You are currently on Anvil1, which is now in maintenance mode. Visit Anvil2 to get the latest version of the design system.
components / Actions and Inputs
Time Picker
Actions and Inputs
Time Picker
The Time Picker allows a user to choose a time by typing into the field, or by selecting value from the dropdown.
<State>
{([time, setTime])=>(
<Form.TimePicker
label="Time"
description="08:00 АM to 05:00 PM"
min="08:00 АM"
max="05:00 PM"
onChange={setTime}
value={time}
/>
)}
</State>
Dropdown
If Time Picker's field is in focus, a dropdown to be shown with a list of availiable options to pick from.
Options are filtered by step prop, but any intermediate value is still allowed to pick by typing.
Closest value, based on user's entry, to be highlighted in a dropdown. Dropdown behavior may be disabled with disableDropdown prop.