Перейти к содержимому
v2.5.0
English
Русский
Документация

Tooltip

Tooltip — составной компонент для лёгких всплывающих описаний, привязанных к триггеру.

Именование

Содержимое тултипа должно дополнять контрол, а не заменять его метку. Триггер должен быть понятен ещё до открытия тултипа.

Поведение клавиатуры

ОбъявлениеПереведите фокус на демо и нажмите клавишу из таблицы.
КлавишаДействие
TabShift + TabПеренос фокуса на триггер с клавиатуры показывает тултип после delayOpen или сразу, если только что закрылся другой тултип; уход фокуса скрывает его.
EscapeСкрывает открытый тултип. Фокус остаётся на триггере.
Каждая строка проверена в настоящем браузере: Playwright нажимает клавишу в Chromium и смотрит, где оказались фокус и активный элемент.

Касание никогда не показывает тултип, поэтому пользователи сенсорных экранов его не видят; всё, что им нужно, держите видимым в другом месте.

Поведение фокуса

  • Открытие тултипа не должно нарушать фокус.
  • Тултипы внутри оверлеев всё равно нужно проверять в реальном стеке.

Семантика для скринридеров

  • Триггер уже должен быть осмысленным.
  • Пока тултип открыт, триггер указывает на его содержимое с role="tooltip" через aria-describedby.
  • Содержимое тултипа должно оставаться дополнительным.

Семантика формы

  • Тултипы полезны для необязательной справки по полю, а не для обязательных инструкций валидации.
  • Если окружающая форма зависит от содержимого, оно должно быть видно вне тултипа.

Риски доступности

  • Тултип как единственное доступное имя контрола.
  • Обязательные инструкции только внутри тултипа.
  • Интерактивные сценарии внутри содержимого тултипа.