# typed: false # frozen_string_literal: true module Ariadne module Layout module NavBar class Component < Ariadne::BaseComponent # Leading items at the far left of the header. renders_many :leading_items, BaseComponent::ACCEPT_ANYTHING # Leading items at the far right of the header. renders_many :center_links, lambda { |href:, label:, current:| @links << { href: href, label: label, current: current } } # Leading items at the far right of the header. renders_many :trailing_items, BaseComponent::ACCEPT_ANYTHING def initialize(**options) super @links = [] end def initial?(position) position.zero? end def final?(position) position == (leading_items.size - 1) end style do base do [ "ariadne-bg-foreground", "dark:ariadne-bg-background-dark", "dark:ariadne-border-b", "dark:ariadne-border-zinc-900", "ariadne-z-50", "ariadne-overflow-hidden", "ariadne-border-zinc-100", ] end end style(:leading_item) do base do [ "", ] end variants do initial do yes { "ariadne-flex ariadne-flex-shrink-0 ariadne-items-center" } no { "ariadne-hidden lg:ariadne-ml-6 lg:ariadne-flex lg:ariadne-space-x-8" } end end end style :tab do base do [ "ariadne-text-content", "dark:ariadne-text-content-dark", "ariadne-text-base", "ariadne-font-medium", "ariadne-whitespace-nowrap", "ariadne-border-b-2", "ariadne-py-2", ] end variants do active do no do [ "ariadne-group", "ariadne-border-transparent", ] end yes do [ "ariadne-border-billy-purple-700", "ariadne-text-billy-purple-700", "dark:ariadne-border-billy-purple-300", "dark:ariadne-text-billy-purple-300", ] end end end end style(:trailing_item) do base do [ "ariadne-flex", "ariadne-flex-1", "ariadne-items-center", "ariadne-justify-end", "ariadne-gap-x-1", ] end variants do end end end end end end