TimePicker

Hours + minutes (and optional seconds) input. 24-hour or 12-hour formats with an AM/PM toggle, ↑/↓ on the minute field steps by your chosen granularity. Value is always emitted as a 24-hour HH:MM string regardless of display format.

24-hour · 5-minute steps

value = 14:30

12-hour · with seconds

value = 09:15

Usage

import { TimePicker } from '@bwo-ui/react';

const [time, setTime] = useState('14:30');

<TimePicker value={time} onValueChange={setTime} step={5} />

// 12-hour with seconds
<TimePicker format="12h" withSeconds value={time} onValueChange={setTime} />

Props

Prop	Type	Default	Description
`value`	`string`	—	Controlled 24-hour HH:MM string.
`defaultValue`	`string`	`'12:00'`	Uncontrolled default.
`onValueChange`	`(value: string) => void`	—	Fires with the new HH:MM (24-hour) string.
`withSeconds`	`boolean`	`false`	Add a seconds slot.
`format`	`'24h' \| '12h'`	`'24h'`	Display format.
`step`	`number`	`1`	Step in minutes for arrow-key changes on the minute field.