Tooltip

WIP: Still need to add transitions, but feel free to copy from source.

A component that let's you add a tooltip to an element.

• Source

Features:

• Supports keyboard navigation for the target DOM node.
• Toggles the tooltip on hover and/or focus.
• Includes role="tooltip" attribute for tooltip content.
• Manages aria-hidden and aria-describedby attributes.

Default Example

Try tabbing through these elements.

Tabbing Example

Try tabbing through these elements.

Custom root tag

Only on focus

Hovering over the target will not do anything, but you can click on it or tab to it to enable the focus state.

Custom Classes

This component can accept a classes prop to customize the output HTML classes:

:classes="{ root: string, content: string }"