Class: Bulmacomp::DropdownComponent

Inherits:
ViewComponent::Base
  • Object
show all
Defined in:
app/components/bulmacomp/dropdown_component.rb

Overview

Make an html structure for a bulma dropdown

Examples:

empty dropdown

render Bulmacomp::DropdownComponent.new()

dropdown with title and elements

render Bulmacomp::DropdownComponent.new(title: 'title', elements: [1,2])

dropdown with yield, elements and other option

= render Bulmacomp::DropdownComponent.new(title: 'title', elements: [1,2], id: 'menu',
                              button_options: {class: 'button is-success'}, icon: nil) do
  some content

Instance Method Summary collapse

Constructor Details

#initialize(title: nil, elements: [], icon: default_icon, button_options: {}, **opts) {|optional| ... } ⇒ DropdownComponent

Returns a new instance of DropdownComponent.

Parameters:

  • opts (Hash) —

    options to generate content

Options Hash (**opts):

  • title (String) —

    Content of button, default empty string

  • elements (Array<String>) —

    collection of dropdown-item

  • icon (String) —

    icon span class content for button, default:

  • button_options (Hash) —

    options for button tag

  • :* (String) —

    each key going as content tag option, default is class: 'dropdown'

Yields:

  • (optional) —

    dropdown content



72
73
74
75
76
77
78
79
 
# File 'app/components/bulmacomp/dropdown_component.rb', line 72

def initialize(title: nil, elements: [], icon: default_icon, button_options: {}, **opts)
  super
  @title = tag.span title if title.present?
  @elements = elements
  @icon = tag.span icon, class: 'icon is-small' if icon.present?
  @button_options = default_button_options.merge(button_options)
  @opts = default_opts.merge(opts)
end

Instance Method Details

#call ⇒ String

Generated html string for bulma dropdown

Returns:

  • (String) 


98
99
100
 
# File 'app/components/bulmacomp/dropdown_component.rb', line 98

def call
  tag.div safe_join([tag_trigger, tag_content]), **@opts
end

#default_button_options ⇒ Object

return [Hash] default option for button tag



92
93
94
 
# File 'app/components/bulmacomp/dropdown_component.rb', line 92

def default_button_options
  { class: 'button', aria: { haspopup: 'true', controls: 'dropdown-menu' } }
end

#default_icon ⇒ String

Returns default content for button icon.

Returns:

  • (String) —

    default content for button icon



82
83
84
 
# File 'app/components/bulmacomp/dropdown_component.rb', line 82

def default_icon
  '<i class="fas fa-angle-down" aria-hidden="true"></i>'.html_safe
end

#default_opts ⇒ Hash

Returns default option for content tag.

Returns:

  • (Hash) —

    default option for content tag



87
88
89
 
# File 'app/components/bulmacomp/dropdown_component.rb', line 87

def default_opts
  { class: 'dropdown' }
end

#tag_content ⇒ String

generated html for '.dropdown-content' div. Map each content of elements in a '.dropdown-item' div and add yield content

Returns:

  • (String) 


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

def tag_content
  tag.div safe_join([@elements.map { |e| tag.div(e, class: 'dropdown-item') }, content]), class: 'dropdown-content'
end

#tag_trigger ⇒ String

generated html for '.dropdown-trigger' div

Returns:

  • (String) 


104
105
106
 
# File 'app/components/bulmacomp/dropdown_component.rb', line 104

def tag_trigger
  tag.div tag.button(safe_join([@title, @icon]), **@button_options), class: 'dropdown-trigger'
end