Form Time
Form time component.
Form Time, Personalization Blocks
Example:
TallStackUi::personalize() ->form('time') ->block('block', 'classes');
:
<x-time />
:
<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}`)"/>