stimulus-overlay-helpers 2.0.0 → 3.0.0
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 +1 -1
- data/lib/stimulus_overlay_helpers/view_helpers.rb +71 -76
- metadata +3 -7
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a2215812e0ecb9c0bd1f4b7efc9400166bda8e93de7c0081e74a2df208ad14c5
|
|
4
|
+
data.tar.gz: 71aa2665940125d96e6d805dec6e5ee0f1ff67bee21f2f2de7e234189ae4f428
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 603f3d036f358c53d05afe2c2e0e0b0526b03f895ae9bf37b18458ba067ab42ace156f5b72b11cd81c1dccc5b011c958ca427cc64b28cb761c55f61c425793ed
|
|
7
|
+
data.tar.gz: 21693b5bdd51a47011afde4ec0842ba149cd67a6e77648982785ae033980eeba41d20ef17fb412ee828336ef71806182eee3646597506434a7c52dde63f6c5f4
|
data/README.md
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
module StimulusOverlayHelpers
|
|
2
2
|
module ViewHelpers
|
|
3
|
+
|
|
4
|
+
|
|
3
5
|
#== dropdown helper
|
|
4
6
|
# @param [button_content] Proc or String for content of the button element
|
|
5
7
|
# @param [panel_at_place] true (default: false) => it would render the panel into content_for(:overlays_box) on sticky parts (left-menu / top-bar) panels should be at place for avoiding that the panel would scroll with the content
|
|
@@ -15,34 +17,29 @@ module StimulusOverlayHelpers
|
|
|
15
17
|
end
|
|
16
18
|
|
|
17
19
|
panel_at_place = options.delete(:panel_at_place)
|
|
20
|
+
src = options.delete(:src)
|
|
21
|
+
button_class = [options.delete(:button_class) || 'dropdown-button', options[:class]].compact.join(' ')
|
|
22
|
+
panel_class = [options.delete(:class), 'dropdown-panel'].compact.join(' ')
|
|
23
|
+
close_btn_proc = StimulusOverlayHelpers.close_button_proc
|
|
18
24
|
|
|
19
25
|
id = "dropdown-panel-#{SecureRandom.hex(4)}"
|
|
20
26
|
|
|
21
|
-
src = options.delete(:src)
|
|
22
|
-
|
|
23
27
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
24
28
|
# create the Button
|
|
25
29
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
26
30
|
|
|
27
|
-
|
|
28
|
-
button_options
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
button_content = capture(&button_content) if button_content.is_a?(Proc)
|
|
32
|
-
btn = content_tag(:div, button_content, button_options)
|
|
31
|
+
button_content = capture(&panel_content_button = button_content) if button_content.is_a?(Proc)
|
|
32
|
+
button_options = options.merge(class: button_class, data: { controller: 'hotwire-svelte-helpers-dropdown', panel_id: id })
|
|
33
|
+
button_element = content_tag(:div, button_content, button_options)
|
|
33
34
|
|
|
34
35
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
35
36
|
# create the panel
|
|
36
37
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
37
38
|
|
|
38
|
-
panel_options = options.
|
|
39
|
-
panel_options[
|
|
40
|
-
panel_options[:style] = "display: none;"
|
|
41
|
-
panel_options[:id] = id
|
|
42
|
-
panel_options['data-src'] = src if src
|
|
43
|
-
close_btn_proc = StimulusOverlayHelpers.close_button_proc
|
|
39
|
+
panel_options = options.merge(class: panel_class, style: 'display: none;', id: id)
|
|
40
|
+
panel_options['data-src'] = src if src.present?
|
|
44
41
|
|
|
45
|
-
|
|
42
|
+
panel_element = content_tag(:div, panel_options) do
|
|
46
43
|
safe_join([
|
|
47
44
|
content_tag(:div, class: 'header') do
|
|
48
45
|
concat content_tag(:div, title, class: 'title')
|
|
@@ -54,14 +51,26 @@ module StimulusOverlayHelpers
|
|
|
54
51
|
])
|
|
55
52
|
end
|
|
56
53
|
|
|
54
|
+
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
55
|
+
# return the result
|
|
56
|
+
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
57
|
+
|
|
57
58
|
if panel_at_place
|
|
58
|
-
|
|
59
|
+
button_element + panel_element
|
|
59
60
|
else
|
|
60
|
-
content_for(:overlays_box,
|
|
61
|
-
|
|
61
|
+
content_for(:overlays_box, panel_element)
|
|
62
|
+
button_element
|
|
62
63
|
end
|
|
63
64
|
end
|
|
64
65
|
|
|
66
|
+
#== modal helper
|
|
67
|
+
# @param [button_content] Proc or String for content of the button element
|
|
68
|
+
# @param [panel_at_place] true (default: false) => it would render the overlay into content_for(:overlays_box) on sticky parts (left-menu / top-bar) overlays should be at place for avoiding that the overlay would scroll with the content
|
|
69
|
+
# @block [panel_content] Panel Content as block
|
|
70
|
+
# what it does:
|
|
71
|
+
# * a) wraps the button_content in element like: %button{ data: { controller: 'modal', ... } } and renders it at place
|
|
72
|
+
# * b) wraps the panel_content in a full-screen overlay element and renders it to the overlays_box (because of z-index-hierarchy)
|
|
73
|
+
# * c) the stimulus controller always adds the class .modal-panel to the panel and .modal-overlay to the backdrop
|
|
65
74
|
def modal(button_content, title = nil, options = {}, &panel_content)
|
|
66
75
|
if title.is_a?(Hash)
|
|
67
76
|
options = title.dup
|
|
@@ -69,32 +78,29 @@ module StimulusOverlayHelpers
|
|
|
69
78
|
end
|
|
70
79
|
|
|
71
80
|
panel_at_place = options.delete(:panel_at_place)
|
|
81
|
+
src = options.delete(:src)
|
|
82
|
+
button_class = [options.delete(:button_class) || 'modal-button', options[:class]].compact.join(' ')
|
|
83
|
+
panel_class = [options.delete(:class), 'modal-panel'].compact.join(' ')
|
|
84
|
+
close_btn_proc = StimulusOverlayHelpers.close_button_proc
|
|
72
85
|
|
|
73
86
|
id = "modal-overlay-#{SecureRandom.hex(4)}"
|
|
74
87
|
|
|
75
|
-
src = options.delete(:src)
|
|
76
|
-
|
|
77
88
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
78
89
|
# create the Button
|
|
79
90
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
80
91
|
|
|
81
|
-
button_options = options.dup
|
|
82
|
-
button_options[:class] = [options[:class], 'modal-button'].compact.join(' ')
|
|
83
|
-
button_options = button_options.merge(data: { controller: 'hotwire-svelte-helpers-modal', panel_id: id })
|
|
84
|
-
|
|
85
92
|
button_content = capture(&button_content) if button_content.is_a?(Proc)
|
|
86
|
-
|
|
93
|
+
button_options = options.merge(class: button_class, data: { controller: 'hotwire-svelte-helpers-modal', panel_id: id })
|
|
94
|
+
button_element = content_tag(:div, button_content, button_options)
|
|
87
95
|
|
|
88
96
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
89
97
|
# create the overlay
|
|
90
98
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
91
99
|
|
|
92
|
-
panel_options = options.
|
|
93
|
-
panel_options[
|
|
94
|
-
panel_options['data-src'] = src if src
|
|
95
|
-
close_btn_proc = StimulusOverlayHelpers.close_button_proc
|
|
100
|
+
panel_options = options.merge(class: panel_class)
|
|
101
|
+
panel_options['data-src'] = src if src.present?
|
|
96
102
|
|
|
97
|
-
|
|
103
|
+
overlay_element = content_tag(:div, class: 'modal-overlay', style: 'display:none;', id: id) do
|
|
98
104
|
content_tag(:div, panel_options) do
|
|
99
105
|
safe_join([
|
|
100
106
|
content_tag(:div, class: 'header') do
|
|
@@ -108,81 +114,70 @@ module StimulusOverlayHelpers
|
|
|
108
114
|
end
|
|
109
115
|
end
|
|
110
116
|
|
|
117
|
+
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
118
|
+
# return the result
|
|
119
|
+
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
120
|
+
|
|
111
121
|
if panel_at_place
|
|
112
|
-
|
|
122
|
+
button_element + overlay_element
|
|
113
123
|
else
|
|
114
|
-
content_for(:overlays_box,
|
|
115
|
-
|
|
124
|
+
content_for(:overlays_box, overlay_element)
|
|
125
|
+
button_element
|
|
116
126
|
end
|
|
117
127
|
end
|
|
118
128
|
|
|
119
|
-
|
|
129
|
+
#== tooltip helper
|
|
130
|
+
# @param [tip] Proc or String for the tooltip content (the panel shown on hover)
|
|
131
|
+
# @param [panel_at_place] true (default: false) => it would render the panel into content_for(:overlays_box) on sticky parts (left-menu / top-bar) panels should be at place for avoiding that the panel would scroll with the content
|
|
132
|
+
# @param [delay] Number (default: 0.4) => delay in seconds before the tooltip is shown
|
|
133
|
+
# @block [label] the visible label/element that triggers the tooltip on hover
|
|
134
|
+
# what it does:
|
|
135
|
+
# * a) wraps the label in element like: %span{ data: { controller: 'tooltip', ... } } and renders it at place
|
|
136
|
+
# * b) wraps the tip in a corresponding panel element and renders it to the overlays_box (because of z-index-hierarchy)
|
|
137
|
+
# * c) the stimulus controller always adds the class .tooltip-panel to the panel
|
|
138
|
+
def tooltip(tip, options = {}, &)
|
|
139
|
+
label = capture(&) if block_given?
|
|
140
|
+
tip = capture &tip if tip.is_a?(Proc)
|
|
141
|
+
return '' if label.blank?
|
|
142
|
+
return label if tip.blank?
|
|
120
143
|
|
|
121
144
|
panel_at_place = options.delete(:panel_at_place) || false
|
|
122
145
|
delay = options.delete(:delay) || 0.4
|
|
123
146
|
src = options.delete(:src)
|
|
124
|
-
label_class = options.delete(:label_class) || 'tooltip-label'
|
|
147
|
+
label_class = [options.delete(:label_class) || 'tooltip-label', options[:class]].compact.join(' ')
|
|
148
|
+
panel_class = [options.delete(:class), 'tooltip-panel'].compact.join(' ')
|
|
125
149
|
|
|
126
|
-
id =
|
|
127
|
-
|
|
128
|
-
lab = if label.is_a?(Proc)
|
|
129
|
-
capture &label
|
|
130
|
-
else
|
|
131
|
-
label
|
|
132
|
-
end
|
|
133
|
-
cont = capture(&content) if block_given?
|
|
150
|
+
id = "tooltip-#{SecureRandom.hex(4)}"
|
|
134
151
|
|
|
135
152
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
136
153
|
# create the Label
|
|
137
154
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
138
155
|
|
|
139
|
-
label_options = options.
|
|
140
|
-
|
|
141
|
-
label_options[:class] = [options[:class], label_class].compact.join(' ')
|
|
142
|
-
label_options = label_options.merge(data: { controller: 'hotwire-svelte-helpers-tooltip', panel_id: id, delay: delay })
|
|
143
|
-
|
|
144
|
-
label_element = if block_given? && cont.present?
|
|
145
|
-
content_tag(:span, label_options) do
|
|
146
|
-
lab
|
|
147
|
-
end
|
|
148
|
-
else
|
|
149
|
-
lab
|
|
150
|
-
end
|
|
156
|
+
label_options = options.merge(class: label_class, data: { controller: 'hotwire-svelte-helpers-tooltip', panel_id: id, delay: delay })
|
|
157
|
+
label_element = content_tag(:span, label, label_options)
|
|
151
158
|
|
|
152
159
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
153
160
|
# create the panel
|
|
154
161
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
155
162
|
|
|
156
|
-
panel_options = options.
|
|
157
|
-
panel_options[
|
|
158
|
-
panel_options[:id] = id
|
|
159
|
-
panel_options[:style] = 'display: none;'
|
|
160
|
-
panel_options['data-src'] = src if src
|
|
163
|
+
panel_options = options.merge(class: panel_class, style: 'display: none', id: id)
|
|
164
|
+
panel_options['data-src'] = src if src.present?
|
|
161
165
|
|
|
162
|
-
panel_element =
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
end
|
|
167
|
-
end
|
|
168
|
-
end
|
|
166
|
+
panel_element = content_tag(:div, panel_options) do
|
|
167
|
+
content_tag( :div, '', id: "arrow") +
|
|
168
|
+
content_tag(:div, tip, class: 'tooltip-content')
|
|
169
|
+
end
|
|
169
170
|
|
|
170
171
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
171
172
|
# return the result
|
|
172
173
|
# xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
173
174
|
|
|
174
|
-
if
|
|
175
|
-
label_element
|
|
176
|
-
elsif panel_at_place
|
|
177
|
-
r = label_element
|
|
178
|
-
r << panel_element
|
|
175
|
+
if panel_at_place
|
|
176
|
+
label_element + panel_element
|
|
179
177
|
else
|
|
180
|
-
content_for(:overlays_box)
|
|
181
|
-
panel_element
|
|
182
|
-
end
|
|
178
|
+
content_for(:overlays_box, panel_element)
|
|
183
179
|
label_element
|
|
184
180
|
end
|
|
185
|
-
|
|
186
181
|
end
|
|
187
182
|
|
|
188
183
|
end
|
metadata
CHANGED
|
@@ -1,16 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: stimulus-overlay-helpers
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version:
|
|
4
|
+
version: 3.0.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Christian Sedlmair
|
|
8
|
-
autorequire:
|
|
9
8
|
bindir: bin
|
|
10
9
|
cert_chain: []
|
|
11
|
-
date:
|
|
10
|
+
date: 1980-01-02 00:00:00.000000000 Z
|
|
12
11
|
dependencies: []
|
|
13
|
-
description:
|
|
14
12
|
email: christian@sedlmair.ch
|
|
15
13
|
executables: []
|
|
16
14
|
extensions: []
|
|
@@ -27,7 +25,6 @@ metadata:
|
|
|
27
25
|
homepage_uri: https://gitlab.com/sedl/stimulus-overlay-helpers
|
|
28
26
|
source_code_uri: https://gitlab.com/sedl/stimulus-overlay-helpers
|
|
29
27
|
changelog_uri: https://gitlab.com/sedl/stimulus-overlay-helpers
|
|
30
|
-
post_install_message:
|
|
31
28
|
rdoc_options: []
|
|
32
29
|
require_paths:
|
|
33
30
|
- lib
|
|
@@ -42,8 +39,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
42
39
|
- !ruby/object:Gem::Version
|
|
43
40
|
version: '0'
|
|
44
41
|
requirements: []
|
|
45
|
-
rubygems_version: 3.
|
|
46
|
-
signing_key:
|
|
42
|
+
rubygems_version: 3.6.7
|
|
47
43
|
specification_version: 4
|
|
48
44
|
summary: View helpers for the npm package @csedl/hotwire-svelte-helpers
|
|
49
45
|
test_files: []
|