doggo

defmodule Storybook.Components.Toolbar do
  use PhoenixStorybook.Story, :component

  def function, do: &Doggo.toolbar/1

  def paw_svg do
    """
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      stroke="currentColor"
      stroke-width="2"
      stroke-linecap="round"
      stroke-linejoin="round"
      class="lucide lucide-paw-print"
    >
      <circle cx="11" cy="4" r="2" />
      <circle cx="18" cy="8" r="2" />
      <circle cx="20" cy="16" r="2" />
      <path d="M9 10a5 5 0 0 1 5 5v3.5a3.5 3.5 0 0 1-6.84 1.045Q6.52 17.48 4.46 16.84A3.5 3.5 0 0 1 5.5 10Z" />
    </svg>
    """
  end

  def pot_svg do
    """
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      stroke="currentColor"
      stroke-width="2"
      stroke-linecap="round"
      stroke-linejoin="round"
      class="lucide lucide-cooking-pot"
    >
      <path d="M2 12h20" /><path d="M20 12v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8" /><path d="m4 8 16-4" /><path d="m8.86 6.78-.45-1.81a2 2 0 0 1 1.45-2.43l1.94-.48a2 2 0 0 1 2.43 1.46l.45 1.8" />
    </svg>
    """
  end

  def teach_svg do
    """
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      stroke="currentColor"
      stroke-width="2"
      stroke-linecap="round"
      stroke-linejoin="round"
      class="lucide lucide-graduation-cap"
    >
      <path d="M22 10v6M2 10l10-5 10 5-10 5z" /><path d="M6 12v5c3 3 9 3 12 0v-5" />
    </svg>
    """
  end

  def cut_svg do
    """
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      stroke="currentColor"
      stroke-width="2"
      stroke-linecap="round"
      stroke-linejoin="round"
      class="lucide lucide-scissors"
    >
      <circle cx="6" cy="6" r="3" /><path d="M8.12 8.12 12 12" /><path d="M20 4 8.12 15.88" /><circle
        cx="6"
        cy="18"
        r="3"
      /><path d="M14.8 14.8 20 20" />
    </svg>
    """
  end

  def variations do
    [
      %Variation{
        id: :default,
        attributes: %{label: "Actions"},
        slots: [
          """
          <div role="group">
            <button phx-click="feed-dog">
              <Doggo.icon label="Feed dog">#{pot_svg()}</Doggo.icon>
            </button>
            <button phx-click="walk-dog">
              <Doggo.icon label="Walk dog">#{paw_svg()}</Doggo.icon>
            </button>
          </div>
          <div role="group">
            <button phx-click="teach-trick">
              <Doggo.icon label="Teach a Trick">#{teach_svg()}</Doggo.icon>
            </button>
            <button phx-click="groom-dog">
              <Doggo.icon label="Groom dog">#{cut_svg()}</Doggo.icon>
            </button>
          </div>
          """
        ]
      }
    ]
  end
end