Skip to content

Tooltip

New component 🎉

Hint is now separate from Tooltip. You can find its documentation in Utils/Hint.

Read more about the differences between tooltip types in the Design guide.

Tooltip ​

jsx
import Tooltip from '@semcore/ui/tooltip';
<Tooltip />;

TooltipProps ​

& & {...}
NameTypeDescription
title Tooltip text
theme"default" | "warning" | "invert" Tooltip theme. You can use the default themes or create your own
interaction"hover" | "click" | "focus" | "none" | Hover interaction means that popper will be shown on mouse hover or keyboard focus. Click interactions means that popper will be shown on mouse click or keyboard Space/Enter keydown. Focus interaction means that popper will be shown on mouse or keyboard focus.

DescriptionTooltip ​

jsx
import { DescriptionTooltip } from '@semcore/ui/tooltip';
<DescriptionTooltip />;

DescriptionTooltipProps ​

& & {...}
NameTypeDescription
theme"default" | "warning" | "invert" Tooltip theme. You can use the default themes or create your own
interaction"hover" | "click" Hover interaction means that popper will be shown on mouse hover or keyboard focus. Click interactions means that popper will be shown on mouse click or keyboard Space/Enter keydown.

Released under the MIT License.

Released under the MIT License.