bootstrap4_helper 0.0.0 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +489 -4
- data/lib/bootstrap4_helper.rb +511 -2
- data/lib/bootstrap4_helper/accordion.rb +103 -0
- data/lib/bootstrap4_helper/accordion_group.rb +50 -0
- data/lib/bootstrap4_helper/alert.rb +54 -0
- data/lib/bootstrap4_helper/badge.rb +41 -0
- data/lib/bootstrap4_helper/card.rb +142 -0
- data/lib/bootstrap4_helper/card_column.rb +15 -0
- data/lib/bootstrap4_helper/card_deck.rb +15 -0
- data/lib/bootstrap4_helper/card_group.rb +15 -0
- data/lib/bootstrap4_helper/card_grouping.rb +33 -0
- data/lib/bootstrap4_helper/component.rb +106 -0
- data/lib/bootstrap4_helper/configuration.rb +34 -0
- data/lib/bootstrap4_helper/constants.rb +27 -0
- data/lib/bootstrap4_helper/dropdown.rb +95 -0
- data/lib/bootstrap4_helper/dropdown/menu.rb +140 -0
- data/lib/bootstrap4_helper/initialize.rb +19 -0
- data/lib/bootstrap4_helper/modal.rb +167 -0
- data/lib/bootstrap4_helper/nav.rb +113 -0
- data/lib/bootstrap4_helper/railtie.rb +8 -0
- data/lib/bootstrap4_helper/spinner.rb +44 -0
- data/lib/bootstrap4_helper/tab.rb +70 -0
- data/lib/bootstrap4_helper/tab/content.rb +58 -0
- data/lib/bootstrap4_helper/version.rb +1 -1
- metadata +116 -7
@@ -0,0 +1,103 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Builds a Accordion out of the collapse component of Bootstrap 4.
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class Accordion < Component
|
6
|
+
CARD_METHODS = %i[
|
7
|
+
title
|
8
|
+
text
|
9
|
+
image_overlay
|
10
|
+
].freeze
|
11
|
+
|
12
|
+
# Class constructor
|
13
|
+
# -
|
14
|
+
#
|
15
|
+
# @param [ActionView] template
|
16
|
+
# @param [Hash] opts
|
17
|
+
# @option opts [String] :id
|
18
|
+
# @option opts [String] :class
|
19
|
+
# @option opts [Hash] :data
|
20
|
+
# @option opts [String] :parent
|
21
|
+
# @option opts [String] :target
|
22
|
+
#
|
23
|
+
def initialize(template, opts = {}, &block)
|
24
|
+
super(template)
|
25
|
+
|
26
|
+
@id = opts.fetch(:id, uuid)
|
27
|
+
@class = opts.fetch(:class, '')
|
28
|
+
@data = opts.fetch(:data, {})
|
29
|
+
@parent = opts.fetch(:parent, nil)
|
30
|
+
@target = @data.fetch(:target, uuid)
|
31
|
+
@content = block || proc { '' }
|
32
|
+
@card = Card.new(@template)
|
33
|
+
end
|
34
|
+
|
35
|
+
# Builds a header component for the accordion, which is actually the header
|
36
|
+
# of a Card.
|
37
|
+
#
|
38
|
+
# @param [Hash] opts
|
39
|
+
# @return [String]
|
40
|
+
#
|
41
|
+
def header(opts = {}, &block)
|
42
|
+
@card.header(opts) do
|
43
|
+
content_tag(config(:accordion_header, :h5)) do
|
44
|
+
content_tag(
|
45
|
+
:a,
|
46
|
+
data: { toggle: 'collapse', target: "##{@target}" },
|
47
|
+
&block
|
48
|
+
)
|
49
|
+
end
|
50
|
+
end
|
51
|
+
end
|
52
|
+
|
53
|
+
# Builds the body component for the accordion, which is actually the body
|
54
|
+
# of a Card.
|
55
|
+
#
|
56
|
+
# @note The `@parent` gets used to set the parent element for the accordion. This
|
57
|
+
# gets used primarily in the `AccordionGroup`.
|
58
|
+
#
|
59
|
+
# @param [Hash] opts
|
60
|
+
# @return [String]
|
61
|
+
#
|
62
|
+
def body(opts = {}, &block)
|
63
|
+
data = { parent: "##{@parent}" } if @parent.present?
|
64
|
+
|
65
|
+
content_tag :div, id: @target, class: 'collapse', data: data do
|
66
|
+
@card.body(opts, &block)
|
67
|
+
end
|
68
|
+
end
|
69
|
+
|
70
|
+
# Because Accordions are basically `Cards` with a wrapper, we might as
|
71
|
+
# well catch common `Card` methods and send them to the card object. No
|
72
|
+
# point in creating similar methods for `Accordions`.
|
73
|
+
#
|
74
|
+
# @param [Symbol|String] method
|
75
|
+
# @param [Mixed] args
|
76
|
+
#
|
77
|
+
def method_missing(method, *args, &block)
|
78
|
+
if CARD_METHODS.include?(method)
|
79
|
+
@card.send(method, *args, &block)
|
80
|
+
else
|
81
|
+
super
|
82
|
+
end
|
83
|
+
end
|
84
|
+
|
85
|
+
# Checks if the Object reponds to missing.
|
86
|
+
#
|
87
|
+
#
|
88
|
+
def respond_to_missing?(method, include_private = false)
|
89
|
+
CARD_METHODS.include?(method) || super
|
90
|
+
end
|
91
|
+
|
92
|
+
# Leaving off the default `accordion` class because with only 1 accordion,
|
93
|
+
# there is no bottom.
|
94
|
+
#
|
95
|
+
# @return [String]
|
96
|
+
#
|
97
|
+
def to_s
|
98
|
+
content_tag :div, class: "card #{@class}", data: @data do
|
99
|
+
@content.call(self)
|
100
|
+
end
|
101
|
+
end
|
102
|
+
end
|
103
|
+
end
|
@@ -0,0 +1,50 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Used to build groups of Accordions, that are all synced with each other.
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class AccordionGroup < Component
|
6
|
+
# Class constructor
|
7
|
+
#
|
8
|
+
# @param [ActionView] template
|
9
|
+
# @param [Hash] opts
|
10
|
+
# @option opts [String] :id
|
11
|
+
# @option opts [String] :class
|
12
|
+
# @option opts [Hash] :data
|
13
|
+
#
|
14
|
+
def initialize(template, opts = {}, &block)
|
15
|
+
super(template)
|
16
|
+
|
17
|
+
@id = opts.fetch(:id, uuid)
|
18
|
+
@class = opts.fetch(:class, '')
|
19
|
+
@data = opts.fetch(:data, {})
|
20
|
+
@content = block || proc { '' }
|
21
|
+
end
|
22
|
+
|
23
|
+
# Used to build a `Accordion` for the `AccordionGroup`.
|
24
|
+
#
|
25
|
+
# @param [Mixed] args
|
26
|
+
# @return [Accordion]
|
27
|
+
#
|
28
|
+
def accordion(*args, &block)
|
29
|
+
opts = *args
|
30
|
+
|
31
|
+
if opts.any? { |opt| opt.is_a?(Hash) }
|
32
|
+
opts.collect! { |opt| opt[:parent] = @id if opt.is_a?(Hash) }
|
33
|
+
else
|
34
|
+
opts << { parent: @id }
|
35
|
+
end
|
36
|
+
|
37
|
+
Accordion.new(self, *opts, &block)
|
38
|
+
end
|
39
|
+
|
40
|
+
# Used to get the HTML markup of the `AccordionGroup`
|
41
|
+
#
|
42
|
+
# @return [String]
|
43
|
+
#
|
44
|
+
def to_s
|
45
|
+
content_tag :div, id: @id, class: "accordion #{@class}", data: @data do
|
46
|
+
@content.call(self)
|
47
|
+
end
|
48
|
+
end
|
49
|
+
end
|
50
|
+
end
|
@@ -0,0 +1,54 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# The Alert helper is meant to help you rapidly build Bootstrap Alert
|
3
|
+
# components quickly and easily. The dissmiss button is optional.
|
4
|
+
#
|
5
|
+
class Alert < Component
|
6
|
+
# Class constructor
|
7
|
+
#
|
8
|
+
# @param [Class] template - Template in which your are binding too.
|
9
|
+
# @param [NilClass|String|Symbol|Hash] context_or_options
|
10
|
+
# @param [Hash] opts
|
11
|
+
# @return [Alert]
|
12
|
+
#
|
13
|
+
def initialize(template, context_or_options = nil, opts = {}, &block)
|
14
|
+
super(template)
|
15
|
+
@context, args = parse_arguments(context_or_options, opts)
|
16
|
+
|
17
|
+
@id = args.fetch(:id, nil)
|
18
|
+
@class = args.fetch(:class, '')
|
19
|
+
@dismissible = args.fetch(:dismissible, false)
|
20
|
+
@content = block || proc { '' }
|
21
|
+
end
|
22
|
+
|
23
|
+
# The dissmiss button, if the element has one.
|
24
|
+
#
|
25
|
+
# @return [String]
|
26
|
+
#
|
27
|
+
def close_button
|
28
|
+
content_tag(:button, class: 'close', data: { dismiss: 'alert' }, aria: { label: 'Close' }) do
|
29
|
+
content_tag(:span, aria: { hidden: true }) { '×'.html_safe }
|
30
|
+
end
|
31
|
+
end
|
32
|
+
|
33
|
+
# Used to render out the Alert component.
|
34
|
+
#
|
35
|
+
# @return [String]
|
36
|
+
#
|
37
|
+
def to_s
|
38
|
+
content_tag :div, id: @id, class: container_class do
|
39
|
+
concat(@dismissible ? close_button : '')
|
40
|
+
@content.call(self)
|
41
|
+
end
|
42
|
+
end
|
43
|
+
|
44
|
+
private
|
45
|
+
|
46
|
+
# Used to get the container classes.
|
47
|
+
#
|
48
|
+
# @return [String]
|
49
|
+
#
|
50
|
+
def container_class
|
51
|
+
"alert alert-#{@context} #{@class}"
|
52
|
+
end
|
53
|
+
end
|
54
|
+
end
|
@@ -0,0 +1,41 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Creates Bootstrap badge components that can be used anywhere.
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class Badge < Component
|
6
|
+
# Class constructor
|
7
|
+
#
|
8
|
+
# @param [ActionView] template
|
9
|
+
# @param [NilClass|String|Symbol|Hash] context_or_options
|
10
|
+
# @param [Hash] opts
|
11
|
+
#
|
12
|
+
def initialize(template, context_or_options = nil, opts = {}, &block)
|
13
|
+
super(template)
|
14
|
+
@context, args = parse_arguments(context_or_options, opts)
|
15
|
+
|
16
|
+
@id = args.fetch(:id, nil)
|
17
|
+
@class = args.fetch(:class, '')
|
18
|
+
@content = block || proc { '' }
|
19
|
+
end
|
20
|
+
|
21
|
+
# String representation of the object.
|
22
|
+
#
|
23
|
+
#
|
24
|
+
def to_s
|
25
|
+
content_tag(config(:badge, :span), id: @id, class: container_class) { @content.call(self) }
|
26
|
+
end
|
27
|
+
|
28
|
+
private
|
29
|
+
|
30
|
+
# Used to get the container classes.
|
31
|
+
#
|
32
|
+
# @return [String]
|
33
|
+
#
|
34
|
+
def container_class
|
35
|
+
string = 'badge '
|
36
|
+
string += @context == 'secondary' ? 'badge-secondary' : "badge-#{@context}"
|
37
|
+
string += " #{@class}"
|
38
|
+
string
|
39
|
+
end
|
40
|
+
end
|
41
|
+
end
|
@@ -0,0 +1,142 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Used to build Bootstrap Card components. Cards are wildly used through Bootstrap 4.
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class Card < Component
|
6
|
+
# Used to initialize a new Card component.
|
7
|
+
#
|
8
|
+
# @param [ActionView] template
|
9
|
+
# @param [Hash] opts
|
10
|
+
# @option opts [String] :id
|
11
|
+
# @option opts [String] :class
|
12
|
+
# @option opts [Hash] :data
|
13
|
+
# @return [Card]
|
14
|
+
#
|
15
|
+
def initialize(template, opts = {}, &block)
|
16
|
+
super(template)
|
17
|
+
|
18
|
+
@id = opts.fetch(:id, '')
|
19
|
+
@class = opts.fetch(:class, '')
|
20
|
+
@data = opts.fetch(:data, nil)
|
21
|
+
@content = block || proc { '' }
|
22
|
+
end
|
23
|
+
|
24
|
+
# Builds the Header component.
|
25
|
+
#
|
26
|
+
# @param [Hash] args
|
27
|
+
# @option args [String] :id
|
28
|
+
# @option args [String] :class
|
29
|
+
# @option args [Hash] :data
|
30
|
+
# @return [String]
|
31
|
+
#
|
32
|
+
def header(args = {}, &block)
|
33
|
+
build_base_component :header, args, &block
|
34
|
+
end
|
35
|
+
|
36
|
+
# Builds the Body component.
|
37
|
+
#
|
38
|
+
# @param [Hash] args
|
39
|
+
# @option args [String] :id
|
40
|
+
# @option args [String] :class
|
41
|
+
# @option args [Hash] :data
|
42
|
+
# @return [String]
|
43
|
+
#
|
44
|
+
def body(args = {}, &block)
|
45
|
+
build_base_component :body, args, &block
|
46
|
+
end
|
47
|
+
|
48
|
+
# Builds the Footer component.
|
49
|
+
#
|
50
|
+
# @param [Hash] args
|
51
|
+
# @option args [String] :id
|
52
|
+
# @option args [String] :class
|
53
|
+
# @option args [Hash] :data
|
54
|
+
# @return [String]
|
55
|
+
#
|
56
|
+
def footer(args = {}, &block)
|
57
|
+
build_base_component :footer, args, &block
|
58
|
+
end
|
59
|
+
|
60
|
+
# Builds a Title component.
|
61
|
+
#
|
62
|
+
# @param [Hash] args
|
63
|
+
# @option args [String] :id
|
64
|
+
# @option args [String] :class
|
65
|
+
# @option args [Hash] :data
|
66
|
+
# @return [String]
|
67
|
+
#
|
68
|
+
def title(args = {}, &block)
|
69
|
+
build_sub_component config(:card_title, :h5), :title, args, &block
|
70
|
+
end
|
71
|
+
|
72
|
+
# Builds a Text component.
|
73
|
+
#
|
74
|
+
# @param [Hash] args
|
75
|
+
# @option args [String] :id
|
76
|
+
# @option args [String] :class
|
77
|
+
# @option args [Hash] :data
|
78
|
+
# @return [String]
|
79
|
+
#
|
80
|
+
def text(args = {}, &block)
|
81
|
+
build_sub_component config(:card_text, :p), :text, args, &block
|
82
|
+
end
|
83
|
+
|
84
|
+
# Builds a Img Overlay component.
|
85
|
+
#
|
86
|
+
# @param [Hash] args
|
87
|
+
# @option args [String] :id
|
88
|
+
# @option args [String] :class
|
89
|
+
# @option args [Hash] :data
|
90
|
+
# @return [String]
|
91
|
+
#
|
92
|
+
def image_overlay(args = {}, &block)
|
93
|
+
build_base_component 'img-overlay', args, &block
|
94
|
+
end
|
95
|
+
|
96
|
+
# Outputs the Object in its String representation.
|
97
|
+
#
|
98
|
+
# @return [String]
|
99
|
+
#
|
100
|
+
def to_s
|
101
|
+
content_tag :div, id: @id, class: "card #{@class}", data: @data do
|
102
|
+
@content.call(self)
|
103
|
+
end
|
104
|
+
end
|
105
|
+
|
106
|
+
private
|
107
|
+
|
108
|
+
# Used to build basic DIV components.
|
109
|
+
#
|
110
|
+
# @param [String] type
|
111
|
+
# @param [Mixed] args
|
112
|
+
# @return [String]
|
113
|
+
#
|
114
|
+
def build_base_component(type, args, &block)
|
115
|
+
build_sub_component :div, type, args, &block
|
116
|
+
end
|
117
|
+
|
118
|
+
# Used to build various DOM components.
|
119
|
+
#
|
120
|
+
# @param [Symbol] tag
|
121
|
+
# @param [String] type
|
122
|
+
# @param [Hash] args
|
123
|
+
# @option args [String] :id
|
124
|
+
# @option args [String] :class
|
125
|
+
# @option args [Hash] :data
|
126
|
+
# @return [String]
|
127
|
+
#
|
128
|
+
def build_sub_component(tag, type, args, &block)
|
129
|
+
id = args.fetch(:id, '')
|
130
|
+
klass = args.fetch(:class, '')
|
131
|
+
data = args.fetch(:data, {})
|
132
|
+
|
133
|
+
content_tag(
|
134
|
+
tag,
|
135
|
+
id: id,
|
136
|
+
class: "card-#{type} #{klass}",
|
137
|
+
data: data,
|
138
|
+
&block
|
139
|
+
)
|
140
|
+
end
|
141
|
+
end
|
142
|
+
end
|
@@ -0,0 +1,15 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Creates a Card Column Component.
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class CardColumn < CardGrouping
|
6
|
+
# String representation of the object.
|
7
|
+
#
|
8
|
+
#
|
9
|
+
def to_s
|
10
|
+
content_tag :div, id: @id, class: "card-columns #{@class}", data: @data do
|
11
|
+
@content.call(self)
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
15
|
+
end
|
@@ -0,0 +1,15 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Creates a Card Deck component
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class CardDeck < CardGrouping
|
6
|
+
# String representation of the object.
|
7
|
+
#
|
8
|
+
#
|
9
|
+
def to_s
|
10
|
+
content_tag :div, id: @id, class: "card-deck #{@class}", data: @data do
|
11
|
+
@content.call(self)
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
15
|
+
end
|
@@ -0,0 +1,15 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Creates a Card Group component
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class CardGroup < CardGrouping
|
6
|
+
# String representation of the object
|
7
|
+
#
|
8
|
+
#
|
9
|
+
def to_s
|
10
|
+
content_tag :div, id: @id, class: "card-group #{@class}", data: @data do
|
11
|
+
@content.call(self)
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
15
|
+
end
|
@@ -0,0 +1,33 @@
|
|
1
|
+
module Bootstrap4Helper
|
2
|
+
# Class for other Card group type components to inherit from.
|
3
|
+
#
|
4
|
+
#
|
5
|
+
class CardGrouping < Component
|
6
|
+
# Used to initialize a new Card Grouping.
|
7
|
+
#
|
8
|
+
# @param [Class] template
|
9
|
+
# @param [Hash] opts
|
10
|
+
# @option opts [String] :id
|
11
|
+
# @option opts [String] :class
|
12
|
+
# @option opts [Hash] :data
|
13
|
+
# @return [Card]
|
14
|
+
#
|
15
|
+
def initialize(template, opts = {}, &block)
|
16
|
+
super(template)
|
17
|
+
|
18
|
+
@id = opts.fetch(:id, '')
|
19
|
+
@class = opts.fetch(:class, '')
|
20
|
+
@data = opts.fetch(:data, nil)
|
21
|
+
@content = block || proc { '' }
|
22
|
+
end
|
23
|
+
|
24
|
+
# Builds a `Card` for the grouping class.
|
25
|
+
#
|
26
|
+
# @param [Hash] opts
|
27
|
+
# @return [Card]
|
28
|
+
#
|
29
|
+
def card(opts = {}, &block)
|
30
|
+
Card.new(@template, opts, &block)
|
31
|
+
end
|
32
|
+
end
|
33
|
+
end
|