Components / Time Picker

Time Picker

A segmented time field paired with a clock trigger that opens a popover of scrollable listbox columns: hours, minutes, optional seconds, and AM / PM for 12-hour cultures. Type into the segments or pick from the columns. This preview is the real component running in WebAssembly.

Examples

Value: 2:30 PM

razor
<ZitsTimePicker @bind-Value="_time" />

@code { private TimeOnly? _time; }

Installation

Terminal bash
navius add time-picker

API reference

ZitsTimePicker:

Prop Type Default
Value TimeOnly? null
ValueChanged EventCallback<TimeOnly?> -
DefaultValue TimeOnly? null
Open bool false
OpenChanged EventCallback<bool> -
DefaultOpen bool false
Granularity string "minute"
HourCycle int? culture
MinuteStep / SecondStep int 1
Disabled bool false