Renders a tooltip component.

Examples

<.tooltip content="This is a tooltip">
  <.button>Hover me</.button>
</.tooltip>

<.tooltip content="Custom tooltip" side="right" align="start">
  <.icon_button><Icons.info /></.icon_button>
</.tooltip>

Props

• content - The tooltip content (required)
• side - Tooltip placement: "top", "right", "bottom", "left" (default: "top")
• align - Tooltip alignment: "start", "center", "end" (default: "center")
• open_delay - Delay before showing (in ms) (default: 700)
• close_delay - Delay before hiding (in ms) (default: 300)
• color - Color theme (default: accent color)
• Plus margin props (m, mx, my, mt, mr, mb, ml)

Attributes

• color (:string) - Color utility class string. One of: gray, gold, bronze, brown, yellow, amber, orange, tomato, red, ruby, crimson, pink, plum, purple, violet, iris, indigo, blue, cyan, teal, jade, green, grass, lime, mint, sky. Must be one of "gray", "gold", "bronze", "brown", "yellow", "amber", "orange", "tomato", "red", "ruby", "crimson", "pink", "plum", "purple", "violet", "iris", "indigo", "blue", "cyan", "teal", "jade", "green", "grass", "lime", "mint", or "sky".
• m (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• mx (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• my (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• mt (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• mr (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• mb (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• ml (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
• id (:string) - Defaults to nil.
• content (:string) (required) - Tooltip content.
• side (:string) - Tooltip placement. Defaults to "top". Must be one of "top", "right", "bottom", or "left".
• align (:string) - Tooltip alignment. Defaults to "center". Must be one of "start", "center", or "end".
• open_delay (:integer) - Delay before showing (ms). Defaults to 700.
• close_delay (:integer) - Delay before hiding (ms). Defaults to 300.
• class (:string) - Additional CSS classes. Defaults to nil.
• style (:string) - Additional inline styles. Defaults to nil.
• Global attributes are accepted.

Slots

• inner_block (required)