# frozen_string_literal: true

module Features
  class Typography < ApplicationComponent
    include Protos::Typography
    # This will override h1-h4 + p and add inline_a

    def view_template
      ul class: "flex flex-col gap-xs" do
        li { h1(size: :xl) { "XL Hello, world!" } }
        li { h2(size: :lg) { "XL Hello, world!" } }
        li { h3(size: :md) { "Hello, world!" } }
        li { h4(size: :sm) { "Hello, world!" } }
        li { h4(size: :xs) { "Hello, world!" } }
        li do
          plain "This is some paragraph text "
          inline_a(href: "https://example.com") { "with an inline link" }
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Buttons < ApplicationComponent
    def view_template
      ul(class: "flex flex-wrap gap-sm") do
        li { button(class: "btn") { "Button" } }
        li { button(class: "btn btn-primary") { "Primary Button" } }
        li { button(class: "btn btn-secondary") { "Secondary Button" } }
        li { button(class: "btn btn-info") { "Info Button" } }
        li { button(class: "btn btn-success") { "Success Button" } }
        li { button(class: "btn btn-warning") { "Warning Button" } }
        li { button(class: "btn btn-error") { "Error Button" } }
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Badges < ApplicationComponent
    def view_template
      ul(class: "flex flex-wrap gap-sm") do
        li { span(class: "badge") { "Badge" } }
        li { span(class: "badge badge-primary") { "Primary Badge" } }
        li { span(class: "badge badge-secondary") { "Secondary Badge" } }
        li { span(class: "badge badge-info") { "Info Badge" } }
        li { span(class: "badge badge-success") { "Success Badge" } }
        li { span(class: "badge badge-warning") { "Warning Badge" } }
        li { span(class: "badge badge-error") { "Error Badge" } }
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Comboboxes < ApplicationComponent
    def view_template
      render Protos::Combobox.new do |c|
        c.trigger(id: "trigger", class: "btn btn-primary") do
          "Select an option"
        end
        c.content do
          c.list(class: "border rounded-box bg-base-300") do
            c.input(placeholder: "Search...")
            c.empty { "No results found" }
            c.group do
              c.title { "Quick links" }
              c.item { a(href: "#") { "Calendar" } }
              c.item { a(href: "#") { "Projects" } }
            end
          end
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Commands < ApplicationComponent
    def view_template
      render Protos::Command.new do |c|
        c.trigger(id: "trigger", class: "btn btn-primary") { "Open command" }

        c.dialog do
          c.list do
            c.input(placeholder: "Search...")
            c.empty { "No results found" }

            c.group do
              c.title { "Suggestions" }
              c.item { a(href: "#") { "Calendar" } }
              c.item { a(href: "#") { "Search Emoji" } }
            end

            c.group do
              c.title { "Settings" }
              c.item { a(href: "#") { "Profile" } }
              c.item { a(href: "#") { "Mail" } }
              c.item { a(href: "#") { "Settings" } }
            end
          end
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Drawers < ApplicationComponent
    def view_template
      render Protos::Drawer.new(id: "some_id") do |c|
        c.content do
          c.trigger(id: "trigger", class: "btn btn-primary") { "Open Drawer" }
        end

        c.side(class: "z-[999]") do
          ul(class: css[:menu]) do
            li { a { "Main Menu" } }
          end
        end
      end
    end

    private

    def theme
      {
        menu: tokens(
          "menu",
          "p-4",
          "w-80",
          "min-h-full",
          "bg-base-200",
          "text-base-content"
        )
      }
    end
  end
end

# frozen_string_literal: true

module Features
  class Modals < ApplicationComponent
    def view_template
      render Protos::Modal.new do |c|
        c.trigger(id: "trigger", class: "btn btn-primary") { "Open Modal" }
        c.dialog do
          span { "This is the modal content." }
          c.close_button(id: "close", class: "btn") { "Close" }
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Dropdowns < ApplicationComponent
    def view_template
      render Protos::Dropdown.new do |c|
        c.trigger(id: "trigger", class: "btn btn-primary") { "Open" }
        c.menu(class: "w-52") do
          c.item { a { "Item 1" } }
          c.item { a { "Item 2" } }
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Accordions < ApplicationComponent
    def view_template
      render Protos::Accordion.new do |c|
        c.item(class: "border", input_id: "title") do
          c.title { "Accordion Item 1" }
          c.content { "Accordion Item 1 Content" }
        end

        c.item(class: "border") do
          c.title { "Accordion Item 2" }
          c.content { "Accordion Item 2 Content" }
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Alerts < ApplicationComponent
    def view_template
      render Protos::Alert.new do |c|
        c.icon { icon("check-circle") }
        plain "Hello world"

        c.actions do
          button(
            class: "btn btn-primary btn-sm btn-circle",
            aria_label: "Something"
          ) do
            icon("x-circle", variant: :outline)
          end
        end
      end
    end
  end
end

NT

# frozen_string_literal: true

module Features
  class Avatars < ApplicationComponent
    def view_template
      div(class: "flex gap-sm items-center") do
        with_placeholder
        with_image
      end
    end

    private

    def with_image
      render Protos::Avatar.new(
        indicator: "online",
        shape: "circle",
        theme: { figure: "bg-base-content text-neutral w-12" }
      ) do |c|
        c.img(src: "https://i.pravatar.cc/300", alt: "NT")
      end
    end

    def with_placeholder
      render Protos::Avatar.new(
        placeholder: true,
        class: "text-base-100",
        shape: :circle,
        theme: { figure: "p-sm bg-base-content" }
      ) do |c|
        c.plain("NT")
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class ChatBubbles < ApplicationComponent
    def view_template
      ul class: "space-y-md" do
        li do
          render Protos::ChatBubble.new do |c|
            c.header { "Robert A. Caro" }
            c.content { "Hey, how's it going?" }
          end
        end

        li do
          render Protos::ChatBubble.new(align: :end) do |c|
            c.header { "You" }
            c.content(type: :primary) { "Pretty good, you?" }
          end
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Collapses < ApplicationComponent
    def view_template
      render Protos::Collapse.new(class: "border", input_id: "collapse") do |c|
        c.title { "Toggle" }
        c.content { "This is the collapse content" }
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Lists < ApplicationComponent
    def view_template
      render Protos::List.new do |c|
        c.item(class: "border p-sm") { "Item 1" }
        c.item(class: "border p-sm") { "Item 2" }
        c.item(class: "border p-sm") { "Item 3" }
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Popovers < ApplicationComponent
    def view_template
      render Protos::Popover.new do |c|
        c.trigger(id: "trigger", class: "btn btn-primary") { "Open Popover" }
        c.content(theme: { container: "transition-all" }) do
          ul(class: "menu border rounded-box") do
            li { a(href: "#") { "Item 1" } }
            li { a(href: "#") { "Item 2" } }
            li { a(href: "#") { "Item 3" } }
          end
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Tables < ApplicationComponent
    def view_template
      render Protos::Table.new do |c|
        c.caption { "Table Caption" }
        c.header do
          c.row do
            c.head { "Name" }
            c.head { "Age" }
            c.head { "Status" }
            c.head { "Location" }
          end
        end

        c.body do
          c.row do
            c.cell { "John Doe" }
            c.cell { "28" }
            c.cell do
              span(class: "badge badge-info") { "Active" }
            end
            c.cell { "North Pole" }
          end
          c.row do
            c.cell { "Jane Smith" }
            c.cell { "33" }
            c.cell { span(class: "badge badge-info") { "Active" } }
            c.cell { "South Pole" }
          end
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Timelines < ApplicationComponent
    def view_template
      events = [
        ["1984", "First Macintosh computer", false, true],
        ["1985", "First Windows computer", true, true],
        ["1998", "iMac", true, false]
      ]

      render Protos::Timeline.new do |c|
        events.each do |date, content, start, finish|
          c.item do
            hr(class: "bg-base-100") if start
            c.left do
              span(class: "badge badge-accent") { date }
            end
            c.center do
              div(class: "w-6 h-6") { icon("check-circle") }
            end
            c.right(class: "timeline-box") do
              span { content }
            end
            hr(class: "bg-base-100") if finish
          end
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Breadcrumbs < ApplicationComponent
    def view_template
      render Protos::Breadcrumbs.new do |c|
        c.crumb do
          a(href: "#", class: "gap-2") do
            icon("home", size: :sm)
            span { "Home" }
          end
        end

        c.crumb { a(href: "#") { "Accounts" } }
        c.crumb { a(href: "#") { "Joe" } }
        c.crumb { "Edit" }
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Carousels < ApplicationComponent
    def view_template
      render Protos::Carousel.new(
        class: "rounded-box h-96",
        snap_to: :end
      ) do |c|
        images.each do |image|
          c.item { img(src: image, alt: "Random image") }
        end
      end
    end

    private

    def images
      [
        asset_path("images/image-1.webp"),
        asset_path("images/image-2.webp"),
        asset_path("images/image-3.webp")
      ]
    end
  end
end

Card Title

This is the card body

# frozen_string_literal: true

module Features
  class Cards < ApplicationComponent
    def view_template
      render Protos::Card.new(
        border: true,
        class: "bg-neutral text-neutral-content max-w-[300px]"
      ) do |c|
        c.image { img(src: image_url, alt: "Placeholder Image") }
        c.body do
          c.title { "Card Title" }
          p { "This is the card body" }
        end
      end
    end

    private

    def image_url
      "https://images.unsplash.com/photo-1709418359735-9cf3b793558d?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
    end
  end
end

# frozen_string_literal: true

module Features
  class Heroes < ApplicationComponent
    include Protos::Typography

    def view_template
      render Protos::Hero.new(
        class: "h-96 rounded-box w-full",
        style: "background-image: url(#{asset_path("images/hero.webp")});"
      ) do |c|
        c.overlay(class: "opacity-90")
        c.content do
          h1(class: "text-white") { "Hello, world!" }
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Stats < ApplicationComponent
    def view_template
      render Protos::Stats.new do |c|
        c.stat do
          c.title { "Total orders" }
          c.value { "1,200" }
        end
        c.stat do
          c.title { "Total sales" }
          c.value { "$1,200" }
        end
        c.stat do
          c.title { "Avg. order value" }
          c.value { "$1.00" }
        end
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Swaps < ApplicationComponent
    def view_template
      render Protos::Swap.new do |c|
        c.on(id: "on", width: 5, height: 5) { icon("check-circle", size: :lg) }
        c.off(id: "off", width: 5, height: 5) { icon("x-circle", size: :lg) }
      end
    end
  end
end

# frozen_string_literal: true

module Features
  class Tabs < ApplicationComponent
    def view_template
      render Protos::Tabs.new do |c|
        c.tab { "Tab 1" }
        c.tab { "Tab 2" }
      end
    end

    private

    def theme
      {
        item: tokens(
          "rounded-box",
          "border",
          "p-sm",
          "bg-base-100"
        )
      }
    end
  end
end

# frozen_string_literal: true

module Features
  class Toasts < ApplicationComponent
    def view_template
      render Protos::Toast.new do |toast|
        render Protos::Alert.new(
          type: :success,
          class: "flex items-center flex-nowrap"
        ) do |alert|
          plain("Hey, how's it going?")
          alert.actions(class: "inline-flex") do
            toast.close_button(id: "close") do
              icon("x-circle", variant: :outline)
            end
          end
        end
      end
    end
  end
end