2.0.5 • Published 1 week ago
@synerise/ds-tooltip
Licence
ISC
Version
2.0.5
Deps
0
Vulns
0
Weekly
0
id: tooltip title: Tooltip
Tooltip UI Component
Tooltip
API
| Property | Description | Type | Default |
|---|---|---|---|
| button | Button to display in tooltip footer | ReactNode | - |
| description | Tooltip description text. Only rendered when type is largeSimple or largeScrollable. |
ReactNode | - |
| disabled | Determines if tooltip is disabled — renders children directly without a wrapper | boolean | - |
| getPopupContainer | The DOM container of the tip, the default behavior is to create a div element in body |
() => HTMLElement |
() => document.body |
| icon | Icon displayed inline before the title text | ReactNode | - |
| image | Image/node rendered between title and description | ReactNode | - |
| offset | Space between trigger and tooltip: default = 8 px, small = 4 px |
'default' | 'small' |
'default' |
| onOpenChange | Callback executed when visibility of the tooltip changes | (newOpen: boolean) => void |
- |
| open | Controlled open state | boolean | - |
| overlayStyle | Inline style applied to the tooltip content wrapper | CSSProperties | - |
| placement | The position of the tooltip relative to the target | 'top' | 'topLeft' | 'topCenter' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomCenter' | 'bottomRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom' |
'top' |
| popoverProps | Additional props forwarded to the underlying <Popover> (escape hatch) |
Omit<PopoverOptions, 'zIndex' | 'getPopupContainer'> |
- |
| render | Custom render prop — when provided, all structured content props are ignored | () => ReactNode |
- |
| shortCuts | Keyboard hint(s) rendered as styled key badges beside the title | ReactNode | ReactNode[] |
- |
| status | Content rendered above the title row (e.g. a status badge) | ReactNode | - |
| timeToHideAfterClick | Time in ms after which tooltip auto-hides when trigger includes 'click'. 0 disables auto-hide. |
number | 0 |
| title | Tooltip title text or node | ReactNode | - |
| trigger | Tooltip trigger mode | 'hover' | 'click' | Array<'hover' | 'click'> |
'hover' |
| type | Visual variant of the tooltip | 'default' | 'largeSimple' | 'largeScrollable' |
'default' |
| zIndex | CSS z-index for the floating layer | number | theme zindex-tooltip |