TimePicker

TimePicker UI Component

Installation

npm i @synerise/ds-time-picker
or
yarn add @synerise/ds-time-picker

Usage

import TimePicker from '@synerise/ds-time-picker'
<TimePicker />

Demo

API

PropertyDescriptionTypeDefault
alwaysOpenwhether or not to always display the dropdown (can't be closed)boolean-
classNameclass name passed down to containerstring-
clearTooltipClear icon tooltipstring / React.ReactNodeClear
containerStyleStyle object applied to the input containerReact.CSSProperties{}
defaultOpenwhether to display the dropdown by defaultboolean-
disabledoption to disabled inputboolean-
dropdownPropsProps object applied to the dropdown componentDropdownProps{}
inputPropsProps object applied to the input componentInputProps{}
placementplacement of dropdowntopLeft / topCenter / topRight / bottomLeft / bottomCenter / bottomRightbottomLeft
overlayClassNameclass name passed down to the overlay containerstring-
onChangeevent fired when date has changed(value: Date or undefined, timeString: string) => void-
unitsshow only desired unitsstring[]['hour', 'minute', 'second']
use12HourClockuse 12 hour clock instead of 24boolean-
placeholderPlaceholder of Timepicker inputstringSelect time
timeFormatformat of date displayed in input (see: https://github.com/iamkun/dayjs/blob/dev/docs/en/API-reference.md#list-of-all-available-formats)string'HH:mm:ss'
triggertrigger that opens the dropdown['click'] / ['hover'] / ['contextMenu']['click']
valueselected valueDate-