@domql/utils 3.5.1 → 3.6.3

package/dist/cjs/extends.js

@@ -52,6 +52,7 @@ var import_component = require("./component.js");
 var import_object = require("./object.js");
 var import_types = require("./types.js");
 const ENV = process.env.NODE_ENV;
+const isSourcemapEnabled = (options) => options.sourcemap !== false && ENV !== "production";
 const createExtendsFromKeys = (key) => {
   if (key.includes("+")) {
     return key.split("+").filter(import_component.matchesComponentNaming);
@@ -126,17 +127,17 @@ const getExtendsStackRegistry = (extend, stack) => {
   }
   return setHashedExtend(extend, stack);
 };
-const extractArrayExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+const extractArrayExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, componentNameMap) => {
   for (const each of extend) {
     if ((0, import_types.isArray)(each)) {
-      extractArrayExtend(each, stack, context, processed);
+      extractArrayExtend(each, stack, context, processed, nameStack, componentNameMap);
     } else {
-      flattenExtend(each, stack, context, processed);
+      flattenExtend(each, stack, context, processed, nameStack, void 0, componentNameMap);
     }
   }
   return stack;
 };
-const deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+const deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, currentName, componentNameMap) => {
   const extendOflattenExtend = extend.extends || extend.extend;
   const cleanExtend = { ...extend };
   delete cleanExtend.extends;
@@ -148,26 +149,32 @@ const deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(
   }
   if (hasKeys) {
     stack.push(cleanExtend);
+    if (nameStack) nameStack.push(currentName);
   }
   if (extendOflattenExtend) {
-    flattenExtend(extendOflattenExtend, stack, context, processed);
+    flattenExtend(extendOflattenExtend, stack, context, processed, nameStack, currentName, componentNameMap);
   }
   return stack;
 };
-const flattenExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+const flattenExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, parentName, componentNameMap) => {
   if (!extend) return stack;
   if (processed.has(extend)) return stack;
   if ((0, import_types.isArray)(extend)) {
-    return extractArrayExtend(extend, stack, context, processed);
+    return extractArrayExtend(extend, stack, context, processed, nameStack, componentNameMap);
   }
+  let currentName = parentName;
   if ((0, import_types.isString)(extend)) {
+    currentName = extend;
     extend = mapStringsWithContextComponents(extend, context);
+  } else if (componentNameMap && (0, import_types.isObject)(extend) && componentNameMap.has(extend)) {
+    currentName = componentNameMap.get(extend);
   }
   processed.add(extend);
   if (extend?.extends || extend?.extend) {
-    deepExtend(extend, stack, context, processed);
+    deepExtend(extend, stack, context, processed, nameStack, currentName, componentNameMap);
   } else if (extend) {
     stack.push(extend);
+    if (nameStack) nameStack.push(currentName);
   }
   return stack;
 };
@@ -180,7 +187,7 @@ const MERGE_EXTENDS_SKIP = /* @__PURE__ */ new Set([
   "childExtend",
   "childExtendRecursive"
 ]);
-const deepMergeExtends = (element, extend) => {
+const deepMergeExtends = (element, extend, sourcemap, sourceName, preBuiltSourcemap) => {
   extend = (0, import_object.deepClone)(extend);
   for (const e in extend) {
     if (MERGE_EXTENDS_SKIP.has(e)) continue;
@@ -190,11 +197,23 @@ const deepMergeExtends = (element, extend) => {
     if (Object.prototype.hasOwnProperty.call(extend, e) && e !== "__proto__" && e !== "constructor" && e !== "prototype") {
       if (elementProp === void 0) {
         element[e] = extendProp;
+        if (sourcemap && sourceName) {
+          if ((0, import_types.isObject)(extendProp) && !(0, import_types.isArray)(extendProp)) {
+            sourcemap[e] = sourcemap[e] || {};
+            trackSourcemapDeep(sourcemap[e], extendProp, sourceName);
+          } else {
+            sourcemap[e] = sourceName;
+          }
+        } else if (sourcemap && preBuiltSourcemap?.[e]) {
+          sourcemap[e] = preBuiltSourcemap[e];
+        }
       } else if ((0, import_types.isObject)(elementProp) && (0, import_types.isObject)(extendProp)) {
+        const nestedSourcemap = sourcemap ? sourcemap[e] = sourcemap[e] || {} : void 0;
+        const nestedPreBuilt = preBuiltSourcemap?.[e];
         if ((0, import_component.matchesComponentNaming)(e)) {
-          element[e] = deepMergeExtends(elementProp, extendProp);
+          element[e] = deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt);
         } else {
-          deepMergeExtends(elementProp, extendProp);
+          deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt);
         }
       }
       if (e === "extends" || e === "childExtends" || e === "childExtendsRecursive") {
@@ -209,10 +228,24 @@ const deepMergeExtends = (element, extend) => {
   }
   return element;
 };
-const cloneAndMergeArrayExtend = (stack) => {
-  return stack.reduce((acc, current) => {
+const trackSourcemapDeep = (sourcemap, obj, sourceName) => {
+  for (const key in obj) {
+    if (!Object.prototype.hasOwnProperty.call(obj, key)) continue;
+    if (key === "__proto__" || key === "constructor" || key === "prototype") continue;
+    const val = obj[key];
+    if ((0, import_types.isObject)(val) && !(0, import_types.isArray)(val)) {
+      sourcemap[key] = sourcemap[key] || {};
+      trackSourcemapDeep(sourcemap[key], val, sourceName);
+    } else {
+      sourcemap[key] = sourceName;
+    }
+  }
+};
+const cloneAndMergeArrayExtend = (stack, sourcemap, extendNames) => {
+  return stack.reduce((acc, current, i) => {
     const cloned = (0, import_object.deepClone)(current);
-    return deepMergeExtends(acc, cloned);
+    const sourceName = extendNames ? extendNames[i] : void 0;
+    return deepMergeExtends(acc, cloned, sourcemap, sourceName);
   }, {});
 };
 const mapStringsWithContextComponents = (extend, context, options = {}, variant) => {
@@ -235,11 +268,12 @@ const mapStringsWithContextComponents = (extend, context, options = {}, variant)
 const jointStacks = (extendStack, childExtendsStack) => {
   return [].concat(extendStack.slice(0, 1)).concat(childExtendsStack.slice(0, 1)).concat(extendStack.slice(1)).concat(childExtendsStack.slice(1));
 };
-const getExtendsStack = (extend, context) => {
+const getExtendsStack = (extend, context, nameStack, componentNameMap) => {
   if (!extend) return [];
   if (extend.__hash) return getHashedExtend(extend) || [];
   const processed = /* @__PURE__ */ new Set();
-  const stack = flattenExtend(extend, [], context, processed);
+  const stack = flattenExtend(extend, [], context, processed, nameStack, void 0, componentNameMap);
+  if (nameStack) return stack;
   return getExtendsStackRegistry(extend, stack);
 };
 const addExtend = (newExtends, elementExtends) => {
@@ -346,6 +380,8 @@ const createExtendsStack = (element, parent, options = {}) => {
   const { props, __ref: ref } = element;
   const context = element.context || parent.context;
   const variant = element.variant || props?.variant;
+  const sourcemap = isSourcemapEnabled(options);
+  const originalExtendNames = sourcemap ? [...ref.__extends] : null;
   const __extends = (0, import_array.removeDuplicatesInArray)(
     ref.__extends.map((val, i) => {
       return mapStringsWithContextComponents(
@@ -356,15 +392,40 @@ const createExtendsStack = (element, parent, options = {}) => {
       );
     })
   );
-  const stack = getExtendsStack(__extends, context);
-  ref.__extendsStack = stack;
+  if (sourcemap) {
+    const componentNameMap = /* @__PURE__ */ new WeakMap();
+    for (let i = 0; i < __extends.length; i++) {
+      const resolved = __extends[i];
+      const originalName = originalExtendNames[i];
+      if (resolved && (0, import_types.isObject)(resolved) && (0, import_types.isString)(originalName)) {
+        componentNameMap.set(resolved, originalName);
+      }
+    }
+    const nameStack = [];
+    const stack = getExtendsStack(__extends, context, nameStack, componentNameMap);
+    ref.__extendsStack = stack;
+    ref.__extendsNames = nameStack;
+  } else {
+    const stack = getExtendsStack(__extends, context);
+    ref.__extendsStack = stack;
+  }
   return ref.__extendsStack;
 };
 const finalizeExtends = (element, parent, options = {}) => {
   const { __ref: ref } = element;
   const { __extendsStack } = ref;
-  const flattenExtends = cloneAndMergeArrayExtend(__extendsStack);
-  return deepMergeExtends(element, flattenExtends);
+  if (isSourcemapEnabled(options)) {
+    const sourcemapAcc = {};
+    const extendNames = ref.__extendsNames || [];
+    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack, sourcemapAcc, extendNames);
+    const appliedSourcemap = {};
+    deepMergeExtends(element, flattenExtends, appliedSourcemap, void 0, sourcemapAcc);
+    ref.__sourcemap = appliedSourcemap;
+  } else {
+    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack);
+    deepMergeExtends(element, flattenExtends);
+  }
+  return element;
 };
 const applyExtends = (element, parent, options = {}) => {
   createElementExtends(element, parent, options);

package/dist/cjs/node.js

@@ -31,5 +31,5 @@ const isHtmlElement = (obj) => {
   return (typeof HTMLElement === "object" ? obj instanceof import_globals.window.HTMLElement : obj && typeof obj === "object" && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === "string") || false;
 };
 const isDOMNode = (obj) => {
-  return typeof import_globals.window !== "undefined" && (obj instanceof import_globals.window.Node || obj instanceof import_globals.window.Window || obj === import_globals.window || obj === document);
+  return typeof import_globals.window !== "undefined" && (import_globals.window.Node && obj instanceof import_globals.window.Node || import_globals.window.Window && obj instanceof import_globals.window.Window || obj === import_globals.window || obj === document);
 };

package/dist/cjs/props.js

@@ -43,6 +43,31 @@ var import_types = require("./types.js");
 var import_string = require("./string.js");
 const RE_UPPER = /^[A-Z]/;
 const RE_DIGITS = /^\d+$/;
+const CSS_SELECTOR_PREFIXES = /* @__PURE__ */ new Set([":", "@", "[", "*", "+", "~", "&", ">", "$", "-", ".", "!"]);
+const ELEMENT_INDICATOR_KEYS = /* @__PURE__ */ new Set([
+  "extend",
+  "props",
+  "text",
+  "tag",
+  "on",
+  "if",
+  "childExtend",
+  "children",
+  "childrenAs",
+  "state",
+  "html",
+  "attr",
+  "define",
+  "content"
+]);
+const looksLikeElement = (value) => {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return false;
+  for (const k in value) {
+    if (ELEMENT_INDICATOR_KEYS.has(k)) return true;
+    if (RE_UPPER.test(k)) return true;
+  }
+  return false;
+};
 const createProps = (element, parent, key) => {
   const { props, __ref: ref } = element;
   ref.__propsStack = [];
@@ -65,11 +90,27 @@ function pickupPropsFromElement(obj, opts = {}) {
       delete obj[key];
       continue;
     }
-    const hasDefine = (0, import_types.isObject)(this.define?.[key]);
-    const hasGlobalDefine = (0, import_types.isObject)(this.context?.define?.[key]);
-    const isElement = RE_UPPER.test(key) || RE_DIGITS.test(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 = (0, import_types.isObject)(defineValue) || (0, import_types.isFunction)(defineValue);
+    const hasGlobalDefine = (0, import_types.isObject)(globalDefineValue) || (0, import_types.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 = import_keys.DOMQ_PROPERTIES.has(key);
-    if (!isElement && !isBuiltin && !hasDefine && !hasGlobalDefine) {
+    if (!isElement && !isBuiltin) {
       obj.props[key] = value;
       delete obj[key];
       cachedKeys.push(key);
@@ -89,8 +130,13 @@ function pickupElementFromProps(obj = this, opts) {
       continue;
     }
     if (cachedKeys.includes(key)) continue;
-    const hasDefine = (0, import_types.isObject)(this.define?.[key]);
-    const hasGlobalDefine = (0, import_types.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 = (0, import_types.isObject)(defineValue) || (0, import_types.isFunction)(defineValue);
+    const hasGlobalDefine = (0, import_types.isObject)(globalDefineValue) || (0, import_types.isFunction)(globalDefineValue);
     const isElement = RE_UPPER.test(key) || RE_DIGITS.test(key);
     const isBuiltin = import_keys.DOMQ_PROPERTIES.has(key);
     if (isElement || isBuiltin || hasDefine || hasGlobalDefine) {
@@ -129,7 +175,7 @@ const inheritParentProps = (element, parent) => {
   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);

package/dist/esm/extends.js

@@ -3,6 +3,7 @@ import { matchesComponentNaming } from "./component.js";
 import { deepClone, exec } from "./object.js";
 import { isArray, isObject, isString } from "./types.js";
 const ENV = process.env.NODE_ENV;
+const isSourcemapEnabled = (options) => options.sourcemap !== false && ENV !== "production";
 const createExtendsFromKeys = (key) => {
   if (key.includes("+")) {
     return key.split("+").filter(matchesComponentNaming);
@@ -77,17 +78,17 @@ const getExtendsStackRegistry = (extend, stack) => {
   }
   return setHashedExtend(extend, stack);
 };
-const extractArrayExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+const extractArrayExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, componentNameMap) => {
   for (const each of extend) {
     if (isArray(each)) {
-      extractArrayExtend(each, stack, context, processed);
+      extractArrayExtend(each, stack, context, processed, nameStack, componentNameMap);
     } else {
-      flattenExtend(each, stack, context, processed);
+      flattenExtend(each, stack, context, processed, nameStack, void 0, componentNameMap);
     }
   }
   return stack;
 };
-const deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+const deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, currentName, componentNameMap) => {
   const extendOflattenExtend = extend.extends || extend.extend;
   const cleanExtend = { ...extend };
   delete cleanExtend.extends;
@@ -99,26 +100,32 @@ const deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(
   }
   if (hasKeys) {
     stack.push(cleanExtend);
+    if (nameStack) nameStack.push(currentName);
   }
   if (extendOflattenExtend) {
-    flattenExtend(extendOflattenExtend, stack, context, processed);
+    flattenExtend(extendOflattenExtend, stack, context, processed, nameStack, currentName, componentNameMap);
   }
   return stack;
 };
-const flattenExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+const flattenExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, parentName, componentNameMap) => {
   if (!extend) return stack;
   if (processed.has(extend)) return stack;
   if (isArray(extend)) {
-    return extractArrayExtend(extend, stack, context, processed);
+    return extractArrayExtend(extend, stack, context, processed, nameStack, componentNameMap);
   }
+  let currentName = parentName;
   if (isString(extend)) {
+    currentName = extend;
     extend = mapStringsWithContextComponents(extend, context);
+  } else if (componentNameMap && isObject(extend) && componentNameMap.has(extend)) {
+    currentName = componentNameMap.get(extend);
   }
   processed.add(extend);
   if (extend?.extends || extend?.extend) {
-    deepExtend(extend, stack, context, processed);
+    deepExtend(extend, stack, context, processed, nameStack, currentName, componentNameMap);
   } else if (extend) {
     stack.push(extend);
+    if (nameStack) nameStack.push(currentName);
   }
   return stack;
 };
@@ -131,7 +138,7 @@ const MERGE_EXTENDS_SKIP = /* @__PURE__ */ new Set([
   "childExtend",
   "childExtendRecursive"
 ]);
-const deepMergeExtends = (element, extend) => {
+const deepMergeExtends = (element, extend, sourcemap, sourceName, preBuiltSourcemap) => {
   extend = deepClone(extend);
   for (const e in extend) {
     if (MERGE_EXTENDS_SKIP.has(e)) continue;
@@ -141,11 +148,23 @@ const deepMergeExtends = (element, extend) => {
     if (Object.prototype.hasOwnProperty.call(extend, e) && e !== "__proto__" && e !== "constructor" && e !== "prototype") {
       if (elementProp === void 0) {
         element[e] = extendProp;
+        if (sourcemap && sourceName) {
+          if (isObject(extendProp) && !isArray(extendProp)) {
+            sourcemap[e] = sourcemap[e] || {};
+            trackSourcemapDeep(sourcemap[e], extendProp, sourceName);
+          } else {
+            sourcemap[e] = sourceName;
+          }
+        } else if (sourcemap && preBuiltSourcemap?.[e]) {
+          sourcemap[e] = preBuiltSourcemap[e];
+        }
       } else if (isObject(elementProp) && isObject(extendProp)) {
+        const nestedSourcemap = sourcemap ? sourcemap[e] = sourcemap[e] || {} : void 0;
+        const nestedPreBuilt = preBuiltSourcemap?.[e];
         if (matchesComponentNaming(e)) {
-          element[e] = deepMergeExtends(elementProp, extendProp);
+          element[e] = deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt);
         } else {
-          deepMergeExtends(elementProp, extendProp);
+          deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt);
         }
       }
       if (e === "extends" || e === "childExtends" || e === "childExtendsRecursive") {
@@ -160,10 +179,24 @@ const deepMergeExtends = (element, extend) => {
   }
   return element;
 };
-const cloneAndMergeArrayExtend = (stack) => {
-  return stack.reduce((acc, current) => {
+const trackSourcemapDeep = (sourcemap, obj, sourceName) => {
+  for (const key in obj) {
+    if (!Object.prototype.hasOwnProperty.call(obj, key)) continue;
+    if (key === "__proto__" || key === "constructor" || key === "prototype") continue;
+    const val = obj[key];
+    if (isObject(val) && !isArray(val)) {
+      sourcemap[key] = sourcemap[key] || {};
+      trackSourcemapDeep(sourcemap[key], val, sourceName);
+    } else {
+      sourcemap[key] = sourceName;
+    }
+  }
+};
+const cloneAndMergeArrayExtend = (stack, sourcemap, extendNames) => {
+  return stack.reduce((acc, current, i) => {
     const cloned = deepClone(current);
-    return deepMergeExtends(acc, cloned);
+    const sourceName = extendNames ? extendNames[i] : void 0;
+    return deepMergeExtends(acc, cloned, sourcemap, sourceName);
   }, {});
 };
 const mapStringsWithContextComponents = (extend, context, options = {}, variant) => {
@@ -186,11 +219,12 @@ const mapStringsWithContextComponents = (extend, context, options = {}, variant)
 const jointStacks = (extendStack, childExtendsStack) => {
   return [].concat(extendStack.slice(0, 1)).concat(childExtendsStack.slice(0, 1)).concat(extendStack.slice(1)).concat(childExtendsStack.slice(1));
 };
-const getExtendsStack = (extend, context) => {
+const getExtendsStack = (extend, context, nameStack, componentNameMap) => {
   if (!extend) return [];
   if (extend.__hash) return getHashedExtend(extend) || [];
   const processed = /* @__PURE__ */ new Set();
-  const stack = flattenExtend(extend, [], context, processed);
+  const stack = flattenExtend(extend, [], context, processed, nameStack, void 0, componentNameMap);
+  if (nameStack) return stack;
   return getExtendsStackRegistry(extend, stack);
 };
 const addExtend = (newExtends, elementExtends) => {
@@ -297,6 +331,8 @@ const createExtendsStack = (element, parent, options = {}) => {
   const { props, __ref: ref } = element;
   const context = element.context || parent.context;
   const variant = element.variant || props?.variant;
+  const sourcemap = isSourcemapEnabled(options);
+  const originalExtendNames = sourcemap ? [...ref.__extends] : null;
   const __extends = removeDuplicatesInArray(
     ref.__extends.map((val, i) => {
       return mapStringsWithContextComponents(
@@ -307,15 +343,40 @@ const createExtendsStack = (element, parent, options = {}) => {
       );
     })
   );
-  const stack = getExtendsStack(__extends, context);
-  ref.__extendsStack = stack;
+  if (sourcemap) {
+    const componentNameMap = /* @__PURE__ */ new WeakMap();
+    for (let i = 0; i < __extends.length; i++) {
+      const resolved = __extends[i];
+      const originalName = originalExtendNames[i];
+      if (resolved && isObject(resolved) && isString(originalName)) {
+        componentNameMap.set(resolved, originalName);
+      }
+    }
+    const nameStack = [];
+    const stack = getExtendsStack(__extends, context, nameStack, componentNameMap);
+    ref.__extendsStack = stack;
+    ref.__extendsNames = nameStack;
+  } else {
+    const stack = getExtendsStack(__extends, context);
+    ref.__extendsStack = stack;
+  }
   return ref.__extendsStack;
 };
 const finalizeExtends = (element, parent, options = {}) => {
   const { __ref: ref } = element;
   const { __extendsStack } = ref;
-  const flattenExtends = cloneAndMergeArrayExtend(__extendsStack);
-  return deepMergeExtends(element, flattenExtends);
+  if (isSourcemapEnabled(options)) {
+    const sourcemapAcc = {};
+    const extendNames = ref.__extendsNames || [];
+    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack, sourcemapAcc, extendNames);
+    const appliedSourcemap = {};
+    deepMergeExtends(element, flattenExtends, appliedSourcemap, void 0, sourcemapAcc);
+    ref.__sourcemap = appliedSourcemap;
+  } else {
+    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack);
+    deepMergeExtends(element, flattenExtends);
+  }
+  return element;
 };
 const applyExtends = (element, parent, options = {}) => {
   createElementExtends(element, parent, options);

package/dist/esm/node.js

@@ -6,7 +6,7 @@ const isHtmlElement = (obj) => {
   return (typeof HTMLElement === "object" ? obj instanceof window.HTMLElement : obj && typeof obj === "object" && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === "string") || false;
 };
 const isDOMNode = (obj) => {
-  return typeof window !== "undefined" && (obj instanceof window.Node || obj instanceof window.Window || obj === window || obj === document);
+  return typeof window !== "undefined" && (window.Node && obj instanceof window.Node || window.Window && obj instanceof window.Window || obj === window || obj === document);
 };
 export {
   isDOMNode,

package/dist/esm/props.js

@@ -5,6 +5,31 @@ import { is, isArray, isFunction, isObject, isObjectLike } from "./types.js";
 import { lowercaseFirstLetter } from "./string.js";
 const RE_UPPER = /^[A-Z]/;
 const RE_DIGITS = /^\d+$/;
+const CSS_SELECTOR_PREFIXES = /* @__PURE__ */ new Set([":", "@", "[", "*", "+", "~", "&", ">", "$", "-", ".", "!"]);
+const ELEMENT_INDICATOR_KEYS = /* @__PURE__ */ new Set([
+  "extend",
+  "props",
+  "text",
+  "tag",
+  "on",
+  "if",
+  "childExtend",
+  "children",
+  "childrenAs",
+  "state",
+  "html",
+  "attr",
+  "define",
+  "content"
+]);
+const looksLikeElement = (value) => {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return false;
+  for (const k in value) {
+    if (ELEMENT_INDICATOR_KEYS.has(k)) return true;
+    if (RE_UPPER.test(k)) return true;
+  }
+  return false;
+};
 const createProps = (element, parent, key) => {
   const { props, __ref: ref } = element;
   ref.__propsStack = [];
@@ -27,11 +52,27 @@ function pickupPropsFromElement(obj, opts = {}) {
       delete obj[key];
       continue;
     }
-    const hasDefine = isObject(this.define?.[key]);
-    const hasGlobalDefine = isObject(this.context?.define?.[key]);
-    const isElement = RE_UPPER.test(key) || RE_DIGITS.test(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);
@@ -51,8 +92,13 @@ function pickupElementFromProps(obj = this, opts) {
       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) {
@@ -91,7 +137,7 @@ const inheritParentProps = (element, parent) => {
   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);

package/dist/iife/index.js

@@ -257,7 +257,7 @@ var DomqlUtils = (() => {
     return (typeof HTMLElement === "object" ? obj instanceof window2.HTMLElement : obj && typeof obj === "object" && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === "string") || false;
   };
   var isDOMNode = (obj) => {
-    return typeof window2 !== "undefined" && (obj instanceof window2.Node || obj instanceof window2.Window || obj === window2 || obj === document);
+    return typeof window2 !== "undefined" && (window2.Node && obj instanceof window2.Node || window2.Window && obj instanceof window2.Window || obj === window2 || obj === document);
   };
 
   // types.js
@@ -1586,6 +1586,7 @@ var DomqlUtils = (() => {
 
   // extends.js
   var ENV3 = process.env.NODE_ENV;
+  var isSourcemapEnabled = (options) => options.sourcemap !== false && ENV3 !== "production";
   var createExtendsFromKeys = (key) => {
     if (key.includes("+")) {
       return key.split("+").filter(matchesComponentNaming);
@@ -1660,17 +1661,17 @@ var DomqlUtils = (() => {
     }
     return setHashedExtend(extend, stack);
   };
-  var extractArrayExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+  var extractArrayExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, componentNameMap) => {
     for (const each of extend) {
       if (isArray(each)) {
-        extractArrayExtend(each, stack, context, processed);
+        extractArrayExtend(each, stack, context, processed, nameStack, componentNameMap);
       } else {
-        flattenExtend(each, stack, context, processed);
+        flattenExtend(each, stack, context, processed, nameStack, void 0, componentNameMap);
       }
     }
     return stack;
   };
-  var deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+  var deepExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, currentName, componentNameMap) => {
     const extendOflattenExtend = extend.extends || extend.extend;
     const cleanExtend = { ...extend };
     delete cleanExtend.extends;
@@ -1682,26 +1683,32 @@ var DomqlUtils = (() => {
     }
     if (hasKeys) {
       stack.push(cleanExtend);
+      if (nameStack) nameStack.push(currentName);
     }
     if (extendOflattenExtend) {
-      flattenExtend(extendOflattenExtend, stack, context, processed);
+      flattenExtend(extendOflattenExtend, stack, context, processed, nameStack, currentName, componentNameMap);
     }
     return stack;
   };
-  var flattenExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set()) => {
+  var flattenExtend = (extend, stack, context, processed = /* @__PURE__ */ new Set(), nameStack, parentName, componentNameMap) => {
     if (!extend) return stack;
     if (processed.has(extend)) return stack;
     if (isArray(extend)) {
-      return extractArrayExtend(extend, stack, context, processed);
+      return extractArrayExtend(extend, stack, context, processed, nameStack, componentNameMap);
     }
+    let currentName = parentName;
     if (isString(extend)) {
+      currentName = extend;
       extend = mapStringsWithContextComponents(extend, context);
+    } else if (componentNameMap && isObject(extend) && componentNameMap.has(extend)) {
+      currentName = componentNameMap.get(extend);
     }
     processed.add(extend);
     if (extend?.extends || extend?.extend) {
-      deepExtend(extend, stack, context, processed);
+      deepExtend(extend, stack, context, processed, nameStack, currentName, componentNameMap);
     } else if (extend) {
       stack.push(extend);
+      if (nameStack) nameStack.push(currentName);
     }
     return stack;
   };
@@ -1714,7 +1721,7 @@ var DomqlUtils = (() => {
     "childExtend",
     "childExtendRecursive"
   ]);
-  var deepMergeExtends = (element, extend) => {
+  var deepMergeExtends = (element, extend, sourcemap, sourceName, preBuiltSourcemap) => {
     extend = deepClone(extend);
     for (const e in extend) {
       if (MERGE_EXTENDS_SKIP.has(e)) continue;
@@ -1724,11 +1731,23 @@ var DomqlUtils = (() => {
       if (Object.prototype.hasOwnProperty.call(extend, e) && e !== "__proto__" && e !== "constructor" && e !== "prototype") {
         if (elementProp === void 0) {
           element[e] = extendProp;
+          if (sourcemap && sourceName) {
+            if (isObject(extendProp) && !isArray(extendProp)) {
+              sourcemap[e] = sourcemap[e] || {};
+              trackSourcemapDeep(sourcemap[e], extendProp, sourceName);
+            } else {
+              sourcemap[e] = sourceName;
+            }
+          } else if (sourcemap && preBuiltSourcemap?.[e]) {
+            sourcemap[e] = preBuiltSourcemap[e];
+          }
         } else if (isObject(elementProp) && isObject(extendProp)) {
+          const nestedSourcemap = sourcemap ? sourcemap[e] = sourcemap[e] || {} : void 0;
+          const nestedPreBuilt = preBuiltSourcemap?.[e];
           if (matchesComponentNaming(e)) {
-            element[e] = deepMergeExtends(elementProp, extendProp);
+            element[e] = deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt);
           } else {
-            deepMergeExtends(elementProp, extendProp);
+            deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt);
           }
         }
         if (e === "extends" || e === "childExtends" || e === "childExtendsRecursive") {
@@ -1743,10 +1762,24 @@ var DomqlUtils = (() => {
     }
     return element;
   };
-  var cloneAndMergeArrayExtend = (stack) => {
-    return stack.reduce((acc, current) => {
+  var trackSourcemapDeep = (sourcemap, obj, sourceName) => {
+    for (const key in obj) {
+      if (!Object.prototype.hasOwnProperty.call(obj, key)) continue;
+      if (key === "__proto__" || key === "constructor" || key === "prototype") continue;
+      const val = obj[key];
+      if (isObject(val) && !isArray(val)) {
+        sourcemap[key] = sourcemap[key] || {};
+        trackSourcemapDeep(sourcemap[key], val, sourceName);
+      } else {
+        sourcemap[key] = sourceName;
+      }
+    }
+  };
+  var cloneAndMergeArrayExtend = (stack, sourcemap, extendNames) => {
+    return stack.reduce((acc, current, i) => {
       const cloned = deepClone(current);
-      return deepMergeExtends(acc, cloned);
+      const sourceName = extendNames ? extendNames[i] : void 0;
+      return deepMergeExtends(acc, cloned, sourcemap, sourceName);
     }, {});
   };
   var mapStringsWithContextComponents = (extend, context, options = {}, variant) => {
@@ -1769,11 +1802,12 @@ var DomqlUtils = (() => {
   var jointStacks = (extendStack, childExtendsStack) => {
     return [].concat(extendStack.slice(0, 1)).concat(childExtendsStack.slice(0, 1)).concat(extendStack.slice(1)).concat(childExtendsStack.slice(1));
   };
-  var getExtendsStack = (extend, context) => {
+  var getExtendsStack = (extend, context, nameStack, componentNameMap) => {
     if (!extend) return [];
     if (extend.__hash) return getHashedExtend(extend) || [];
     const processed = /* @__PURE__ */ new Set();
-    const stack = flattenExtend(extend, [], context, processed);
+    const stack = flattenExtend(extend, [], context, processed, nameStack, void 0, componentNameMap);
+    if (nameStack) return stack;
     return getExtendsStackRegistry(extend, stack);
   };
   var addExtend = (newExtends, elementExtends) => {
@@ -1880,6 +1914,8 @@ var DomqlUtils = (() => {
     const { props, __ref: ref } = element;
     const context = element.context || parent.context;
     const variant = element.variant || props?.variant;
+    const sourcemap = isSourcemapEnabled(options);
+    const originalExtendNames = sourcemap ? [...ref.__extends] : null;
     const __extends = removeDuplicatesInArray(
       ref.__extends.map((val, i) => {
         return mapStringsWithContextComponents(
@@ -1890,15 +1926,40 @@ var DomqlUtils = (() => {
         );
       })
     );
-    const stack = getExtendsStack(__extends, context);
-    ref.__extendsStack = stack;
+    if (sourcemap) {
+      const componentNameMap = /* @__PURE__ */ new WeakMap();
+      for (let i = 0; i < __extends.length; i++) {
+        const resolved = __extends[i];
+        const originalName = originalExtendNames[i];
+        if (resolved && isObject(resolved) && isString(originalName)) {
+          componentNameMap.set(resolved, originalName);
+        }
+      }
+      const nameStack = [];
+      const stack = getExtendsStack(__extends, context, nameStack, componentNameMap);
+      ref.__extendsStack = stack;
+      ref.__extendsNames = nameStack;
+    } else {
+      const stack = getExtendsStack(__extends, context);
+      ref.__extendsStack = stack;
+    }
     return ref.__extendsStack;
   };
   var finalizeExtends = (element, parent, options = {}) => {
     const { __ref: ref } = element;
     const { __extendsStack } = ref;
-    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack);
-    return deepMergeExtends(element, flattenExtends);
+    if (isSourcemapEnabled(options)) {
+      const sourcemapAcc = {};
+      const extendNames = ref.__extendsNames || [];
+      const flattenExtends = cloneAndMergeArrayExtend(__extendsStack, sourcemapAcc, extendNames);
+      const appliedSourcemap = {};
+      deepMergeExtends(element, flattenExtends, appliedSourcemap, void 0, sourcemapAcc);
+      ref.__sourcemap = appliedSourcemap;
+    } else {
+      const flattenExtends = cloneAndMergeArrayExtend(__extendsStack);
+      deepMergeExtends(element, flattenExtends);
+    }
+    return element;
   };
   var applyExtends = (element, parent, options = {}) => {
     createElementExtends(element, parent, options);
@@ -1943,6 +2004,31 @@ var DomqlUtils = (() => {
   // 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",
+    "text",
+    "tag",
+    "on",
+    "if",
+    "childExtend",
+    "children",
+    "childrenAs",
+    "state",
+    "html",
+    "attr",
+    "define",
+    "content"
+  ]);
+  var looksLikeElement = (value) => {
+    if (!value || typeof value !== "object" || Array.isArray(value)) return false;
+    for (const k in value) {
+      if (ELEMENT_INDICATOR_KEYS.has(k)) return true;
+      if (RE_UPPER.test(k)) return true;
+    }
+    return false;
+  };
   var createProps = (element, parent, key) => {
     const { props, __ref: ref } = element;
     ref.__propsStack = [];
@@ -1965,11 +2051,27 @@ var DomqlUtils = (() => {
         delete obj[key];
         continue;
       }
-      const hasDefine = isObject(this.define?.[key]);
-      const hasGlobalDefine = isObject(this.context?.define?.[key]);
-      const isElement = RE_UPPER.test(key) || RE_DIGITS.test(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);
@@ -1989,8 +2091,13 @@ var DomqlUtils = (() => {
         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) {
@@ -2029,7 +2136,7 @@ var DomqlUtils = (() => {
     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);

package/extends.js

@@ -5,6 +5,7 @@ import { matchesComponentNaming } from './component.js'
 import { deepClone, exec } from './object.js'
 import { isArray, isObject, isString } from './types.js'
 const ENV = process.env.NODE_ENV
+const isSourcemapEnabled = (options) => options.sourcemap !== false && ENV !== 'production'
 
 export const createExtendsFromKeys = key => {
   if (key.includes('+')) {
@@ -112,19 +113,21 @@ export const extractArrayExtend = (
   extend,
   stack,
   context,
-  processed = new Set()
+  processed = new Set(),
+  nameStack,
+  componentNameMap
 ) => {
   for (const each of extend) {
     if (isArray(each)) {
-      extractArrayExtend(each, stack, context, processed)
+      extractArrayExtend(each, stack, context, processed, nameStack, componentNameMap)
     } else {
-      flattenExtend(each, stack, context, processed)
+      flattenExtend(each, stack, context, processed, nameStack, undefined, componentNameMap)
     }
   }
   return stack
 }
 
-export const deepExtend = (extend, stack, context, processed = new Set()) => {
+export const deepExtend = (extend, stack, context, processed = new Set(), nameStack, currentName, componentNameMap) => {
   const extendOflattenExtend = extend.extends || extend.extend
   // Remove extends/extend properties before adding to stack
   const cleanExtend = { ...extend }
@@ -134,9 +137,10 @@ export const deepExtend = (extend, stack, context, processed = new Set()) => {
   for (const _k in cleanExtend) { hasKeys = true; break } // eslint-disable-line
   if (hasKeys) {
     stack.push(cleanExtend)
+    if (nameStack) nameStack.push(currentName)
   }
   if (extendOflattenExtend) {
-    flattenExtend(extendOflattenExtend, stack, context, processed)
+    flattenExtend(extendOflattenExtend, stack, context, processed, nameStack, currentName, componentNameMap)
   }
   return stack
 }
@@ -145,25 +149,34 @@ export const flattenExtend = (
   extend,
   stack,
   context,
-  processed = new Set()
+  processed = new Set(),
+  nameStack,
+  parentName,
+  componentNameMap
 ) => {
   if (!extend) return stack
   if (processed.has(extend)) return stack
 
   if (isArray(extend)) {
-    return extractArrayExtend(extend, stack, context, processed)
+    return extractArrayExtend(extend, stack, context, processed, nameStack, componentNameMap)
   }
 
+  let currentName = parentName
   if (isString(extend)) {
+    currentName = extend
     extend = mapStringsWithContextComponents(extend, context)
+  } else if (componentNameMap && isObject(extend) && componentNameMap.has(extend)) {
+    // Resolve name from pre-built map (top-level resolved extends)
+    currentName = componentNameMap.get(extend)
   }
 
   processed.add(extend)
 
   if (extend?.extends || extend?.extend) {
-    deepExtend(extend, stack, context, processed)
+    deepExtend(extend, stack, context, processed, nameStack, currentName, componentNameMap)
   } else if (extend) {
     stack.push(extend)
+    if (nameStack) nameStack.push(currentName)
   }
 
   return stack
@@ -173,7 +186,7 @@ const MERGE_EXTENDS_SKIP = new Set([
   'parent', 'node', '__ref', '__proto__', 'extend', 'childExtend', 'childExtendRecursive'
 ])
 
-export const deepMergeExtends = (element, extend) => {
+export const deepMergeExtends = (element, extend, sourcemap, sourceName, preBuiltSourcemap) => {
   // Clone extend to prevent mutations
   extend = deepClone(extend)
 
@@ -194,14 +207,28 @@ export const deepMergeExtends = (element, extend) => {
       if (elementProp === undefined) {
         // For undefined properties in element, copy from extend
         element[e] = extendProp
+        // Track sourcemap for this property
+        if (sourcemap && sourceName) {
+          if (isObject(extendProp) && !isArray(extendProp)) {
+            sourcemap[e] = sourcemap[e] || {}
+            trackSourcemapDeep(sourcemap[e], extendProp, sourceName)
+          } else {
+            sourcemap[e] = sourceName
+          }
+        } else if (sourcemap && preBuiltSourcemap?.[e]) {
+          // Copy sourcemap entry from pre-built sourcemap (used in finalizeExtends)
+          sourcemap[e] = preBuiltSourcemap[e]
+        }
       } else if (isObject(elementProp) && isObject(extendProp)) {
         // For objects, merge based on type
+        const nestedSourcemap = sourcemap ? (sourcemap[e] = sourcemap[e] || {}) : undefined
+        const nestedPreBuilt = preBuiltSourcemap?.[e]
         if (matchesComponentNaming(e)) {
           // For components, override base properties with extended ones
-          element[e] = deepMergeExtends(elementProp, extendProp)
+          element[e] = deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt)
         } else {
           // For other objects, merge normally
-          deepMergeExtends(elementProp, extendProp)
+          deepMergeExtends(elementProp, extendProp, nestedSourcemap, sourceName, nestedPreBuilt)
         }
       }
 
@@ -225,12 +252,27 @@ export const deepMergeExtends = (element, extend) => {
   return element
 }
 
-export const cloneAndMergeArrayExtend = stack => {
-  return stack.reduce((acc, current) => {
+const trackSourcemapDeep = (sourcemap, obj, sourceName) => {
+  for (const key in obj) {
+    if (!Object.prototype.hasOwnProperty.call(obj, key)) continue
+    if (key === '__proto__' || key === 'constructor' || key === 'prototype') continue
+    const val = obj[key]
+    if (isObject(val) && !isArray(val)) {
+      sourcemap[key] = sourcemap[key] || {}
+      trackSourcemapDeep(sourcemap[key], val, sourceName)
+    } else {
+      sourcemap[key] = sourceName
+    }
+  }
+}
+
+export const cloneAndMergeArrayExtend = (stack, sourcemap, extendNames) => {
+  return stack.reduce((acc, current, i) => {
     // Clone current extend to avoid mutations
     const cloned = deepClone(current)
+    const sourceName = extendNames ? extendNames[i] : undefined
     // Merge into accumulator, giving priority to current extend
-    return deepMergeExtends(acc, cloned)
+    return deepMergeExtends(acc, cloned, sourcemap, sourceName)
   }, {})
 }
 
@@ -271,11 +313,12 @@ export const jointStacks = (extendStack, childExtendsStack) => {
 }
 
 // init
-export const getExtendsStack = (extend, context) => {
+export const getExtendsStack = (extend, context, nameStack, componentNameMap) => {
   if (!extend) return []
   if (extend.__hash) return getHashedExtend(extend) || []
   const processed = new Set()
-  const stack = flattenExtend(extend, [], context, processed)
+  const stack = flattenExtend(extend, [], context, processed, nameStack, undefined, componentNameMap)
+  if (nameStack) return stack
   return getExtendsStackRegistry(extend, stack)
 }
 
@@ -416,6 +459,10 @@ export const createExtendsStack = (element, parent, options = {}) => {
 
   const variant = element.variant || props?.variant
 
+  // Keep original string names before resolution for sourcemap tracking
+  const sourcemap = isSourcemapEnabled(options)
+  const originalExtendNames = sourcemap ? [...ref.__extends] : null
+
   const __extends = removeDuplicatesInArray(
     ref.__extends.map((val, i) => {
       return mapStringsWithContextComponents(
@@ -427,8 +474,24 @@ export const createExtendsStack = (element, parent, options = {}) => {
     })
   )
 
-  const stack = getExtendsStack(__extends, context)
-  ref.__extendsStack = stack
+  if (sourcemap) {
+    // Build a map from resolved component objects to their original string names
+    const componentNameMap = new WeakMap()
+    for (let i = 0; i < __extends.length; i++) {
+      const resolved = __extends[i]
+      const originalName = originalExtendNames[i]
+      if (resolved && isObject(resolved) && isString(originalName)) {
+        componentNameMap.set(resolved, originalName)
+      }
+    }
+    const nameStack = []
+    const stack = getExtendsStack(__extends, context, nameStack, componentNameMap)
+    ref.__extendsStack = stack
+    ref.__extendsNames = nameStack
+  } else {
+    const stack = getExtendsStack(__extends, context)
+    ref.__extendsStack = stack
+  }
 
   return ref.__extendsStack
 }
@@ -436,9 +499,21 @@ export const createExtendsStack = (element, parent, options = {}) => {
 export const finalizeExtends = (element, parent, options = {}) => {
   const { __ref: ref } = element
   const { __extendsStack } = ref
-  const flattenExtends = cloneAndMergeArrayExtend(__extendsStack)
 
-  return deepMergeExtends(element, flattenExtends)
+  if (isSourcemapEnabled(options)) {
+    const sourcemapAcc = {}
+    const extendNames = ref.__extendsNames || []
+    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack, sourcemapAcc, extendNames)
+    // Only keep sourcemap entries for properties actually merged into element
+    const appliedSourcemap = {}
+    deepMergeExtends(element, flattenExtends, appliedSourcemap, undefined, sourcemapAcc)
+    ref.__sourcemap = appliedSourcemap
+  } else {
+    const flattenExtends = cloneAndMergeArrayExtend(__extendsStack)
+    deepMergeExtends(element, flattenExtends)
+  }
+
+  return element
 }
 
 export const applyExtends = (element, parent, options = {}) => {

package/node.js

@@ -29,8 +29,8 @@ export const isHtmlElement = obj => {
 export const isDOMNode = obj => {
   return (
     typeof window !== 'undefined' &&
-    (obj instanceof window.Node ||
-      obj instanceof window.Window ||
+    ((window.Node && obj instanceof window.Node) ||
+      (window.Window && obj instanceof window.Window) ||
       obj === window ||
       obj === document)
   )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/utils",
-  "version": "3.5.1",
+  "version": "3.6.3",
   "license": "MIT",
   "type": "module",
   "module": "./dist/esm/index.js",
@@ -8,24 +8,19 @@
   "exports": {
     ".": {
       "import": "./dist/esm/index.js",
-      "require": "./dist/cjs/index.js",
-      "browser": "./dist/esm/index.js",
-      "default": "./dist/esm/index.js"
+      "require": "./dist/cjs/index.js"
     },
     "./methods": {
       "import": "./dist/esm/methods.js",
-      "require": "./dist/cjs/methods.js",
-      "default": "./dist/esm/methods.js"
+      "require": "./dist/cjs/methods.js"
     },
     "./*.js": {
       "import": "./dist/esm/*.js",
-      "require": "./dist/cjs/*.js",
-      "default": "./dist/esm/*.js"
+      "require": "./dist/cjs/*.js"
     },
     "./*": {
       "import": "./dist/esm/*.js",
-      "require": "./dist/cjs/*.js",
-      "default": "./dist/esm/*.js"
+      "require": "./dist/cjs/*.js"
     }
   },
   "source": "index.js",
@@ -48,5 +43,8 @@
   "browser": "./dist/esm/index.js",
   "unpkg": "./dist/iife/index.js",
   "jsdelivr": "./dist/iife/index.js",
-  "sideEffects": false
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  }
 }

package/props.js

@@ -9,6 +9,24 @@ import { lowercaseFirstLetter } from './string.js'
 const RE_UPPER = /^[A-Z]/
 const RE_DIGITS = /^\d+$/
 
+// Characters that mark css-in-props selectors (pseudo-selectors, media queries, etc.)
+// These properties must always live in props so useCssInProps() can process them
+const CSS_SELECTOR_PREFIXES = new Set([':', '@', '[', '*', '+', '~', '&', '>', '$', '-', '.', '!'])
+
+const ELEMENT_INDICATOR_KEYS = new Set([
+  'extend', 'props', 'text', 'tag', 'on', 'if', 'childExtend',
+  'children', 'childrenAs', 'state', 'html', 'attr',
+  'define', 'content'
+])
+const looksLikeElement = (value) => {
+  if (!value || typeof value !== 'object' || Array.isArray(value)) return false
+  for (const k in value) {
+    if (ELEMENT_INDICATOR_KEYS.has(k)) return true
+    if (RE_UPPER.test(k)) return true
+  }
+  return false
+}
+
 export const createProps = (element, parent, key) => {
   const { props, __ref: ref } = element
   ref.__propsStack = []
@@ -36,13 +54,38 @@ export function pickupPropsFromElement (obj, opts = {}) {
       continue
     }
 
-    const hasDefine = isObject(this.define?.[key])
-    const hasGlobalDefine = isObject(this.context?.define?.[key])
-    const isElement = RE_UPPER.test(key) || RE_DIGITS.test(key)
+    // childProps is a framework property that must always live in props
+    // even though its value may contain uppercase keys (Icon, Hgroup, etc.)
+    if (key === 'childProps') {
+      obj.props[key] = value
+      delete obj[key]
+      cachedKeys.push(key)
+      continue
+    }
+
+    // Check define handlers - keys with define handlers must stay at root
+    // for throughInitialDefine to process them
+    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
+
+    // CSS-in-props selectors (:after, :hover, @mobileS, etc.) must always
+    // live in props so useCssInProps() can process them via transformersByPrefix
+    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 it's not a special case, move to props
-    if (!isElement && !isBuiltin && !hasDefine && !hasGlobalDefine) {
+    if (!isElement && !isBuiltin) {
       obj.props[key] = value
       delete obj[key]
       cachedKeys.push(key)
@@ -71,8 +114,17 @@ export function pickupElementFromProps (obj = this, opts) {
     // Skip if key was originally from obj
     if (cachedKeys.includes(key)) continue
 
-    const hasDefine = isObject(this.define?.[key])
-    const hasGlobalDefine = isObject(this.context?.define?.[key])
+    // childProps must stay in props - it's consumed by inheritParentProps
+    if (key === 'childProps') continue
+
+    // CSS-in-props selectors must stay in props
+    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)
 
@@ -126,7 +178,7 @@ export const inheritParentProps = (element, parent) => {
   if (!parentProps) return propsStack
 
   const matchParentKeyProps = parentProps[element.key]
-  const matchParentChildProps = parentProps.childProps
+  const matchParentChildProps = parentProps.childProps || parent.childProps
 
   // Order matters: key-specific props should be added after childProps
   const ignoreChildProps = element.props?.ignoreChildProps