There are still dozens of new things to be done in 2025 in TallStackUI v2. Stay tuned for every release!

Powerful suite of Blade components for TALL Stack apps.

Form Time

Form time component.

:

<x-time />
Select the hour
:

<x-time label="Time" hint="Select the hour" />
:

:
<!-- 12-hour format -->
<x-time />
 
<!-- 24-hour format -->
<x-time format="24" />
:

:

<!-- Hours -->
<x-time :min-hour="5" :max-hour="10" />
 
<!-- Minutes -->
<x-time :min-minute="30" :max-minute="45" />

Due to the way the component works, the min and max hours/minutes do not limit the range, but rather the post-selected value when time is selected.

An option to adjust the time to the current one without the possibility of clearing the input.

:
<x-time required />

An option to easily select the current time.

:
<x-time helper />
:

<x-time :step-hour="3" :step-minute="15" />
:

<x-time x-on:hour="alert(`Hour Selected: ${$event.detail.hour}`)"
x-on:minute="alert(`Minute Selected: ${$event.detail.minute}`)"
x-on:interval="alert(`Interval Changed: ${$event.detail.interval}`)"/>

Code highlighting provided by Torchlight