Date Picker
Calendar primitives for date and range selection.
Usage
SuMoTuWeThFrSa
API Reference
VoltDatePickerLabel — volt-date-picker-label
| Input | Type | Default |
|---|---|---|
| id | string | — |
| ariaLive | string | 'polite' |
| aria-live | unknown | — |
VoltDatePicker — volt-date-picker
| Input | Type | Default |
|---|---|---|
| min | Date | — |
| max | Date | — |
| disabled | boolean | false |
| dateDisabled | (date: Date) => boolean | () => false |
| firstDayOfWeek | VoltDatePickerFirstDayOfWeek | 7 |
| date | Date | undefined | — |
| focusedDate | Date | undefined | — |
| Output | Type |
|---|---|
| dateChange | Date | undefined |
| focusedDateChange | Date | undefined |
VoltDateRangePicker — volt-date-range-picker
| Input | Type | Default |
|---|---|---|
| min | Date | — |
| max | Date | — |
| disabled | boolean | false |
| dateDisabled | (date: Date) => boolean | () => false |
| firstDayOfWeek | VoltDatePickerFirstDayOfWeek | 7 |
| startDate | Date | undefined | — |
| endDate | Date | undefined | — |
| focusedDate | Date | undefined | — |
| Output | Type |
|---|---|
| startDateChange | Date | undefined |
| endDateChange | Date | undefined |
| focusedDateChange | Date | undefined |
Component Source
Install via CLI:
npx @voltui/cli add date-pickerTypeScript
Loading editor…
Copy this code to your project. The component uses ng-primitives/date-picker.