Pickers
Набор элементов управления для выбора даты и времени.
Storybook
DatePicker
TimePicker
Размеры
Доступно три размера компонентов: l, s и xs.
Доступность
DatePicker
Добавьте значения атрибутам daysAriaLabel monthsAriaLabel и yearsAriaLabel
для озвучивания компонента с помощью ScreenReader:
<DatePicker
daysAriaLabel="день"
monthsAriaLabel="месяц"
yearsAriaLabel="год"
/>
TimePicker
По аналогии с DatePicker, добавьте значения атрибутам secondsAriaLabel minutesAriaLabel и hoursAriaLabel:
<TimePicker
secondsAriaLabel="секунды"
minutesAriaLabel="минуты"
hoursAriaLabel="часы"
/>
Управление с клавиатуры
Компоненты DatePicker и TimePicker имеют возможность
переключаться с помощью клавиш на клавиатуре:
ArrowUp- прокрутка назад;ArrowDown- вперед;PageUp- вернуться на 10 пунктов назад;PageDown- на 10 пунктов вперед;Home- переход к первому элементу;End- к последнему элементу.
При этом, с активированным экранным считывающим устройством (screen reader), происходит объявление переключаемых опций.
Проблемы в Safari iOS 14.5 и ниже
Для корректной работы необходимо выключить scroll-snap-align.
Для этого нужно использовать - disableScrollSnapAlign.
По-умолчанию значение для этого свойства - false.