Skua.Components.Tooltip (Skua v0.1.0)

Copy Markdown View Source

A tooltip — a small top-layer label shown on hover/focus of its trigger.

<.tooltip id="copy-tip" text="Copy to clipboard">
  <.button icon_only aria-label="Copy">
    <svg class="sk-glyph" viewBox="0 0 24 24">…</svg>
  </.button>
</.tooltip>

The inner block is the trigger; the SkuaTooltip hook shows the label on pointer-enter / focus and hides it on leave / blur / Escape. The label lives in the browser top layer (Popover API) so no ancestor overflow can clip it, and the hook wires aria-describedby from the trigger to the label.

Summary

Functions

tooltip(assigns)

Functions

tooltip(assigns)

Attributes

  • id (:string) (required)
  • text (:string) (required)
  • placement (:string) - Defaults to "top". Must be one of "top", "bottom", "left", or "right".
  • class (:any) - Defaults to nil.

Slots

  • inner_block (required)