@domql/element 2.5.187 → 2.5.190

package/create.js

@@ -22,7 +22,7 @@ import {
   addChildrenIfNotInOriginal
 } from '@domql/utils'
 
-import { triggerEventOn } from '@domql/event'
+import { applyAnimationFrame, triggerEventOn } from '@domql/event'
 import { assignNode } from '@domql/render'
 import { createState } from '@domql/state'
 
@@ -222,14 +222,20 @@ const renderElement = async (element, parent, options, attachOptions) => {
 
   const { __ref: ref, key } = element
 
-  // CREATE a real NODE
-  try {
+  const createNestedChild = async () => {
     const isInfiniteLoopDetected = detectInfiniteLoop(ref.path)
     if (ref.__uniqId || isInfiniteLoopDetected) return
     await createNode(element, options)
     ref.__uniqId = Math.random()
-  } catch (e) {
-    if (ENV === 'test' || ENV === 'development') {
+  }
+
+  // CREATE a real NODE
+  if (ENV === 'test' || ENV === 'development') {
+    await createNestedChild()
+  } else {
+    try {
+      await createNestedChild()
+    } catch (e) {
       const path = ref.path
       if (path.includes('ComponentsGrid')) path.splice(0, path.indexOf('ComponentsGrid') + 2)
       if (path.includes('demoComponent')) path.splice(0, path.indexOf('demoComponent') + 1)
@@ -250,6 +256,9 @@ const renderElement = async (element, parent, options, attachOptions) => {
   // assign NODE
   assignNode(element, parent, key, attachOptions)
 
+  // apply events
+  applyAnimationFrame(element, options)
+
   // run `on.renderRouter`
   await triggerEventOn('renderRouter', element, options)
 

package/dist/cjs/create.js

@@ -178,14 +178,19 @@ const renderElement = async (element, parent, options, attachOptions) => {
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
-  try {
+  const createNestedChild = async () => {
     const isInfiniteLoopDetected = (0, import_utils.detectInfiniteLoop)(ref.path);
     if (ref.__uniqId || isInfiniteLoopDetected)
       return;
     await (0, import_node.default)(element, options);
     ref.__uniqId = Math.random();
-  } catch (e) {
-    if (ENV === "test" || ENV === "development") {
+  };
+  if (ENV === "test" || ENV === "development") {
+    await createNestedChild();
+  } else {
+    try {
+      await createNestedChild();
+    } catch (e) {
       const path = ref.path;
       if (path.includes("ComponentsGrid"))
         path.splice(0, path.indexOf("ComponentsGrid") + 2);
@@ -206,6 +211,7 @@ const renderElement = async (element, parent, options, attachOptions) => {
     return element;
   }
   (0, import_render.assignNode)(element, parent, key, attachOptions);
+  (0, import_event.applyAnimationFrame)(element, options);
   await (0, import_event.triggerEventOn)("renderRouter", element, options);
   await (0, import_event.triggerEventOn)("render", element, options);
   await (0, import_event.triggerEventOn)("done", element, options);

package/dist/cjs/mixins/registry.js

@@ -48,7 +48,7 @@ const REGISTRY = {
   style: import_style.default,
   text: import_text.default,
   html: import_html.default,
-  setContent: import_content.default,
+  content: import_content.default,
   data: import_data.default,
   class: import_classList.classList,
   state: import_state.default,

package/dist/cjs/node.js

@@ -65,7 +65,6 @@ const createNode = async (element, options) => {
   (0, import_iterate.throughInitialExec)(element);
   if (element.tag !== "string" && element.tag !== "fragment") {
     (0, import_propEvents.propagateEventsFromProps)(element);
-    (0, import_event.applyAnimationFrame)(element, options);
     if (isNewNode && (0, import_utils.isObject)(element.on)) {
       (0, import_event.applyEventsOnNode)(element, options);
     }

package/dist/cjs/set.js

@@ -73,15 +73,16 @@ const set = function(params, options = {}, el) {
     return;
   }
   if (params) {
-    let { childExtend, childProps, props } = params;
-    if (!childExtend && element.childExtend)
+    let { childExtend, props } = params;
+    if (!props)
+      props = params.props = {};
+    if (!childExtend && element.childExtend) {
       params.childExtend = element.childExtend;
-    if (!childProps && element.childProps)
-      params.childProps = element.childProps;
+      props.ignoreChildExtend = true;
+    }
     if (!(props == null ? void 0 : props.childProps) && ((_a = element.props) == null ? void 0 : _a.childProps)) {
-      if (!props)
-        props = params.props = {};
       props.childProps = element.props.childProps;
+      props.ignoreChildProps = true;
     }
     if (lazyLoad) {
       window.requestAnimationFrame(() => resetElement(params, element, options));

package/dist/esm/create.js

@@ -18,7 +18,7 @@ import {
   detectInfiniteLoop,
   addChildrenIfNotInOriginal
 } from "@domql/utils";
-import { triggerEventOn } from "@domql/event";
+import { applyAnimationFrame, triggerEventOn } from "@domql/event";
 import { assignNode } from "@domql/render";
 import { createState } from "@domql/state";
 import { isMethod } from "./methods/index.js";
@@ -164,14 +164,19 @@ const renderElement = async (element, parent, options, attachOptions) => {
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
-  try {
+  const createNestedChild = async () => {
     const isInfiniteLoopDetected = detectInfiniteLoop(ref.path);
     if (ref.__uniqId || isInfiniteLoopDetected)
       return;
     await createNode(element, options);
     ref.__uniqId = Math.random();
-  } catch (e) {
-    if (ENV === "test" || ENV === "development") {
+  };
+  if (ENV === "test" || ENV === "development") {
+    await createNestedChild();
+  } else {
+    try {
+      await createNestedChild();
+    } catch (e) {
       const path = ref.path;
       if (path.includes("ComponentsGrid"))
         path.splice(0, path.indexOf("ComponentsGrid") + 2);
@@ -192,6 +197,7 @@ const renderElement = async (element, parent, options, attachOptions) => {
     return element;
   }
   assignNode(element, parent, key, attachOptions);
+  applyAnimationFrame(element, options);
   await triggerEventOn("renderRouter", element, options);
   await triggerEventOn("render", element, options);
   await triggerEventOn("done", element, options);

package/dist/esm/mixins/registry.js

@@ -1,6 +1,6 @@
 import attr from "./attr.js";
 import { classList } from "./classList.js";
-import setContent from "./content.js";
+import content from "./content.js";
 import data from "./data.js";
 import html from "./html.js";
 import scope from "./scope.js";
@@ -12,7 +12,7 @@ const REGISTRY = {
   style,
   text,
   html,
-  setContent,
+  content,
   data,
   class: classList,
   state,

package/dist/esm/node.js

@@ -1,5 +1,5 @@
 import { exec, isFunction, isObject, isUndefined, isVariant } from "@domql/utils";
-import { applyEventsOnNode, triggerEventOn, applyAnimationFrame } from "@domql/event";
+import { applyEventsOnNode, triggerEventOn } from "@domql/event";
 import { cacheNode } from "@domql/render";
 import { isMethod } from "./methods/index.js";
 import create from "./create.js";
@@ -35,7 +35,6 @@ const createNode = async (element, options) => {
   throughInitialExec(element);
   if (element.tag !== "string" && element.tag !== "fragment") {
     propagateEventsFromProps(element);
-    applyAnimationFrame(element, options);
     if (isNewNode && isObject(element.on)) {
       applyEventsOnNode(element, options);
     }

package/dist/esm/set.js

@@ -47,15 +47,16 @@ const set = function(params, options = {}, el) {
     return;
   }
   if (params) {
-    let { childExtend, childProps, props } = params;
-    if (!childExtend && element.childExtend)
+    let { childExtend, props } = params;
+    if (!props)
+      props = params.props = {};
+    if (!childExtend && element.childExtend) {
       params.childExtend = element.childExtend;
-    if (!childProps && element.childProps)
-      params.childProps = element.childProps;
+      props.ignoreChildExtend = true;
+    }
     if (!(props == null ? void 0 : props.childProps) && ((_a = element.props) == null ? void 0 : _a.childProps)) {
-      if (!props)
-        props = params.props = {};
       props.childProps = element.props.childProps;
+      props.ignoreChildProps = true;
     }
     if (lazyLoad) {
       window.requestAnimationFrame(() => resetElement(params, element, options));

package/mixins/registry.js

@@ -2,7 +2,7 @@
 
 import attr from './attr.js'
 import { classList } from './classList.js'
-import setContent from './content.js'
+import content from './content.js'
 import data from './data.js'
 import html from './html.js'
 import scope from './scope.js'
@@ -15,7 +15,7 @@ export const REGISTRY = {
   style,
   text,
   html,
-  setContent,
+  content,
   data,
   class: classList,
   state,

package/node.js

@@ -1,7 +1,7 @@
 'use strict'
 
 import { exec, isFunction, isObject, isUndefined, isVariant } from '@domql/utils'
-import { applyEventsOnNode, triggerEventOn, applyAnimationFrame } from '@domql/event'
+import { applyEventsOnNode, triggerEventOn } from '@domql/event'
 import { cacheNode } from '@domql/render'
 import { isMethod } from './methods/index.js'
 
@@ -37,7 +37,6 @@ export const createNode = async (element, options) => {
     // trigger `on.attachNode`
     triggerEventOn('attachNode', element, options)
   }
-
   // node.dataset // .key = element.key
 
   if (ENV === 'test' || ENV === 'development' || options.alowRefReference) {
@@ -57,9 +56,6 @@ export const createNode = async (element, options) => {
   if (element.tag !== 'string' && element.tag !== 'fragment') {
     propagateEventsFromProps(element)
 
-    // apply events
-    applyAnimationFrame(element, options)
-
     if (isNewNode && isObject(element.on)) {
       applyEventsOnNode(element, options)
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "2.5.187",
+  "version": "2.5.190",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -27,12 +27,12 @@
     "prepublish": "rimraf -I dist && npm run build && npm run copy:package:cjs"
   },
   "dependencies": {
-    "@domql/event": "^2.5.187",
-    "@domql/render": "^2.5.187",
-    "@domql/state": "^2.5.187",
+    "@domql/event": "^2.5.190",
+    "@domql/render": "^2.5.190",
+    "@domql/state": "^2.5.190",
     "@domql/utils": "^2.5.187"
   },
-  "gitHead": "c150bfbbdd51b19d25c93f10334d54175cea9d1d",
+  "gitHead": "c4e06a81317c6d43c070d9ad93bbaeba24b3bb3b",
   "devDependencies": {
     "@babel/core": "^7.12.0"
   }

package/set.js

@@ -51,12 +51,15 @@ export const set = function (params, options = {}, el) {
   }
 
   if (params) {
-    let { childExtend, childProps, props } = params
-    if (!childExtend && element.childExtend) params.childExtend = element.childExtend
-    if (!childProps && element.childProps) params.childProps = element.childProps
+    let { childExtend, props } = params
+    if (!props) props = params.props = {}
+    if (!childExtend && element.childExtend) {
+      params.childExtend = element.childExtend
+      props.ignoreChildExtend = true
+    }
     if (!props?.childProps && element.props?.childProps) {
-      if (!props) props = params.props = {}
       props.childProps = element.props.childProps
+      props.ignoreChildProps = true
     }
 
     if (lazyLoad) {