Tooltip
A small floating text label that appears next to its trigger on hover or keyboard focus. Never contains interactive content.
Installation
npx dafink-ui add tooltipDemo
Props
| Name | Type | Default | Description |
|---|---|---|---|
| content | ReactNode | - | The tooltip text. Must be non-interactive content only. |
| children | ReactElement | - | A single trigger element; receives hover/focus handlers and aria-describedby automatically. |
| side | 'top' | 'right' | 'bottom' | 'left' | 'top' | Which side of the trigger the tooltip appears on. |
| delay | number | 300 | Open delay in milliseconds for hover. Keyboard focus shows the tooltip immediately. |
| className | string | '' | Additional classes on the wrapper span. |