opinion
TimePicker
A trigger that opens scrollable hour and minute columns.
Start timePick an hour, then a minute; both apply at once
Selected: 09:00
In context
Schedule a reviewStart and end of the mobile design review
Mobile design review22 Oct, Tideline mobile
Starts
Ends
Props
| Prop | Type | Required | Default |
|---|---|---|---|
value | string | undefined | No | — |
defaultValue | string | undefined | No | 00:00 |
onValueChange | ((time: string) => void) | undefined | No | — |
format | "12h" | "24h" | undefined | No | 12h |
minuteStep | number | undefined | No | 1 |
Value and display
value is always 24-hour "HH:MM"; format only changes how the label and hour list read.
data-rebar-* attributes
data-rebar-component="time-picker" on the trigger; data-rebar-part="panel"|"hours"|"minutes"|"hour"|"minute"|"period-toggle"|"period-am"|"period-pm", with data-rebar-selected on the picked hour, minute or period.
Migrating to Ant Design
AntD's TimePicker is a close equivalent (minuteStep maps directly). It takes a dayjs value; this one uses a plain "HH:MM" string, so convert at the boundary.