limestone/TimePicker

Provides a Limestone-themed time selection component.

Loading Live Preview

Import Usage

import TimePicker from '@enact/limestone/TimePicker';

Members

TimePicker   Component

A component that allows displaying or selecting time.

Set the limestone/TimePickerlimestone/TimePicker.TimePicker.value property to a standard JavaScript /docs/developer-guide/glossary/#date/docs/developer-guide/glossary/#date object to initialize the picker.

By default, TimePicker maintains the state of its value property. Supply the defaultValue property to control its initial value. If you wish to directly control updates to the component, supply a value to value at creation time and update it in response to onChange events.

Import Usage

import TimePicker from '@enact/limestone/TimePicker';

Wrapped with: ui/Changeableui/Changeable.Changeable

Properties

defaultValue

Number

Default value

---

value

Date

The selected date.

TimePickerBase   Component

limestone/TimePickerlimestone/TimePicker.TimePickerBase is the stateless functional time picker component. Should not be used directly but may be composed within another component as it is within limestone/TimePickerlimestone/TimePicker.TimePicker.

Import Usage

import {TimePickerBase} from '@enact/limestone/TimePicker';

Properties

Required Property •  hour

Number

The hour component of the time.

---

Required Property •  meridiem

Number

The meridiem component of the time.

---

Required Property •  minute

Number

The minute component of the time.

---

Required Property •  order

Array(String)

The order in which the component pickers are displayed.

Should be an array of 2 or 3 strings containing one of 'h', 'k', 'm', and 'a'.

---

data-webos-voice-disabled

Boolean

Disables voice control.

---

disabled

Boolean

Disables the TimePicker.

---

hourAriaLabel

String

The "aria-label" for the hour picker

If not specified, the "aria-label" for the hour picker will be a combination of the current value and 'hour change a value with up down button'.

---

label

String

The primary text of TimePicker.

---

meridiemAriaLabel

String

The "aria-label" for the meridiem picker.

If not specified, the "aria-label" for the meridiem picker will be a combination of the current value and 'change a value with up down button'.

---

meridiemLabel

String

The hint string read when focusing the meridiem picker.

---

Required Property •  meridiems

Array(String)

Array of meridiem labels to display.

---

minuteAriaLabel

String

The "aria-label" for the minute picker.

If not specified, the "aria-label" for the minute picker will be a combination of the current value and 'minute change a value with up down button'.

---

noLabel

Boolean

Hides the label that displays the time.

---

onChangeHour

Function

Called on changes in the hour component of the time.

---

onChangeMeridiem

Function

Called on changes in the meridiem component of the time.

---

onChangeMinute

Function

Called on changes in the minute component of the time.

---

onSpotlightDisappear

Function

Called when the component is removed while retaining focus.

---

onSpotlightLeft

Function

Called when the focus leaves the picker when the 5-way left key is pressed.

---

onSpotlightRight

Function

Called when the focus leaves the picker when the 5-way right key is pressed.

---

spotlightDisabled

Boolean

Disables spotlight navigation into the component.

Default: false

---

onComplete

Function

Called when Enter key down on the last picker

timeToLocaleString   Function

timeToLocaleString( time ) → String  |  any

Converts a standard Date object into a locale-specific string.

1 Param

time Date

Date to convert

Returns

 String | any

Converted date or null if date is invalid