Tooltip (подсказка)

Всплывающая подсказка, срабатывающая по наведению / клику / фокусу. Позиционирование fixed + переворот в области просмотра (flip/shift); когда триггер прокручивается за пределы видимой области, подсказка автоматически скрывается.

Подсказка

<template>
  <div class="demo-row" style="justify-content: center; padding: 56px 0 72px">
    <LhTooltip content="Подсказка сверху" placement="top">
      <LhButton>Вверх</LhButton>
    </LhTooltip>
    <LhTooltip content="Подсказка снизу" placement="bottom">
      <LhButton>Вниз</LhButton>
    </LhTooltip>
    <LhTooltip content="Подсказка слева" placement="left">
      <LhButton>Влево</LhButton>
    </LhTooltip>
    <LhTooltip content="Подсказка справа" placement="right">
      <LhButton>Вправо</LhButton>
    </LhTooltip>
    <LhTooltip content="Срабатывает по клику" trigger="click">
      <LhButton type="primary">Клик</LhButton>
    </LhTooltip>
    <LhTooltip content="Строго по top, без переворота" placement="top" :flip="false">
      <LhButton>Строгий top</LhButton>
    </LhTooltip>
    <LhTooltip content="Подсказка в цвете темы" type="primary">
      <LhButton>Цвет темы</LhButton>
    </LhTooltip>
  </div>
</template>

Props

Проп	Описание	Тип	По умолчанию
content	Содержимое подсказки	string	''
placement	12 позиций	'top' \| 'top-start' \| … \| 'right-end'	'top'
flip	При нехватке места по главной оси меняет направление; false — строго по placement	boolean	true
trigger	Способ срабатывания	'hover' \| 'click' \| 'focus'	'hover'
manual / visible	Ручной управляемый режим	boolean	false / —
showAfter / hideAfter	Задержка показа / скрытия (мс)	number	0
openDelay / closeDelay	Псевдонимы задержки показа / скрытия (синонимы showAfter/hideAfter, более низкий приоритет)	number	—
effect	Светлая / тёмная тема	'dark' \| 'light'	'dark'
type	Встроенный цвет темы (переопределяет фон effect)	'primary' \| 'success' \| …	—
bgColor	Пользовательский цвет фона (наивысший приоритет)	string	—
maxWidth	Максимальная ширина	string \| number	'200px'
teleportTarget	Целевой элемент монтирования всплывающего слоя (перемещением DOM)	string \| HTMLElement	'body'
disabled / themeVars / bgPattern / sx	—	—	—

Events

Показом и скрытием управляет внутренняя логика срабатывания.

Методы

В режиме manual используются методы экземпляра show() / hide() / toggle() (defineExpose).

Совет

sx применяется к корневому элементу триггера (popper уже смонтирован в body, sx не применяется).