@snack-uikit/tooltip

Tooltip

Installation

npm i @snack-uikit/tooltip

Changelog

Компонент Tooltip использует под собой компонент PopoverPrivate (readme ниже);

Tooltip

Props

name	type	default value	description
tip*	ReactNode	-	Содержимое тултипа
disableMaxWidth	boolean	-	Отключение ограничения ширины тултипа @default false
className	string	-	CSS-класс
triggerClassName	string	-	CSS-класс триггера
open	boolean	-	Управляет состоянием показан/не показан.
onOpenChange	(isOpen: boolean) => void	-	Колбек отображения компонента. Срабатывает при изменении состояния open.
hoverDelayOpen	number	-	Задержка открытия по ховеру
hoverDelayClose	number	-	Задержка закрытия по ховеру
trigger	enum Trigger: "click", "hover", "focusVisible", "focus", "hoverAndFocusVisible", "hoverAndFocus", "clickAndFocusVisible"	Tooltip.triggers.HoverAndFocusVisible	Условие отображения поповера: - Click - открывать по клику - Hover - открывать по ховеру - FocusVisible - открывать по focus-visible - Focus - открывать по фокусу - HoverAndFocusVisible - открывать по ховеру и focus-visible - HoverAndFocus - открывать по ховеру и фокусу - ClickAndFocusVisible - открывать по клику и focus-visible
placement	enum Placement: "left", "left-start", "left-end", "right", "right-start", "right-end", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end"	Tooltip.placements.Top	Положение поповера относительно своего триггера (children).
children	ReactNode | ChildrenFunction	-	Триггер поповера (подробнее читайте ниже)

QuestionTooltip

Props

name	type	default value	description
tip*	ReactNode	-	Содержимое тултипа
className	string	-	CSS-класс
open	boolean	-	Управляет состоянием показан/не показан.
onOpenChange	(isOpen: boolean) => void	-	Колбек отображения компонента. Срабатывает при изменении состояния open.
hoverDelayOpen	number	-	Задержка открытия по ховеру
hoverDelayClose	number	-	Задержка закрытия по ховеру
placement	enum Placement: "left", "left-start", "left-end", "right", "right-start", "right-end", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end"	Placement.Top	Положение поповера относительно своего триггера (children).
disableMaxWidth	boolean	-	Отключение ограничения ширины тултипа @default false
trigger	enum Trigger: "hover", "click"	Trigger.Hover	Условие отображения подсказки
size	enum Size: "s", "xs"	Size.Xs	Размер
tooltipClassname	string	-	CSS-класс контейнера подсказки
triggerDataTestId	string	-	data-test-id для триггера