On This Page
Popup information displayed on hover or focus.
top / bottomStandard text popups next to form labels, icon-only buttons, active statsleft / rightSide navigation bar items, table actions, compact layout toolbarsrich contentDetailed descriptions with headers, list summaries, or custom HTML structuresdelay durationMuted helper copy that shouldn't display immediately to power users| Prop | Type | Default | Description |
|---|---|---|---|
| content* | React.ReactNode | — | The content (text or elements) displayed inside the tooltip bubble. |
| side | "top" | "bottom" | "left" | "right" | "top" | Display position placement relative to the trigger element. |
| variant | "default" | "dark" | "light" | "default" | Color theme style variant. |
| delayDuration | number | 700 | Time delay in milliseconds before the tooltip appears. |
| sideOffset | number | 4 | Offset distance from the trigger element in pixels. |
role="tooltip" attributes are linked to targets.