Class: Bootstrap5Helper::Overlay

Inherits:
Component show all
Defined in:
lib/bootstrap5_helper/overlay.rb,
lib/bootstrap5_helper/overlay/menu.rb

Overview

Builds a Overlay component that can be used in other components.

Direct Known Subclasses

Dropdown, Dropend, Dropstart, Dropup

Defined Under Namespace

Classes: Menu

Instance Method Summary collapse

Methods inherited from Component

#capture, #concat, #config, #content_tag, #parse_arguments, #parse_context_or_options, #parse_tag_or_options, #parse_text_or_options, #uuid

Constructor Details

#initialize(template, tag, opts) ⇒ Overlay #initialize(template, opts) ⇒ Overlay

Class constructor

Overloads:

  • #initialize(template, tag, opts) ⇒ Overlay

    Parameters:

    • template (ActionView)
    • tag (Symbol|String)
      • The HTML element to use to wrap the component.
    • opts (Hash)

    Options Hash (opts):

    • :id (String)
    • :class (String)
    • :data (Hash)
    • :centered (Boolean)
  • #initialize(template, opts) ⇒ Overlay

    Parameters:

    • template (ActionView)
    • opts (Hash)

    Options Hash (opts):

    • :id (String)
    • :class (String)
    • :data (Hash)
    • :centered (Boolean)


27
28
29
30
31
32
33
34
35
36
37
38
39
# File 'lib/bootstrap5_helper/overlay.rb', line 27

def initialize(template, *tag_or_options, &block)
  super(template)

  @tag, args = parse_tag_or_options(*tag_or_options, {})
  @attrs     = args
  @split     = @attrs.delete(:split)    { false }
  @centered  = @attrs.delete(:centered) { false }
  @id        = @attrs.delete(:id)       { uuid }
  @class     = @attrs.delete(:class)    { '' }
  @data      = @attrs.delete(:data)     { {} }

  @content   = block || proc { '' }
end

Instance Method Details

#button(context = :primary, opts = {}, &block) ⇒ String

Used to generate a button for the dropdown. This button just opens the coresponding dropdown menu.

Parameters:

  • context (Symbol) (defaults to: :primary)
  • opts (Hash) (defaults to: {})

Options Hash (opts):

  • :id (String)
  • :class (String)
  • :data (Hash)

Returns:

  • (String)


53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
# File 'lib/bootstrap5_helper/overlay.rb', line 53

def button(context = :primary, opts = {}, &block)
  attrs  = opts
  klass  = attrs.delete(:class) { '' }
  data   = attrs.delete(:data)  { {} }
  aria   = attrs.delete(:aria)  { {} }

  (
    :button,
    {
      type:  'button',
      class: "dropdown-toggle btn btn-#{context} #{klass}",
      data:  data.merge(
        'bs-toggle'  => 'dropdown',
        'bs-display' => 'static'
      ),
      aria:  aria.merge(
        haspopup: true,
        expanded: false
      )
    }.merge(attrs),
    &block
  )
end

#caret(context = :primary, opts = {}) ⇒ String

Used to generate a button with just the caret, to open the dropdown.

Parameters:

  • context (Symbol) (defaults to: :primary)
  • opts (Hash) (defaults to: {})

Options Hash (opts):

  • :id (String)
  • :class (String)
  • :data (Hash)

Returns:

  • (String)


87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
# File 'lib/bootstrap5_helper/overlay.rb', line 87

def caret(context = :primary, opts = {})
  id     = opts.fetch(:id,    nil)
  klass  = opts.fetch(:class, '')
  data   = opts.fetch(:data,  {}).merge('bs-toggle' => 'dropdown')

  (
    :button,
    id:    id,
    type:  'button',
    class: "dropdown-toggle btn btn-#{context} #{klass} dropdown-toggle-split",
    data:  data,
    aria:  { haspopup: true, expanded: false }
  ) do
    (:span, 'Toggle Dropdown', class: 'visually-hidden')
  end
end

Used to create a new Overlay::Menu

Parameters:

  • opts (Hash)

Yields:

Returns:



113
114
115
# File 'lib/bootstrap5_helper/overlay.rb', line 113

def menu(*tag_or_options, &block)
  Menu.new(@template, *tag_or_options, &block)
end

#to_sString

String reprentation of the object.

Returns:

  • (String)


121
122
123
124
125
126
127
128
129
130
131
132
# File 'lib/bootstrap5_helper/overlay.rb', line 121

def to_s
  (
    @tag || :div,
    {
      id:    @id,
      class: "#{@type} #{alignment_type_class} #{@class}",
      data:  @data
    }.merge(@attrs)
  ) do
    @content.call(self)
  end
end