Components › Forms
Time field
A time input in segments. Arrows step, digits type, left and right move between hours, minutes and AM/PM.
Installation
npx plankui@latest add time-fieldUsage
import { TimeField } from "@/components/ui/time-field";
<TimeField value={time} onValueChange={setTime} hour12 step={15} />API reference
| Prop | Type | Default | Description |
|---|---|---|---|
| value / defaultValue | { hours: number; minutes: number } | 9:00 | Hours are 0 to 23. |
| onValueChange | (time) => void | Called when a segment changes. | |
| hour12 | boolean | false | Show a 12-hour clock with AM/PM. |
| step | number | 1 | Minutes per arrow press. |