Time Picker
Overview
Sample
Edit sample on Codepen
API reference
calcite-time-picker
Properties
| Property | Attribute | Description | Type | Values |
|---|---|---|---|---|
| intlHour | intl-hour | aria-label for the hour input | "Hour" (default) | |
| intlHourDown | intl-hour-down | aria-label for the hour down button | "Decrease hour" (default) | |
| intlHourUp | intl-hour-up | aria-label for the hour up button | "Increase hour" (default) | |
| intlMeridiem | intl-meridiem | aria-label for the meridiem (am/pm) input | "AM/PM" (default) | |
| intlMeridiemDown | intl-meridiem-down | aria-label for the meridiem (am/pm) down button | "Decrease AM/PM" (default) | |
| intlMeridiemUp | intl-meridiem-up | aria-label for the meridiem (am/pm) up button | "Increase AM/PM" (default) | |
| intlMinute | intl-minute | aria-label for the minute input | "Minute" (default) | |
| intlMinuteDown | intl-minute-down | aria-label for the minute down button | "Decrease minute" (default) | |
| intlMinuteUp | intl-minute-up | aria-label for the minute up button | "Increase minute" (default) | |
| intlSecond | intl-second | aria-label for the second input | "Second" (default) | |
| intlSecondDown | intl-second-down | aria-label for the second down button | "Decrease second" (default) | |
| intlSecondUp | intl-second-up | aria-label for the second up button | "Increase second" (default) | |
| scale | scale | The scale (size) of the time picker | lm (default)s | |
| step | step | number (seconds) that specifies the granularity that the value must adhere to | 60 (default) | |
| value | value | The selected time in UTC (always 24-hour format) |
Methods
| Name | Description | Signature | Returns |
|---|---|---|---|
| setFocus | Sets focus on the component. | setFocus(target: TimePart) => Promise<void> | Promise<void> |