defmodule CMSWeb.CoreComponents do @moduledoc """ Provides core UI components. """ use Phoenix.Component attr :class, :string, default: nil attr :global, :global, include: ~w[navigate patch href replace method csrf_token download hreflang referrerpolicy rel target type] slot :inner_block def a(assigns) do ~H""" <.link class={["hover:underline", @class]} {@global}>{render_slot(@inner_block)}</.link> """ end attr :field, Phoenix.HTML.FormField, required: true attr :global, :global, include: ~w[required placeholder type] def input(assigns) do ~H""" <input id={@field.id} name={@field.name} value={@field.value} {@global} /> """ end @doc """ Renders a [Heroicon](https://heroicons.com). Heroicons come in three styles – outline, solid, and mini. By default, the outline style is used, but solid and mini may be applied by using the `-solid` and `-mini` suffix. You can customize the size and colors of the icons by setting width, height, and background color classes. Icons are extracted from the `deps/heroicons` directory and bundled within your compiled app.css by the plugin in your `assets/tailwind.config.js`. ## Examples <.icon name="hero-x-mark-solid" /> <.icon name="hero-arrow-path" class="ml-1 w-3 h-3 animate-spin" /> """ attr :name, :string, required: true attr :class, :string, default: nil def icon(%{name: "hero-" <> _} = assigns) do ~H""" <span class={[@name, @class]} /> """ end end