Выпадающий список из дизайн-системы невозможно выбрать с клавиатуры
Компонент Select в дизайн-системе свёрстан на div со своим списком и обработчиками клика — чтобы полностью контролировать вид. Его используют 40 форм в пяти продуктах. Аудит доступности показал: список не открывается с клавиатуры, скринридер не объявляет выбранное значение.
Какой вывод правильный для дизайн-системы?
- Доступность — обязанность базового компонента: клавиатура, фокус и ARIA-роли там
- Каждый продукт должен добавить доступность в своих формах сам
- Для доступности достаточно добавить компоненту tabindex="0"
- Скринридеры поддерживают только нативные элементы, чинить нечего