Class: Bulmacomp::MenuComponent

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

Overview

Make the html strucrure for a bulma menu

Examples:

Empty menu

= render Bulmacomp::MenuComponent.new

<aside class='menu'></aside>

menu with title and elements

title = 'Menu title'
elements  = [link_to('first entry', '#'), link_to('second entry', '#')
render Bulmacomp::MenuComponent.new(elements: elements, title: title)

<aside class='menu'>
  <p class='menu-label'>Menu title</p>
  <ul>
    <li><a href='#'>first entry</li>
    <li><a href='#'>second entry<li>
  </ul>
</aside>

menu with title and annidate elements

elements = ['Uno',['Due',['Tre','Quattro']]]
= render Bulmacomp::MenuComponent.new(elements: elements)

<aside class='menu'>
  <p class='menu-label'>Uno</p>
  <ul>
    <li>Due</li>
    <li>
      Tre
      <ul>
        <li>Quattro</li>
      </ul>
    <li>
  </ul>
</aside>

with conetent

= render Bulmacomp::MenuComponent.new do
  %p some content

<aside class='menu'>
  <p>some content</p>
</aside>

with mixed conetent (arguments before)

elements = ['argument content',['argoument menu']]
= render Bulmacomp::MenuComponent.new(elements: elements) do
  %p yield content

<aside class='menu'>
  <p class='menu-label'>argoument content</p>
  <ul>
    <li>argoument menu</li>
  </ul>
  <p>yield content</p>
</aside>

Instance Method Summary collapse

Constructor Details

#initialize(elements: [], **opts) ⇒ MenuComponent

Returns a new instance of MenuComponent.

Parameters:

  • opts (Hash) —

    options to generate content

Options Hash (**opts):

  • elements (Array<String>) —

    each entry is used to generate menu elements throug #first_level method

  • :* (String) —

    each key going as tag option, default is class: ‘menu’



69
70
71
72
73
 
# File 'app/components/bulmacomp/menu_component.rb', line 69

def initialize(elements: [], **opts)
  super
  @elements = elements
  @opts = { class: 'menu' }.merge(opts)
end

Instance Method Details

#call ⇒ String

Generate an html safe string with full bulma menu.

Returns:

  • (String) —

    html string menu



77
78
79
 
# File 'app/components/bulmacomp/menu_component.rb', line 77

def call
  tag.aside first_level(@elements) + content, **@opts
end

#first_level(values = []) ⇒ String

Generate a string with all bulma menu element from ‘values` param.

Each element in ‘values` is mapped:

  • as ‘p.menu-title` tag if is not an Array

  • as #map_menu if is an Array

Examples:

Bulmacomp::MenuComponent.new().first_level(['Uno',['Due','Tre']])

<p class='menu-label'>Uno</p><ul><li>Due</li><li>Tre<li></ul>

Parameters:

  • values (Array) (defaults to: []) —

    menu elements

Returns:

  • (String) 


92
93
94
95
96
 
# File 'app/components/bulmacomp/menu_component.rb', line 92

def first_level(values = [])
  safe_join(
    values.map { |e| e.is_a?(Array) ? map_menu(e) : tag.p(e, class: 'menu-label') }
  )
end

#map_menu(values = []) ⇒ String

Generate a string with the “real” menu elements (no title) from ‘values’ param. The menu elements are incapsulated in a ul tag

Each element in ‘values’ is mapped:

  • as li tag if is not an Array

  • as #sub_menu if is an Array

Examples:

Bulmacomp::MenuComponent.new().map_menu(['Uno',['Due','Tre']])

<ul><li>Uno</li><li>Due<ul><li>Tre</li></ul></li></ul>

Parameters:

  • values (Array) (defaults to: []) —

    menu elements

Returns:

  • (String) 


110
111
112
 
# File 'app/components/bulmacomp/menu_component.rb', line 110

def map_menu(values = [])
  tag.ul safe_join(values.map { |e| e.is_a?(Array) ? sub_menu(e) : tag.li(e) })
end

#sub_menu(values = []) ⇒ String

Generate a string with sub-menu content from values params. The first array element is used as ancescor, other element are used to make the sub menu with #map_menu method.

Examples:

Bulmacomp::MenuComponent.new().sub_menu(['Uno',['Due','Tre']])

<li>Uno<ul><li>Due</li><li>Tre</li></ul></li>

Parameters:

  • values (Array) (defaults to: []) —

    sub-menu elements

Returns:

  • (String) 


123
124
125
 
# File 'app/components/bulmacomp/menu_component.rb', line 123

def sub_menu(values = [])
  tag.li safe_join([values.shift, map_menu(values)])
end