API reference
The wrapper surface centers on <tng-tooltip>. For primitive directives and root-owned positioning details, use the headless tooltip docs.
Wrapper component: <tng-tooltip>
| Input / Output | Type | Description |
|---|---|---|
triggerLabel | string | Fallback trigger text rendered by the built-in button. |
text | string | Fallback tooltip message when no projected content is provided. |
side | 'top' | 'right' | 'bottom' | 'left' | Placement hint exposed through data-side on tooltip content and flipped when needed. |
openDelay, closeDelay | number | Delay in milliseconds before open/close transitions are applied. |
disabled | boolean | Disables hover/focus interactions and keeps tooltip closed. |
ariaLabel | string | null | Accessible label for the built-in trigger button. |
openChange | boolean | Emits each time wrapper state changes from open to closed (and vice versa). |
Projected content
| Surface | Purpose | Notes |
|---|---|---|
[trigger] slot | Projects custom trigger content into the built-in wrapper button. | Use this for icons or branded trigger labels without replacing the wrapper behavior. |
| Default content slot | Projects tooltip body content into the floating shell. | Fallbacks to text when nothing is projected. Keep the content short and non-interactive. |
Behavior baseline
Tabto a trigger opens the tooltip for keyboard users.Blur,mouseleave, outside pointer, andEscapeclose the tooltip and removearia-describedby.- Tooltip content stays non-interactive and should remain outside the tab order.
- The wrapper exposes the same slot and state hooks as the primitive, but keeps trigger and content markup on a stable minimum shell.