Input Time

A time picker input (HH:MM). Delegates to the native browser time picker. Supports min, max, and step constraints.

Default

Time picker delegating to the native browser time picker UI.

<diwa-input-time label="Start time"></diwa-input-time>

With time range constraint

Use min / max (HH:MM) to restrict the allowed range.

<diwa-input-time label="Meeting time" min="09:00" max="17:00" description="Business hours only (09:00–17:00)."></diwa-input-time>

Error state

<diwa-input-time label="Departure time" value="03:00" state="error" message="Time must be within business hours."></diwa-input-time>

Compact

<diwa-input-time label="Time" compact></diwa-input-time>

Slots

Use start to embed an icon inside the input border, and label-after to place contextual icons or links after the label.

<diwa-input-time label="Meeting time">
  <diwa-icon slot="start" name="clock" size="16"></diwa-icon>
  <diwa-icon slot="label-after" name="info" size="16"></diwa-icon>
</diwa-input-time>