@domql/element 2.27.16 → 2.28.1
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.
- package/create.js +2 -2
- package/dist/cjs/create.js +1 -1
- package/dist/cjs/methods/index.js +13 -3
- package/dist/cjs/mixins/content.js +12 -7
- package/dist/cjs/node.js +14 -15
- package/dist/cjs/set.js +9 -2
- package/dist/cjs/utils/applyParam.js +1 -1
- package/dist/cjs/utils/propEvents.js +1 -1
- package/dist/esm/create.js +1 -1
- package/dist/esm/methods/index.js +13 -3
- package/dist/esm/mixins/content.js +12 -7
- package/dist/esm/node.js +14 -15
- package/dist/esm/set.js +9 -2
- package/dist/esm/utils/applyParam.js +2 -2
- package/dist/esm/utils/propEvents.js +1 -1
- package/methods/index.js +34 -7
- package/mixins/content.js +15 -7
- package/node.js +17 -16
- package/package.json +6 -6
- package/set.js +16 -5
- package/utils/applyParam.js +7 -4
- package/utils/propEvents.js +1 -1
package/create.js
CHANGED
|
@@ -112,6 +112,8 @@ export const create = async (
|
|
|
112
112
|
// apply variants
|
|
113
113
|
applyVariant(element, parent)
|
|
114
114
|
|
|
115
|
+
addChildrenIfNotInOriginal(element, parent, key)
|
|
116
|
+
|
|
115
117
|
const onInit = await triggerEventOn('init', element, options)
|
|
116
118
|
if (onInit === false) return element
|
|
117
119
|
|
|
@@ -120,8 +122,6 @@ export const create = async (
|
|
|
120
122
|
// generate a CLASS name
|
|
121
123
|
assignKeyAsClassname(element)
|
|
122
124
|
|
|
123
|
-
addChildrenIfNotInOriginal(element, parent, key)
|
|
124
|
-
|
|
125
125
|
await renderElement(element, parent, options, attachOptions)
|
|
126
126
|
|
|
127
127
|
addElementIntoParentChildren(element, parent)
|
package/dist/cjs/create.js
CHANGED
|
@@ -73,11 +73,11 @@ const create = async (element, parent, key, options = import_options.OPTIONS.cre
|
|
|
73
73
|
return (0, import_render.assignNode)(element, parent, key, attachOptions);
|
|
74
74
|
}
|
|
75
75
|
(0, import_component.applyVariant)(element, parent);
|
|
76
|
+
(0, import_utils.addChildrenIfNotInOriginal)(element, parent, key);
|
|
76
77
|
const onInit = await (0, import_event.triggerEventOn)("init", element, options);
|
|
77
78
|
if (onInit === false) return element;
|
|
78
79
|
await (0, import_event.triggerEventOn)("beforeClassAssign", element, options);
|
|
79
80
|
(0, import_classList.assignKeyAsClassname)(element);
|
|
80
|
-
(0, import_utils.addChildrenIfNotInOriginal)(element, parent, key);
|
|
81
81
|
await renderElement(element, parent, options, attachOptions);
|
|
82
82
|
addElementIntoParentChildren(element, parent);
|
|
83
83
|
await (0, import_event.triggerEventOn)("complete", element, options);
|
|
@@ -288,9 +288,19 @@ function variables(obj = {}) {
|
|
|
288
288
|
};
|
|
289
289
|
}
|
|
290
290
|
function call(fnKey, ...args) {
|
|
291
|
-
var _a;
|
|
292
|
-
const context = this.context;
|
|
293
|
-
|
|
291
|
+
var _a, _b, _c, _d;
|
|
292
|
+
const fn = ((_a = this.context.utils) == null ? void 0 : _a[fnKey]) || ((_b = this.context.functions) == null ? void 0 : _b[fnKey]) || ((_c = this.context.methods) == null ? void 0 : _c[fnKey]) || ((_d = this.context.snippets) == null ? void 0 : _d[fnKey]);
|
|
293
|
+
if (!fn) return void 0;
|
|
294
|
+
try {
|
|
295
|
+
const result = fn.call(this, ...args);
|
|
296
|
+
if (result && typeof result.then === "function") {
|
|
297
|
+
return result;
|
|
298
|
+
}
|
|
299
|
+
return result;
|
|
300
|
+
} catch (error2) {
|
|
301
|
+
console.error(`Error calling '${fnKey}':`, error2);
|
|
302
|
+
throw error2;
|
|
303
|
+
}
|
|
294
304
|
}
|
|
295
305
|
const METHODS = [
|
|
296
306
|
"set",
|
|
@@ -26,12 +26,13 @@ __export(content_exports, {
|
|
|
26
26
|
module.exports = __toCommonJS(content_exports);
|
|
27
27
|
var import_utils = require("@domql/utils");
|
|
28
28
|
var import_set = require("../set.js");
|
|
29
|
-
const updateContent = function(params, options) {
|
|
29
|
+
const updateContent = async function(params, options) {
|
|
30
30
|
const element = this;
|
|
31
31
|
const ref = element.__ref;
|
|
32
32
|
const contentKey = ref.contentElementKey;
|
|
33
33
|
if (!element[contentKey]) return;
|
|
34
|
-
if (element[contentKey].update)
|
|
34
|
+
if (element[contentKey].update)
|
|
35
|
+
await element[contentKey].update(params, options);
|
|
35
36
|
};
|
|
36
37
|
const removeContent = function(el, opts = {}) {
|
|
37
38
|
const element = el || this;
|
|
@@ -40,16 +41,20 @@ const removeContent = function(el, opts = {}) {
|
|
|
40
41
|
if (opts.contentElementKey !== "content") opts.contentElementKey = "content";
|
|
41
42
|
if (element[contentElementKey]) {
|
|
42
43
|
if (element[contentElementKey].node && element.node) {
|
|
43
|
-
if (element[contentElementKey].tag === "fragment")
|
|
44
|
+
if (element[contentElementKey].tag === "fragment")
|
|
45
|
+
element.node.innerHTML = "";
|
|
44
46
|
else {
|
|
45
47
|
const contentNode = element[contentElementKey].node;
|
|
46
|
-
if (contentNode.parentNode === element.node)
|
|
48
|
+
if (contentNode.parentNode === element.node)
|
|
49
|
+
element.node.removeChild(element[contentElementKey].node);
|
|
47
50
|
}
|
|
48
51
|
}
|
|
49
52
|
const { __cached } = ref;
|
|
50
53
|
if (__cached && __cached[contentElementKey]) {
|
|
51
|
-
if (__cached[contentElementKey].tag === "fragment")
|
|
52
|
-
|
|
54
|
+
if (__cached[contentElementKey].tag === "fragment")
|
|
55
|
+
__cached[contentElementKey].parent.node.innerHTML = "";
|
|
56
|
+
else if (__cached[contentElementKey] && (0, import_utils.isFunction)(__cached[contentElementKey].remove))
|
|
57
|
+
__cached[contentElementKey].remove();
|
|
53
58
|
}
|
|
54
59
|
delete element[contentElementKey];
|
|
55
60
|
}
|
|
@@ -58,7 +63,7 @@ async function setContent(param, element, node, opts) {
|
|
|
58
63
|
const contentElementKey = (0, import_utils.setContentKey)(element, opts);
|
|
59
64
|
if (param && element) {
|
|
60
65
|
if (element[contentElementKey].update) {
|
|
61
|
-
element[contentElementKey].update({}, opts);
|
|
66
|
+
await element[contentElementKey].update({}, opts);
|
|
62
67
|
} else {
|
|
63
68
|
await import_set.set.call(element, param, opts);
|
|
64
69
|
}
|
package/dist/cjs/node.js
CHANGED
|
@@ -62,21 +62,20 @@ const createNode = async (element, options) => {
|
|
|
62
62
|
if ((0, import_utils.isUndefined)(value) || (0, import_methods.isMethod)(param, element) || (0, import_utils.isVariant)(param) || (0, import_utils.isObject)(import_mixins.REGISTRY[param]))
|
|
63
63
|
continue;
|
|
64
64
|
const isElement = await (0, import_applyParam.applyParam)(param, element, options);
|
|
65
|
-
if (isElement)
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
}
|
|
65
|
+
if (!isElement) continue;
|
|
66
|
+
const { hasDefine, hasContextDefine } = isElement;
|
|
67
|
+
if (isElement && value && !hasDefine && !hasContextDefine) {
|
|
68
|
+
const createAsync = async () => {
|
|
69
|
+
await (0, import_create.create)(await (0, import_utils.exec)(value, element), element, param, options);
|
|
70
|
+
};
|
|
71
|
+
if (element.props && element.props.lazyLoad || options.lazyLoad) {
|
|
72
|
+
window.requestAnimationFrame(async () => {
|
|
73
|
+
await createAsync();
|
|
74
|
+
if (!options.preventUpdateListener) {
|
|
75
|
+
await (0, import_event.triggerEventOn)("lazyLoad", element, options);
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
} else await createAsync();
|
|
80
79
|
}
|
|
81
80
|
}
|
|
82
81
|
return element;
|
package/dist/cjs/set.js
CHANGED
|
@@ -33,6 +33,7 @@ var import_event = require("@domql/event");
|
|
|
33
33
|
const resetElement = async (params, element, options) => {
|
|
34
34
|
if (!options.preventRemove) (0, import_content.removeContent)(element, options);
|
|
35
35
|
const { __ref: ref } = element;
|
|
36
|
+
if (params instanceof Promise) console.log(params, params instanceof Promise);
|
|
36
37
|
await (0, import_create.create)(params, element, ref.contentElementKey || "content", {
|
|
37
38
|
ignoreChildExtend: true,
|
|
38
39
|
...import_mixins.registry.defaultOptions,
|
|
@@ -60,11 +61,17 @@ const set = async function(params, options = {}, el) {
|
|
|
60
61
|
if (options.preventContentUpdate === true && !hasCollection) return;
|
|
61
62
|
if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && (0, import_utils.deepContains)(params, content)) {
|
|
62
63
|
if (!options.preventBeforeUpdateListener && !options.preventListeners) {
|
|
63
|
-
const beforeUpdateReturns = await (0, import_event.triggerEventOnUpdate)(
|
|
64
|
+
const beforeUpdateReturns = await (0, import_event.triggerEventOnUpdate)(
|
|
65
|
+
"beforeUpdate",
|
|
66
|
+
params,
|
|
67
|
+
element,
|
|
68
|
+
options
|
|
69
|
+
);
|
|
64
70
|
if (beforeUpdateReturns === false) return element;
|
|
65
71
|
}
|
|
66
72
|
if (content == null ? void 0 : content.update) await content.update();
|
|
67
|
-
if (!options.preventUpdateListener)
|
|
73
|
+
if (!options.preventUpdateListener)
|
|
74
|
+
await (0, import_event.triggerEventOn)("update", element, options);
|
|
68
75
|
return;
|
|
69
76
|
}
|
|
70
77
|
if (params) {
|
|
@@ -25,7 +25,7 @@ var import_utils = require("@domql/utils");
|
|
|
25
25
|
var import_mixins = require("../mixins/index.js");
|
|
26
26
|
const applyParam = async (param, element, options) => {
|
|
27
27
|
const { node, context, __ref: ref } = element;
|
|
28
|
-
const prop = element[param];
|
|
28
|
+
const prop = await (0, import_utils.exec)(element[param], element);
|
|
29
29
|
const { onlyUpdate } = options;
|
|
30
30
|
const DOMQLProperty = import_mixins.REGISTRY[param];
|
|
31
31
|
const DOMQLPropertyFromContext = context && context.registry && context.registry[param];
|
|
@@ -32,7 +32,7 @@ const propagateEventsFromProps = (element) => {
|
|
|
32
32
|
if ((0, import_utils.isFunction)(origEvent)) {
|
|
33
33
|
on[eventName] = (...args) => {
|
|
34
34
|
const originalEventRetunrs = origEvent(...args);
|
|
35
|
-
if (originalEventRetunrs !== false) funcFromProps(...args);
|
|
35
|
+
if (originalEventRetunrs !== false) return funcFromProps(...args);
|
|
36
36
|
};
|
|
37
37
|
} else on[eventName] = funcFromProps;
|
|
38
38
|
});
|
package/dist/esm/create.js
CHANGED
|
@@ -69,11 +69,11 @@ const create = async (element, parent, key, options = OPTIONS.create || {}, atta
|
|
|
69
69
|
return assignNode(element, parent, key, attachOptions);
|
|
70
70
|
}
|
|
71
71
|
applyVariant(element, parent);
|
|
72
|
+
addChildrenIfNotInOriginal(element, parent, key);
|
|
72
73
|
const onInit = await triggerEventOn("init", element, options);
|
|
73
74
|
if (onInit === false) return element;
|
|
74
75
|
await triggerEventOn("beforeClassAssign", element, options);
|
|
75
76
|
assignKeyAsClassname(element);
|
|
76
|
-
addChildrenIfNotInOriginal(element, parent, key);
|
|
77
77
|
await renderElement(element, parent, options, attachOptions);
|
|
78
78
|
addElementIntoParentChildren(element, parent);
|
|
79
79
|
await triggerEventOn("complete", element, options);
|
|
@@ -251,9 +251,19 @@ function variables(obj = {}) {
|
|
|
251
251
|
};
|
|
252
252
|
}
|
|
253
253
|
function call(fnKey, ...args) {
|
|
254
|
-
var _a;
|
|
255
|
-
const context = this.context;
|
|
256
|
-
|
|
254
|
+
var _a, _b, _c, _d;
|
|
255
|
+
const fn = ((_a = this.context.utils) == null ? void 0 : _a[fnKey]) || ((_b = this.context.functions) == null ? void 0 : _b[fnKey]) || ((_c = this.context.methods) == null ? void 0 : _c[fnKey]) || ((_d = this.context.snippets) == null ? void 0 : _d[fnKey]);
|
|
256
|
+
if (!fn) return void 0;
|
|
257
|
+
try {
|
|
258
|
+
const result = fn.call(this, ...args);
|
|
259
|
+
if (result && typeof result.then === "function") {
|
|
260
|
+
return result;
|
|
261
|
+
}
|
|
262
|
+
return result;
|
|
263
|
+
} catch (error2) {
|
|
264
|
+
console.error(`Error calling '${fnKey}':`, error2);
|
|
265
|
+
throw error2;
|
|
266
|
+
}
|
|
257
267
|
}
|
|
258
268
|
const METHODS = [
|
|
259
269
|
"set",
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { isFunction, setContentKey } from "@domql/utils";
|
|
2
2
|
import { set } from "../set.js";
|
|
3
|
-
const updateContent = function(params, options) {
|
|
3
|
+
const updateContent = async function(params, options) {
|
|
4
4
|
const element = this;
|
|
5
5
|
const ref = element.__ref;
|
|
6
6
|
const contentKey = ref.contentElementKey;
|
|
7
7
|
if (!element[contentKey]) return;
|
|
8
|
-
if (element[contentKey].update)
|
|
8
|
+
if (element[contentKey].update)
|
|
9
|
+
await element[contentKey].update(params, options);
|
|
9
10
|
};
|
|
10
11
|
const removeContent = function(el, opts = {}) {
|
|
11
12
|
const element = el || this;
|
|
@@ -14,16 +15,20 @@ const removeContent = function(el, opts = {}) {
|
|
|
14
15
|
if (opts.contentElementKey !== "content") opts.contentElementKey = "content";
|
|
15
16
|
if (element[contentElementKey]) {
|
|
16
17
|
if (element[contentElementKey].node && element.node) {
|
|
17
|
-
if (element[contentElementKey].tag === "fragment")
|
|
18
|
+
if (element[contentElementKey].tag === "fragment")
|
|
19
|
+
element.node.innerHTML = "";
|
|
18
20
|
else {
|
|
19
21
|
const contentNode = element[contentElementKey].node;
|
|
20
|
-
if (contentNode.parentNode === element.node)
|
|
22
|
+
if (contentNode.parentNode === element.node)
|
|
23
|
+
element.node.removeChild(element[contentElementKey].node);
|
|
21
24
|
}
|
|
22
25
|
}
|
|
23
26
|
const { __cached } = ref;
|
|
24
27
|
if (__cached && __cached[contentElementKey]) {
|
|
25
|
-
if (__cached[contentElementKey].tag === "fragment")
|
|
26
|
-
|
|
28
|
+
if (__cached[contentElementKey].tag === "fragment")
|
|
29
|
+
__cached[contentElementKey].parent.node.innerHTML = "";
|
|
30
|
+
else if (__cached[contentElementKey] && isFunction(__cached[contentElementKey].remove))
|
|
31
|
+
__cached[contentElementKey].remove();
|
|
27
32
|
}
|
|
28
33
|
delete element[contentElementKey];
|
|
29
34
|
}
|
|
@@ -32,7 +37,7 @@ async function setContent(param, element, node, opts) {
|
|
|
32
37
|
const contentElementKey = setContentKey(element, opts);
|
|
33
38
|
if (param && element) {
|
|
34
39
|
if (element[contentElementKey].update) {
|
|
35
|
-
element[contentElementKey].update({}, opts);
|
|
40
|
+
await element[contentElementKey].update({}, opts);
|
|
36
41
|
} else {
|
|
37
42
|
await set.call(element, param, opts);
|
|
38
43
|
}
|
package/dist/esm/node.js
CHANGED
|
@@ -48,21 +48,20 @@ const createNode = async (element, options) => {
|
|
|
48
48
|
if (isUndefined(value) || isMethod(param, element) || isVariant(param) || isObject(REGISTRY[param]))
|
|
49
49
|
continue;
|
|
50
50
|
const isElement = await applyParam(param, element, options);
|
|
51
|
-
if (isElement)
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
}
|
|
51
|
+
if (!isElement) continue;
|
|
52
|
+
const { hasDefine, hasContextDefine } = isElement;
|
|
53
|
+
if (isElement && value && !hasDefine && !hasContextDefine) {
|
|
54
|
+
const createAsync = async () => {
|
|
55
|
+
await create(await exec(value, element), element, param, options);
|
|
56
|
+
};
|
|
57
|
+
if (element.props && element.props.lazyLoad || options.lazyLoad) {
|
|
58
|
+
window.requestAnimationFrame(async () => {
|
|
59
|
+
await createAsync();
|
|
60
|
+
if (!options.preventUpdateListener) {
|
|
61
|
+
await triggerEventOn("lazyLoad", element, options);
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
} else await createAsync();
|
|
66
65
|
}
|
|
67
66
|
}
|
|
68
67
|
return element;
|
package/dist/esm/set.js
CHANGED
|
@@ -7,6 +7,7 @@ import { triggerEventOn, triggerEventOnUpdate } from "@domql/event";
|
|
|
7
7
|
const resetElement = async (params, element, options) => {
|
|
8
8
|
if (!options.preventRemove) removeContent(element, options);
|
|
9
9
|
const { __ref: ref } = element;
|
|
10
|
+
if (params instanceof Promise) console.log(params, params instanceof Promise);
|
|
10
11
|
await create(params, element, ref.contentElementKey || "content", {
|
|
11
12
|
ignoreChildExtend: true,
|
|
12
13
|
...registry.defaultOptions,
|
|
@@ -34,11 +35,17 @@ const set = async function(params, options = {}, el) {
|
|
|
34
35
|
if (options.preventContentUpdate === true && !hasCollection) return;
|
|
35
36
|
if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && deepContains(params, content)) {
|
|
36
37
|
if (!options.preventBeforeUpdateListener && !options.preventListeners) {
|
|
37
|
-
const beforeUpdateReturns = await triggerEventOnUpdate(
|
|
38
|
+
const beforeUpdateReturns = await triggerEventOnUpdate(
|
|
39
|
+
"beforeUpdate",
|
|
40
|
+
params,
|
|
41
|
+
element,
|
|
42
|
+
options
|
|
43
|
+
);
|
|
38
44
|
if (beforeUpdateReturns === false) return element;
|
|
39
45
|
}
|
|
40
46
|
if (content == null ? void 0 : content.update) await content.update();
|
|
41
|
-
if (!options.preventUpdateListener)
|
|
47
|
+
if (!options.preventUpdateListener)
|
|
48
|
+
await triggerEventOn("update", element, options);
|
|
42
49
|
return;
|
|
43
50
|
}
|
|
44
51
|
if (params) {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { isFunction } from "@domql/utils";
|
|
1
|
+
import { exec, isFunction } from "@domql/utils";
|
|
2
2
|
import { REGISTRY } from "../mixins/index.js";
|
|
3
3
|
const applyParam = async (param, element, options) => {
|
|
4
4
|
const { node, context, __ref: ref } = element;
|
|
5
|
-
const prop = element[param];
|
|
5
|
+
const prop = await exec(element[param], element);
|
|
6
6
|
const { onlyUpdate } = options;
|
|
7
7
|
const DOMQLProperty = REGISTRY[param];
|
|
8
8
|
const DOMQLPropertyFromContext = context && context.registry && context.registry[param];
|
|
@@ -9,7 +9,7 @@ const propagateEventsFromProps = (element) => {
|
|
|
9
9
|
if (isFunction(origEvent)) {
|
|
10
10
|
on[eventName] = (...args) => {
|
|
11
11
|
const originalEventRetunrs = origEvent(...args);
|
|
12
|
-
if (originalEventRetunrs !== false) funcFromProps(...args);
|
|
12
|
+
if (originalEventRetunrs !== false) return funcFromProps(...args);
|
|
13
13
|
};
|
|
14
14
|
} else on[eventName] = funcFromProps;
|
|
15
15
|
});
|
package/methods/index.js
CHANGED
|
@@ -302,14 +302,41 @@ export function variables (obj = {}) {
|
|
|
302
302
|
}
|
|
303
303
|
}
|
|
304
304
|
|
|
305
|
+
/**
|
|
306
|
+
* A unified call function that detects the calling context and adapts accordingly.
|
|
307
|
+
* - When called in an async context (with await), it fully resolves promises
|
|
308
|
+
* - When called in a sync context, it returns sync results directly and handles promises appropriately
|
|
309
|
+
*
|
|
310
|
+
* @param {string} fnKey - The name of the function to call
|
|
311
|
+
* @param {...any} args - Arguments to pass to the function
|
|
312
|
+
* @returns {any|Promise} - The result or a Promise to the result
|
|
313
|
+
*/
|
|
305
314
|
export function call (fnKey, ...args) {
|
|
306
|
-
const
|
|
307
|
-
|
|
308
|
-
context.
|
|
309
|
-
context.
|
|
310
|
-
context.
|
|
311
|
-
|
|
312
|
-
)
|
|
315
|
+
const fn =
|
|
316
|
+
this.context.utils?.[fnKey] ||
|
|
317
|
+
this.context.functions?.[fnKey] ||
|
|
318
|
+
this.context.methods?.[fnKey] ||
|
|
319
|
+
this.context.snippets?.[fnKey]
|
|
320
|
+
|
|
321
|
+
if (!fn) return undefined
|
|
322
|
+
|
|
323
|
+
try {
|
|
324
|
+
// Call the function
|
|
325
|
+
const result = fn.call(this, ...args)
|
|
326
|
+
|
|
327
|
+
// Handle promises
|
|
328
|
+
if (result && typeof result.then === 'function') {
|
|
329
|
+
// This magic allows the function to be awaited if called with await
|
|
330
|
+
// but still work reasonably when called without await
|
|
331
|
+
return result
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
// Return synchronous results directly
|
|
335
|
+
return result
|
|
336
|
+
} catch (error) {
|
|
337
|
+
console.error(`Error calling '${fnKey}':`, error)
|
|
338
|
+
throw error
|
|
339
|
+
}
|
|
313
340
|
}
|
|
314
341
|
|
|
315
342
|
export const METHODS = [
|
package/mixins/content.js
CHANGED
|
@@ -3,14 +3,15 @@
|
|
|
3
3
|
import { isFunction, setContentKey } from '@domql/utils'
|
|
4
4
|
import { set } from '../set.js'
|
|
5
5
|
|
|
6
|
-
export const updateContent = function (params, options) {
|
|
6
|
+
export const updateContent = async function (params, options) {
|
|
7
7
|
const element = this
|
|
8
8
|
const ref = element.__ref
|
|
9
9
|
|
|
10
10
|
const contentKey = ref.contentElementKey
|
|
11
11
|
|
|
12
12
|
if (!element[contentKey]) return
|
|
13
|
-
if (element[contentKey].update)
|
|
13
|
+
if (element[contentKey].update)
|
|
14
|
+
await element[contentKey].update(params, options)
|
|
14
15
|
}
|
|
15
16
|
|
|
16
17
|
export const removeContent = function (el, opts = {}) {
|
|
@@ -20,17 +21,24 @@ export const removeContent = function (el, opts = {}) {
|
|
|
20
21
|
if (opts.contentElementKey !== 'content') opts.contentElementKey = 'content'
|
|
21
22
|
if (element[contentElementKey]) {
|
|
22
23
|
if (element[contentElementKey].node && element.node) {
|
|
23
|
-
if (element[contentElementKey].tag === 'fragment')
|
|
24
|
+
if (element[contentElementKey].tag === 'fragment')
|
|
25
|
+
element.node.innerHTML = ''
|
|
24
26
|
else {
|
|
25
27
|
const contentNode = element[contentElementKey].node
|
|
26
|
-
if (contentNode.parentNode === element.node)
|
|
28
|
+
if (contentNode.parentNode === element.node)
|
|
29
|
+
element.node.removeChild(element[contentElementKey].node)
|
|
27
30
|
}
|
|
28
31
|
}
|
|
29
32
|
|
|
30
33
|
const { __cached } = ref
|
|
31
34
|
if (__cached && __cached[contentElementKey]) {
|
|
32
|
-
if (__cached[contentElementKey].tag === 'fragment')
|
|
33
|
-
|
|
35
|
+
if (__cached[contentElementKey].tag === 'fragment')
|
|
36
|
+
__cached[contentElementKey].parent.node.innerHTML = ''
|
|
37
|
+
else if (
|
|
38
|
+
__cached[contentElementKey] &&
|
|
39
|
+
isFunction(__cached[contentElementKey].remove)
|
|
40
|
+
)
|
|
41
|
+
__cached[contentElementKey].remove()
|
|
34
42
|
}
|
|
35
43
|
|
|
36
44
|
delete element[contentElementKey]
|
|
@@ -45,7 +53,7 @@ export async function setContent (param, element, node, opts) {
|
|
|
45
53
|
const contentElementKey = setContentKey(element, opts)
|
|
46
54
|
if (param && element) {
|
|
47
55
|
if (element[contentElementKey].update) {
|
|
48
|
-
element[contentElementKey].update({}, opts)
|
|
56
|
+
await element[contentElementKey].update({}, opts)
|
|
49
57
|
} else {
|
|
50
58
|
await set.call(element, param, opts)
|
|
51
59
|
}
|
package/node.js
CHANGED
|
@@ -79,23 +79,24 @@ export const createNode = async (element, options) => {
|
|
|
79
79
|
continue
|
|
80
80
|
|
|
81
81
|
const isElement = await applyParam(param, element, options)
|
|
82
|
-
if (isElement)
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
if ((element.props && element.props.lazyLoad) || options.lazyLoad) {
|
|
90
|
-
window.requestAnimationFrame(async () => {
|
|
91
|
-
await createAsync()
|
|
92
|
-
// handle lazy load
|
|
93
|
-
if (!options.preventUpdateListener) {
|
|
94
|
-
await triggerEventOn('lazyLoad', element, options)
|
|
95
|
-
}
|
|
96
|
-
})
|
|
97
|
-
} else await createAsync()
|
|
82
|
+
if (!isElement) continue
|
|
83
|
+
|
|
84
|
+
const { hasDefine, hasContextDefine } = isElement
|
|
85
|
+
|
|
86
|
+
if (isElement && value && !hasDefine && !hasContextDefine) {
|
|
87
|
+
const createAsync = async () => {
|
|
88
|
+
await create(await exec(value, element), element, param, options)
|
|
98
89
|
}
|
|
90
|
+
|
|
91
|
+
if ((element.props && element.props.lazyLoad) || options.lazyLoad) {
|
|
92
|
+
window.requestAnimationFrame(async () => {
|
|
93
|
+
await createAsync()
|
|
94
|
+
// handle lazy load
|
|
95
|
+
if (!options.preventUpdateListener) {
|
|
96
|
+
await triggerEventOn('lazyLoad', element, options)
|
|
97
|
+
}
|
|
98
|
+
})
|
|
99
|
+
} else await createAsync()
|
|
99
100
|
}
|
|
100
101
|
}
|
|
101
102
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@domql/element",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.28.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"module": "index.js",
|
|
@@ -27,12 +27,12 @@
|
|
|
27
27
|
"prepublish": "npx rimraf -I dist && npm run build && npm run copy:package:cjs"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@domql/event": "^2.
|
|
31
|
-
"@domql/render": "^2.
|
|
32
|
-
"@domql/state": "^2.
|
|
33
|
-
"@domql/utils": "^2.
|
|
30
|
+
"@domql/event": "^2.28.1",
|
|
31
|
+
"@domql/render": "^2.28.1",
|
|
32
|
+
"@domql/state": "^2.28.1",
|
|
33
|
+
"@domql/utils": "^2.28.1"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "371cc070cdca345fcd7ea73558d336a03c847825",
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@babel/core": "^7.26.0"
|
|
38
38
|
}
|
package/set.js
CHANGED
|
@@ -11,6 +11,7 @@ import { triggerEventOn, triggerEventOnUpdate } from '@domql/event'
|
|
|
11
11
|
export const resetElement = async (params, element, options) => {
|
|
12
12
|
if (!options.preventRemove) removeContent(element, options)
|
|
13
13
|
const { __ref: ref } = element
|
|
14
|
+
if (params instanceof Promise) console.log(params, params instanceof Promise)
|
|
14
15
|
await create(params, element, ref.contentElementKey || 'content', {
|
|
15
16
|
ignoreChildExtend: true,
|
|
16
17
|
...registry.defaultOptions,
|
|
@@ -19,7 +20,7 @@ export const resetElement = async (params, element, options) => {
|
|
|
19
20
|
})
|
|
20
21
|
}
|
|
21
22
|
|
|
22
|
-
export const reset = async
|
|
23
|
+
export const reset = async options => {
|
|
23
24
|
const element = this
|
|
24
25
|
await create(element, element.parent, undefined, {
|
|
25
26
|
ignoreChildExtend: true,
|
|
@@ -37,16 +38,26 @@ export const set = async function (params, options = {}, el) {
|
|
|
37
38
|
const __contentRef = content && content.__ref
|
|
38
39
|
const lazyLoad = element.props && element.props.lazyLoad
|
|
39
40
|
|
|
40
|
-
const hasCollection =
|
|
41
|
+
const hasCollection =
|
|
42
|
+
element.$collection || element.$stateCollection || element.$propsCollection
|
|
41
43
|
if (options.preventContentUpdate === true && !hasCollection) return
|
|
42
44
|
|
|
43
|
-
if (
|
|
45
|
+
if (
|
|
46
|
+
ref.__noCollectionDifference ||
|
|
47
|
+
(__contentRef && __contentRef.__cached && deepContains(params, content))
|
|
48
|
+
) {
|
|
44
49
|
if (!options.preventBeforeUpdateListener && !options.preventListeners) {
|
|
45
|
-
const beforeUpdateReturns = await triggerEventOnUpdate(
|
|
50
|
+
const beforeUpdateReturns = await triggerEventOnUpdate(
|
|
51
|
+
'beforeUpdate',
|
|
52
|
+
params,
|
|
53
|
+
element,
|
|
54
|
+
options
|
|
55
|
+
)
|
|
46
56
|
if (beforeUpdateReturns === false) return element
|
|
47
57
|
}
|
|
48
58
|
if (content?.update) await content.update()
|
|
49
|
-
if (!options.preventUpdateListener)
|
|
59
|
+
if (!options.preventUpdateListener)
|
|
60
|
+
await triggerEventOn('update', element, options)
|
|
50
61
|
return
|
|
51
62
|
}
|
|
52
63
|
|
package/utils/applyParam.js
CHANGED
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
'use strict'
|
|
2
2
|
|
|
3
|
-
import { isFunction } from '@domql/utils'
|
|
3
|
+
import { exec, isFunction } from '@domql/utils'
|
|
4
4
|
import { REGISTRY } from '../mixins/index.js'
|
|
5
5
|
|
|
6
6
|
export const applyParam = async (param, element, options) => {
|
|
7
7
|
const { node, context, __ref: ref } = element
|
|
8
|
-
const prop = element[param]
|
|
8
|
+
const prop = await exec(element[param], element)
|
|
9
9
|
|
|
10
10
|
const { onlyUpdate } = options
|
|
11
11
|
|
|
12
12
|
const DOMQLProperty = REGISTRY[param]
|
|
13
|
-
const DOMQLPropertyFromContext =
|
|
13
|
+
const DOMQLPropertyFromContext =
|
|
14
|
+
context && context.registry && context.registry[param]
|
|
14
15
|
const isGlobalTransformer = DOMQLPropertyFromContext || DOMQLProperty
|
|
15
16
|
|
|
16
17
|
const hasDefine = element.define && element.define[param]
|
|
@@ -18,7 +19,9 @@ export const applyParam = async (param, element, options) => {
|
|
|
18
19
|
|
|
19
20
|
if (!ref.__if) return
|
|
20
21
|
|
|
21
|
-
const hasOnlyUpdate = onlyUpdate
|
|
22
|
+
const hasOnlyUpdate = onlyUpdate
|
|
23
|
+
? onlyUpdate === param || element.lookup(onlyUpdate)
|
|
24
|
+
: true
|
|
22
25
|
|
|
23
26
|
if (isGlobalTransformer && !hasContextDefine && hasOnlyUpdate) {
|
|
24
27
|
if (isFunction(isGlobalTransformer)) {
|
package/utils/propEvents.js
CHANGED
|
@@ -12,7 +12,7 @@ export const propagateEventsFromProps = (element) => {
|
|
|
12
12
|
if (isFunction(origEvent)) {
|
|
13
13
|
on[eventName] = (...args) => {
|
|
14
14
|
const originalEventRetunrs = origEvent(...args)
|
|
15
|
-
if (originalEventRetunrs !== false) funcFromProps(...args)
|
|
15
|
+
if (originalEventRetunrs !== false) return funcFromProps(...args)
|
|
16
16
|
}
|
|
17
17
|
} else on[eventName] = funcFromProps
|
|
18
18
|
})
|