@domql/element 3.6.1 → 3.6.3

package/dist/cjs/mixins/registry.js

@@ -53,7 +53,9 @@ const REGISTRY = {
   extends: {},
   children: {},
   content: {},
+  childExtend: {},
   childExtends: {},
+  childExtendRecursive: {},
   childExtendsRecursive: {},
   props: {},
   if: {},

package/dist/cjs/set.js

@@ -105,6 +105,16 @@ const removeContent = function(el, opts = {}) {
 };
 const set = function(params, options = {}, el) {
   const element = el || this;
+  const { __ref: ref } = element;
+  if (ref.__settingContent) return element;
+  ref.__settingContent = true;
+  try {
+    return _setInner(params, options, element);
+  } finally {
+    ref.__settingContent = false;
+  }
+};
+const _setInner = function(params, options, element) {
   const { __ref: ref } = element;
   const contentElementKey = setContentKey(element, options);
   const content = element[contentElementKey];
@@ -134,14 +144,16 @@ const set = function(params, options = {}, el) {
   let { childExtends, props, tag } = params;
   if (!props) props = params.props = {};
   if (tag === "fragment") {
-    if (!childExtends && element.childExtends) {
-      params.childExtends = element.childExtends;
+    const elementChildExtends = element.childExtends || element.childExtend;
+    if (!childExtends && elementChildExtends) {
+      params.childExtends = elementChildExtends;
       props.ignoreChildExtends = true;
     }
-    if (!props?.childProps && element.props?.childProps) {
-      props.childProps = element.props.childProps;
-      props.ignoreChildProps = true;
+    const elementChildProps = element.childProps || element.props?.childProps;
+    if (!props?.childProps && elementChildProps) {
+      props.childProps = elementChildProps;
     }
+    props.ignoreChildProps = true;
   }
   if (lazyLoad) {
     window.requestAnimationFrame(() => {

package/dist/esm/mixins/registry.js

@@ -19,7 +19,9 @@ const REGISTRY = {
   extends: {},
   children: {},
   content: {},
+  childExtend: {},
   childExtends: {},
+  childExtendRecursive: {},
   childExtendsRecursive: {},
   props: {},
   if: {},

package/dist/esm/set.js

@@ -75,6 +75,16 @@ const removeContent = function(el, opts = {}) {
 };
 const set = function(params, options = {}, el) {
   const element = el || this;
+  const { __ref: ref } = element;
+  if (ref.__settingContent) return element;
+  ref.__settingContent = true;
+  try {
+    return _setInner(params, options, element);
+  } finally {
+    ref.__settingContent = false;
+  }
+};
+const _setInner = function(params, options, element) {
   const { __ref: ref } = element;
   const contentElementKey = setContentKey(element, options);
   const content = element[contentElementKey];
@@ -104,14 +114,16 @@ const set = function(params, options = {}, el) {
   let { childExtends, props, tag } = params;
   if (!props) props = params.props = {};
   if (tag === "fragment") {
-    if (!childExtends && element.childExtends) {
-      params.childExtends = element.childExtends;
+    const elementChildExtends = element.childExtends || element.childExtend;
+    if (!childExtends && elementChildExtends) {
+      params.childExtends = elementChildExtends;
       props.ignoreChildExtends = true;
     }
-    if (!props?.childProps && element.props?.childProps) {
-      props.childProps = element.props.childProps;
-      props.ignoreChildProps = true;
+    const elementChildProps = element.childProps || element.props?.childProps;
+    if (!props?.childProps && elementChildProps) {
+      props.childProps = elementChildProps;
     }
+    props.ignoreChildProps = true;
   }
   if (lazyLoad) {
     window.requestAnimationFrame(() => {

package/dist/iife/index.js

@@ -1180,6 +1180,7 @@ var DomqlElement = (() => {
   // ../utils/dist/esm/props.js
   var RE_UPPER = /^[A-Z]/;
   var RE_DIGITS = /^\d+$/;
+  var CSS_SELECTOR_PREFIXES = /* @__PURE__ */ new Set([":", "@", "[", "*", "+", "~", "&", ">", "$", "-", ".", "!"]);
   var ELEMENT_INDICATOR_KEYS = /* @__PURE__ */ new Set([
     "extend",
     "props",
@@ -1226,11 +1227,27 @@ var DomqlElement = (() => {
         delete obj[key];
         continue;
       }
-      const hasDefine = isObject(this.define?.[key]);
-      const hasGlobalDefine = isObject(this.context?.define?.[key]);
+      if (key === "childProps") {
+        obj.props[key] = value;
+        delete obj[key];
+        cachedKeys.push(key);
+        continue;
+      }
+      const defineValue = this.define?.[key];
+      const globalDefineValue = this.context?.define?.[key];
+      const hasDefine = isObject(defineValue) || isFunction(defineValue);
+      const hasGlobalDefine = isObject(globalDefineValue) || isFunction(globalDefineValue);
+      if (hasDefine || hasGlobalDefine) continue;
+      const firstChar = key.charAt(0);
+      if (CSS_SELECTOR_PREFIXES.has(firstChar)) {
+        obj.props[key] = value;
+        delete obj[key];
+        cachedKeys.push(key);
+        continue;
+      }
       const isElement = RE_UPPER.test(key) || RE_DIGITS.test(key) || looksLikeElement(value);
       const isBuiltin = DOMQ_PROPERTIES.has(key);
-      if (!isElement && !isBuiltin && !hasDefine && !hasGlobalDefine) {
+      if (!isElement && !isBuiltin) {
         obj.props[key] = value;
         delete obj[key];
         cachedKeys.push(key);
@@ -1250,8 +1267,13 @@ var DomqlElement = (() => {
         continue;
       }
       if (cachedKeys.includes(key)) continue;
-      const hasDefine = isObject(this.define?.[key]);
-      const hasGlobalDefine = isObject(this.context?.define?.[key]);
+      if (key === "childProps") continue;
+      const firstChar = key.charAt(0);
+      if (CSS_SELECTOR_PREFIXES.has(firstChar)) continue;
+      const defineValue = this.define?.[key];
+      const globalDefineValue = this.context?.define?.[key];
+      const hasDefine = isObject(defineValue) || isFunction(defineValue);
+      const hasGlobalDefine = isObject(globalDefineValue) || isFunction(globalDefineValue);
       const isElement = RE_UPPER.test(key) || RE_DIGITS.test(key);
       const isBuiltin = DOMQ_PROPERTIES.has(key);
       if (isElement || isBuiltin || hasDefine || hasGlobalDefine) {
@@ -1286,7 +1308,7 @@ var DomqlElement = (() => {
     const parentProps = parent.props;
     if (!parentProps) return propsStack;
     const matchParentKeyProps = parentProps[element.key];
-    const matchParentChildProps = parentProps.childProps;
+    const matchParentChildProps = parentProps.childProps || parent.childProps;
     const ignoreChildProps = element.props?.ignoreChildProps;
     if (matchParentChildProps && !ignoreChildProps) {
       const childProps = objectizeStringProperty(matchParentChildProps);
@@ -2721,7 +2743,9 @@ ${element}` : "";
     extends: {},
     children: {},
     content: {},
+    childExtend: {},
     childExtends: {},
+    childExtendRecursive: {},
     childExtendsRecursive: {},
     props: {},
     if: {},
@@ -2935,6 +2959,16 @@ ${element}` : "";
   };
   var set = function(params, options = {}, el) {
     const element = el || this;
+    const { __ref: ref } = element;
+    if (ref.__settingContent) return element;
+    ref.__settingContent = true;
+    try {
+      return _setInner(params, options, element);
+    } finally {
+      ref.__settingContent = false;
+    }
+  };
+  var _setInner = function(params, options, element) {
     const { __ref: ref } = element;
     const contentElementKey = setContentKey(element, options);
     const content = element[contentElementKey];
@@ -2964,14 +2998,16 @@ ${element}` : "";
     let { childExtends, props, tag } = params;
     if (!props) props = params.props = {};
     if (tag === "fragment") {
-      if (!childExtends && element.childExtends) {
-        params.childExtends = element.childExtends;
+      const elementChildExtends = element.childExtends || element.childExtend;
+      if (!childExtends && elementChildExtends) {
+        params.childExtends = elementChildExtends;
         props.ignoreChildExtends = true;
       }
-      if (!props?.childProps && element.props?.childProps) {
-        props.childProps = element.props.childProps;
-        props.ignoreChildProps = true;
+      const elementChildProps = element.childProps || element.props?.childProps;
+      if (!props?.childProps && elementChildProps) {
+        props.childProps = elementChildProps;
       }
+      props.ignoreChildProps = true;
     }
     if (lazyLoad) {
       window.requestAnimationFrame(() => {

package/mixins/registry.js

@@ -23,7 +23,9 @@ export const REGISTRY = {
   extends: {},
   children: {},
   content: {},
+  childExtend: {},
   childExtends: {},
+  childExtendRecursive: {},
   childExtendsRecursive: {},
   props: {},
   if: {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "3.6.1",
+  "version": "3.6.3",
   "license": "MIT",
   "type": "module",
   "module": "./dist/esm/index.js",
@@ -46,10 +46,10 @@
     "build:iife": "cross-env NODE_ENV=$NODE_ENV esbuild index.js --bundle --target=es2020 --format=iife --global-name=DomqlElement --outfile=dist/iife/index.js --define:process.env.NODE_ENV=process.env.NODE_ENV"
   },
   "dependencies": {
-    "@domql/report": "^3.6.1",
-    "@domql/state": "^3.6.1",
-    "@domql/utils": "^3.6.1",
-    "attrs-in-props": "^3.6.1"
+    "@domql/report": "^3.6.3",
+    "@domql/state": "^3.6.3",
+    "@domql/utils": "^3.6.3",
+    "attrs-in-props": "^3.6.3"
   },
   "gitHead": "9fc1b79b41cdc725ca6b24aec64920a599634681",
   "devDependencies": {

package/set.js

@@ -98,6 +98,20 @@ export const set = function (params, options = {}, el) {
   const element = el || this
   const { __ref: ref } = element
 
+  // Guard against infinite set loops
+  if (ref.__settingContent) return element
+  ref.__settingContent = true
+
+  try {
+    return _setInner(params, options, element)
+  } finally {
+    ref.__settingContent = false
+  }
+}
+
+const _setInner = function (params, options, element) {
+  const { __ref: ref } = element
+
   const contentElementKey = setContentKey(element, options)
   const content = element[contentElementKey]
   const __contentRef = content && content.__ref
@@ -136,15 +150,20 @@ export const set = function (params, options = {}, el) {
   if (!props) props = params.props = {}
 
   if (tag === 'fragment') {
-    if (!childExtends && element.childExtends) {
-      params.childExtends = element.childExtends
+    const elementChildExtends = element.childExtends || element.childExtend
+    if (!childExtends && elementChildExtends) {
+      params.childExtends = elementChildExtends
       props.ignoreChildExtends = true
     }
 
-    if (!props?.childProps && element.props?.childProps) {
-      props.childProps = element.props.childProps
-      props.ignoreChildProps = true
+    const elementChildProps = element.childProps || element.props?.childProps
+    if (!props?.childProps && elementChildProps) {
+      props.childProps = elementChildProps
     }
+
+    // Prevent the fragment from inheriting parent's childProps via inheritParentProps
+    // (childProps is already forwarded explicitly above for the fragment's children)
+    props.ignoreChildProps = true
   }
 
   if (lazyLoad) {