AccrueAdmin.Components.Tooltip (accrue_admin v1.5.0)

Copy Markdown View Source

CSS-driven accessible tooltip for mounted admin pages.

Uses a :hover + :focus-within CSS reveal pattern — no JS required. The tooltip content is positioned via CSS at the --ax-z-popover (300) layer.

The trigger slot wraps any keyboard-reachable element (e.g. a button or a focusable icon). The tooltip content is linked via role="tooltip" for screen reader announcements. Callers can additionally wire aria-describedby on the trigger to the tooltip content ID for explicit association.

Example:

<.tooltip content="Copy to clipboard" position="above">
  <button type="button" aria-label="Copy"></button>
</.tooltip>

Summary

Functions

tooltip(assigns)

Attributes

  • content (:string) (required)
  • position (:string) - Defaults to "above". Must be one of "above", or "below".
  • class (:string) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["aria-describedby"].

Slots

  • inner_block (required)