@page "/time-picker"

<h3>@Localizer["Title"]</h3>

<h4>@Localizer["Description"]</h4>

<DemoBlock Title="@Localizer["OnConfirmTitle"]" Introduction="@Localizer["OnConfirmIntro"]" Name="OnConfirm">
    <TimePicker Value="@Value" OnConfirm="OnConfirm" />
    <ConsoleLogger @ref="Logger" class="mt-3" />
</DemoBlock>

<DemoBlock Title="@Localizer["HasSecondsTitle"]" Introduction="@Localizer["HasSecondsIntro"]" Name="HasSeconds">
    <div class="row">
        <div class="col-12 col-sm-6">
            <TimePicker @bind-Value="@SecondValue" HasSeconds="false" />
        </div>
        <div class="col-12 col-sm-6">
            <Display Value="@SecondValue" FormatString="hh\:mm" />
        </div>
    </div>
</DemoBlock>
