coveragebook_components 0.7.1 → 0.7.2
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.js +136 -309
- 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/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/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.js +0 -2
- data/app/components/coco/base/button/button.js +0 -2
- data/app/components/coco/base/dropdown/dropdown.js +1 -3
- data/app/helpers/coco/base_helper.rb +2 -2
- data/app/helpers/coco/url_helper.rb +2 -2
- data/lib/coco.rb +1 -1
- metadata +9 -18
- 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
@@ -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")
|
@@ -12,7 +12,7 @@ module Coco
|
|
12
12
|
|
13
13
|
href = Coco::ActionViewHelper.url_target(name, options)
|
14
14
|
|
15
|
-
link = Coco::Link
|
15
|
+
link = Coco::App::Elements::Link.new(href: href, **html_options.symbolize_keys!)
|
16
16
|
link = link.with_content(name) unless block
|
17
17
|
|
18
18
|
render(link, &block)
|
@@ -23,7 +23,7 @@ module Coco
|
|
23
23
|
options ||= {}
|
24
24
|
html_options ||= {}
|
25
25
|
|
26
|
-
button = Coco::App::Elements::FormButton.new(action: options, **html_options)
|
26
|
+
button = Coco::App::Elements::FormButton.new(action: options, **html_options.symbolize_keys!)
|
27
27
|
button = button.with_content(content) unless block
|
28
28
|
|
29
29
|
render(button, &block)
|
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.2
|
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-
|
11
|
+
date: 2023-09-29 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
|
@@ -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
|
-
}
|
@@ -1,69 +0,0 @@
|
|
1
|
-
import { tippy, hideOnEsc } from "@libs/tippy";
|
2
|
-
|
3
|
-
export default function withDropdown(props = {}) {
|
4
|
-
function withDropdownMixin(component) {
|
5
|
-
const tippyEl = component.$refs.dropdownTrigger || component.$root;
|
6
|
-
|
7
|
-
const dropdown = tippy(tippyEl, {
|
8
|
-
trigger: "click",
|
9
|
-
interactive: true,
|
10
|
-
animation: false,
|
11
|
-
content: component.$refs.dropdownPanel,
|
12
|
-
plugins: [hideOnEsc],
|
13
|
-
|
14
|
-
onMount() {
|
15
|
-
if (component.onDropdownMount) {
|
16
|
-
component.onDropdownMount();
|
17
|
-
}
|
18
|
-
},
|
19
|
-
|
20
|
-
onCreate() {
|
21
|
-
if (component.onDropdownCreate) {
|
22
|
-
component.onDropdownCreate();
|
23
|
-
}
|
24
|
-
},
|
25
|
-
|
26
|
-
onShow: () => {
|
27
|
-
component.dropdown.open = true;
|
28
|
-
if (component.onDropdownShow) {
|
29
|
-
return component.onDropdownShow();
|
30
|
-
}
|
31
|
-
|
32
|
-
if (component.setState) {
|
33
|
-
component.setState("active");
|
34
|
-
}
|
35
|
-
},
|
36
|
-
|
37
|
-
onHide: () => {
|
38
|
-
component.dropdown.open = false;
|
39
|
-
if (component.onDropdownHide) {
|
40
|
-
component.onDropdownHide();
|
41
|
-
}
|
42
|
-
if (component.resetState) {
|
43
|
-
component.resetState();
|
44
|
-
}
|
45
|
-
},
|
46
|
-
|
47
|
-
...props,
|
48
|
-
});
|
49
|
-
|
50
|
-
return Object.assign(component, {
|
51
|
-
dropdown: Alpine.reactive({
|
52
|
-
instance: dropdown,
|
53
|
-
open: false,
|
54
|
-
|
55
|
-
hide() {
|
56
|
-
this.instance.hide();
|
57
|
-
},
|
58
|
-
|
59
|
-
show() {
|
60
|
-
this.instance.show();
|
61
|
-
},
|
62
|
-
}),
|
63
|
-
});
|
64
|
-
}
|
65
|
-
|
66
|
-
withDropdownMixin.props = ["dropdown"];
|
67
|
-
|
68
|
-
return withDropdownMixin;
|
69
|
-
}
|
@@ -1,17 +0,0 @@
|
|
1
|
-
import withAttrObserver from "./attr-observer";
|
2
|
-
import withAttrs from "./attrs";
|
3
|
-
import withDropdown from "./dropdown";
|
4
|
-
import withOptions from "./options";
|
5
|
-
import withSizeObserver from "./size-observer";
|
6
|
-
import withTooltip from "./tooltip";
|
7
|
-
import withUndo from "./undo";
|
8
|
-
|
9
|
-
export {
|
10
|
-
withAttrObserver,
|
11
|
-
withAttrs,
|
12
|
-
withDropdown,
|
13
|
-
withOptions,
|
14
|
-
withSizeObserver,
|
15
|
-
withTooltip,
|
16
|
-
withUndo,
|
17
|
-
};
|
@@ -1,76 +0,0 @@
|
|
1
|
-
import { kebabCase, camelCase } from "lodash";
|
2
|
-
|
3
|
-
export default function withOptions(props = {}) {
|
4
|
-
return function (component) {
|
5
|
-
if (!component.options) {
|
6
|
-
return component;
|
7
|
-
}
|
8
|
-
|
9
|
-
const el = component.$root;
|
10
|
-
const oldDestroy = component.destroy;
|
11
|
-
const optionsProps = component.options || {};
|
12
|
-
const optionsAttrs = Object.keys(optionsProps).map(
|
13
|
-
(name) => `data-${kebabCase(name)}`
|
14
|
-
);
|
15
|
-
|
16
|
-
Object.keys(optionsProps).forEach((name) => {
|
17
|
-
const attrName = `data-${kebabCase(name)}`;
|
18
|
-
if (el.hasAttribute(attrName)) {
|
19
|
-
component.options[name] = el.getAttribute(attrName);
|
20
|
-
}
|
21
|
-
});
|
22
|
-
|
23
|
-
let attrObserver = new MutationObserver((mutationsList) => {
|
24
|
-
for (const mutation of mutationsList) {
|
25
|
-
if (
|
26
|
-
mutation.type !== "attributes" ||
|
27
|
-
!optionsAttrs.includes(mutation.attributeName)
|
28
|
-
) {
|
29
|
-
return;
|
30
|
-
}
|
31
|
-
|
32
|
-
const propName = camelCase(mutation.attributeName.replace("data-", ""));
|
33
|
-
let value = mutation.target.getAttribute(mutation.attributeName);
|
34
|
-
|
35
|
-
switch (value) {
|
36
|
-
case "true":
|
37
|
-
value = true;
|
38
|
-
break;
|
39
|
-
case "false":
|
40
|
-
value = false;
|
41
|
-
break;
|
42
|
-
}
|
43
|
-
|
44
|
-
component.options[propName] = value;
|
45
|
-
}
|
46
|
-
});
|
47
|
-
|
48
|
-
Object.assign(
|
49
|
-
component,
|
50
|
-
Alpine.reactive({
|
51
|
-
destroy() {
|
52
|
-
attrObserver.disconnect();
|
53
|
-
attrObserver = null;
|
54
|
-
|
55
|
-
if (oldDestroy) {
|
56
|
-
oldDestroy.call(this);
|
57
|
-
}
|
58
|
-
},
|
59
|
-
})
|
60
|
-
);
|
61
|
-
|
62
|
-
attrObserver.observe(el, { attributes: true });
|
63
|
-
|
64
|
-
component.$watch("options", (options, oldOptions) => {
|
65
|
-
for (const [key, value] of Object.entries(options)) {
|
66
|
-
el.setAttribute(`data-${kebabCase(key)}`, value);
|
67
|
-
|
68
|
-
if (component.onOptionChange) {
|
69
|
-
component.onOptionChange(key, value);
|
70
|
-
}
|
71
|
-
}
|
72
|
-
});
|
73
|
-
|
74
|
-
return component;
|
75
|
-
};
|
76
|
-
}
|
@@ -1,34 +0,0 @@
|
|
1
|
-
export default function withSizeObserver(props = {}) {
|
2
|
-
return function (component) {
|
3
|
-
const resizeTarget = props.target || component.$root;
|
4
|
-
const oldDestroy = component.destroy;
|
5
|
-
|
6
|
-
const sizeObserver = Alpine.reactive({
|
7
|
-
observer: null,
|
8
|
-
handler(target) {
|
9
|
-
if (component.onResize) {
|
10
|
-
component.onResize(target.contentRect, target);
|
11
|
-
}
|
12
|
-
},
|
13
|
-
});
|
14
|
-
|
15
|
-
sizeObserver.observer = new ResizeObserver((entries) =>
|
16
|
-
sizeObserver.handler(entries[0])
|
17
|
-
);
|
18
|
-
|
19
|
-
Object.assign(component, {
|
20
|
-
destroy() {
|
21
|
-
sizeObserver.observer.disconnect();
|
22
|
-
sizeObserver.observer = null;
|
23
|
-
|
24
|
-
if (oldDestroy) {
|
25
|
-
oldDestroy.call(this);
|
26
|
-
}
|
27
|
-
},
|
28
|
-
});
|
29
|
-
|
30
|
-
sizeObserver.observer.observe(resizeTarget);
|
31
|
-
|
32
|
-
return component;
|
33
|
-
};
|
34
|
-
}
|
@@ -1,81 +0,0 @@
|
|
1
|
-
import tippy from "@libs/tippy";
|
2
|
-
|
3
|
-
export default function withTooltip(props = {}) {
|
4
|
-
function withTooltipMixin(component) {
|
5
|
-
const el = component.$root;
|
6
|
-
const oldDestroy = component.destroy;
|
7
|
-
|
8
|
-
if (!component.hasData("tippy-content")) {
|
9
|
-
component.setData("tippy-disabled", true);
|
10
|
-
}
|
11
|
-
|
12
|
-
const content = component.getData("tippy-content");
|
13
|
-
const tooltip = tippy(el, {
|
14
|
-
theme: "coco-tooltip",
|
15
|
-
|
16
|
-
onShow() {
|
17
|
-
if (component.onTooltipShow) {
|
18
|
-
return component.onTooltipShow();
|
19
|
-
} else {
|
20
|
-
return component.refuteData("tippy-disabled", true);
|
21
|
-
}
|
22
|
-
},
|
23
|
-
|
24
|
-
content() {
|
25
|
-
return content;
|
26
|
-
},
|
27
|
-
|
28
|
-
...props,
|
29
|
-
});
|
30
|
-
|
31
|
-
Object.assign(
|
32
|
-
component,
|
33
|
-
Alpine.reactive({
|
34
|
-
tooltip: {
|
35
|
-
content,
|
36
|
-
instance: tooltip,
|
37
|
-
originalContent: content,
|
38
|
-
},
|
39
|
-
|
40
|
-
getTooltip() {
|
41
|
-
return this.tooltip;
|
42
|
-
},
|
43
|
-
|
44
|
-
setTooltip(content) {
|
45
|
-
this.tooltip.content = content;
|
46
|
-
},
|
47
|
-
|
48
|
-
resetTooltip() {
|
49
|
-
this.tooltip.content = this.tooltip.originalContent;
|
50
|
-
},
|
51
|
-
|
52
|
-
destroy() {
|
53
|
-
if (this.tooltip && this.tooltip.instance) {
|
54
|
-
this.tooltip.instance.destroy();
|
55
|
-
this.tooltip = null;
|
56
|
-
}
|
57
|
-
|
58
|
-
if (oldDestroy) {
|
59
|
-
oldDestroy.call(this);
|
60
|
-
}
|
61
|
-
},
|
62
|
-
})
|
63
|
-
);
|
64
|
-
|
65
|
-
Alpine.effect(() => {
|
66
|
-
if (component.tooltip && component.tooltip.instance) {
|
67
|
-
const value = component.tooltip.content;
|
68
|
-
if (value !== null) {
|
69
|
-
component.tooltip.instance.setContent(value);
|
70
|
-
component.setData("tippy-content", value);
|
71
|
-
}
|
72
|
-
}
|
73
|
-
});
|
74
|
-
|
75
|
-
return component;
|
76
|
-
}
|
77
|
-
|
78
|
-
withTooltipMixin.props = ["tooltip"];
|
79
|
-
|
80
|
-
return withTooltipMixin;
|
81
|
-
}
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|