LanternUI.Components.Tooltip (LanternUI v0.9.0)

Copy Markdown View Source

Tooltip - mirrors Fluxon's tooltip/1 API.

The tip is Zag-driven (a @zag-js/tooltip state machine, loaded on demand): the hook root carries data-zag plus data-scope="tooltip" / data-part anatomy, and Zag owns open state, hover/focus timing, and positioning. Styling stays lui-* tokens. Two modes:

  • client (default) — Zag owns open state; hover/focus timing is the machine's openDelay (delay attr).
  • server-driven (controlled) — the server value (open) is truth; opens flow out through on_change, patches flow in.

Summary

Functions

tooltip(assigns)

Functions

tooltip(assigns)

Attributes

  • id (:string) - Stable DOM id for the tooltip hook; auto-generated when omitted, mirroring Fluxon's tooltip (drop-in parity). Defaults to nil.
  • value (:string) - Plain-text tip when no :content slot is given. Defaults to nil.
  • placement (:string) - Preferred side of the trigger; may flip for viewport fit. Defaults to "top". Must be one of "top", "bottom", "left", or "right".
  • delay (:integer) - Milliseconds before the tip appears on hover/focus. Defaults to 200.
  • arrow (:boolean) - Show the small pointer arrow toward the trigger. Defaults to true.
  • controlled (:boolean) - Server-driven open state: open is truth, patches flow into the machine. Defaults to false.
  • open (:boolean) - Open state for controlled mode (client mode ignores it). Defaults to nil.
  • on_change (:string) - Server event pushed on open change (lantern:tooltip:set-open replies). Defaults to nil.
  • on_change_client (:string) - Bubbling DOM CustomEvent dispatched on open change. Defaults to nil.
  • class (:any) - Extra classes merged onto the root element. Defaults to nil.
  • Global attributes are accepted. Arbitrary HTML/phx-* attributes passed through.

Slots

  • inner_block (required) - Trigger element that shows the tip.
  • content - Rich tip body; overrides value when present.