coveragebook_components 0.7.1 → 0.7.3
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/app/assets/build/coco/app.css +27 -20
- data/app/assets/build/coco/app.js +136 -309
- data/app/assets/build/coco/book.css +11 -7
- data/app/assets/build/coco/book.js +143 -185
- data/app/assets/js/coco.js +2 -30
- data/app/assets/js/{base/mixins → libs/alpine/directives}/undo.js +12 -13
- data/app/assets/js/libs/alpine/index.js +15 -13
- data/app/components/coco/app/blocks/slide_editor/slide_editor.html.erb +2 -1
- data/app/components/coco/app/blocks/slide_editor/slide_editor.js +0 -3
- data/app/components/coco/app/elements/{form_button/form_button.css → button_to/button_to.css} +1 -1
- data/app/components/coco/app/elements/{form_button/form_button.rb → button_to/button_to.rb} +1 -1
- data/app/components/coco/app/elements/color_picker/color_picker.js +0 -2
- data/app/components/coco/app/elements/image_picker/image_picker.js +0 -2
- data/app/components/coco/app/elements/link/link.css +11 -1
- data/app/components/coco/app/elements/link/link.rb +1 -0
- data/app/components/coco/app/elements/menu/menu.css +1 -1
- data/app/components/coco/app/elements/seamless_textarea/seamless_textarea.html.erb +2 -1
- data/app/components/coco/app/elements/seamless_textarea/seamless_textarea.js +1 -7
- data/app/components/coco/app/elements/snackbar/snackbar.js +0 -2
- data/app/components/coco/app/elements/toast/toast.css +1 -1
- data/app/components/coco/app/elements/toast/toast.js +0 -2
- data/app/components/coco/base/button/button.js +0 -2
- data/app/components/coco/base/button/button.rb +3 -9
- data/app/components/coco/base/dropdown/dropdown.js +1 -3
- data/app/components/coco/base/link/link.css +11 -11
- data/app/components/coco/base/link/link.rb +1 -5
- data/app/components/coco/base/modal_dialog/modal_dialog.css +1 -1
- data/app/components/coco/concerns/acts_as_button_group.rb +1 -1
- data/app/helpers/coco/app_helper.rb +60 -37
- data/app/helpers/coco/base_helper.rb +2 -2
- data/app/helpers/coco/url_helper.rb +6 -12
- data/lib/coco.rb +1 -1
- metadata +12 -21
- data/app/assets/js/app/mixins/dropdown.js +0 -18
- data/app/assets/js/app/mixins/index.js +0 -3
- data/app/assets/js/base/mixins/attr-observer.js +0 -54
- data/app/assets/js/base/mixins/attrs.js +0 -58
- data/app/assets/js/base/mixins/dropdown.js +0 -69
- data/app/assets/js/base/mixins/index.js +0 -17
- data/app/assets/js/base/mixins/options.js +0 -76
- data/app/assets/js/base/mixins/size-observer.js +0 -34
- data/app/assets/js/base/mixins/tooltip.js +0 -81
- /data/app/assets/js/libs/alpine/{plugins → directives}/destroy.js +0 -0
- /data/app/assets/js/libs/alpine/{plugins → directives}/dimensions.js +0 -0
- /data/app/assets/js/libs/alpine/{plugins → directives}/dropdown.js +0 -0
- /data/app/assets/js/libs/alpine/{plugins → directives}/notification.js +0 -0
- /data/app/assets/js/libs/alpine/{plugins → directives}/options.js +0 -0
- /data/app/assets/js/libs/alpine/{plugins → directives}/tooltip.js +0 -0
- /data/app/components/coco/app/elements/{form_button/form_button.html.erb → button_to/button_to.html.erb} +0 -0
@@ -1,10 +1,7 @@
|
|
1
1
|
import { CocoComponent } from "@js/coco";
|
2
|
-
import { withSizeObserver } from "@js/base/mixins";
|
3
2
|
|
4
3
|
export default CocoComponent("appSeamlessTextarea", () => {
|
5
4
|
return {
|
6
|
-
use: [withSizeObserver()],
|
7
|
-
|
8
5
|
height: null,
|
9
6
|
observer: null,
|
10
7
|
value: null,
|
@@ -27,11 +24,8 @@ export default CocoComponent("appSeamlessTextarea", () => {
|
|
27
24
|
const textarea = this.$refs.textarea;
|
28
25
|
|
29
26
|
if (textarea) {
|
30
|
-
const styles = window.getComputedStyle(textarea);
|
31
|
-
const fontSize = styles.getPropertyValue("font-size");
|
32
|
-
|
33
27
|
textarea.style.height = "4px";
|
34
|
-
|
28
|
+
const newHeight = textarea.scrollHeight;
|
35
29
|
textarea.style.height = `${newHeight}px`;
|
36
30
|
|
37
31
|
if (this.height !== newHeight) {
|
@@ -74,11 +74,10 @@ module Coco
|
|
74
74
|
end
|
75
75
|
end
|
76
76
|
|
77
|
-
attr_reader :on_click, :resize, :
|
77
|
+
attr_reader :on_click, :resize, :button_attrs
|
78
78
|
|
79
|
-
def initialize(click: nil, resize: nil,
|
79
|
+
def initialize(click: nil, resize: nil, states: nil, loading: false, active: false, button_element: {}, **kwargs)
|
80
80
|
@on_click = click
|
81
|
-
@props = props.to_h
|
82
81
|
@resize = resize.to_h
|
83
82
|
@states = states.to_h
|
84
83
|
@loading = loading
|
@@ -183,12 +182,7 @@ module Coco
|
|
183
182
|
end
|
184
183
|
|
185
184
|
def alpine_data
|
186
|
-
|
187
|
-
{
|
188
|
-
tooltips: (state_tooltips if state_tooltips.present?),
|
189
|
-
props: (props if props.present?)
|
190
|
-
}.compact
|
191
|
-
end
|
185
|
+
{tooltips: state_tooltips} if state_tooltips.present?
|
192
186
|
end
|
193
187
|
|
194
188
|
private
|
@@ -2,23 +2,23 @@
|
|
2
2
|
[data-coco].coco-link {
|
3
3
|
@apply inline-flex items-center;
|
4
4
|
|
5
|
-
|
6
|
-
|
7
|
-
@apply order-2;
|
8
|
-
}
|
9
|
-
|
10
|
-
[data-component="icon"] {
|
5
|
+
&.with-icon {
|
6
|
+
> [data-component="icon"] {
|
11
7
|
@apply order-1 mr-[0.4em];
|
12
8
|
}
|
13
|
-
}
|
14
9
|
|
15
|
-
&[data-icon-position="end"] {
|
16
10
|
.link-text {
|
17
|
-
@apply order-
|
11
|
+
@apply order-2;
|
18
12
|
}
|
19
13
|
|
20
|
-
[data-
|
21
|
-
|
14
|
+
&[data-icon-position="end"] {
|
15
|
+
.link-text {
|
16
|
+
@apply order-1 mr-[0.4em];
|
17
|
+
}
|
18
|
+
|
19
|
+
[data-component="icon"] {
|
20
|
+
@apply order-2 mr-0;
|
21
|
+
}
|
22
22
|
}
|
23
23
|
}
|
24
24
|
}
|
@@ -4,12 +4,8 @@ module Coco
|
|
4
4
|
include Concerns::ActsAsLink
|
5
5
|
include Concerns::WithIcon
|
6
6
|
|
7
|
-
after_initialize do
|
8
|
-
get_option(:icon, :position).default = "start"
|
9
|
-
end
|
10
|
-
|
11
7
|
def call
|
12
|
-
render component_tag(class: "coco-link") do
|
8
|
+
render component_tag(class: ["coco-link", ("with-icon" if icon?)]) do
|
13
9
|
safe_join([
|
14
10
|
icon,
|
15
11
|
icon? ? tag.span(link_text, class: "link-text") : link_text
|
@@ -9,7 +9,7 @@ module Coco
|
|
9
9
|
divider: ->(**kwargs) { tag.div(class: "divider") },
|
10
10
|
button: ->(**kwargs) {
|
11
11
|
if kwargs.key?(:action) || kwargs.key?(:method) || kwargs.key?(:params)
|
12
|
-
App::Elements::
|
12
|
+
App::Elements::ButtonTo.new(**button_kwargs(kwargs, :button_to))
|
13
13
|
else
|
14
14
|
App::Elements::Button.new(**button_kwargs(kwargs, :button))
|
15
15
|
end
|
@@ -2,6 +2,19 @@ module Coco
|
|
2
2
|
module AppHelper
|
3
3
|
def coco_link(*args, **kwargs, &block)
|
4
4
|
href, content = args[0..2].reverse!
|
5
|
+
|
6
|
+
if kwargs.key?(:modal)
|
7
|
+
modal_name = (kwargs[:modal] == true) ? "default" : kwargs[:modal]
|
8
|
+
kwargs[:data] = kwargs.fetch(:data, {}).merge(coco_modal_data_attributes(modal_name))
|
9
|
+
kwargs.delete(:modal)
|
10
|
+
end
|
11
|
+
|
12
|
+
if kwargs.key?(:frame)
|
13
|
+
turbo_data = {turbo: true, turbo_frame: kwargs[:frame]}
|
14
|
+
kwargs[:data] = kwargs.fetch(:data, {}).merge(turbo_data)
|
15
|
+
kwargs.delete(:frame)
|
16
|
+
end
|
17
|
+
|
5
18
|
link = Coco::App::Elements::Link.new(href: href, **kwargs)
|
6
19
|
link = link.with_content(content) unless block
|
7
20
|
|
@@ -10,81 +23,91 @@ module Coco
|
|
10
23
|
|
11
24
|
def coco_button(href = nil, **kwargs, &block)
|
12
25
|
button = if kwargs.key?(:action) || kwargs.key?(:method) || kwargs.key?(:params)
|
13
|
-
"
|
26
|
+
"ButtonTo"
|
14
27
|
else
|
15
28
|
"Button"
|
16
29
|
end
|
17
30
|
|
31
|
+
kwargs[:button_element] ||= {}
|
32
|
+
|
33
|
+
if kwargs.key?(:modal)
|
34
|
+
modal_name = (kwargs[:modal] == true) ? "default" : kwargs[:modal]
|
35
|
+
kwargs[:button_element][:data] = kwargs[:button_element].fetch(:data, {}).merge(coco_modal_data_attributes(modal_name))
|
36
|
+
kwargs.delete(:modal)
|
37
|
+
end
|
38
|
+
|
39
|
+
if kwargs.key?(:frame)
|
40
|
+
turbo_data = {turbo: true, turbo_frame: kwargs[:frame]}
|
41
|
+
kwargs[:button_element][:data] = kwargs[:button_element].fetch(:data, {}).merge(turbo_data)
|
42
|
+
kwargs.delete(:frame)
|
43
|
+
end
|
44
|
+
|
18
45
|
component = "Coco::App::Elements::#{button}".constantize.new(href: href, **kwargs)
|
19
46
|
render component, &block
|
20
47
|
end
|
21
48
|
|
22
|
-
def
|
23
|
-
render Coco::App::Elements::
|
24
|
-
end
|
25
|
-
|
26
|
-
def coco_menu_button(**kwargs, &block)
|
27
|
-
render Coco::App::Elements::MenuButton.new(**kwargs), &block
|
49
|
+
def coco_menu_button(**, &block)
|
50
|
+
render Coco::App::Elements::MenuButton.new(**), &block
|
28
51
|
end
|
29
52
|
|
30
|
-
def coco_confirm_button(href = nil,
|
31
|
-
render Coco::App::Elements::ConfirmButton.new(href: href, **
|
53
|
+
def coco_confirm_button(href = nil, **, &block)
|
54
|
+
render Coco::App::Elements::ConfirmButton.new(href: href, **), &block
|
32
55
|
end
|
33
56
|
|
34
|
-
def coco_color_picker_button(
|
35
|
-
render Coco::App::Elements::ColorPickerButton.new(**
|
57
|
+
def coco_color_picker_button(**, &block)
|
58
|
+
render Coco::App::Elements::ColorPickerButton.new(**), &block
|
36
59
|
end
|
37
60
|
|
38
|
-
def coco_image_picker_button(
|
39
|
-
render Coco::App::Elements::ImagePickerButton.new(**
|
61
|
+
def coco_image_picker_button(**, &block)
|
62
|
+
render Coco::App::Elements::ImagePickerButton.new(**), &block
|
40
63
|
end
|
41
64
|
|
42
|
-
def coco_layout_picker_button(
|
43
|
-
render Coco::App::Elements::LayoutPickerButton.new(**
|
65
|
+
def coco_layout_picker_button(**, &block)
|
66
|
+
render Coco::App::Elements::LayoutPickerButton.new(**), &block
|
44
67
|
end
|
45
68
|
|
46
|
-
def coco_dropdown_button(
|
47
|
-
render Coco::App::Elements::DropdownButton.new(**
|
69
|
+
def coco_dropdown_button(**, &block)
|
70
|
+
render Coco::App::Elements::DropdownButton.new(**), &block
|
48
71
|
end
|
49
72
|
|
50
|
-
def coco_button_group(
|
51
|
-
render Coco::App::Elements::ButtonGroup.new(**
|
73
|
+
def coco_button_group(**, &block)
|
74
|
+
render Coco::App::Elements::ButtonGroup.new(**), &block
|
52
75
|
end
|
53
76
|
|
54
|
-
def coco_toolbar(
|
55
|
-
render Coco::App::Elements::Toolbar.new(**
|
77
|
+
def coco_toolbar(**, &block)
|
78
|
+
render Coco::App::Elements::Toolbar.new(**), &block
|
56
79
|
end
|
57
80
|
|
58
|
-
def coco_seamless_textarea(
|
59
|
-
render Coco::App::Elements::SeamlessTextarea.new(**
|
81
|
+
def coco_seamless_textarea(**, &block)
|
82
|
+
render Coco::App::Elements::SeamlessTextarea.new(**), &block
|
60
83
|
end
|
61
84
|
|
62
|
-
def coco_snackbar(
|
63
|
-
render Coco::App::Elements::Snackbar.new(**
|
85
|
+
def coco_snackbar(**, &block)
|
86
|
+
render Coco::App::Elements::Snackbar.new(**), &block
|
64
87
|
end
|
65
88
|
|
66
|
-
def coco_notice(
|
67
|
-
render Coco::App::Elements::Notice.new(**
|
89
|
+
def coco_notice(**, &block)
|
90
|
+
render Coco::App::Elements::Notice.new(**), &block
|
68
91
|
end
|
69
92
|
|
70
|
-
def coco_toast(
|
71
|
-
render Coco::App::Elements::Toast.new(**
|
93
|
+
def coco_toast(**, &block)
|
94
|
+
render Coco::App::Elements::Toast.new(**), &block
|
72
95
|
end
|
73
96
|
|
74
|
-
def coco_system_banner(
|
75
|
-
render Coco::App::Elements::SystemBanner.new(**
|
97
|
+
def coco_system_banner(**, &block)
|
98
|
+
render Coco::App::Elements::SystemBanner.new(**), &block
|
76
99
|
end
|
77
100
|
|
78
|
-
def coco_form_with(
|
79
|
-
form_with(
|
101
|
+
def coco_form_with(**, &block)
|
102
|
+
form_with(**, builder: Coco::AppFormBuilder, &block)
|
80
103
|
end
|
81
104
|
|
82
|
-
def coco_form_for(
|
83
|
-
form_for(
|
105
|
+
def coco_form_for(*, **, &block)
|
106
|
+
form_for(*, **, builder: Coco::AppFormBuilder, &block)
|
84
107
|
end
|
85
108
|
|
86
|
-
def coco_fields(
|
87
|
-
fields(
|
109
|
+
def coco_fields(**, &block)
|
110
|
+
fields(**, builder: Coco::AppFormBuilder, &block)
|
88
111
|
end
|
89
112
|
end
|
90
113
|
end
|
@@ -39,10 +39,10 @@ module Coco
|
|
39
39
|
end
|
40
40
|
end
|
41
41
|
|
42
|
-
def
|
42
|
+
def coco_link_to_modal(*, data: {}, modal: nil, **kwargs, &)
|
43
43
|
kwargs[:data] = coco_modal_data_attributes(modal || "default").merge(data)
|
44
44
|
|
45
|
-
|
45
|
+
coco_link_to(*, **kwargs, &)
|
46
46
|
end
|
47
47
|
|
48
48
|
def coco_modal_frame_id(name = "default")
|
@@ -5,27 +5,21 @@ module Coco
|
|
5
5
|
def coco_link_to(name = nil, options = nil, html_options = nil, &block)
|
6
6
|
html_options, options, name = options, name, block if block
|
7
7
|
options ||= {}
|
8
|
-
|
9
8
|
html_options = Coco::ActionViewHelper.convert_options_to_data_attributes(options, html_options)
|
10
|
-
html_options[:classes] = html_options[:class]
|
11
|
-
html_options.delete(:class)
|
12
9
|
|
13
10
|
href = Coco::ActionViewHelper.url_target(name, options)
|
14
11
|
|
15
|
-
|
16
|
-
link = link.with_content(name) unless block
|
17
|
-
|
18
|
-
render(link, &block)
|
12
|
+
coco_link(name, href, **html_options.symbolize_keys!, &block)
|
19
13
|
end
|
20
14
|
|
21
|
-
def coco_button_to(
|
22
|
-
html_options, options = options,
|
15
|
+
def coco_button_to(name = nil, options = nil, html_options = nil, &block)
|
16
|
+
html_options, options = options, name if block
|
23
17
|
options ||= {}
|
24
18
|
html_options ||= {}
|
19
|
+
html_options.symbolize_keys!
|
25
20
|
|
26
|
-
button = Coco::App::Elements::
|
27
|
-
button = button.with_content(
|
28
|
-
|
21
|
+
button = Coco::App::Elements::ButtonTo.new(action: options, type: :submit, **html_options)
|
22
|
+
button = button.with_content(name) unless block
|
29
23
|
render(button, &block)
|
30
24
|
end
|
31
25
|
end
|
data/lib/coco.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: coveragebook_components
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.7.
|
4
|
+
version: 0.7.3
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Mark Perkins
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2023-
|
11
|
+
date: 2023-10-03 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: rails
|
@@ -1323,17 +1323,7 @@ files:
|
|
1323
1323
|
- app/assets/img/test/slides/slide-foreground-portrait.jpg
|
1324
1324
|
- app/assets/js/app.js
|
1325
1325
|
- app/assets/js/app/components.js
|
1326
|
-
- app/assets/js/app/mixins/dropdown.js
|
1327
|
-
- app/assets/js/app/mixins/index.js
|
1328
1326
|
- app/assets/js/base/components.js
|
1329
|
-
- app/assets/js/base/mixins/attr-observer.js
|
1330
|
-
- app/assets/js/base/mixins/attrs.js
|
1331
|
-
- app/assets/js/base/mixins/dropdown.js
|
1332
|
-
- app/assets/js/base/mixins/index.js
|
1333
|
-
- app/assets/js/base/mixins/options.js
|
1334
|
-
- app/assets/js/base/mixins/size-observer.js
|
1335
|
-
- app/assets/js/base/mixins/tooltip.js
|
1336
|
-
- app/assets/js/base/mixins/undo.js
|
1337
1327
|
- app/assets/js/book.js
|
1338
1328
|
- app/assets/js/book/components.js
|
1339
1329
|
- app/assets/js/coco.js
|
@@ -1345,13 +1335,14 @@ files:
|
|
1345
1335
|
- app/assets/js/helpers/path.js
|
1346
1336
|
- app/assets/js/helpers/screenshot.js
|
1347
1337
|
- app/assets/js/helpers/turbo_events.js
|
1338
|
+
- app/assets/js/libs/alpine/directives/destroy.js
|
1339
|
+
- app/assets/js/libs/alpine/directives/dimensions.js
|
1340
|
+
- app/assets/js/libs/alpine/directives/dropdown.js
|
1341
|
+
- app/assets/js/libs/alpine/directives/notification.js
|
1342
|
+
- app/assets/js/libs/alpine/directives/options.js
|
1343
|
+
- app/assets/js/libs/alpine/directives/tooltip.js
|
1344
|
+
- app/assets/js/libs/alpine/directives/undo.js
|
1348
1345
|
- app/assets/js/libs/alpine/index.js
|
1349
|
-
- app/assets/js/libs/alpine/plugins/destroy.js
|
1350
|
-
- app/assets/js/libs/alpine/plugins/dimensions.js
|
1351
|
-
- app/assets/js/libs/alpine/plugins/dropdown.js
|
1352
|
-
- app/assets/js/libs/alpine/plugins/notification.js
|
1353
|
-
- app/assets/js/libs/alpine/plugins/options.js
|
1354
|
-
- app/assets/js/libs/alpine/plugins/tooltip.js
|
1355
1346
|
- app/assets/js/libs/alpine/utils/tippy_modifiers.js
|
1356
1347
|
- app/assets/js/libs/tippy/index.js
|
1357
1348
|
- app/assets/js/libs/tippy/plugins/hide_on_esc.js
|
@@ -1381,6 +1372,9 @@ files:
|
|
1381
1372
|
- app/components/coco/app/elements/button_group/button_group.html.erb
|
1382
1373
|
- app/components/coco/app/elements/button_group/button_group.js
|
1383
1374
|
- app/components/coco/app/elements/button_group/button_group.rb
|
1375
|
+
- app/components/coco/app/elements/button_to/button_to.css
|
1376
|
+
- app/components/coco/app/elements/button_to/button_to.html.erb
|
1377
|
+
- app/components/coco/app/elements/button_to/button_to.rb
|
1384
1378
|
- app/components/coco/app/elements/color_picker/color_picker.css
|
1385
1379
|
- app/components/coco/app/elements/color_picker/color_picker.html.erb
|
1386
1380
|
- app/components/coco/app/elements/color_picker/color_picker.js
|
@@ -1393,9 +1387,6 @@ files:
|
|
1393
1387
|
- app/components/coco/app/elements/confirm_panel/confirm_panel.html.erb
|
1394
1388
|
- app/components/coco/app/elements/confirm_panel/confirm_panel.js
|
1395
1389
|
- app/components/coco/app/elements/confirm_panel/confirm_panel.rb
|
1396
|
-
- app/components/coco/app/elements/form_button/form_button.css
|
1397
|
-
- app/components/coco/app/elements/form_button/form_button.html.erb
|
1398
|
-
- app/components/coco/app/elements/form_button/form_button.rb
|
1399
1390
|
- app/components/coco/app/elements/image_picker/image_picker.css
|
1400
1391
|
- app/components/coco/app/elements/image_picker/image_picker.html.erb
|
1401
1392
|
- app/components/coco/app/elements/image_picker/image_picker.js
|
@@ -1,18 +0,0 @@
|
|
1
|
-
import withDropdown from "@js/base/mixins/dropdown";
|
2
|
-
|
3
|
-
export default function withAppDropdown(props = {}) {
|
4
|
-
const initDropdown = withDropdown({
|
5
|
-
theme: "coco-app-dropdown",
|
6
|
-
placement: "bottom-start",
|
7
|
-
offset: [0, 0],
|
8
|
-
...props,
|
9
|
-
});
|
10
|
-
|
11
|
-
function withAppDropdownMixin(component) {
|
12
|
-
return initDropdown(component);
|
13
|
-
}
|
14
|
-
|
15
|
-
withAppDropdownMixin.props = initDropdown.props;
|
16
|
-
|
17
|
-
return withAppDropdownMixin;
|
18
|
-
}
|
@@ -1,54 +0,0 @@
|
|
1
|
-
const ignoredAttributes = ["class", "style"];
|
2
|
-
|
3
|
-
export default function withAttrObserver(props = {}) {
|
4
|
-
return function (component) {
|
5
|
-
const oldDestroy = component.destroy;
|
6
|
-
const toIgnore = props.ignore || ignoredAttributes;
|
7
|
-
|
8
|
-
const attrObserver = Alpine.reactive({
|
9
|
-
observer: null,
|
10
|
-
handler(attrName, newValue, oldValue, target) {
|
11
|
-
if (component.onAttrChange) {
|
12
|
-
component.onAttrChange(attrName, newValue, oldValue, target);
|
13
|
-
}
|
14
|
-
},
|
15
|
-
});
|
16
|
-
|
17
|
-
attrObserver.observer = new MutationObserver((mutationsList) => {
|
18
|
-
for (const mutation of mutationsList) {
|
19
|
-
if (
|
20
|
-
mutation.type !== "attributes" ||
|
21
|
-
toIgnore.includes(mutation.attributeName)
|
22
|
-
) {
|
23
|
-
return;
|
24
|
-
}
|
25
|
-
|
26
|
-
const { target } = mutation;
|
27
|
-
|
28
|
-
attrObserver.handler(
|
29
|
-
mutation.attributeName,
|
30
|
-
target.getAttribute(mutation.attributeName),
|
31
|
-
mutation.oldValue,
|
32
|
-
target
|
33
|
-
);
|
34
|
-
}
|
35
|
-
});
|
36
|
-
|
37
|
-
Object.assign(component, {
|
38
|
-
destroy() {
|
39
|
-
attrObserver.observer.disconnect();
|
40
|
-
attrObserver.observer = null;
|
41
|
-
|
42
|
-
if (oldDestroy) {
|
43
|
-
oldDestroy.call(this);
|
44
|
-
}
|
45
|
-
},
|
46
|
-
});
|
47
|
-
|
48
|
-
attrObserver.observer.observe(component.$root, { attributes: true });
|
49
|
-
|
50
|
-
return component;
|
51
|
-
};
|
52
|
-
}
|
53
|
-
|
54
|
-
export { ignoredAttributes };
|
@@ -1,58 +0,0 @@
|
|
1
|
-
export default function withAttrs(props = {}) {
|
2
|
-
return function (component) {
|
3
|
-
return Object.assign(
|
4
|
-
component,
|
5
|
-
Alpine.reactive({
|
6
|
-
getAttr(name) {
|
7
|
-
return this.$root.getAttribute(name);
|
8
|
-
},
|
9
|
-
|
10
|
-
setAttr(name, value) {
|
11
|
-
this.$root.setAttribute(name, value);
|
12
|
-
return this;
|
13
|
-
},
|
14
|
-
|
15
|
-
hasAttr(name) {
|
16
|
-
return this.$root.hasAttribute(name);
|
17
|
-
},
|
18
|
-
|
19
|
-
removeAttr(name) {
|
20
|
-
component.$root.removeAttribute(name);
|
21
|
-
return this;
|
22
|
-
},
|
23
|
-
|
24
|
-
assertAttr(name, testValue) {
|
25
|
-
return this.$root.getAttribute(name) === String(testValue);
|
26
|
-
},
|
27
|
-
|
28
|
-
refuteAttr(name, testValue) {
|
29
|
-
return !this.assertAttr(name, testValue);
|
30
|
-
},
|
31
|
-
|
32
|
-
getData(name) {
|
33
|
-
return this.getAttr(`data-${name}`);
|
34
|
-
},
|
35
|
-
|
36
|
-
setData(name, value) {
|
37
|
-
return this.setAttr(`data-${name}`, value);
|
38
|
-
},
|
39
|
-
|
40
|
-
hasData(name) {
|
41
|
-
return this.hasAttr(`data-${name}`);
|
42
|
-
},
|
43
|
-
|
44
|
-
removeData(name) {
|
45
|
-
return this.removeAttr(`data-${name}`);
|
46
|
-
},
|
47
|
-
|
48
|
-
assertData(name, testValue) {
|
49
|
-
return this.assertAttr(`data-${name}`, testValue);
|
50
|
-
},
|
51
|
-
|
52
|
-
refuteData(name, testValue) {
|
53
|
-
return !this.assertData(name, testValue);
|
54
|
-
},
|
55
|
-
})
|
56
|
-
);
|
57
|
-
};
|
58
|
-
}
|