Input Time

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

When to use

Use diwa-input-time when the user must enter a time of day. The native time picker is used, with optional min / max constraints and a step for granularity.

Example

<!-- Basic -->
<diwa-input-time
  label="Meeting time"
  required
></diwa-input-time>

<!-- 15-minute increments, business hours only -->
<diwa-input-time
  label="Appointment time"
  min="08:00"
  max="18:00"
  step="900"
></diwa-input-time>

Value format

Values are in HH:MM or HH:MM:SS format (24-hour clock). Both the controlled value prop and the emitted change payload use this format.

step

step is in seconds. Common values: 60 (1 min), 900 (15 min), 1800 (30 min), 3600 (1 hour). Some browsers show a snap-to list when step divides the range evenly.

min / max

Provide min and max as HH:MM strings to restrict the selectable range (e.g. business-hour scheduling).