Tooltip component for contextual help and information.
Features
- Position-aware (top, bottom, left, right)
- Keyboard accessible
- Delay customization
- Arrow indicator
- Responsive positioning
Examples
<%!-- Basic tooltip --%>
<.tooltip content="Save your changes">
<.button>Save</.button>
</.tooltip>
<%!-- Positioned tooltip --%>
<.tooltip content="Delete item" position="bottom">
<.button variant="danger">Delete</.button>
</.tooltip>
<%!-- With delay --%>
<.tooltip content="Loading..." delay={1000}>
<.button>Load</.button>
</.tooltip>
Summary
Functions
Attributes
id(:string) (required)content(:string) (required) - Tooltip content text.position(:string) - Defaults to"top". Must be one of"top","bottom","left", or"right".delay(:integer) - Show delay in milliseconds. Defaults to300.disabled(:boolean) - Defaults tofalse.class(:string) - Defaults tonil.- Global attributes are accepted.
Slots
inner_block(required)