Datetime picker

Pick a date and time together.

import { BuiDatetimePicker } from 'ng-blatui';

<bui-datetime-picker [(value)]="when" />

Custom placeholder

<bui-datetime-picker [(value)]="when" placeholder="Pick date & time…" />

Min / max

<!-- min/max forward to the inner calendar -->
<bui-datetime-picker [(value)]="when" minDate="2026-06-01" maxDate="2026-06-30" />

With seconds

<!-- [seconds]="true" forwards to the time field -->
<bui-datetime-picker [(value)]="when" [seconds]="true" />

Dropdown caption

<bui-datetime-picker [(value)]="when" captionLayout="dropdown" />

Range

<!-- mode="range" → start–end dates sharing one time; [months]="2" shows both grids -->
<bui-datetime-picker mode="range" [months]="2" [(range)]="range" />
// range = signal({ start: '', end: '' })

Range with limits

<!-- range constrained by min/max (forwarded to the calendar) -->
<bui-datetime-picker mode="range" [months]="2" [(range)]="range" minDate="2026-06-01" maxDate="2026-06-30" />