Class: Shadcn::ModeToggle::Component

Inherits:
ApplicationViewComponent show all
Defined in:
app/components/shadcn/mode_toggle/component.rb

Overview

Port of registry/new-york-v4/examples/mode-toggle.tsx — the dropdown shadcn documents for switching between light, dark and system.

In React the items call next-themes' setTheme; here they hand the mode to the shadcn--theme Stimulus controller wrapping them.

Constant Summary collapse

SUN_CLASSES =
"h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all " \
"dark:scale-0 dark:-rotate-90"
MOON_CLASSES =
"absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all " \
"dark:scale-100 dark:rotate-0"
MODES =
%w[light dark system].freeze

Constants inherited from ApplicationViewComponent

ApplicationViewComponent::CONTENTS_STYLE, ApplicationViewComponent::VOID_TAGS

Instance Attribute Summary collapse

Attributes inherited from ApplicationViewComponent

#attributes

Instance Method Summary collapse

Methods inherited from ApplicationViewComponent

#css_classes, default_tag, #merged_style, #render_element, #shadcn_t, slot_name, #style_variants, #tag_name

Constructor Details

#initialize(variant: :outline, align: :end, **attributes) ⇒ Component

Returns a new instance of Component.



23
24
25
26
27
# File 'app/components/shadcn/mode_toggle/component.rb', line 23

def initialize(variant: :outline, align: :end, **attributes)
  @variant = variant&.to_sym || :outline
  @align = align&.to_sym || :end
  super(**attributes)
end

Instance Attribute Details

#alignObject (readonly)

Returns the value of attribute align.



21
22
23
# File 'app/components/shadcn/mode_toggle/component.rb', line 21

def align
  @align
end

#variantObject (readonly)

Returns the value of attribute variant.



21
22
23
# File 'app/components/shadcn/mode_toggle/component.rb', line 21

def variant
  @variant
end

Instance Method Details

#callObject



36
37
38
# File 'app/components/shadcn/mode_toggle/component.rb', line 36

def call
  render_element(body: menu)
end

#element_attributes(**defaults) ⇒ Object



29
30
31
32
33
34
# File 'app/components/shadcn/mode_toggle/component.rb', line 29

def element_attributes(**defaults)
  super(**{
    style: merged_style(CONTENTS_STYLE),
    "data-controller" => "shadcn--theme"
  }.merge(defaults))
end