AccrueAdmin.Components.Icon (accrue_admin v1.5.0)

Copy Markdown View Source

Inline SVG icon primitive for the admin UI.

Renders Heroicons (MIT-licensed) outline glyphs as inline SVG — no sprite file, no runtime JS, CSP-clean. Icons inherit color via currentColor and are sized by the --ax-icon-* design tokens (size attr).

<Icon.icon name={:bolt} />
<Icon.icon name={:arrow_right} size="sm" class="text-accent" />

Decorative by default (aria-hidden). Pass label to expose an accessible name for an icon that carries meaning on its own (e.g. an icon-only button/link).

Summary

Functions

Renders an inline icon.

All icon names this component can render.

Functions

icon(assigns)

Renders an inline icon.

Attributes

  • name — required, one of [:home, :users, :subscriptions, :invoices, :payments, :recovery, :webhooks, :events, :coupons, :promotions, :connect, :search, :arrow_right, :arrow_long_right, :chevron_right, :chevron_down, :chevron_up_down, :x_mark, :check, :check_circle, :exclamation_triangle, :information_circle, :external, :clock, :banknotes, :replay, :funnel, :plus, :building, :dots_vertical, :inbox, :copy, :sun, :moon, :computer_desktop]
  • size"sm" (16px) | "md" (20px, default) | "lg" (24px)

  • class — extra classes merged onto the <svg>
  • label — accessible name; when set the icon is exposed to AT (not hidden)

Attributes

  • name (:atom) (required) - Must be one of :home, :users, :subscriptions, :invoices, :payments, :recovery, :webhooks, :events, :coupons, :promotions, :connect, :search, :arrow_right, :arrow_long_right, :chevron_right, :chevron_down, :chevron_up_down, :x_mark, :check, :check_circle, :exclamation_triangle, :information_circle, :external, :clock, :banknotes, :replay, :funnel, :plus, :building, :dots_vertical, :inbox, :copy, :sun, :moon, or :computer_desktop.
  • size (:string) - Defaults to "md". Must be one of "sm", "md", or "lg".
  • class (:any) - Defaults to nil.
  • label (:string) - Defaults to nil.
  • Global attributes are accepted.

names()

@spec names() :: [atom()]

All icon names this component can render.