Подписи
- Текстовые кнопки получают имя из видимого содержимого.
- Кнопкам только с иконкой нужен явный
aria-label. - При
asChildитоговый дочерний элемент всё равно должен иметь корректное доступное имя.
Поведение клавиатуры
ОбъявлениеПереведите фокус на демо и нажмите клавишу из таблицы.
| Клавиша | Действие |
|---|---|
| EnterSpace | Активирует кнопку в фокусе. Это нативный <button>; с asChild у дочернего элемента остаются свои клавиши, и ссылка реагирует только на Enter. |
Поведение фокуса
ButtonBaseрендерит видимую обводку:focus-visibleцветом--focus-color.disabledотключает взаимодействие.- Если действие должно оставаться фокусируемым, но визуально заблокированным, выберите другую модель взаимодействия, а не навязывайте стили отключённого состояния.
Семантика для скринридеров
- По умолчанию семантика — как у нативного
button. - С
asChildсемантику определяет элемент в слоте. - Не превращайте навигационные ссылки в псевдокнопки, если взаимодействие в продукте на самом деле является навигацией.
Риски доступности
- Содержимое только из иконки без подписи.
asChildс неинтерактивным дочерним элементом.- Забытое различие: у
buttonиaразные ожидания от клавиатуры и скринридеров.