PureAdmin.Components.Tooltip (PureAdmin v1.1.0)

Copy Markdown View Source

Tooltip and Popover components for Pure Admin.

Tooltips use CSS-only positioning via pa-tooltip class with data-tooltip attribute. Popovers use a click-triggered rich content overlay.

Summary

Functions

Renders a popover trigger with rich content overlay.

Renders a tooltip wrapper around content.

Functions

popover(assigns)

Renders a popover trigger with rich content overlay.

Uses a click-triggered pattern with CSS positioning.

Examples

<.popover title_text="Help" placement="bottom">
  <p>Rich content with <strong>HTML</strong>.</p>
</.popover>

<.popover title_text="Options" placement="bottom" size="lg">
  <:trigger>
    <.button variant="info" size="xs">Help</.button>
  </:trigger>
  <p>Detailed help content.</p>
</.popover>

Attributes

  • id (:string) - Unique ID (auto-generated if not provided). Defaults to nil.
  • title_text (:string) (required)
  • placement (:string) - Defaults to "top". Must be one of "top", "end", "bottom", or "start".
  • size (:string) - Defaults to nil.Must be one of nil, "sm", or "lg".
  • alignment (:string) - Defaults to nil.Must be one of nil, "center", or "end".
  • trigger_text (:string) - Default trigger button text. Defaults to "?".
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • trigger - Custom trigger content.
  • inner_block (required)

tooltip(assigns)

Renders a tooltip wrapper around content.

The tooltip text appears on hover via CSS ::before/::after pseudo-elements.

Examples

<.tooltip text="Save your changes">
  <.button variant="primary">Save</.button>
</.tooltip>

<.tooltip text="Tooltip on bottom" position="bottom" variant="success">
  Hover me
</.tooltip>

<.tooltip text="Long explanation text..." multiline>
  Hover for details
</.tooltip>

Attributes

  • text (:string) (required) - Tooltip text.
  • position (:string) - Tooltip position: top (default), end (right in LTR), bottom, start (left in LTR). Defaults to nil. Must be one of nil, "top", "end", "bottom", or "start".
  • variant (:string) - Color variant (primary, success, warning, danger, color-1 through color-9). Defaults to nil.
  • multiline (:boolean) - Multiline tooltip (wider, left-aligned). Defaults to false.
  • is_help (:boolean) - Help cursor (question mark). Defaults to false.
  • is_inline (:boolean) - Inline text style with dotted underline. Defaults to false.
  • is_keyword (:boolean) - Dotted underline + help cursor for inline term explanations. Defaults to false.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)