Тултип — подсказка, которая появляется по наведению или фокусу. Тултип закрывается, если отвести указатель, убрать фокус, проскроллить страницу или нажать Esc.
Размер тултипа определяется содержимым, но ширина компонента не может быть более 300px.
Иногда удобнее, если текст в тултипе не переносится, а написан в одну строку. Например, при сравнении хеш-сумм, выводе адресов электронной почты или путей к файлам и папкам. Для подобных случаев не ограничивайте тултип по ширине.
Добавьте стрелку-указатель, когда можно запутаться, к чему относится подсказка.
В обычной ситуации тултип открывается сверху по центру. Положение возле триггерного объекта можно настроить вручную.
Выбирайте положение, в котором тултип будет не перекрывать контент, с которым пользователь будет взаимодействовать следом. Например, в вертикальном списке открывайте тултипы сборку, чтобы подсказка не мешала изучать соседний элемент по направлению чтения.
Если для показа тултипа не хватает места, он откроется с противоположной стороны. Атрибут kbqPlacementPriority помогает настроить запасные позиции, если нужно, чтобы они отличались от порядка по умолчанию.
При настройке kbqRelativeToPointer="true" тултип позиционируется относительно курсора. Часто это нужно для длинных строк (хеш-суммы, электронная почта, пути), чтобы подсказка появлялась прямо у курсора.
Тултип можно открыть рядом с текстовым курсором в редактируемом поле. Он следует за ним при вводе текста, перемещении по полю и прокрутке. При выделении текста тултип привязывается к выделению.
Задайте kbqRelativeToCaret="true", чтобы включить режим. По умолчанию для однострочного input тултип привязывается по вертикали ко всему полю, а для textarea и contenteditable — к строке с текстовым курсором. Параметр kbqRelativeToCaretVertical позволяет выбрать привязку к полю (field) или строке (line). В этом режиме доступны все позиции тултипа.
Если браузер не может определить положение текстового курсора, тултип привязывается к полю. Это происходит, например, в полях password, email и number, а также при направлении текста справа налево и выравнивании по центру или по правому краю. Если тултип привязан к контейнеру, положение определяется по первому редактируемому элементу внутри него.
При наведении курсора на элемент тултип появляется с задержкой 0,4 секунды, а исчезает мгновенно.
При переключении фокуса или наведении на другой элемент с тултипом задержка работает по следующему принципу:
Тултип принимает события указателя, поэтому при переводе курсора с триггера на сам тултип подсказка не
закрывается. Это важно для пользователей, которые работают с увеличением: курсор у них часто оказывается
поверх тултипа, — и для подсказок, которые нужно успеть прочитать (WCAG 1.4.13 «Content on Hover or Focus»).
Чтобы у курсора было время дойти до тултипа, используйте это вместе с [hideWithTimeout]="true" и
kbqLeaveDelay — пример «Интерактивный Tooltip» на вкладке Examples.
Обратное поведение включается через [ignoreTooltipPointerEvents]="true": тултип становится прозрачным для
указателя, и клики проходят сквозь него. Это нужно подсказкам, которые перекрывают другие интерактивные
элементы, — например подсказкам об обрезанном тексте в прокручиваемом списке опций, где перехватывающий
события тултип съедал бы клик по соседней опции.
До v20 тултип по умолчанию не принимал события указателя, поэтому при обновлении поведение меняется на
обратное: разметке, которая рассчитывала на сквозные клики, теперь нужно запросить это явно. Встроенные
подсказки об обрезанном тексте (kbq-title, kbqEllipsisCenter, подсказки опций и таймзон) отключают приём
событий сами, как и любой тултип с kbqTrigger в значении manual или none: наведение на такую панель ни
открывает её, ни закрывает, поэтому защищать там нечего.
На экране всегда находится не больше одного тултипа: когда появляется новый, ранее открытый закрывается. Правило распространяется на тултипы, которые открываются по hover, focus, click или keydown, — в том числе на подсказки kbq-title и kbqEllipsisCenter.
Тултипы, которыми управляют программно (kbqTrigger="manual"), в этом правиле не участвуют: они не закрывают другие тултипы и не закрываются сами. Так работают, например, подсказки о результатах валидации.
Отключить поведение для отдельного тултипа можно через [kbqTooltipSingleInstance]="false", а для всего приложения — провайдером токена KBQ_TOOLTIP_SINGLE_INSTANCE_DEFAULT:
providers: [{ provide: KBQ_TOOLTIP_SINGLE_INSTANCE_DEFAULT, useValue: false }];Если определенная кнопка или функция недоступна, тултип может объяснить это.
Для особых случаев можно изменить размеры тултипа и расположить в нем не только текст. Используйте стиль Contrast-fade, который похож на фон приложения, чтобы гарантировать контраст содержимого на фоне тултипа.
A low Earth orbit (LEO) is an orbit around Earth with a period of 128 minutes or less (making at least 11.25 orbits per day) and an eccentricity less than 0.25. Most of the artificial objects in outer space are in LEO, peaking in number at an altitude around 800 km (500 mi), while the farthest in LEO, before medium Earth orbit (MEO), have an altitude of 2,000 kilometers, about one-third of the radius of Earth and near the beginning of the inner Van Allen radiation belt.