defmodule PrymnWeb.Button do use Phoenix.Component @doc """ Render a primary variant button. ## Examples <.primary>Click me <.primary href="/a/path" size="sm">Link button """ attr :size, :string, default: "md", values: ~w(sm md lg) attr :class, :string, default: nil attr :rest, :global, include: ~w(href navigate patch) slot :inner_block, required: true def primary(assigns), do: button(assign(assigns, :variant, "primary")) @doc """ Render a secondary variant button. ## Examples <.secondary>Click me <.secondary href="/a/path" size="sm">Link button """ attr :size, :string, default: "md", values: ~w(sm md lg) attr :class, :string, default: nil attr :rest, :global, include: ~w(href navigate patch) slot :inner_block, required: true def secondary(assigns), do: button(assign(assigns, :variant, "secondary")) defp button_assigns(assigns) do assign( assigns, :style, [ "inline-flex justify-center items-end rounded-2xl shadow transition-colors active:shadow-sm", by_variant(assigns.variant), by_size(assigns.size), assigns[:class] ] ) end defp button(%{rest: %{href: _}} = assigns), do: link_button(assigns) defp button(%{rest: %{navigate: _}} = assigns), do: link_button(assigns) defp button(%{rest: %{patch: _}} = assigns), do: link_button(assigns) defp button(assigns) do assigns = button_assigns(assigns) ~H""" """ end defp link_button(assigns) do assigns = button_assigns(assigns) ~H""" <%= render_slot(@inner_block) %> """ end defp by_size("sm"), do: "text-sm px-3 py-1" defp by_size("md"), do: "text-base px-5 py-2" defp by_size("lg"), do: "text-lg px-7 py-3" defp by_variant("primary"), do: "font-medium bg-black text-white hover:bg-slate-800 active:text-white/80" defp by_variant("secondary"), do: "font-medium bg-transparent border border-slate-800 text-slate-800 hover:bg-slate-800 hover:text-white active:text-white/80" end