LanternUI.Components.IconButton (LanternUI v0.8.1)

Copy Markdown View Source

Icon-only button with a required accessible label, a tooltip (lantern's tooltip/1), and an optional kbd hint.

<.icon_button label="Toggle panel" kbd="]">
  <.icon name="view-columns" />
</.icon_button>

<.icon_button label="New ticket" variant="outline" navigate="/tickets/new">
  <.icon name="plus" />
</.icon_button>

Summary

Functions

icon_button(assigns)

Functions

icon_button(assigns)

Attributes

  • label (:string) (required) - Accessible name and tooltip copy. Required.
  • kbd (:string) - Optional keyboard hint shown in the tooltip after the label. Defaults to nil.
  • variant (:string) - ghost is transparent; outline has a hairline; primary is solid. Defaults to "ghost". Must be one of "ghost", "outline", or "primary".
  • size (:string) - Maps onto button icon sizes (sm/md/lg). Defaults to "md". Must be one of "sm", "md", or "lg".
  • disabled (:boolean) - Render disabled and non-interactive. Defaults to false.
  • tooltip (:boolean) - Wrap with tooltip/1. Turn off when the parent already tips. Defaults to true.
  • navigate (:string) - LiveView navigate target; renders as a link. Defaults to nil.
  • patch (:string) - LiveView patch target; renders as a link. Defaults to nil.
  • href (:any) - External/full-page href; renders as a link. Defaults to nil.
  • class (:any) - Extra classes merged onto the button. Defaults to nil.
  • Global attributes are accepted. HTML/phx-* attrs on the button. Supports all globals plus: ["id", "type", "form", "name", "value"].

Slots

  • inner_block (required) - The icon.