# typed: false
# frozen_string_literal: true

module Ariadne
  module UI
    module Badge
      class Component < Ariadne::BaseComponent
        option :size, default: proc { :base }

        renders_one :text
        renders_one :leading_color_dot, lambda { |**options|
          options[:size] = size # Use the same size as the badge
          Ariadne::UI::ColorDot::Component.new(**options)
        }

        include Ariadne::Behaviors::Tooltipable

        # must be dont here rather than within an `accepts_html_attributes` block
        # because the padding class is dependent on the slot's existence, which isn't known until now
        def before_render
          html_attrs[:class] = Ariadne::ViewComponents.tailwind_merger.merge([style(size:, with_leading_item: leading_item? ? :yes : :no), html_attrs[:class]].join(" "))
        end

        private def leading_item?
          leading_color_dot.present?
        end

        private def leading_item
          leading_color_dot.presence
        end

        style do
          base do
            [
              "ariadne-truncate",
              "ariadne-max-w-full",
              "ariadne-border-0.5",
              "ariadne-border-solid",
              "ariadne-border-black/10",
              "dark:ariadne-border-white/10",
              "ariadne-text-content",
              "dark:ariadne-text-content-dark",
            ]
          end

          variants do
            with_leading_item do
              yes { "ariadne-inline-flex ariadne-items-center" }
              no { "ariadne-inline-block" }
            end

            size do
              xs { "ariadne-leading-5 ariadne-text-xs ariadne-rounded-md" }
              sm { "ariadne-leading-6 ariadne-text-sm ariadne-rounded-lg" }
              base { "ariadne-leading-7 ariadne-text-base ariadne-rounded-xl" }
              md { "ariadne-leading-7 ariadne-text-base ariadne-rounded-xl" }
            end
          end

          compound(size: :xs, with_leading_item: :yes) { ["ariadne-pe-1 ariadne-ps-0.5"] }
          compound(size: :sm, with_leading_item: :yes) { ["ariadne-pe-1.5 ariadne-ps-0.5"] }
          compound(size: :base, with_leading_item: :yes) { ["ariadne-pe-2.5 ariadne-ps-0.5"] }
          compound(size: :md, with_leading_item: :yes) { ["ariadne-pe-1.5 ariadne-ps-0.5"] }

          compound(size: :xs, with_leading_item: :no) { ["ariadne-px-1"] }
          compound(size: :sm, with_leading_item: :no) { ["ariadne-px-1.5"] }
          compound(size: :base, with_leading_item: :no) { ["ariadne-px-2"] }
          compound(size: :md, with_leading_item: :no) { ["ariadne-px-2"] }
        end
      end
    end
  end
end