Date Picker

Примітиви календаря для вибору дати та діапазону.

Використання

ПереглядКод
May 2026
SuMoTuWeThFrSa
26 27 28 29 30 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31 1 2 3 4 5 6

Довідник API

VoltDatePickerLabel — volt-date-picker-label

ВхідТипЗа замовчуванням
id string
ariaLive string 'polite'
aria-live unknown

VoltDatePicker — volt-date-picker

ВхідТипЗа замовчуванням
min Date
max Date
disabled boolean false
dateDisabled (date: Date) => boolean () => false
firstDayOfWeek VoltDatePickerFirstDayOfWeek 7
date Date | undefined
focusedDate Date | undefined
ВихідТип
dateChangeDate | undefined
focusedDateChangeDate | undefined

VoltDateRangePicker — volt-date-range-picker

ВхідТипЗа замовчуванням
min Date
max Date
disabled boolean false
dateDisabled (date: Date) => boolean () => false
firstDayOfWeek VoltDatePickerFirstDayOfWeek 7
startDate Date | undefined
endDate Date | undefined
focusedDate Date | undefined
ВихідТип
startDateChangeDate | undefined
endDateChangeDate | undefined
focusedDateChangeDate | undefined

Код компонента

Встановити через CLI:npx @voltui/cli add date-picker
TypeScript
Завантаження редактора…

Скопіюйте цей код у свій проєкт. Компонент використовує ng-primitives/date-picker.