Time Picker
Introduction
A TimePicker
allows the user to specify a time.
TimePicker
has no direct localization support. You should handle localization directly in your
application if needed.
The below information is a snippet from the
related section in the Blueprint reference documentation.
Examples
Live Playgrounds coming soon!
Usage
TimePicker
When a time is required, and the date is not relevant, this input component simplifies entry for the user.
API Reference
TimePicker
Prop Name | Required? | Type | Description |
---|---|---|---|
defaultValue | false | Date | Initial time the `TimePicker` will display. This should not be set if `value` is set. |
disabled | false | boolean | Whether the time picker is non-interactive. |
maxTime | false | Date | The latest time the user can select. The year, month, and day parts of the `Date` object are ignored. While the `maxTime` will be later than the `minTime` in the basic case, it is also allowed to be earlier than the `minTime`. This is useful, for example, to express a time range that extends before and after midnight. If the `maxTime` and `minTime` are equal, then the valid time range is constrained to only that one value. |
minTime | false | Date | The earliest time the user can select. The year, month, and day parts of the `Date` object are ignored. While the `minTime` will be earlier than the `maxTime` in the basic case, it is also allowed to be later than the `maxTime`. This is useful, for example, to express a time range that extends before and after midnight. If the `maxTime` and `minTime` are equal, then the valid time range is constrained to only that one value. |
onChange | false | (newTime: Date) => void | Callback invoked when the user changes the time. |
precision | false | TimePrecision | The precision of time the user can set. |
selectAllOnFocus | false | boolean | Whether all the text in each input should be selected on focus. |
showArrowButtons | false | boolean | Whether to show arrows buttons for changing the time. |
useAmPm | false | boolean | Whether to use a 12 hour format with an AM/PM dropdown. |
value | false | Date | The currently set time. If this prop is provided, the component acts in a controlled manner. |
Related Reading
Blueprint Reference
DatePicker Component