phia_ui

defmodule <%= @module_name %>.Components.UI.Icon do
  @moduledoc """
  Inline SVG icon component backed by a Lucide sprite file.

  Ejected from PhiaUI — owns this copy of the source. Customise freely.

  Icons are rendered via an SVG `<use>` element that references a symbol in
  `/icons/lucide-sprite.svg`. The sprite file is generated by running:

      mix phia.icons

  The generated file lives at `priv/static/icons/lucide-sprite.svg` and is
  served by Phoenix's static plug at `/icons/lucide-sprite.svg`.

  ## Sizes

  | Size   | Classes |
  |--------|---------|
  | `:xs`  | w-3 h-3 |
  | `:sm`  | w-4 h-4 |
  | `:md`  | w-5 h-5 |
  | `:lg`  | w-6 h-6 |

  ## Examples

      <.icon name="menu" />

      <.icon name="chevron-down" size={:sm} />

      <.icon name="trending-up" class="text-green-500" />

      <.button size={:icon} aria-label="Add item">
        <.icon name="plus" />
      </.button>
  """

  use Phoenix.Component

  # Replace with your app's class merger or remove if unused.
  import <%= @module_name %>.ClassMerger, only: [cn: 1]

  attr :name, :string,
    required: true,
    doc: "Lucide icon name (e.g. \"menu\", \"chevron-down\", \"trending-up\")"

  attr :size, :atom,
    values: [:xs, :sm, :md, :lg],
    default: :md,
    doc: "Icon size — xs: w-3 h-3 · sm: w-4 h-4 · md: w-5 h-5 · lg: w-6 h-6"

  attr :class, :string,
    default: nil,
    doc: "Additional CSS classes (merged via cn/1, last wins)"

  def icon(assigns) do
    ~H"""
    <svg
      class={cn([size_class(@size), @class])}
      aria-hidden="true"
      focusable="false"
    >
      <use href={"/icons/lucide-sprite.svg#icon-#{@name}"} />
    </svg>
    """
  end

  defp size_class(:xs), do: "w-3 h-3"
  defp size_class(:sm), do: "w-4 h-4"
  defp size_class(:md), do: "w-5 h-5"
  defp size_class(:lg), do: "w-6 h-6"
end