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.
Files changed (50) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/build/coco/app.css +27 -20
  3. data/app/assets/build/coco/app.js +136 -309
  4. data/app/assets/build/coco/book.css +11 -7
  5. data/app/assets/build/coco/book.js +143 -185
  6. data/app/assets/js/coco.js +2 -30
  7. data/app/assets/js/{base/mixins → libs/alpine/directives}/undo.js +12 -13
  8. data/app/assets/js/libs/alpine/index.js +15 -13
  9. data/app/components/coco/app/blocks/slide_editor/slide_editor.html.erb +2 -1
  10. data/app/components/coco/app/blocks/slide_editor/slide_editor.js +0 -3
  11. data/app/components/coco/app/elements/{form_button/form_button.css → button_to/button_to.css} +1 -1
  12. data/app/components/coco/app/elements/{form_button/form_button.rb → button_to/button_to.rb} +1 -1
  13. data/app/components/coco/app/elements/color_picker/color_picker.js +0 -2
  14. data/app/components/coco/app/elements/image_picker/image_picker.js +0 -2
  15. data/app/components/coco/app/elements/link/link.css +11 -1
  16. data/app/components/coco/app/elements/link/link.rb +1 -0
  17. data/app/components/coco/app/elements/menu/menu.css +1 -1
  18. data/app/components/coco/app/elements/seamless_textarea/seamless_textarea.html.erb +2 -1
  19. data/app/components/coco/app/elements/seamless_textarea/seamless_textarea.js +1 -7
  20. data/app/components/coco/app/elements/snackbar/snackbar.js +0 -2
  21. data/app/components/coco/app/elements/toast/toast.css +1 -1
  22. data/app/components/coco/app/elements/toast/toast.js +0 -2
  23. data/app/components/coco/base/button/button.js +0 -2
  24. data/app/components/coco/base/button/button.rb +3 -9
  25. data/app/components/coco/base/dropdown/dropdown.js +1 -3
  26. data/app/components/coco/base/link/link.css +11 -11
  27. data/app/components/coco/base/link/link.rb +1 -5
  28. data/app/components/coco/base/modal_dialog/modal_dialog.css +1 -1
  29. data/app/components/coco/concerns/acts_as_button_group.rb +1 -1
  30. data/app/helpers/coco/app_helper.rb +60 -37
  31. data/app/helpers/coco/base_helper.rb +2 -2
  32. data/app/helpers/coco/url_helper.rb +6 -12
  33. data/lib/coco.rb +1 -1
  34. metadata +12 -21
  35. data/app/assets/js/app/mixins/dropdown.js +0 -18
  36. data/app/assets/js/app/mixins/index.js +0 -3
  37. data/app/assets/js/base/mixins/attr-observer.js +0 -54
  38. data/app/assets/js/base/mixins/attrs.js +0 -58
  39. data/app/assets/js/base/mixins/dropdown.js +0 -69
  40. data/app/assets/js/base/mixins/index.js +0 -17
  41. data/app/assets/js/base/mixins/options.js +0 -76
  42. data/app/assets/js/base/mixins/size-observer.js +0 -34
  43. data/app/assets/js/base/mixins/tooltip.js +0 -81
  44. /data/app/assets/js/libs/alpine/{plugins → directives}/destroy.js +0 -0
  45. /data/app/assets/js/libs/alpine/{plugins → directives}/dimensions.js +0 -0
  46. /data/app/assets/js/libs/alpine/{plugins → directives}/dropdown.js +0 -0
  47. /data/app/assets/js/libs/alpine/{plugins → directives}/notification.js +0 -0
  48. /data/app/assets/js/libs/alpine/{plugins → directives}/options.js +0 -0
  49. /data/app/assets/js/libs/alpine/{plugins → directives}/tooltip.js +0 -0
  50. /data/app/components/coco/app/elements/{form_button/form_button.html.erb → button_to/button_to.html.erb} +0 -0
@@ -8,6 +8,7 @@ module Coco
8
8
  THEMES = %W[positive primary warning negative info neutral-dark neutral-light] << nil
9
9
 
10
10
  accepts_option :theme, from: THEMES
11
+ accepts_option :underline, from: [true, false]
11
12
  end
12
13
  end
13
14
  end
@@ -8,7 +8,7 @@
8
8
  }
9
9
 
10
10
  > [data-component="app-button"],
11
- > [data-component="app-form-button"],
11
+ > [data-component="app-button-to"],
12
12
  > [data-component="app-menu-button"] {
13
13
  @apply hover:bg-gray-blend-50 active:bg-gray-blend-100;
14
14
 
@@ -8,7 +8,8 @@
8
8
  "@keydown.enter.prevent": (true unless multiline?),
9
9
  "@input": "onResize",
10
10
  ref: "textarea",
11
- "model.fill.debounce": "value"
11
+ "model.fill.debounce": "value",
12
+ "dimensions": "onResize"
12
13
  }),
13
14
  **@textarea_args
14
15
  ) %>
@@ -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
- let newHeight = textarea.scrollHeight;
28
+ const newHeight = textarea.scrollHeight;
35
29
  textarea.style.height = `${newHeight}px`;
36
30
 
37
31
  if (this.height !== newHeight) {
@@ -2,8 +2,6 @@ import { CocoComponent } from "@js/coco";
2
2
 
3
3
  export default CocoComponent("appSnackbar", () => {
4
4
  return {
5
- use: false,
6
-
7
5
  notificationType: "snackbar",
8
6
  options: ["show", "dismiss", "showDelay", "dismissDelay", "position"],
9
7
 
@@ -11,7 +11,7 @@
11
11
 
12
12
  &[data-position="fixed"] {
13
13
  @apply fixed top-8 right-8;
14
- z-index: 1000;
14
+ z-index: 10001;
15
15
  }
16
16
 
17
17
  /* Transitions */
@@ -2,8 +2,6 @@ import { CocoComponent } from "@js/coco";
2
2
 
3
3
  export default CocoComponent("appToast", () => {
4
4
  return {
5
- use: false,
6
-
7
5
  notificationType: "toast",
8
6
  options: ["show", "dismiss", "showDelay", "dismissDelay", "position"],
9
7
 
@@ -3,8 +3,6 @@ import { camelCase } from "lodash";
3
3
 
4
4
  export default CocoComponent("button", (data = {}) => {
5
5
  return {
6
- use: false,
7
-
8
6
  options: ["state", "confirm", "size", "disabled", "collapsible"],
9
7
 
10
8
  isCollapsed: false,
@@ -74,11 +74,10 @@ module Coco
74
74
  end
75
75
  end
76
76
 
77
- attr_reader :on_click, :resize, :props, :button_attrs
77
+ attr_reader :on_click, :resize, :button_attrs
78
78
 
79
- def initialize(click: nil, resize: nil, props: nil, states: nil, loading: false, active: false, button_element: {}, **kwargs)
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
- if props.present? || state_tooltips.present?
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
@@ -1,7 +1,5 @@
1
1
  import { CocoComponent } from "@js/coco";
2
2
 
3
3
  export default CocoComponent("dropdown", () => {
4
- return {
5
- use: false,
6
- };
4
+ return {};
7
5
  });
@@ -2,23 +2,23 @@
2
2
  [data-coco].coco-link {
3
3
  @apply inline-flex items-center;
4
4
 
5
- &[data-icon-position="start"] {
6
- .link-text {
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-1 mr-[0.4em];
11
+ @apply order-2;
18
12
  }
19
13
 
20
- [data-component="icon"] {
21
- @apply order-2;
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 @@
9
9
  }
10
10
 
11
11
  .modal-dialog-title {
12
- @apply text-lg pr-6 w-full font-semibold truncate;
12
+ @apply text-lg pr-6 w-full font-bold truncate;
13
13
  }
14
14
 
15
15
  .modal-dialog-close {
@@ -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::FormButton.new(**button_kwargs(kwargs, :form_button))
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
- "FormButton"
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 coco_form_button(**kwargs, &block)
23
- render Coco::App::Elements::FormButton.new(**kwargs), &block
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, **kwargs, &block)
31
- render Coco::App::Elements::ConfirmButton.new(href: href, **kwargs), &block
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(**kwargs, &block)
35
- render Coco::App::Elements::ColorPickerButton.new(**kwargs), &block
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(**kwargs, &block)
39
- render Coco::App::Elements::ImagePickerButton.new(**kwargs), &block
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(**kwargs, &block)
43
- render Coco::App::Elements::LayoutPickerButton.new(**kwargs), &block
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(**kwargs, &block)
47
- render Coco::App::Elements::DropdownButton.new(**kwargs), &block
69
+ def coco_dropdown_button(**, &block)
70
+ render Coco::App::Elements::DropdownButton.new(**), &block
48
71
  end
49
72
 
50
- def coco_button_group(**kwargs, &block)
51
- render Coco::App::Elements::ButtonGroup.new(**kwargs), &block
73
+ def coco_button_group(**, &block)
74
+ render Coco::App::Elements::ButtonGroup.new(**), &block
52
75
  end
53
76
 
54
- def coco_toolbar(**kwargs, &block)
55
- render Coco::App::Elements::Toolbar.new(**kwargs), &block
77
+ def coco_toolbar(**, &block)
78
+ render Coco::App::Elements::Toolbar.new(**), &block
56
79
  end
57
80
 
58
- def coco_seamless_textarea(**kwargs, &block)
59
- render Coco::App::Elements::SeamlessTextarea.new(**kwargs), &block
81
+ def coco_seamless_textarea(**, &block)
82
+ render Coco::App::Elements::SeamlessTextarea.new(**), &block
60
83
  end
61
84
 
62
- def coco_snackbar(**kwargs, &block)
63
- render Coco::App::Elements::Snackbar.new(**kwargs), &block
85
+ def coco_snackbar(**, &block)
86
+ render Coco::App::Elements::Snackbar.new(**), &block
64
87
  end
65
88
 
66
- def coco_notice(**kwargs, &block)
67
- render Coco::App::Elements::Notice.new(**kwargs), &block
89
+ def coco_notice(**, &block)
90
+ render Coco::App::Elements::Notice.new(**), &block
68
91
  end
69
92
 
70
- def coco_toast(**kwargs, &block)
71
- render Coco::App::Elements::Toast.new(**kwargs), &block
93
+ def coco_toast(**, &block)
94
+ render Coco::App::Elements::Toast.new(**), &block
72
95
  end
73
96
 
74
- def coco_system_banner(**kwargs, &block)
75
- render Coco::App::Elements::SystemBanner.new(**kwargs), &block
97
+ def coco_system_banner(**, &block)
98
+ render Coco::App::Elements::SystemBanner.new(**), &block
76
99
  end
77
100
 
78
- def coco_form_with(**kwargs, &block)
79
- form_with(**kwargs, builder: Coco::AppFormBuilder, &block)
101
+ def coco_form_with(**, &block)
102
+ form_with(**, builder: Coco::AppFormBuilder, &block)
80
103
  end
81
104
 
82
- def coco_form_for(*args, **kwargs, &block)
83
- form_for(*args, **kwargs, builder: Coco::AppFormBuilder, &block)
105
+ def coco_form_for(*, **, &block)
106
+ form_for(*, **, builder: Coco::AppFormBuilder, &block)
84
107
  end
85
108
 
86
- def coco_fields(**kwargs, &block)
87
- fields(**kwargs, builder: Coco::AppFormBuilder, &block)
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 coco_modal_link(*, data: {}, modal: nil, **kwargs, &)
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
- link_to(*, **kwargs, &)
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
- link = Coco::Link::Component.new(href: href, **html_options)
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(content = nil, options = nil, html_options = nil, &block)
22
- html_options, options = options, content if block
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::FormButton.new(action: options, **html_options)
27
- button = button.with_content(content) unless block
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
@@ -1,3 +1,3 @@
1
1
  module Coco
2
- VERSION = "0.7.1"
2
+ VERSION = "0.7.3"
3
3
  end
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.1
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-09-22 00:00:00.000000000 Z
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,3 +0,0 @@
1
- import withAppDropdown from "./dropdown";
2
-
3
- export { withAppDropdown };
@@ -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
- }