@domql/element 2.27.0 → 2.27.11
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 +81 -35
- package/dist/cjs/create.js +41 -16
- package/dist/cjs/extend.js +12 -4
- package/dist/cjs/methods/index.js +16 -9
- package/dist/cjs/node.js +4 -2
- package/dist/cjs/utils/extendUtils.js +1 -1
- package/dist/esm/create.js +41 -16
- package/dist/esm/extend.js +13 -5
- package/dist/esm/methods/index.js +26 -10
- package/dist/esm/node.js +11 -3
- package/dist/esm/utils/extendUtils.js +9 -2
- package/extend.js +15 -6
- package/methods/index.js +45 -15
- package/node.js +11 -3
- package/package.json +8 -8
- package/utils/extendUtils.js +26 -10
package/create.js
CHANGED
|
@@ -40,13 +40,20 @@ import {
|
|
|
40
40
|
applyVariant,
|
|
41
41
|
createValidDomqlObjectFromSugar
|
|
42
42
|
} from './utils/component.js'
|
|
43
|
+
import { isNotProduction } from '@domql/utils/env.js'
|
|
43
44
|
|
|
44
45
|
const ENV = process.env.NODE_ENV
|
|
45
46
|
|
|
46
47
|
/**
|
|
47
48
|
* Creating a domQL element using passed parameters
|
|
48
49
|
*/
|
|
49
|
-
export const create = async (
|
|
50
|
+
export const create = async (
|
|
51
|
+
element,
|
|
52
|
+
parent,
|
|
53
|
+
key,
|
|
54
|
+
options = OPTIONS.create || {},
|
|
55
|
+
attachOptions
|
|
56
|
+
) => {
|
|
50
57
|
cacheOptions(element, options)
|
|
51
58
|
|
|
52
59
|
// if element is STRING
|
|
@@ -93,7 +100,8 @@ export const create = async (element, parent, key, options = OPTIONS.create || {
|
|
|
93
100
|
|
|
94
101
|
// apply props settings
|
|
95
102
|
createProps(element, parent, options)
|
|
96
|
-
if (element.scope === 'props' || element.scope === true)
|
|
103
|
+
if (element.scope === 'props' || element.scope === true)
|
|
104
|
+
element.scope = element.props
|
|
97
105
|
|
|
98
106
|
// recatch if it passess props again
|
|
99
107
|
createIfConditionFlag(element, parent)
|
|
@@ -128,13 +136,17 @@ export const create = async (element, parent, key, options = OPTIONS.create || {
|
|
|
128
136
|
const createBasedOnType = (element, parent, key, options) => {
|
|
129
137
|
// if ELEMENT is not given
|
|
130
138
|
if (element === undefined) {
|
|
131
|
-
if (ENV
|
|
132
|
-
console.warn(
|
|
139
|
+
if (isNotProduction(ENV)) {
|
|
140
|
+
console.warn(
|
|
141
|
+
key,
|
|
142
|
+
'element is undefined in',
|
|
143
|
+
parent && parent.__ref && parent.__ref.path
|
|
144
|
+
)
|
|
133
145
|
}
|
|
134
146
|
return {}
|
|
135
147
|
}
|
|
136
148
|
if (isString(key) && key.slice(0, 2 === '__')) {
|
|
137
|
-
if (ENV
|
|
149
|
+
if (isNotProduction(ENV)) {
|
|
138
150
|
console.warn(key, 'seems like to be in __ref')
|
|
139
151
|
}
|
|
140
152
|
}
|
|
@@ -152,7 +164,11 @@ const createBasedOnType = (element, parent, key, options) => {
|
|
|
152
164
|
const redefineElement = (element, parent, key, options) => {
|
|
153
165
|
const elementWrapper = createBasedOnType(element, parent, key, options)
|
|
154
166
|
|
|
155
|
-
if (
|
|
167
|
+
if (
|
|
168
|
+
options.syntaxv3 ||
|
|
169
|
+
(element.props && element.props.syntaxv3) ||
|
|
170
|
+
(parent && parent.props && parent.props.syntaxv3) /* kalduna guard */
|
|
171
|
+
) {
|
|
156
172
|
if (element.props) element.props.syntaxv3 = true
|
|
157
173
|
else element.syntaxv3 = true
|
|
158
174
|
return createValidDomqlObjectFromSugar(element, parent, key, options)
|
|
@@ -187,12 +203,7 @@ const cacheOptions = (element, options) => {
|
|
|
187
203
|
}
|
|
188
204
|
|
|
189
205
|
const createKey = (element, parent, key) => {
|
|
190
|
-
return (
|
|
191
|
-
exec(key, element) ||
|
|
192
|
-
key ||
|
|
193
|
-
element.key ||
|
|
194
|
-
generateKey()
|
|
195
|
-
).toString()
|
|
206
|
+
return (exec(key, element) || key || element.key || generateKey()).toString()
|
|
196
207
|
}
|
|
197
208
|
|
|
198
209
|
const addRef = (element, parent) => {
|
|
@@ -209,13 +220,15 @@ const switchDefaultOptions = (element, parent, options) => {
|
|
|
209
220
|
}
|
|
210
221
|
|
|
211
222
|
const addElementIntoParentChildren = (element, parent) => {
|
|
212
|
-
if (parent.__ref && parent.__ref.__children)
|
|
223
|
+
if (parent.__ref && parent.__ref.__children)
|
|
224
|
+
parent.__ref.__children.push(element.key)
|
|
213
225
|
}
|
|
214
226
|
|
|
215
227
|
const visitedElements = new WeakMap()
|
|
216
228
|
const renderElement = async (element, parent, options, attachOptions) => {
|
|
217
229
|
if (visitedElements.has(element)) {
|
|
218
|
-
if (ENV
|
|
230
|
+
if (isNotProduction(ENV))
|
|
231
|
+
console.warn('Cyclic rendering detected:', element.__ref.path)
|
|
219
232
|
}
|
|
220
233
|
|
|
221
234
|
visitedElements.set(element, true)
|
|
@@ -230,21 +243,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
|
|
|
230
243
|
}
|
|
231
244
|
|
|
232
245
|
// CREATE a real NODE
|
|
233
|
-
if (ENV
|
|
246
|
+
if (isNotProduction(ENV)) {
|
|
234
247
|
await createNestedChild()
|
|
235
248
|
} else {
|
|
236
249
|
try {
|
|
237
250
|
await createNestedChild()
|
|
238
251
|
} catch (e) {
|
|
239
252
|
const path = ref.path
|
|
240
|
-
if (path.includes('ComponentsGrid'))
|
|
241
|
-
|
|
253
|
+
if (path.includes('ComponentsGrid'))
|
|
254
|
+
path.splice(0, path.indexOf('ComponentsGrid') + 2)
|
|
255
|
+
if (path.includes('demoComponent'))
|
|
256
|
+
path.splice(0, path.indexOf('demoComponent') + 1)
|
|
242
257
|
const isDemoComponent = element.lookup(el => el.state.key)?.state?.key
|
|
243
|
-
element.warn(
|
|
258
|
+
element.warn(
|
|
259
|
+
'Error happened in:',
|
|
260
|
+
isDemoComponent ? isDemoComponent + ' ' : '' + path.join('.')
|
|
261
|
+
)
|
|
244
262
|
element.verbose()
|
|
245
263
|
element.error(e, options)
|
|
246
|
-
if (element.on?.error)
|
|
247
|
-
|
|
264
|
+
if (element.on?.error)
|
|
265
|
+
element.on.error(e, element, element.state, element.context, options)
|
|
266
|
+
if (element.props?.onError)
|
|
267
|
+
element.props.onError(
|
|
268
|
+
e,
|
|
269
|
+
element,
|
|
270
|
+
element.state,
|
|
271
|
+
element.context,
|
|
272
|
+
options
|
|
273
|
+
)
|
|
248
274
|
}
|
|
249
275
|
}
|
|
250
276
|
|
|
@@ -273,25 +299,32 @@ const renderElement = async (element, parent, options, attachOptions) => {
|
|
|
273
299
|
await triggerEventOn('create', element, options)
|
|
274
300
|
}
|
|
275
301
|
|
|
276
|
-
const checkIfPrimitive =
|
|
302
|
+
const checkIfPrimitive = element => is(element)('string', 'number')
|
|
277
303
|
|
|
278
304
|
const applyValueAsText = (element, parent, key) => {
|
|
279
305
|
const extendTag = element.extend && element.extend.tag
|
|
280
306
|
const childExtendTag = parent.childExtend && parent.childExtend.tag
|
|
281
307
|
const childPropsTag = parent.props.childProps && parent.props.childProps.tag
|
|
282
|
-
const isKeyValidHTMLTag =
|
|
308
|
+
const isKeyValidHTMLTag = HTML_TAGS.body.indexOf(key) > -1 && key
|
|
283
309
|
return {
|
|
284
310
|
text: element,
|
|
285
|
-
tag:
|
|
311
|
+
tag:
|
|
312
|
+
extendTag ||
|
|
313
|
+
childExtendTag ||
|
|
314
|
+
childPropsTag ||
|
|
315
|
+
isKeyValidHTMLTag ||
|
|
316
|
+
'string'
|
|
286
317
|
}
|
|
287
318
|
}
|
|
288
319
|
|
|
289
320
|
const applyContext = (element, parent, options) => {
|
|
290
|
-
const forcedOptionsContext =
|
|
321
|
+
const forcedOptionsContext =
|
|
322
|
+
options.context && !ROOT.context && !element.context
|
|
291
323
|
if (forcedOptionsContext) ROOT.context = options.context
|
|
292
324
|
|
|
293
325
|
// inherit from parent or root
|
|
294
|
-
if (!element.context)
|
|
326
|
+
if (!element.context)
|
|
327
|
+
element.context = parent.context || options.context || ROOT.context
|
|
295
328
|
}
|
|
296
329
|
|
|
297
330
|
// Create scope - shared object across the elements to the own or the nearest parent
|
|
@@ -304,7 +337,10 @@ const createScope = (element, parent) => {
|
|
|
304
337
|
const createIfConditionFlag = (element, parent) => {
|
|
305
338
|
const { __ref: ref } = element
|
|
306
339
|
|
|
307
|
-
if (
|
|
340
|
+
if (
|
|
341
|
+
isFunction(element.if) &&
|
|
342
|
+
!element.if(element, element.state, element.context)
|
|
343
|
+
) {
|
|
308
344
|
delete ref.__if
|
|
309
345
|
} else ref.__if = true
|
|
310
346
|
}
|
|
@@ -337,14 +373,15 @@ const addCaching = (element, parent) => {
|
|
|
337
373
|
// enable CHANGES storing
|
|
338
374
|
if (!ref.__children) ref.__children = []
|
|
339
375
|
|
|
340
|
-
if (checkIfKeyIsComponent(key))
|
|
376
|
+
if (checkIfKeyIsComponent(key))
|
|
377
|
+
ref.__componentKey = key.split('_')[0].split('.')[0].split('+')[0]
|
|
341
378
|
|
|
342
379
|
// Add _root element property
|
|
343
380
|
const hasRoot = parent && parent.key === ':root'
|
|
344
381
|
if (!ref.root) ref.root = hasRoot ? element : parentRef.root
|
|
345
382
|
|
|
346
383
|
// set the PATH array
|
|
347
|
-
// if (ENV
|
|
384
|
+
// if (isNotProduction(ENV)) {
|
|
348
385
|
if (!parentRef) parentRef = parent.ref = {}
|
|
349
386
|
if (!parentRef.path) parentRef.path = []
|
|
350
387
|
ref.path = parentRef.path.concat(element.key)
|
|
@@ -367,9 +404,12 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
367
404
|
|
|
368
405
|
// apply props settings
|
|
369
406
|
createProps(element, parent, options)
|
|
370
|
-
if (element.scope === 'props' || element.scope === true)
|
|
407
|
+
if (element.scope === 'props' || element.scope === true)
|
|
408
|
+
element.scope = element.props
|
|
371
409
|
|
|
372
|
-
if (element.node && ref.__if) {
|
|
410
|
+
if (element.node && ref.__if) {
|
|
411
|
+
parent[key || element.key] = element
|
|
412
|
+
} // Borrowed from assignNode()
|
|
373
413
|
|
|
374
414
|
if (!element.props) element.props = {}
|
|
375
415
|
applyVariant(element, parent)
|
|
@@ -387,16 +427,22 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
387
427
|
isMethod(k, element) ||
|
|
388
428
|
isObject((registry.default || registry)[k]) ||
|
|
389
429
|
isVariant(k)
|
|
390
|
-
)
|
|
430
|
+
)
|
|
431
|
+
continue
|
|
391
432
|
|
|
392
433
|
const hasDefine = element.define && element.define[k]
|
|
393
|
-
const contextHasDefine =
|
|
394
|
-
|
|
434
|
+
const contextHasDefine =
|
|
435
|
+
element.context && element.context.define && element.context.define[k]
|
|
395
436
|
const optionsHasDefine = options.define && options.define[k]
|
|
396
437
|
|
|
397
438
|
if (!ref.__skipCreate && REGISTRY[k] && !optionsHasDefine) {
|
|
398
439
|
continue
|
|
399
|
-
} else if (
|
|
440
|
+
} else if (
|
|
441
|
+
element[k] &&
|
|
442
|
+
!hasDefine &&
|
|
443
|
+
!optionsHasDefine &&
|
|
444
|
+
!contextHasDefine
|
|
445
|
+
) {
|
|
400
446
|
create(exec(element[k], element), element, k, options)
|
|
401
447
|
}
|
|
402
448
|
}
|
|
@@ -416,7 +462,7 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
416
462
|
return element
|
|
417
463
|
}
|
|
418
464
|
|
|
419
|
-
const checkIfMedia =
|
|
465
|
+
const checkIfMedia = key => key.slice(0, 1) === '@'
|
|
420
466
|
|
|
421
467
|
const applyMediaProps = (element, parent, key) => {
|
|
422
468
|
const { props } = element
|
package/dist/cjs/create.js
CHANGED
|
@@ -37,6 +37,7 @@ var import_classList = require("./mixins/classList.js");
|
|
|
37
37
|
var import_iterate = require("./iterate.js");
|
|
38
38
|
var import_options = require("./cache/options.js");
|
|
39
39
|
var import_component = require("./utils/component.js");
|
|
40
|
+
var import_env = require("@domql/utils/env.js");
|
|
40
41
|
const ENV = "development";
|
|
41
42
|
const create = async (element, parent, key, options = import_options.OPTIONS.create || {}, attachOptions) => {
|
|
42
43
|
cacheOptions(element, options);
|
|
@@ -66,7 +67,8 @@ const create = async (element, parent, key, options = import_options.OPTIONS.cre
|
|
|
66
67
|
if (element.scope === "state") element.scope = element.state;
|
|
67
68
|
createIfConditionFlag(element, parent);
|
|
68
69
|
(0, import_props.createProps)(element, parent, options);
|
|
69
|
-
if (element.scope === "props" || element.scope === true)
|
|
70
|
+
if (element.scope === "props" || element.scope === true)
|
|
71
|
+
element.scope = element.props;
|
|
70
72
|
createIfConditionFlag(element, parent);
|
|
71
73
|
if (element.node && ref.__if) {
|
|
72
74
|
return (0, import_render.assignNode)(element, parent, key, attachOptions);
|
|
@@ -84,13 +86,17 @@ const create = async (element, parent, key, options = import_options.OPTIONS.cre
|
|
|
84
86
|
};
|
|
85
87
|
const createBasedOnType = (element, parent, key, options) => {
|
|
86
88
|
if (element === void 0) {
|
|
87
|
-
if (
|
|
88
|
-
console.warn(
|
|
89
|
+
if ((0, import_env.isNotProduction)(ENV)) {
|
|
90
|
+
console.warn(
|
|
91
|
+
key,
|
|
92
|
+
"element is undefined in",
|
|
93
|
+
parent && parent.__ref && parent.__ref.path
|
|
94
|
+
);
|
|
89
95
|
}
|
|
90
96
|
return {};
|
|
91
97
|
}
|
|
92
98
|
if ((0, import_utils.isString)(key) && key.slice(0, false)) {
|
|
93
|
-
if (
|
|
99
|
+
if ((0, import_env.isNotProduction)(ENV)) {
|
|
94
100
|
console.warn(key, "seems like to be in __ref");
|
|
95
101
|
}
|
|
96
102
|
}
|
|
@@ -145,13 +151,15 @@ const switchDefaultOptions = (element, parent, options) => {
|
|
|
145
151
|
}
|
|
146
152
|
};
|
|
147
153
|
const addElementIntoParentChildren = (element, parent) => {
|
|
148
|
-
if (parent.__ref && parent.__ref.__children)
|
|
154
|
+
if (parent.__ref && parent.__ref.__children)
|
|
155
|
+
parent.__ref.__children.push(element.key);
|
|
149
156
|
};
|
|
150
157
|
const visitedElements = /* @__PURE__ */ new WeakMap();
|
|
151
158
|
const renderElement = async (element, parent, options, attachOptions) => {
|
|
152
159
|
var _a, _b, _c, _d;
|
|
153
160
|
if (visitedElements.has(element)) {
|
|
154
|
-
if (
|
|
161
|
+
if ((0, import_env.isNotProduction)(ENV))
|
|
162
|
+
console.warn("Cyclic rendering detected:", element.__ref.path);
|
|
155
163
|
}
|
|
156
164
|
visitedElements.set(element, true);
|
|
157
165
|
const { __ref: ref, key } = element;
|
|
@@ -161,21 +169,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
|
|
|
161
169
|
await (0, import_node.createNode)(element, options);
|
|
162
170
|
ref.__uniqId = Math.random();
|
|
163
171
|
};
|
|
164
|
-
if (
|
|
172
|
+
if ((0, import_env.isNotProduction)(ENV)) {
|
|
165
173
|
await createNestedChild();
|
|
166
174
|
} else {
|
|
167
175
|
try {
|
|
168
176
|
await createNestedChild();
|
|
169
177
|
} catch (e) {
|
|
170
178
|
const path = ref.path;
|
|
171
|
-
if (path.includes("ComponentsGrid"))
|
|
172
|
-
|
|
179
|
+
if (path.includes("ComponentsGrid"))
|
|
180
|
+
path.splice(0, path.indexOf("ComponentsGrid") + 2);
|
|
181
|
+
if (path.includes("demoComponent"))
|
|
182
|
+
path.splice(0, path.indexOf("demoComponent") + 1);
|
|
173
183
|
const isDemoComponent = (_b = (_a = element.lookup((el) => el.state.key)) == null ? void 0 : _a.state) == null ? void 0 : _b.key;
|
|
174
|
-
element.warn(
|
|
184
|
+
element.warn(
|
|
185
|
+
"Error happened in:",
|
|
186
|
+
isDemoComponent ? isDemoComponent + " " : "" + path.join(".")
|
|
187
|
+
);
|
|
175
188
|
element.verbose();
|
|
176
189
|
element.error(e, options);
|
|
177
|
-
if ((_c = element.on) == null ? void 0 : _c.error)
|
|
178
|
-
|
|
190
|
+
if ((_c = element.on) == null ? void 0 : _c.error)
|
|
191
|
+
element.on.error(e, element, element.state, element.context, options);
|
|
192
|
+
if ((_d = element.props) == null ? void 0 : _d.onError)
|
|
193
|
+
element.props.onError(
|
|
194
|
+
e,
|
|
195
|
+
element,
|
|
196
|
+
element.state,
|
|
197
|
+
element.context,
|
|
198
|
+
options
|
|
199
|
+
);
|
|
179
200
|
}
|
|
180
201
|
}
|
|
181
202
|
if (!ref.__if) {
|
|
@@ -203,7 +224,8 @@ const applyValueAsText = (element, parent, key) => {
|
|
|
203
224
|
const applyContext = (element, parent, options) => {
|
|
204
225
|
const forcedOptionsContext = options.context && !import_tree.ROOT.context && !element.context;
|
|
205
226
|
if (forcedOptionsContext) import_tree.ROOT.context = options.context;
|
|
206
|
-
if (!element.context)
|
|
227
|
+
if (!element.context)
|
|
228
|
+
element.context = parent.context || options.context || import_tree.ROOT.context;
|
|
207
229
|
};
|
|
208
230
|
const createScope = (element, parent) => {
|
|
209
231
|
const { __ref: ref } = element;
|
|
@@ -228,7 +250,8 @@ const addCaching = (element, parent) => {
|
|
|
228
250
|
if (!ref.__attr) ref.__attr = {};
|
|
229
251
|
if (!ref.__changes) ref.__changes = [];
|
|
230
252
|
if (!ref.__children) ref.__children = [];
|
|
231
|
-
if ((0, import_utils.checkIfKeyIsComponent)(key))
|
|
253
|
+
if ((0, import_utils.checkIfKeyIsComponent)(key))
|
|
254
|
+
ref.__componentKey = key.split("_")[0].split(".")[0].split("+")[0];
|
|
232
255
|
const hasRoot = parent && parent.key === ":root";
|
|
233
256
|
if (!ref.root) ref.root = hasRoot ? element : parentRef.root;
|
|
234
257
|
if (!parentRef) parentRef = parent.ref = {};
|
|
@@ -245,7 +268,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
245
268
|
if (element.scope === "state") element.scope = element.state;
|
|
246
269
|
createIfConditionFlag(element, parent);
|
|
247
270
|
(0, import_props.createProps)(element, parent, options);
|
|
248
|
-
if (element.scope === "props" || element.scope === true)
|
|
271
|
+
if (element.scope === "props" || element.scope === true)
|
|
272
|
+
element.scope = element.props;
|
|
249
273
|
if (element.node && ref.__if) {
|
|
250
274
|
parent[key || element.key] = element;
|
|
251
275
|
}
|
|
@@ -257,7 +281,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
257
281
|
(0, import_iterate.throughInitialDefine)(element);
|
|
258
282
|
(0, import_iterate.throughInitialExec)(element);
|
|
259
283
|
for (const k in element) {
|
|
260
|
-
if ((0, import_utils.isUndefined)(element[k]) || (0, import_methods.isMethod)(k, element) || (0, import_utils.isObject)((import_mixins.registry.default || import_mixins.registry)[k]) || (0, import_utils.isVariant)(k))
|
|
284
|
+
if ((0, import_utils.isUndefined)(element[k]) || (0, import_methods.isMethod)(k, element) || (0, import_utils.isObject)((import_mixins.registry.default || import_mixins.registry)[k]) || (0, import_utils.isVariant)(k))
|
|
285
|
+
continue;
|
|
261
286
|
const hasDefine = element.define && element.define[k];
|
|
262
287
|
const contextHasDefine = element.context && element.context.define && element.context.define[k];
|
|
263
288
|
const optionsHasDefine = options.define && options.define[k];
|
package/dist/cjs/extend.js
CHANGED
|
@@ -33,7 +33,7 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
33
33
|
const context = element.context || parent.context;
|
|
34
34
|
extend = (0, import_utils2.fallbackStringExtend)(extend, context, options, variant);
|
|
35
35
|
const extendStack = (0, import_utils2.getExtendStack)(extend, context);
|
|
36
|
-
if (
|
|
36
|
+
if ((0, import_utils.isProduction)(ENV)) delete element.extend;
|
|
37
37
|
let childExtendStack = [];
|
|
38
38
|
if (parent) {
|
|
39
39
|
element.parent = parent;
|
|
@@ -43,7 +43,10 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
43
43
|
if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
|
|
44
44
|
const canExtendRecursive = element.key !== "__text";
|
|
45
45
|
if (canExtendRecursive) {
|
|
46
|
-
const childExtendRecursiveStack = (0, import_utils2.getExtendStack)(
|
|
46
|
+
const childExtendRecursiveStack = (0, import_utils2.getExtendStack)(
|
|
47
|
+
parent.childExtendRecursive,
|
|
48
|
+
context
|
|
49
|
+
);
|
|
47
50
|
childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
|
|
48
51
|
element.childExtendRecursive = parent.childExtendRecursive;
|
|
49
52
|
}
|
|
@@ -62,7 +65,10 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
62
65
|
} else if (!context.defaultExtends) return element;
|
|
63
66
|
if (context.defaultExtends) {
|
|
64
67
|
if (!mainExtend) {
|
|
65
|
-
const defaultOptionsExtend = (0, import_utils2.getExtendStack)(
|
|
68
|
+
const defaultOptionsExtend = (0, import_utils2.getExtendStack)(
|
|
69
|
+
context.defaultExtends,
|
|
70
|
+
context
|
|
71
|
+
);
|
|
66
72
|
mainExtend = (0, import_utils2.cloneAndMergeArrayExtend)(defaultOptionsExtend);
|
|
67
73
|
delete mainExtend.extend;
|
|
68
74
|
}
|
|
@@ -73,7 +79,9 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
73
79
|
const COMPONENTS = context && context.components || options.components;
|
|
74
80
|
const component = (0, import_utils.exec)(element.component || mergedExtend.component, element);
|
|
75
81
|
if (component && COMPONENTS && COMPONENTS[component]) {
|
|
76
|
-
const componentExtend = (0, import_utils2.cloneAndMergeArrayExtend)(
|
|
82
|
+
const componentExtend = (0, import_utils2.cloneAndMergeArrayExtend)(
|
|
83
|
+
(0, import_utils2.getExtendStack)(COMPONENTS[component])
|
|
84
|
+
);
|
|
77
85
|
mergedExtend = (0, import_utils2.deepMergeExtend)(componentExtend, mergedExtend);
|
|
78
86
|
}
|
|
79
87
|
const merged = (0, import_utils2.deepMergeExtend)(element, mergedExtend);
|
|
@@ -53,7 +53,8 @@ function spotByPath(path) {
|
|
|
53
53
|
const element = this;
|
|
54
54
|
const arr = [].concat(path);
|
|
55
55
|
let active = import_tree.TREE[arr[0]];
|
|
56
|
-
if (!arr || !arr.length)
|
|
56
|
+
if (!arr || !arr.length)
|
|
57
|
+
return console.log(arr, "on", element.key, "is undefined");
|
|
57
58
|
while (active.key === arr[0]) {
|
|
58
59
|
arr.shift();
|
|
59
60
|
if (!arr.length) break;
|
|
@@ -66,7 +67,8 @@ function lookup(param) {
|
|
|
66
67
|
const el = this;
|
|
67
68
|
let { parent } = el;
|
|
68
69
|
if ((0, import_utils.isFunction)(param)) {
|
|
69
|
-
if (parent.state && param(parent, parent.state, parent.context))
|
|
70
|
+
if (parent.state && param(parent, parent.state, parent.context))
|
|
71
|
+
return parent;
|
|
70
72
|
else if (parent.parent) return parent.lookup(param);
|
|
71
73
|
else return;
|
|
72
74
|
}
|
|
@@ -136,7 +138,11 @@ async function remove(opts) {
|
|
|
136
138
|
element.log();
|
|
137
139
|
}
|
|
138
140
|
delete element.parent[element.key];
|
|
139
|
-
if (element.parent.__ref)
|
|
141
|
+
if (element.parent.__ref)
|
|
142
|
+
element.parent.__ref.__children = (0, import_utils.removeValueFromArray)(
|
|
143
|
+
element.parent.__ref.__children,
|
|
144
|
+
element.key
|
|
145
|
+
);
|
|
140
146
|
await (0, import_event.triggerEventOn)("remove", element, opts);
|
|
141
147
|
}
|
|
142
148
|
function get(param) {
|
|
@@ -184,7 +190,8 @@ function parse(excl = []) {
|
|
|
184
190
|
} else if (v === "props") {
|
|
185
191
|
const { __element, update, ...props } = element[v];
|
|
186
192
|
obj[v] = props;
|
|
187
|
-
} else if ((0, import_utils.isDefined)(val) && Object.hasOwnProperty.call(element, v))
|
|
193
|
+
} else if ((0, import_utils.isDefined)(val) && Object.hasOwnProperty.call(element, v))
|
|
194
|
+
obj[v] = val;
|
|
188
195
|
});
|
|
189
196
|
return obj;
|
|
190
197
|
}
|
|
@@ -200,7 +207,7 @@ function parseDeep(excl = []) {
|
|
|
200
207
|
return obj;
|
|
201
208
|
}
|
|
202
209
|
function verbose(element, ...args) {
|
|
203
|
-
if (
|
|
210
|
+
if ((0, import_utils.isProduction)(ENV)) return;
|
|
204
211
|
const parent = this;
|
|
205
212
|
const { __ref: ref } = parent;
|
|
206
213
|
console.groupCollapsed(parent.key);
|
|
@@ -217,18 +224,18 @@ function verbose(element, ...args) {
|
|
|
217
224
|
return parent;
|
|
218
225
|
}
|
|
219
226
|
function log(...params) {
|
|
220
|
-
if (
|
|
227
|
+
if ((0, import_utils.isNotProduction)(ENV)) {
|
|
221
228
|
console.log(...params);
|
|
222
229
|
}
|
|
223
230
|
}
|
|
224
231
|
function warn(...params) {
|
|
225
|
-
if (
|
|
232
|
+
if ((0, import_utils.isNotProduction)(ENV)) {
|
|
226
233
|
console.warn(...params);
|
|
227
234
|
}
|
|
228
235
|
}
|
|
229
236
|
function error(...params) {
|
|
230
237
|
var _a, _b;
|
|
231
|
-
if (
|
|
238
|
+
if ((0, import_utils.isNotProduction)(ENV)) {
|
|
232
239
|
if ((_a = params[params.length - 1]) == null ? void 0 : _a.debugger) debugger;
|
|
233
240
|
if ((_b = params[params.length - 1]) == null ? void 0 : _b.verbose) verbose.call(this, ...params);
|
|
234
241
|
console.error(...params, this);
|
|
@@ -265,7 +272,7 @@ function variables(obj = {}) {
|
|
|
265
272
|
}
|
|
266
273
|
return {
|
|
267
274
|
changed: (cb) => {
|
|
268
|
-
if (!changed) return;
|
|
275
|
+
if (!changed || !varCaches) return;
|
|
269
276
|
const returns = cb(changes, (0, import_utils.deepClone)(varCaches));
|
|
270
277
|
for (const key in changes) {
|
|
271
278
|
varCaches[key] = changes[key];
|
package/dist/cjs/node.js
CHANGED
|
@@ -31,6 +31,7 @@ var import_iterate = require("./iterate.js");
|
|
|
31
31
|
var import_mixins = require("./mixins/index.js");
|
|
32
32
|
var import_applyParam = require("./utils/applyParam.js");
|
|
33
33
|
var import_propEvents = require("./utils/propEvents.js");
|
|
34
|
+
var import_env = require("@domql/utils/env.js");
|
|
34
35
|
const ENV = "development";
|
|
35
36
|
const createNode = async (element, options) => {
|
|
36
37
|
let { node, tag, __ref: ref } = element;
|
|
@@ -43,7 +44,7 @@ const createNode = async (element, options) => {
|
|
|
43
44
|
} else node = element.node = (0, import_render.cacheNode)(element);
|
|
44
45
|
await (0, import_event.triggerEventOn)("attachNode", element, options);
|
|
45
46
|
}
|
|
46
|
-
if (
|
|
47
|
+
if ((0, import_env.isNotProduction)(ENV) || options.alowRefReference) {
|
|
47
48
|
node.ref = element;
|
|
48
49
|
if ((0, import_utils.isFunction)(node.setAttribute)) node.setAttribute("key", element.key);
|
|
49
50
|
}
|
|
@@ -59,7 +60,8 @@ const createNode = async (element, options) => {
|
|
|
59
60
|
for (const param in element) {
|
|
60
61
|
const value = element[param];
|
|
61
62
|
if (!Object.hasOwnProperty.call(element, param)) continue;
|
|
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
|
+
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]))
|
|
64
|
+
continue;
|
|
63
65
|
const isElement = await (0, import_applyParam.applyParam)(param, element, options);
|
|
64
66
|
if (isElement) {
|
|
65
67
|
const { hasDefine, hasContextDefine } = isElement;
|
|
@@ -110,7 +110,7 @@ const fallbackStringExtend = (extend, context, options = {}, variant) => {
|
|
|
110
110
|
if (componentExists) return componentExists;
|
|
111
111
|
else if (pageExists) return pageExists;
|
|
112
112
|
else {
|
|
113
|
-
if (options.verbose && (
|
|
113
|
+
if (options.verbose && (0, import_utils.isNotProduction)(ENV)) {
|
|
114
114
|
console.warn("Extend is string but component was not found:", extend);
|
|
115
115
|
}
|
|
116
116
|
return {};
|
package/dist/esm/create.js
CHANGED
|
@@ -33,6 +33,7 @@ import {
|
|
|
33
33
|
applyVariant,
|
|
34
34
|
createValidDomqlObjectFromSugar
|
|
35
35
|
} from "./utils/component.js";
|
|
36
|
+
import { isNotProduction } from "@domql/utils/env.js";
|
|
36
37
|
const ENV = "development";
|
|
37
38
|
const create = async (element, parent, key, options = OPTIONS.create || {}, attachOptions) => {
|
|
38
39
|
cacheOptions(element, options);
|
|
@@ -62,7 +63,8 @@ const create = async (element, parent, key, options = OPTIONS.create || {}, atta
|
|
|
62
63
|
if (element.scope === "state") element.scope = element.state;
|
|
63
64
|
createIfConditionFlag(element, parent);
|
|
64
65
|
createProps(element, parent, options);
|
|
65
|
-
if (element.scope === "props" || element.scope === true)
|
|
66
|
+
if (element.scope === "props" || element.scope === true)
|
|
67
|
+
element.scope = element.props;
|
|
66
68
|
createIfConditionFlag(element, parent);
|
|
67
69
|
if (element.node && ref.__if) {
|
|
68
70
|
return assignNode(element, parent, key, attachOptions);
|
|
@@ -80,13 +82,17 @@ const create = async (element, parent, key, options = OPTIONS.create || {}, atta
|
|
|
80
82
|
};
|
|
81
83
|
const createBasedOnType = (element, parent, key, options) => {
|
|
82
84
|
if (element === void 0) {
|
|
83
|
-
if (ENV
|
|
84
|
-
console.warn(
|
|
85
|
+
if (isNotProduction(ENV)) {
|
|
86
|
+
console.warn(
|
|
87
|
+
key,
|
|
88
|
+
"element is undefined in",
|
|
89
|
+
parent && parent.__ref && parent.__ref.path
|
|
90
|
+
);
|
|
85
91
|
}
|
|
86
92
|
return {};
|
|
87
93
|
}
|
|
88
94
|
if (isString(key) && key.slice(0, false)) {
|
|
89
|
-
if (ENV
|
|
95
|
+
if (isNotProduction(ENV)) {
|
|
90
96
|
console.warn(key, "seems like to be in __ref");
|
|
91
97
|
}
|
|
92
98
|
}
|
|
@@ -141,13 +147,15 @@ const switchDefaultOptions = (element, parent, options) => {
|
|
|
141
147
|
}
|
|
142
148
|
};
|
|
143
149
|
const addElementIntoParentChildren = (element, parent) => {
|
|
144
|
-
if (parent.__ref && parent.__ref.__children)
|
|
150
|
+
if (parent.__ref && parent.__ref.__children)
|
|
151
|
+
parent.__ref.__children.push(element.key);
|
|
145
152
|
};
|
|
146
153
|
const visitedElements = /* @__PURE__ */ new WeakMap();
|
|
147
154
|
const renderElement = async (element, parent, options, attachOptions) => {
|
|
148
155
|
var _a, _b, _c, _d;
|
|
149
156
|
if (visitedElements.has(element)) {
|
|
150
|
-
if (ENV
|
|
157
|
+
if (isNotProduction(ENV))
|
|
158
|
+
console.warn("Cyclic rendering detected:", element.__ref.path);
|
|
151
159
|
}
|
|
152
160
|
visitedElements.set(element, true);
|
|
153
161
|
const { __ref: ref, key } = element;
|
|
@@ -157,21 +165,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
|
|
|
157
165
|
await createNode(element, options);
|
|
158
166
|
ref.__uniqId = Math.random();
|
|
159
167
|
};
|
|
160
|
-
if (ENV
|
|
168
|
+
if (isNotProduction(ENV)) {
|
|
161
169
|
await createNestedChild();
|
|
162
170
|
} else {
|
|
163
171
|
try {
|
|
164
172
|
await createNestedChild();
|
|
165
173
|
} catch (e) {
|
|
166
174
|
const path = ref.path;
|
|
167
|
-
if (path.includes("ComponentsGrid"))
|
|
168
|
-
|
|
175
|
+
if (path.includes("ComponentsGrid"))
|
|
176
|
+
path.splice(0, path.indexOf("ComponentsGrid") + 2);
|
|
177
|
+
if (path.includes("demoComponent"))
|
|
178
|
+
path.splice(0, path.indexOf("demoComponent") + 1);
|
|
169
179
|
const isDemoComponent = (_b = (_a = element.lookup((el) => el.state.key)) == null ? void 0 : _a.state) == null ? void 0 : _b.key;
|
|
170
|
-
element.warn(
|
|
180
|
+
element.warn(
|
|
181
|
+
"Error happened in:",
|
|
182
|
+
isDemoComponent ? isDemoComponent + " " : "" + path.join(".")
|
|
183
|
+
);
|
|
171
184
|
element.verbose();
|
|
172
185
|
element.error(e, options);
|
|
173
|
-
if ((_c = element.on) == null ? void 0 : _c.error)
|
|
174
|
-
|
|
186
|
+
if ((_c = element.on) == null ? void 0 : _c.error)
|
|
187
|
+
element.on.error(e, element, element.state, element.context, options);
|
|
188
|
+
if ((_d = element.props) == null ? void 0 : _d.onError)
|
|
189
|
+
element.props.onError(
|
|
190
|
+
e,
|
|
191
|
+
element,
|
|
192
|
+
element.state,
|
|
193
|
+
element.context,
|
|
194
|
+
options
|
|
195
|
+
);
|
|
175
196
|
}
|
|
176
197
|
}
|
|
177
198
|
if (!ref.__if) {
|
|
@@ -199,7 +220,8 @@ const applyValueAsText = (element, parent, key) => {
|
|
|
199
220
|
const applyContext = (element, parent, options) => {
|
|
200
221
|
const forcedOptionsContext = options.context && !ROOT.context && !element.context;
|
|
201
222
|
if (forcedOptionsContext) ROOT.context = options.context;
|
|
202
|
-
if (!element.context)
|
|
223
|
+
if (!element.context)
|
|
224
|
+
element.context = parent.context || options.context || ROOT.context;
|
|
203
225
|
};
|
|
204
226
|
const createScope = (element, parent) => {
|
|
205
227
|
const { __ref: ref } = element;
|
|
@@ -224,7 +246,8 @@ const addCaching = (element, parent) => {
|
|
|
224
246
|
if (!ref.__attr) ref.__attr = {};
|
|
225
247
|
if (!ref.__changes) ref.__changes = [];
|
|
226
248
|
if (!ref.__children) ref.__children = [];
|
|
227
|
-
if (checkIfKeyIsComponent(key))
|
|
249
|
+
if (checkIfKeyIsComponent(key))
|
|
250
|
+
ref.__componentKey = key.split("_")[0].split(".")[0].split("+")[0];
|
|
228
251
|
const hasRoot = parent && parent.key === ":root";
|
|
229
252
|
if (!ref.root) ref.root = hasRoot ? element : parentRef.root;
|
|
230
253
|
if (!parentRef) parentRef = parent.ref = {};
|
|
@@ -241,7 +264,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
241
264
|
if (element.scope === "state") element.scope = element.state;
|
|
242
265
|
createIfConditionFlag(element, parent);
|
|
243
266
|
createProps(element, parent, options);
|
|
244
|
-
if (element.scope === "props" || element.scope === true)
|
|
267
|
+
if (element.scope === "props" || element.scope === true)
|
|
268
|
+
element.scope = element.props;
|
|
245
269
|
if (element.node && ref.__if) {
|
|
246
270
|
parent[key || element.key] = element;
|
|
247
271
|
}
|
|
@@ -253,7 +277,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
|
|
|
253
277
|
throughInitialDefine(element);
|
|
254
278
|
throughInitialExec(element);
|
|
255
279
|
for (const k in element) {
|
|
256
|
-
if (isUndefined(element[k]) || isMethod(k, element) || isObject((registry.default || registry)[k]) || isVariant(k))
|
|
280
|
+
if (isUndefined(element[k]) || isMethod(k, element) || isObject((registry.default || registry)[k]) || isVariant(k))
|
|
281
|
+
continue;
|
|
257
282
|
const hasDefine = element.define && element.define[k];
|
|
258
283
|
const contextHasDefine = element.context && element.context.define && element.context.define[k];
|
|
259
284
|
const optionsHasDefine = options.define && options.define[k];
|
package/dist/esm/extend.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { isFunction, exec } from "@domql/utils";
|
|
1
|
+
import { isFunction, exec, isProduction } from "@domql/utils";
|
|
2
2
|
import {
|
|
3
3
|
getExtendStack,
|
|
4
4
|
jointStacks,
|
|
@@ -16,7 +16,7 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
16
16
|
const context = element.context || parent.context;
|
|
17
17
|
extend = fallbackStringExtend(extend, context, options, variant);
|
|
18
18
|
const extendStack = getExtendStack(extend, context);
|
|
19
|
-
if (ENV
|
|
19
|
+
if (isProduction(ENV)) delete element.extend;
|
|
20
20
|
let childExtendStack = [];
|
|
21
21
|
if (parent) {
|
|
22
22
|
element.parent = parent;
|
|
@@ -26,7 +26,10 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
26
26
|
if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
|
|
27
27
|
const canExtendRecursive = element.key !== "__text";
|
|
28
28
|
if (canExtendRecursive) {
|
|
29
|
-
const childExtendRecursiveStack = getExtendStack(
|
|
29
|
+
const childExtendRecursiveStack = getExtendStack(
|
|
30
|
+
parent.childExtendRecursive,
|
|
31
|
+
context
|
|
32
|
+
);
|
|
30
33
|
childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
|
|
31
34
|
element.childExtendRecursive = parent.childExtendRecursive;
|
|
32
35
|
}
|
|
@@ -45,7 +48,10 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
45
48
|
} else if (!context.defaultExtends) return element;
|
|
46
49
|
if (context.defaultExtends) {
|
|
47
50
|
if (!mainExtend) {
|
|
48
|
-
const defaultOptionsExtend = getExtendStack(
|
|
51
|
+
const defaultOptionsExtend = getExtendStack(
|
|
52
|
+
context.defaultExtends,
|
|
53
|
+
context
|
|
54
|
+
);
|
|
49
55
|
mainExtend = cloneAndMergeArrayExtend(defaultOptionsExtend);
|
|
50
56
|
delete mainExtend.extend;
|
|
51
57
|
}
|
|
@@ -56,7 +62,9 @@ const applyExtend = (element, parent, options = {}) => {
|
|
|
56
62
|
const COMPONENTS = context && context.components || options.components;
|
|
57
63
|
const component = exec(element.component || mergedExtend.component, element);
|
|
58
64
|
if (component && COMPONENTS && COMPONENTS[component]) {
|
|
59
|
-
const componentExtend = cloneAndMergeArrayExtend(
|
|
65
|
+
const componentExtend = cloneAndMergeArrayExtend(
|
|
66
|
+
getExtendStack(COMPONENTS[component])
|
|
67
|
+
);
|
|
60
68
|
mergedExtend = deepMergeExtend(componentExtend, mergedExtend);
|
|
61
69
|
}
|
|
62
70
|
const merged = deepMergeExtend(element, mergedExtend);
|
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
import { triggerEventOn } from "@domql/event";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
isDefined,
|
|
4
|
+
isObject,
|
|
5
|
+
isFunction,
|
|
6
|
+
isObjectLike,
|
|
7
|
+
isProduction,
|
|
8
|
+
removeValueFromArray,
|
|
9
|
+
deepClone,
|
|
10
|
+
isNotProduction
|
|
11
|
+
} from "@domql/utils";
|
|
3
12
|
import { TREE } from "../tree.js";
|
|
4
13
|
import { parseFilters, REGISTRY } from "../mixins/index.js";
|
|
5
14
|
const ENV = "development";
|
|
@@ -7,7 +16,8 @@ function spotByPath(path) {
|
|
|
7
16
|
const element = this;
|
|
8
17
|
const arr = [].concat(path);
|
|
9
18
|
let active = TREE[arr[0]];
|
|
10
|
-
if (!arr || !arr.length)
|
|
19
|
+
if (!arr || !arr.length)
|
|
20
|
+
return console.log(arr, "on", element.key, "is undefined");
|
|
11
21
|
while (active.key === arr[0]) {
|
|
12
22
|
arr.shift();
|
|
13
23
|
if (!arr.length) break;
|
|
@@ -20,7 +30,8 @@ function lookup(param) {
|
|
|
20
30
|
const el = this;
|
|
21
31
|
let { parent } = el;
|
|
22
32
|
if (isFunction(param)) {
|
|
23
|
-
if (parent.state && param(parent, parent.state, parent.context))
|
|
33
|
+
if (parent.state && param(parent, parent.state, parent.context))
|
|
34
|
+
return parent;
|
|
24
35
|
else if (parent.parent) return parent.lookup(param);
|
|
25
36
|
else return;
|
|
26
37
|
}
|
|
@@ -90,7 +101,11 @@ async function remove(opts) {
|
|
|
90
101
|
element.log();
|
|
91
102
|
}
|
|
92
103
|
delete element.parent[element.key];
|
|
93
|
-
if (element.parent.__ref)
|
|
104
|
+
if (element.parent.__ref)
|
|
105
|
+
element.parent.__ref.__children = removeValueFromArray(
|
|
106
|
+
element.parent.__ref.__children,
|
|
107
|
+
element.key
|
|
108
|
+
);
|
|
94
109
|
await triggerEventOn("remove", element, opts);
|
|
95
110
|
}
|
|
96
111
|
function get(param) {
|
|
@@ -138,7 +153,8 @@ function parse(excl = []) {
|
|
|
138
153
|
} else if (v === "props") {
|
|
139
154
|
const { __element, update, ...props } = element[v];
|
|
140
155
|
obj[v] = props;
|
|
141
|
-
} else if (isDefined(val) && Object.hasOwnProperty.call(element, v))
|
|
156
|
+
} else if (isDefined(val) && Object.hasOwnProperty.call(element, v))
|
|
157
|
+
obj[v] = val;
|
|
142
158
|
});
|
|
143
159
|
return obj;
|
|
144
160
|
}
|
|
@@ -154,7 +170,7 @@ function parseDeep(excl = []) {
|
|
|
154
170
|
return obj;
|
|
155
171
|
}
|
|
156
172
|
function verbose(element, ...args) {
|
|
157
|
-
if (ENV
|
|
173
|
+
if (isProduction(ENV)) return;
|
|
158
174
|
const parent = this;
|
|
159
175
|
const { __ref: ref } = parent;
|
|
160
176
|
console.groupCollapsed(parent.key);
|
|
@@ -171,18 +187,18 @@ function verbose(element, ...args) {
|
|
|
171
187
|
return parent;
|
|
172
188
|
}
|
|
173
189
|
function log(...params) {
|
|
174
|
-
if (ENV
|
|
190
|
+
if (isNotProduction(ENV)) {
|
|
175
191
|
console.log(...params);
|
|
176
192
|
}
|
|
177
193
|
}
|
|
178
194
|
function warn(...params) {
|
|
179
|
-
if (ENV
|
|
195
|
+
if (isNotProduction(ENV)) {
|
|
180
196
|
console.warn(...params);
|
|
181
197
|
}
|
|
182
198
|
}
|
|
183
199
|
function error(...params) {
|
|
184
200
|
var _a, _b;
|
|
185
|
-
if (ENV
|
|
201
|
+
if (isNotProduction(ENV)) {
|
|
186
202
|
if ((_a = params[params.length - 1]) == null ? void 0 : _a.debugger) debugger;
|
|
187
203
|
if ((_b = params[params.length - 1]) == null ? void 0 : _b.verbose) verbose.call(this, ...params);
|
|
188
204
|
console.error(...params, this);
|
|
@@ -219,7 +235,7 @@ function variables(obj = {}) {
|
|
|
219
235
|
}
|
|
220
236
|
return {
|
|
221
237
|
changed: (cb) => {
|
|
222
|
-
if (!changed) return;
|
|
238
|
+
if (!changed || !varCaches) return;
|
|
223
239
|
const returns = cb(changes, deepClone(varCaches));
|
|
224
240
|
for (const key in changes) {
|
|
225
241
|
varCaches[key] = changes[key];
|
package/dist/esm/node.js
CHANGED
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
exec,
|
|
3
|
+
isFunction,
|
|
4
|
+
isObject,
|
|
5
|
+
isUndefined,
|
|
6
|
+
isVariant
|
|
7
|
+
} from "@domql/utils";
|
|
2
8
|
import { applyEventsOnNode, triggerEventOn } from "@domql/event";
|
|
3
9
|
import { cacheNode } from "@domql/render";
|
|
4
10
|
import { isMethod } from "./methods/index.js";
|
|
@@ -11,6 +17,7 @@ import {
|
|
|
11
17
|
import { REGISTRY } from "./mixins/index.js";
|
|
12
18
|
import { applyParam } from "./utils/applyParam.js";
|
|
13
19
|
import { propagateEventsFromProps } from "./utils/propEvents.js";
|
|
20
|
+
import { isNotProduction } from "@domql/utils/env.js";
|
|
14
21
|
const ENV = "development";
|
|
15
22
|
const createNode = async (element, options) => {
|
|
16
23
|
let { node, tag, __ref: ref } = element;
|
|
@@ -23,7 +30,7 @@ const createNode = async (element, options) => {
|
|
|
23
30
|
} else node = element.node = cacheNode(element);
|
|
24
31
|
await triggerEventOn("attachNode", element, options);
|
|
25
32
|
}
|
|
26
|
-
if (ENV
|
|
33
|
+
if (isNotProduction(ENV) || options.alowRefReference) {
|
|
27
34
|
node.ref = element;
|
|
28
35
|
if (isFunction(node.setAttribute)) node.setAttribute("key", element.key);
|
|
29
36
|
}
|
|
@@ -39,7 +46,8 @@ const createNode = async (element, options) => {
|
|
|
39
46
|
for (const param in element) {
|
|
40
47
|
const value = element[param];
|
|
41
48
|
if (!Object.hasOwnProperty.call(element, param)) continue;
|
|
42
|
-
if (isUndefined(value) || isMethod(param, element) || isVariant(param) || isObject(REGISTRY[param]))
|
|
49
|
+
if (isUndefined(value) || isMethod(param, element) || isVariant(param) || isObject(REGISTRY[param]))
|
|
50
|
+
continue;
|
|
43
51
|
const isElement = await applyParam(param, element, options);
|
|
44
52
|
if (isElement) {
|
|
45
53
|
const { hasDefine, hasContextDefine } = isElement;
|
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
isArray,
|
|
3
|
+
isFunction,
|
|
4
|
+
isObject,
|
|
5
|
+
isString,
|
|
6
|
+
deepClone,
|
|
7
|
+
isNotProduction
|
|
8
|
+
} from "@domql/utils";
|
|
2
9
|
const ENV = "development";
|
|
3
10
|
const generateHash = () => Math.random().toString(36).substring(2);
|
|
4
11
|
const extendStackRegistry = {};
|
|
@@ -73,7 +80,7 @@ const fallbackStringExtend = (extend, context, options = {}, variant) => {
|
|
|
73
80
|
if (componentExists) return componentExists;
|
|
74
81
|
else if (pageExists) return pageExists;
|
|
75
82
|
else {
|
|
76
|
-
if (options.verbose && (ENV
|
|
83
|
+
if (options.verbose && isNotProduction(ENV)) {
|
|
77
84
|
console.warn("Extend is string but component was not found:", extend);
|
|
78
85
|
}
|
|
79
86
|
return {};
|
package/extend.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict'
|
|
2
2
|
|
|
3
|
-
import { isFunction, exec } from '@domql/utils'
|
|
3
|
+
import { isFunction, exec, isProduction } from '@domql/utils'
|
|
4
4
|
import {
|
|
5
5
|
getExtendStack,
|
|
6
6
|
jointStacks,
|
|
@@ -29,7 +29,7 @@ export const applyExtend = (element, parent, options = {}) => {
|
|
|
29
29
|
|
|
30
30
|
const extendStack = getExtendStack(extend, context)
|
|
31
31
|
|
|
32
|
-
if (ENV
|
|
32
|
+
if (isProduction(ENV)) delete element.extend
|
|
33
33
|
|
|
34
34
|
let childExtendStack = []
|
|
35
35
|
if (parent) {
|
|
@@ -41,11 +41,15 @@ export const applyExtend = (element, parent, options = {}) => {
|
|
|
41
41
|
// if (!options.ignoreChildExtend && !(props && exec(props, element).ignoreChildExtend)) {
|
|
42
42
|
// const ignoreChildExtendRecursive = props && exec(props, element).ignoreChildExtendRecursive
|
|
43
43
|
|
|
44
|
-
const ignoreChildExtendRecursive =
|
|
44
|
+
const ignoreChildExtendRecursive =
|
|
45
|
+
props && props.ignoreChildExtendRecursive
|
|
45
46
|
if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
|
|
46
47
|
const canExtendRecursive = element.key !== '__text'
|
|
47
48
|
if (canExtendRecursive) {
|
|
48
|
-
const childExtendRecursiveStack = getExtendStack(
|
|
49
|
+
const childExtendRecursiveStack = getExtendStack(
|
|
50
|
+
parent.childExtendRecursive,
|
|
51
|
+
context
|
|
52
|
+
)
|
|
49
53
|
// add error if childExtendRecursive contains element which goes to infinite loop
|
|
50
54
|
childExtendStack = childExtendStack.concat(childExtendRecursiveStack)
|
|
51
55
|
element.childExtendRecursive = parent.childExtendRecursive
|
|
@@ -68,7 +72,10 @@ export const applyExtend = (element, parent, options = {}) => {
|
|
|
68
72
|
|
|
69
73
|
if (context.defaultExtends) {
|
|
70
74
|
if (!mainExtend) {
|
|
71
|
-
const defaultOptionsExtend = getExtendStack(
|
|
75
|
+
const defaultOptionsExtend = getExtendStack(
|
|
76
|
+
context.defaultExtends,
|
|
77
|
+
context
|
|
78
|
+
)
|
|
72
79
|
mainExtend = cloneAndMergeArrayExtend(defaultOptionsExtend)
|
|
73
80
|
delete mainExtend.extend
|
|
74
81
|
}
|
|
@@ -81,7 +88,9 @@ export const applyExtend = (element, parent, options = {}) => {
|
|
|
81
88
|
const COMPONENTS = (context && context.components) || options.components
|
|
82
89
|
const component = exec(element.component || mergedExtend.component, element)
|
|
83
90
|
if (component && COMPONENTS && COMPONENTS[component]) {
|
|
84
|
-
const componentExtend = cloneAndMergeArrayExtend(
|
|
91
|
+
const componentExtend = cloneAndMergeArrayExtend(
|
|
92
|
+
getExtendStack(COMPONENTS[component])
|
|
93
|
+
)
|
|
85
94
|
mergedExtend = deepMergeExtend(componentExtend, mergedExtend)
|
|
86
95
|
}
|
|
87
96
|
|
package/methods/index.js
CHANGED
|
@@ -1,7 +1,16 @@
|
|
|
1
1
|
'use strict'
|
|
2
2
|
|
|
3
3
|
import { triggerEventOn } from '@domql/event'
|
|
4
|
-
import {
|
|
4
|
+
import {
|
|
5
|
+
isDefined,
|
|
6
|
+
isObject,
|
|
7
|
+
isFunction,
|
|
8
|
+
isObjectLike,
|
|
9
|
+
isProduction,
|
|
10
|
+
removeValueFromArray,
|
|
11
|
+
deepClone,
|
|
12
|
+
isNotProduction
|
|
13
|
+
} from '@domql/utils'
|
|
5
14
|
import { TREE } from '../tree.js'
|
|
6
15
|
import { parseFilters, REGISTRY } from '../mixins/index.js'
|
|
7
16
|
const ENV = process.env.NODE_ENV
|
|
@@ -12,7 +21,8 @@ export function spotByPath (path) {
|
|
|
12
21
|
const arr = [].concat(path)
|
|
13
22
|
let active = TREE[arr[0]]
|
|
14
23
|
|
|
15
|
-
if (!arr || !arr.length)
|
|
24
|
+
if (!arr || !arr.length)
|
|
25
|
+
return console.log(arr, 'on', element.key, 'is undefined')
|
|
16
26
|
|
|
17
27
|
while (active.key === arr[0]) {
|
|
18
28
|
arr.shift()
|
|
@@ -30,7 +40,8 @@ export function lookup (param) {
|
|
|
30
40
|
let { parent } = el
|
|
31
41
|
|
|
32
42
|
if (isFunction(param)) {
|
|
33
|
-
if (parent.state && param(parent, parent.state, parent.context))
|
|
43
|
+
if (parent.state && param(parent, parent.state, parent.context))
|
|
44
|
+
return parent
|
|
34
45
|
else if (parent.parent) return parent.lookup(param)
|
|
35
46
|
else return
|
|
36
47
|
}
|
|
@@ -111,7 +122,11 @@ export async function remove (opts) {
|
|
|
111
122
|
element.log()
|
|
112
123
|
}
|
|
113
124
|
delete element.parent[element.key]
|
|
114
|
-
if (element.parent.__ref)
|
|
125
|
+
if (element.parent.__ref)
|
|
126
|
+
element.parent.__ref.__children = removeValueFromArray(
|
|
127
|
+
element.parent.__ref.__children,
|
|
128
|
+
element.key
|
|
129
|
+
)
|
|
115
130
|
await triggerEventOn('remove', element, opts)
|
|
116
131
|
}
|
|
117
132
|
|
|
@@ -148,7 +163,12 @@ export function keys () {
|
|
|
148
163
|
const element = this
|
|
149
164
|
const keys = []
|
|
150
165
|
for (const param in element) {
|
|
151
|
-
if (
|
|
166
|
+
if (
|
|
167
|
+
(REGISTRY[param] && !parseFilters.elementKeys.includes(param)) ||
|
|
168
|
+
!Object.hasOwnProperty.call(element, param)
|
|
169
|
+
) {
|
|
170
|
+
continue
|
|
171
|
+
}
|
|
152
172
|
keys.push(param)
|
|
153
173
|
}
|
|
154
174
|
return keys
|
|
@@ -164,14 +184,17 @@ export function parse (excl = []) {
|
|
|
164
184
|
if (v === 'state') {
|
|
165
185
|
if (element.__ref && !element.__ref.__hasRootState) return
|
|
166
186
|
const parsedVal = isFunction(val && val.parse) ? val.parse() : val
|
|
167
|
-
obj[v] = isFunction(parsedVal)
|
|
187
|
+
obj[v] = isFunction(parsedVal)
|
|
188
|
+
? parsedVal
|
|
189
|
+
: JSON.parse(JSON.stringify(parsedVal || {}))
|
|
168
190
|
} else if (v === 'scope') {
|
|
169
191
|
if (element.__ref && !element.__ref.__hasRootScope) return
|
|
170
192
|
obj[v] = JSON.parse(JSON.stringify(val || {}))
|
|
171
193
|
} else if (v === 'props') {
|
|
172
194
|
const { __element, update, ...props } = element[v]
|
|
173
195
|
obj[v] = props
|
|
174
|
-
} else if (isDefined(val) && Object.hasOwnProperty.call(element, v))
|
|
196
|
+
} else if (isDefined(val) && Object.hasOwnProperty.call(element, v))
|
|
197
|
+
obj[v] = val
|
|
175
198
|
})
|
|
176
199
|
return obj
|
|
177
200
|
}
|
|
@@ -181,13 +204,15 @@ export function parseDeep (excl = []) {
|
|
|
181
204
|
const obj = parse.call(element, excl)
|
|
182
205
|
for (const v in obj) {
|
|
183
206
|
if (excl.includes(v)) return
|
|
184
|
-
if (isObjectLike(obj[v])) {
|
|
207
|
+
if (isObjectLike(obj[v])) {
|
|
208
|
+
obj[v] = parseDeep.call(obj[v], excl)
|
|
209
|
+
}
|
|
185
210
|
}
|
|
186
211
|
return obj
|
|
187
212
|
}
|
|
188
213
|
|
|
189
214
|
export function verbose (element, ...args) {
|
|
190
|
-
if (ENV
|
|
215
|
+
if (isProduction(ENV)) return
|
|
191
216
|
|
|
192
217
|
const parent = this
|
|
193
218
|
const { __ref: ref } = parent
|
|
@@ -205,19 +230,19 @@ export function verbose (element, ...args) {
|
|
|
205
230
|
}
|
|
206
231
|
|
|
207
232
|
export function log (...params) {
|
|
208
|
-
if (ENV
|
|
233
|
+
if (isNotProduction(ENV)) {
|
|
209
234
|
console.log(...params)
|
|
210
235
|
}
|
|
211
236
|
}
|
|
212
237
|
|
|
213
238
|
export function warn (...params) {
|
|
214
|
-
if (ENV
|
|
239
|
+
if (isNotProduction(ENV)) {
|
|
215
240
|
console.warn(...params)
|
|
216
241
|
}
|
|
217
242
|
}
|
|
218
243
|
|
|
219
244
|
export function error (...params) {
|
|
220
|
-
if (ENV
|
|
245
|
+
if (isNotProduction(ENV)) {
|
|
221
246
|
if (params[params.length - 1]?.debugger) debugger // eslint-disable-line
|
|
222
247
|
if (params[params.length - 1]?.verbose) verbose.call(this, ...params)
|
|
223
248
|
console.error(...params, this)
|
|
@@ -260,8 +285,8 @@ export function variables (obj = {}) {
|
|
|
260
285
|
}
|
|
261
286
|
}
|
|
262
287
|
return {
|
|
263
|
-
changed:
|
|
264
|
-
if (!changed) return
|
|
288
|
+
changed: cb => {
|
|
289
|
+
if (!changed || !varCaches) return
|
|
265
290
|
const returns = cb(changes, deepClone(varCaches))
|
|
266
291
|
for (const key in changes) {
|
|
267
292
|
varCaches[key] = changes[key]
|
|
@@ -280,7 +305,12 @@ export function variables (obj = {}) {
|
|
|
280
305
|
|
|
281
306
|
export function call (fnKey, ...args) {
|
|
282
307
|
const context = this.context
|
|
283
|
-
return (
|
|
308
|
+
return (
|
|
309
|
+
context.utils[fnKey] ||
|
|
310
|
+
context.functions[fnKey] ||
|
|
311
|
+
context.methods[fnKey] ||
|
|
312
|
+
context.snippets[fnKey]
|
|
313
|
+
)?.call(this, ...args)
|
|
284
314
|
}
|
|
285
315
|
|
|
286
316
|
export const METHODS = [
|
package/node.js
CHANGED
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
'use strict'
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import {
|
|
4
|
+
exec,
|
|
5
|
+
isFunction,
|
|
6
|
+
isObject,
|
|
7
|
+
isUndefined,
|
|
8
|
+
isVariant
|
|
9
|
+
} from '@domql/utils'
|
|
4
10
|
import { applyEventsOnNode, triggerEventOn } from '@domql/event'
|
|
5
11
|
import { cacheNode } from '@domql/render'
|
|
6
12
|
import { isMethod } from './methods/index.js'
|
|
@@ -14,6 +20,7 @@ import {
|
|
|
14
20
|
import { REGISTRY } from './mixins/index.js'
|
|
15
21
|
import { applyParam } from './utils/applyParam.js'
|
|
16
22
|
import { propagateEventsFromProps } from './utils/propEvents.js'
|
|
23
|
+
import { isNotProduction } from '@domql/utils/env.js'
|
|
17
24
|
// import { defineSetter } from './methods'
|
|
18
25
|
|
|
19
26
|
const ENV = process.env.NODE_ENV
|
|
@@ -38,7 +45,7 @@ export const createNode = async (element, options) => {
|
|
|
38
45
|
}
|
|
39
46
|
// node.dataset // .key = element.key
|
|
40
47
|
|
|
41
|
-
if (ENV
|
|
48
|
+
if (isNotProduction(ENV) || options.alowRefReference) {
|
|
42
49
|
node.ref = element
|
|
43
50
|
if (isFunction(node.setAttribute)) node.setAttribute('key', element.key)
|
|
44
51
|
}
|
|
@@ -70,7 +77,8 @@ export const createNode = async (element, options) => {
|
|
|
70
77
|
isMethod(param, element) ||
|
|
71
78
|
isVariant(param) ||
|
|
72
79
|
isObject(REGISTRY[param])
|
|
73
|
-
)
|
|
80
|
+
)
|
|
81
|
+
continue
|
|
74
82
|
|
|
75
83
|
const isElement = await applyParam(param, element, options)
|
|
76
84
|
if (isElement) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@domql/element",
|
|
3
|
-
"version": "2.27.
|
|
3
|
+
"version": "2.27.11",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"module": "index.js",
|
|
@@ -21,18 +21,18 @@
|
|
|
21
21
|
],
|
|
22
22
|
"scripts": {
|
|
23
23
|
"copy:package:cjs": "cp ../../build/package-cjs.json dist/cjs/package.json",
|
|
24
|
-
"build:esm": "npx esbuild *.js **/*.js --target=es2019 --format=esm --outdir=dist/esm",
|
|
25
|
-
"build:cjs": "npx esbuild *.js **/*.js --target=node16 --format=cjs --outdir=dist/cjs",
|
|
24
|
+
"build:esm": "cross-env NODE_ENV=$NODE_ENV npx esbuild *.js **/*.js --target=es2019 --format=esm --outdir=dist/esm",
|
|
25
|
+
"build:cjs": "cross-env NODE_ENV=$NODE_ENV npx esbuild *.js **/*.js --target=node16 --format=cjs --outdir=dist/cjs",
|
|
26
26
|
"build": "npx rimraf -I dist; npm run build:cjs; npm run build:esm",
|
|
27
27
|
"prepublish": "npx rimraf -I dist && npm run build && npm run copy:package:cjs"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@domql/event": "^2.27.
|
|
31
|
-
"@domql/render": "^2.27.
|
|
32
|
-
"@domql/state": "^2.27.
|
|
33
|
-
"@domql/utils": "^2.27.
|
|
30
|
+
"@domql/event": "^2.27.11",
|
|
31
|
+
"@domql/render": "^2.27.11",
|
|
32
|
+
"@domql/state": "^2.27.11",
|
|
33
|
+
"@domql/utils": "^2.27.11"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "0189e4620f901c763754d06de65bcf6075c05618",
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@babel/core": "^7.26.0"
|
|
38
38
|
}
|
package/utils/extendUtils.js
CHANGED
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
'use strict'
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import {
|
|
4
|
+
isArray,
|
|
5
|
+
isFunction,
|
|
6
|
+
isObject,
|
|
7
|
+
isString,
|
|
8
|
+
deepClone,
|
|
9
|
+
isNotProduction
|
|
10
|
+
} from '@domql/utils'
|
|
4
11
|
const ENV = process.env.NODE_ENV
|
|
5
12
|
|
|
6
13
|
export const generateHash = () => Math.random().toString(36).substring(2)
|
|
@@ -15,13 +22,17 @@ export const getHashedExtend = extend => {
|
|
|
15
22
|
|
|
16
23
|
export const setHashedExtend = (extend, stack) => {
|
|
17
24
|
const hash = generateHash()
|
|
18
|
-
if (!isString(extend)) {
|
|
25
|
+
if (!isString(extend)) {
|
|
26
|
+
extend.__hash = hash
|
|
27
|
+
}
|
|
19
28
|
extendStackRegistry[hash] = stack
|
|
20
29
|
return stack
|
|
21
30
|
}
|
|
22
31
|
|
|
23
32
|
export const getExtendStackRegistry = (extend, stack) => {
|
|
24
|
-
if (extend.__hash) {
|
|
33
|
+
if (extend.__hash) {
|
|
34
|
+
return stack.concat(getHashedExtend(extend))
|
|
35
|
+
}
|
|
25
36
|
return setHashedExtend(extend, stack) // stack .concat(hashedExtend)
|
|
26
37
|
}
|
|
27
38
|
|
|
@@ -75,20 +86,25 @@ export const cloneAndMergeArrayExtend = stack => {
|
|
|
75
86
|
}, {})
|
|
76
87
|
}
|
|
77
88
|
|
|
78
|
-
export const fallbackStringExtend = (
|
|
89
|
+
export const fallbackStringExtend = (
|
|
90
|
+
extend,
|
|
91
|
+
context,
|
|
92
|
+
options = {},
|
|
93
|
+
variant
|
|
94
|
+
) => {
|
|
79
95
|
const COMPONENTS = (context && context.components) || options.components
|
|
80
96
|
const PAGES = (context && context.pages) || options.pages
|
|
81
97
|
if (isString(extend)) {
|
|
82
|
-
const componentExists =
|
|
83
|
-
COMPONENTS
|
|
84
|
-
COMPONENTS[extend] ||
|
|
85
|
-
|
|
86
|
-
|
|
98
|
+
const componentExists =
|
|
99
|
+
COMPONENTS &&
|
|
100
|
+
(COMPONENTS[extend + '.' + variant] ||
|
|
101
|
+
COMPONENTS[extend] ||
|
|
102
|
+
COMPONENTS['smbls.' + extend])
|
|
87
103
|
const pageExists = PAGES && extend.startsWith('/') && PAGES[extend]
|
|
88
104
|
if (componentExists) return componentExists
|
|
89
105
|
else if (pageExists) return pageExists
|
|
90
106
|
else {
|
|
91
|
-
if (options.verbose && (ENV
|
|
107
|
+
if (options.verbose && isNotProduction(ENV)) {
|
|
92
108
|
console.warn('Extend is string but component was not found:', extend)
|
|
93
109
|
}
|
|
94
110
|
return {}
|