Class: Daisy::Actions::DropdownComponent

Inherits:
LocoMotion::BaseComponent show all
Includes:
ViewComponent::SlotableDefault
Defined in:
app/components/daisy/actions/dropdown_component.rb

Overview

The Dropdown component shows a Button, or any other component you wish, with a hovering menu that opens on click (or hover). It provides a flexible way to create dropdown menus with customizable triggers and content.

Note that the dropdown uses slots for both the activator and menu items, allowing for maximum flexibility in how the dropdown is triggered and what content it displays.

Constant Summary

Constants inherited from LocoMotion::BaseComponent

LocoMotion::BaseComponent::EMPTY_PART_IGNORED_TAGS, LocoMotion::BaseComponent::SELF_CLOSING_TAGS

Instance Attribute Summary

Attributes inherited from LocoMotion::BaseComponent

#config, #loco_parent

Instance Method Summary collapse

Methods inherited from LocoMotion::BaseComponent

build, #component_ref, #config_option, #cssify, define_modifier, define_modifiers, define_part, define_parts, define_size, define_sizes, #empty_part_content, #inspect, #part, register_component_initializer, register_component_setup, #rendered_css, #rendered_data, #rendered_html, #rendered_stimulus_controllers, #rendered_tag_name, renders_many, renders_one, set_component_name, #set_loco_parent, #strip_spaces

Constructor Details

#initialize(title = nil, **kws, &block) ⇒ DropdownComponent

Creates a new instance of the DropdownComponent.

Options Hash (**kws):

  • title (String) —

    The title of the dropdown. You can also pass this as the first argument.



78
79
80
81
82
 
# File 'app/components/daisy/actions/dropdown_component.rb', line 78

def initialize(title = nil, **kws, &block)
  super

  @simple_title = config_option(:title, title)
end

Instance Method Details

#before_render ⇒ Object

Adds the relevant Daisy classes to the component.



87
88
89
90
 
# File 'app/components/daisy/actions/dropdown_component.rb', line 87

def before_render
  setup_component
  setup_menu
end

#default_button ⇒ Object

Provides a default button if no button or custom activator is provided.



111
112
113
 
# File 'app/components/daisy/actions/dropdown_component.rb', line 111

def default_button
  Daisy::Actions::ButtonComponent.new(title: @simple_title)
end

#setup_component ⇒ Object

Add the ‘dropdown` CSS class to the component.



95
96
97
 
# File 'app/components/daisy/actions/dropdown_component.rb', line 95

def setup_component
  add_css(:component, "dropdown")
end

#setup_menu ⇒ Object

Make the menu a ‘<ul> / <li>` element and add the relevant Daisy classes.



102
103
104
105
106
 
# File 'app/components/daisy/actions/dropdown_component.rb', line 102

def setup_menu
  # Setup menu itself
  set_tag_name(:menu, :ul)
  add_css(:menu, "dropdown-content where:menu where:bg-base-100 where:rounded-box where:shadow where:w-52 where:p-2 where:z-[1]")
end