TimePicker
Markdown for agentsNative time field with an HH:MM contract and an optional clear button.
npx slipstream-ui@latest add time-pickerClass time
24-hour, HH:MM
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | string | — | "HH:MM" (24h), controlled. |
| defaultValue | string | — | "HH:MM", initial value. |
| onValueChange | (value: string) => void | — | Fired with the time string; '' when cleared. |
| clearable | boolean | false | Shows a clear button once a value exists. |
Accessibility
- Renders input[type=time]; the OS picker and keyboard editing apply.
- Label the moment, not the control type.
Browser support
| Browser | Tested versions |
|---|---|
| Chrome | 111+ (Mar 2023) |
| Edge | 111+ (Mar 2023) |
| Firefox | 121+ (Dec 2023) |
| Safari | 17.2+ — macOS & iOS (Dec 2023) |
Slipstream components rely only on CSS custom properties, Flexbox/Grid, and ARIA — the everyday baseline of the last two years of evergreen releases. Anything newer is progressive enhancement: unsupported browsers keep full functionality with static behavior instead of animations.