@domql/element 2.27.8 → 2.27.11

package/create.js

@@ -40,13 +40,20 @@ import {
   applyVariant,
   createValidDomqlObjectFromSugar
 } from './utils/component.js'
+import { isNotProduction } from '@domql/utils/env.js'
 
 const ENV = process.env.NODE_ENV
 
 /**
  * Creating a domQL element using passed parameters
  */
-export const create = async (element, parent, key, options = OPTIONS.create || {}, attachOptions) => {
+export const create = async (
+  element,
+  parent,
+  key,
+  options = OPTIONS.create || {},
+  attachOptions
+) => {
   cacheOptions(element, options)
 
   // if element is STRING
@@ -93,7 +100,8 @@ export const create = async (element, parent, key, options = OPTIONS.create || {
 
   // apply props settings
   createProps(element, parent, options)
-  if (element.scope === 'props' || element.scope === true) element.scope = element.props
+  if (element.scope === 'props' || element.scope === true)
+    element.scope = element.props
 
   // recatch if it passess props again
   createIfConditionFlag(element, parent)
@@ -128,13 +136,17 @@ export const create = async (element, parent, key, options = OPTIONS.create || {
 const createBasedOnType = (element, parent, key, options) => {
   // if ELEMENT is not given
   if (element === undefined) {
-    if (ENV === 'testing' || ENV === 'development') {
-      console.warn(key, 'element is undefined in', parent && parent.__ref && parent.__ref.path)
+    if (isNotProduction(ENV)) {
+      console.warn(
+        key,
+        'element is undefined in',
+        parent && parent.__ref && parent.__ref.path
+      )
     }
     return {}
   }
   if (isString(key) && key.slice(0, 2 === '__')) {
-    if (ENV === 'testing' || ENV === 'development') {
+    if (isNotProduction(ENV)) {
       console.warn(key, 'seems like to be in __ref')
     }
   }
@@ -152,7 +164,11 @@ const createBasedOnType = (element, parent, key, options) => {
 const redefineElement = (element, parent, key, options) => {
   const elementWrapper = createBasedOnType(element, parent, key, options)
 
-  if (options.syntaxv3 || (element.props && element.props.syntaxv3) || (parent && parent.props && parent.props.syntaxv3) /* kalduna guard */) {
+  if (
+    options.syntaxv3 ||
+    (element.props && element.props.syntaxv3) ||
+    (parent && parent.props && parent.props.syntaxv3) /* kalduna guard */
+  ) {
     if (element.props) element.props.syntaxv3 = true
     else element.syntaxv3 = true
     return createValidDomqlObjectFromSugar(element, parent, key, options)
@@ -187,12 +203,7 @@ const cacheOptions = (element, options) => {
 }
 
 const createKey = (element, parent, key) => {
-  return (
-    exec(key, element) ||
-    key ||
-    element.key ||
-    generateKey()
-  ).toString()
+  return (exec(key, element) || key || element.key || generateKey()).toString()
 }
 
 const addRef = (element, parent) => {
@@ -209,13 +220,15 @@ const switchDefaultOptions = (element, parent, options) => {
 }
 
 const addElementIntoParentChildren = (element, parent) => {
-  if (parent.__ref && parent.__ref.__children) parent.__ref.__children.push(element.key)
+  if (parent.__ref && parent.__ref.__children)
+    parent.__ref.__children.push(element.key)
 }
 
 const visitedElements = new WeakMap()
 const renderElement = async (element, parent, options, attachOptions) => {
   if (visitedElements.has(element)) {
-    if (ENV === 'testing' || ENV === 'development') console.warn('Cyclic rendering detected:', element.__ref.path)
+    if (isNotProduction(ENV))
+      console.warn('Cyclic rendering detected:', element.__ref.path)
   }
 
   visitedElements.set(element, true)
@@ -230,21 +243,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
   }
 
   // CREATE a real NODE
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction(ENV)) {
     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)
+      if (path.includes('ComponentsGrid'))
+        path.splice(0, path.indexOf('ComponentsGrid') + 2)
+      if (path.includes('demoComponent'))
+        path.splice(0, path.indexOf('demoComponent') + 1)
       const isDemoComponent = element.lookup(el => el.state.key)?.state?.key
-      element.warn('Error happened in:', isDemoComponent ? isDemoComponent + ' ' : '' + path.join('.'))
+      element.warn(
+        'Error happened in:',
+        isDemoComponent ? isDemoComponent + ' ' : '' + path.join('.')
+      )
       element.verbose()
       element.error(e, options)
-      if (element.on?.error) element.on.error(e, element, element.state, element.context, options)
-      if (element.props?.onError) element.props.onError(e, element, element.state, element.context, options)
+      if (element.on?.error)
+        element.on.error(e, element, element.state, element.context, options)
+      if (element.props?.onError)
+        element.props.onError(
+          e,
+          element,
+          element.state,
+          element.context,
+          options
+        )
     }
   }
 
@@ -273,25 +299,32 @@ const renderElement = async (element, parent, options, attachOptions) => {
   await triggerEventOn('create', element, options)
 }
 
-const checkIfPrimitive = (element) => is(element)('string', 'number')
+const checkIfPrimitive = element => is(element)('string', 'number')
 
 const applyValueAsText = (element, parent, key) => {
   const extendTag = element.extend && element.extend.tag
   const childExtendTag = parent.childExtend && parent.childExtend.tag
   const childPropsTag = parent.props.childProps && parent.props.childProps.tag
-  const isKeyValidHTMLTag = ((HTML_TAGS.body.indexOf(key) > -1) && key)
+  const isKeyValidHTMLTag = HTML_TAGS.body.indexOf(key) > -1 && key
   return {
     text: element,
-    tag: extendTag || childExtendTag || childPropsTag || isKeyValidHTMLTag || 'string'
+    tag:
+      extendTag ||
+      childExtendTag ||
+      childPropsTag ||
+      isKeyValidHTMLTag ||
+      'string'
   }
 }
 
 const applyContext = (element, parent, options) => {
-  const forcedOptionsContext = options.context && !ROOT.context && !element.context
+  const forcedOptionsContext =
+    options.context && !ROOT.context && !element.context
   if (forcedOptionsContext) ROOT.context = options.context
 
   // inherit from parent or root
-  if (!element.context) element.context = parent.context || options.context || ROOT.context
+  if (!element.context)
+    element.context = parent.context || options.context || ROOT.context
 }
 
 // Create scope - shared object across the elements to the own or the nearest parent
@@ -304,7 +337,10 @@ const createScope = (element, parent) => {
 const createIfConditionFlag = (element, parent) => {
   const { __ref: ref } = element
 
-  if (isFunction(element.if) && !element.if(element, element.state, element.context)) {
+  if (
+    isFunction(element.if) &&
+    !element.if(element, element.state, element.context)
+  ) {
     delete ref.__if
   } else ref.__if = true
 }
@@ -337,14 +373,15 @@ const addCaching = (element, parent) => {
   // enable CHANGES storing
   if (!ref.__children) ref.__children = []
 
-  if (checkIfKeyIsComponent(key)) ref.__componentKey = key.split('_')[0].split('.')[0].split('+')[0]
+  if (checkIfKeyIsComponent(key))
+    ref.__componentKey = key.split('_')[0].split('.')[0].split('+')[0]
 
   // Add _root element property
   const hasRoot = parent && parent.key === ':root'
   if (!ref.root) ref.root = hasRoot ? element : parentRef.root
 
   // set the PATH array
-  // if (ENV === 'testing' || ENV === 'development') {
+  // if (isNotProduction(ENV)) {
   if (!parentRef) parentRef = parent.ref = {}
   if (!parentRef.path) parentRef.path = []
   ref.path = parentRef.path.concat(element.key)
@@ -367,9 +404,12 @@ const onlyResolveExtends = (element, parent, key, options) => {
 
     // apply props settings
     createProps(element, parent, options)
-    if (element.scope === 'props' || element.scope === true) element.scope = element.props
+    if (element.scope === 'props' || element.scope === true)
+      element.scope = element.props
 
-    if (element.node && ref.__if) { parent[key || element.key] = element } // Borrowed from assignNode()
+    if (element.node && ref.__if) {
+      parent[key || element.key] = element
+    } // Borrowed from assignNode()
 
     if (!element.props) element.props = {}
     applyVariant(element, parent)
@@ -387,16 +427,22 @@ const onlyResolveExtends = (element, parent, key, options) => {
         isMethod(k, element) ||
         isObject((registry.default || registry)[k]) ||
         isVariant(k)
-      ) continue
+      )
+        continue
 
       const hasDefine = element.define && element.define[k]
-      const contextHasDefine = element.context && element.context.define &&
-            element.context.define[k]
+      const contextHasDefine =
+        element.context && element.context.define && element.context.define[k]
       const optionsHasDefine = options.define && options.define[k]
 
       if (!ref.__skipCreate && REGISTRY[k] && !optionsHasDefine) {
         continue
-      } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
+      } else if (
+        element[k] &&
+        !hasDefine &&
+        !optionsHasDefine &&
+        !contextHasDefine
+      ) {
         create(exec(element[k], element), element, k, options)
       }
     }
@@ -416,7 +462,7 @@ const onlyResolveExtends = (element, parent, key, options) => {
   return element
 }
 
-const checkIfMedia = (key) => key.slice(0, 1) === '@'
+const checkIfMedia = key => key.slice(0, 1) === '@'
 
 const applyMediaProps = (element, parent, key) => {
   const { props } = element

package/dist/cjs/create.js

@@ -37,6 +37,7 @@ var import_classList = require("./mixins/classList.js");
 var import_iterate = require("./iterate.js");
 var import_options = require("./cache/options.js");
 var import_component = require("./utils/component.js");
+var import_env = require("@domql/utils/env.js");
 const ENV = "development";
 const create = async (element, parent, key, options = import_options.OPTIONS.create || {}, attachOptions) => {
   cacheOptions(element, options);
@@ -66,7 +67,8 @@ const create = async (element, parent, key, options = import_options.OPTIONS.cre
   if (element.scope === "state") element.scope = element.state;
   createIfConditionFlag(element, parent);
   (0, import_props.createProps)(element, parent, options);
-  if (element.scope === "props" || element.scope === true) element.scope = element.props;
+  if (element.scope === "props" || element.scope === true)
+    element.scope = element.props;
   createIfConditionFlag(element, parent);
   if (element.node && ref.__if) {
     return (0, import_render.assignNode)(element, parent, key, attachOptions);
@@ -84,13 +86,17 @@ const create = async (element, parent, key, options = import_options.OPTIONS.cre
 };
 const createBasedOnType = (element, parent, key, options) => {
   if (element === void 0) {
-    if (ENV === "testing" || ENV === "development") {
-      console.warn(key, "element is undefined in", parent && parent.__ref && parent.__ref.path);
+    if ((0, import_env.isNotProduction)(ENV)) {
+      console.warn(
+        key,
+        "element is undefined in",
+        parent && parent.__ref && parent.__ref.path
+      );
     }
     return {};
   }
   if ((0, import_utils.isString)(key) && key.slice(0, false)) {
-    if (ENV === "testing" || ENV === "development") {
+    if ((0, import_env.isNotProduction)(ENV)) {
       console.warn(key, "seems like to be in __ref");
     }
   }
@@ -145,13 +151,15 @@ const switchDefaultOptions = (element, parent, options) => {
   }
 };
 const addElementIntoParentChildren = (element, parent) => {
-  if (parent.__ref && parent.__ref.__children) parent.__ref.__children.push(element.key);
+  if (parent.__ref && parent.__ref.__children)
+    parent.__ref.__children.push(element.key);
 };
 const visitedElements = /* @__PURE__ */ new WeakMap();
 const renderElement = async (element, parent, options, attachOptions) => {
   var _a, _b, _c, _d;
   if (visitedElements.has(element)) {
-    if (ENV === "testing" || ENV === "development") console.warn("Cyclic rendering detected:", element.__ref.path);
+    if ((0, import_env.isNotProduction)(ENV))
+      console.warn("Cyclic rendering detected:", element.__ref.path);
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
@@ -161,21 +169,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
     await (0, import_node.createNode)(element, options);
     ref.__uniqId = Math.random();
   };
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_env.isNotProduction)(ENV)) {
     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);
+      if (path.includes("ComponentsGrid"))
+        path.splice(0, path.indexOf("ComponentsGrid") + 2);
+      if (path.includes("demoComponent"))
+        path.splice(0, path.indexOf("demoComponent") + 1);
       const isDemoComponent = (_b = (_a = element.lookup((el) => el.state.key)) == null ? void 0 : _a.state) == null ? void 0 : _b.key;
-      element.warn("Error happened in:", isDemoComponent ? isDemoComponent + " " : "" + path.join("."));
+      element.warn(
+        "Error happened in:",
+        isDemoComponent ? isDemoComponent + " " : "" + path.join(".")
+      );
       element.verbose();
       element.error(e, options);
-      if ((_c = element.on) == null ? void 0 : _c.error) element.on.error(e, element, element.state, element.context, options);
-      if ((_d = element.props) == null ? void 0 : _d.onError) element.props.onError(e, element, element.state, element.context, options);
+      if ((_c = element.on) == null ? void 0 : _c.error)
+        element.on.error(e, element, element.state, element.context, options);
+      if ((_d = element.props) == null ? void 0 : _d.onError)
+        element.props.onError(
+          e,
+          element,
+          element.state,
+          element.context,
+          options
+        );
     }
   }
   if (!ref.__if) {
@@ -203,7 +224,8 @@ const applyValueAsText = (element, parent, key) => {
 const applyContext = (element, parent, options) => {
   const forcedOptionsContext = options.context && !import_tree.ROOT.context && !element.context;
   if (forcedOptionsContext) import_tree.ROOT.context = options.context;
-  if (!element.context) element.context = parent.context || options.context || import_tree.ROOT.context;
+  if (!element.context)
+    element.context = parent.context || options.context || import_tree.ROOT.context;
 };
 const createScope = (element, parent) => {
   const { __ref: ref } = element;
@@ -228,7 +250,8 @@ const addCaching = (element, parent) => {
   if (!ref.__attr) ref.__attr = {};
   if (!ref.__changes) ref.__changes = [];
   if (!ref.__children) ref.__children = [];
-  if ((0, import_utils.checkIfKeyIsComponent)(key)) ref.__componentKey = key.split("_")[0].split(".")[0].split("+")[0];
+  if ((0, import_utils.checkIfKeyIsComponent)(key))
+    ref.__componentKey = key.split("_")[0].split(".")[0].split("+")[0];
   const hasRoot = parent && parent.key === ":root";
   if (!ref.root) ref.root = hasRoot ? element : parentRef.root;
   if (!parentRef) parentRef = parent.ref = {};
@@ -245,7 +268,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
     if (element.scope === "state") element.scope = element.state;
     createIfConditionFlag(element, parent);
     (0, import_props.createProps)(element, parent, options);
-    if (element.scope === "props" || element.scope === true) element.scope = element.props;
+    if (element.scope === "props" || element.scope === true)
+      element.scope = element.props;
     if (element.node && ref.__if) {
       parent[key || element.key] = element;
     }
@@ -257,7 +281,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
     (0, import_iterate.throughInitialDefine)(element);
     (0, import_iterate.throughInitialExec)(element);
     for (const k in element) {
-      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)) continue;
+      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))
+        continue;
       const hasDefine = element.define && element.define[k];
       const contextHasDefine = element.context && element.context.define && element.context.define[k];
       const optionsHasDefine = options.define && options.define[k];

package/dist/cjs/extend.js

@@ -33,7 +33,7 @@ const applyExtend = (element, parent, options = {}) => {
   const context = element.context || parent.context;
   extend = (0, import_utils2.fallbackStringExtend)(extend, context, options, variant);
   const extendStack = (0, import_utils2.getExtendStack)(extend, context);
-  if (ENV !== "testing" || ENV !== "development") delete element.extend;
+  if ((0, import_utils.isProduction)(ENV)) delete element.extend;
   let childExtendStack = [];
   if (parent) {
     element.parent = parent;
@@ -43,7 +43,10 @@ const applyExtend = (element, parent, options = {}) => {
       if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
         const canExtendRecursive = element.key !== "__text";
         if (canExtendRecursive) {
-          const childExtendRecursiveStack = (0, import_utils2.getExtendStack)(parent.childExtendRecursive, context);
+          const childExtendRecursiveStack = (0, import_utils2.getExtendStack)(
+            parent.childExtendRecursive,
+            context
+          );
           childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
           element.childExtendRecursive = parent.childExtendRecursive;
         }
@@ -62,7 +65,10 @@ const applyExtend = (element, parent, options = {}) => {
   } else if (!context.defaultExtends) return element;
   if (context.defaultExtends) {
     if (!mainExtend) {
-      const defaultOptionsExtend = (0, import_utils2.getExtendStack)(context.defaultExtends, context);
+      const defaultOptionsExtend = (0, import_utils2.getExtendStack)(
+        context.defaultExtends,
+        context
+      );
       mainExtend = (0, import_utils2.cloneAndMergeArrayExtend)(defaultOptionsExtend);
       delete mainExtend.extend;
     }
@@ -73,7 +79,9 @@ const applyExtend = (element, parent, options = {}) => {
   const COMPONENTS = context && context.components || options.components;
   const component = (0, import_utils.exec)(element.component || mergedExtend.component, element);
   if (component && COMPONENTS && COMPONENTS[component]) {
-    const componentExtend = (0, import_utils2.cloneAndMergeArrayExtend)((0, import_utils2.getExtendStack)(COMPONENTS[component]));
+    const componentExtend = (0, import_utils2.cloneAndMergeArrayExtend)(
+      (0, import_utils2.getExtendStack)(COMPONENTS[component])
+    );
     mergedExtend = (0, import_utils2.deepMergeExtend)(componentExtend, mergedExtend);
   }
   const merged = (0, import_utils2.deepMergeExtend)(element, mergedExtend);

package/dist/cjs/methods/index.js

@@ -207,7 +207,7 @@ function parseDeep(excl = []) {
   return obj;
 }
 function verbose(element, ...args) {
-  if (ENV !== "testing" && ENV !== "development") return;
+  if ((0, import_utils.isProduction)(ENV)) return;
   const parent = this;
   const { __ref: ref } = parent;
   console.groupCollapsed(parent.key);
@@ -224,18 +224,18 @@ function verbose(element, ...args) {
   return parent;
 }
 function log(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_utils.isNotProduction)(ENV)) {
     console.log(...params);
   }
 }
 function warn(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_utils.isNotProduction)(ENV)) {
     console.warn(...params);
   }
 }
 function error(...params) {
   var _a, _b;
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_utils.isNotProduction)(ENV)) {
     if ((_a = params[params.length - 1]) == null ? void 0 : _a.debugger) debugger;
     if ((_b = params[params.length - 1]) == null ? void 0 : _b.verbose) verbose.call(this, ...params);
     console.error(...params, this);

package/dist/cjs/node.js

@@ -31,6 +31,7 @@ var import_iterate = require("./iterate.js");
 var import_mixins = require("./mixins/index.js");
 var import_applyParam = require("./utils/applyParam.js");
 var import_propEvents = require("./utils/propEvents.js");
+var import_env = require("@domql/utils/env.js");
 const ENV = "development";
 const createNode = async (element, options) => {
   let { node, tag, __ref: ref } = element;
@@ -43,7 +44,7 @@ const createNode = async (element, options) => {
     } else node = element.node = (0, import_render.cacheNode)(element);
     await (0, import_event.triggerEventOn)("attachNode", element, options);
   }
-  if (ENV === "testing" || ENV === "development" || options.alowRefReference) {
+  if ((0, import_env.isNotProduction)(ENV) || options.alowRefReference) {
     node.ref = element;
     if ((0, import_utils.isFunction)(node.setAttribute)) node.setAttribute("key", element.key);
   }
@@ -59,7 +60,8 @@ const createNode = async (element, options) => {
   for (const param in element) {
     const value = element[param];
     if (!Object.hasOwnProperty.call(element, param)) continue;
-    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])) continue;
+    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]))
+      continue;
     const isElement = await (0, import_applyParam.applyParam)(param, element, options);
     if (isElement) {
       const { hasDefine, hasContextDefine } = isElement;

package/dist/cjs/utils/extendUtils.js

@@ -110,7 +110,7 @@ const fallbackStringExtend = (extend, context, options = {}, variant) => {
     if (componentExists) return componentExists;
     else if (pageExists) return pageExists;
     else {
-      if (options.verbose && (ENV === "testing" || ENV === "development")) {
+      if (options.verbose && (0, import_utils.isNotProduction)(ENV)) {
         console.warn("Extend is string but component was not found:", extend);
       }
       return {};

package/dist/esm/create.js

@@ -33,6 +33,7 @@ import {
   applyVariant,
   createValidDomqlObjectFromSugar
 } from "./utils/component.js";
+import { isNotProduction } from "@domql/utils/env.js";
 const ENV = "development";
 const create = async (element, parent, key, options = OPTIONS.create || {}, attachOptions) => {
   cacheOptions(element, options);
@@ -62,7 +63,8 @@ const create = async (element, parent, key, options = OPTIONS.create || {}, atta
   if (element.scope === "state") element.scope = element.state;
   createIfConditionFlag(element, parent);
   createProps(element, parent, options);
-  if (element.scope === "props" || element.scope === true) element.scope = element.props;
+  if (element.scope === "props" || element.scope === true)
+    element.scope = element.props;
   createIfConditionFlag(element, parent);
   if (element.node && ref.__if) {
     return assignNode(element, parent, key, attachOptions);
@@ -80,13 +82,17 @@ const create = async (element, parent, key, options = OPTIONS.create || {}, atta
 };
 const createBasedOnType = (element, parent, key, options) => {
   if (element === void 0) {
-    if (ENV === "testing" || ENV === "development") {
-      console.warn(key, "element is undefined in", parent && parent.__ref && parent.__ref.path);
+    if (isNotProduction(ENV)) {
+      console.warn(
+        key,
+        "element is undefined in",
+        parent && parent.__ref && parent.__ref.path
+      );
     }
     return {};
   }
   if (isString(key) && key.slice(0, false)) {
-    if (ENV === "testing" || ENV === "development") {
+    if (isNotProduction(ENV)) {
       console.warn(key, "seems like to be in __ref");
     }
   }
@@ -141,13 +147,15 @@ const switchDefaultOptions = (element, parent, options) => {
   }
 };
 const addElementIntoParentChildren = (element, parent) => {
-  if (parent.__ref && parent.__ref.__children) parent.__ref.__children.push(element.key);
+  if (parent.__ref && parent.__ref.__children)
+    parent.__ref.__children.push(element.key);
 };
 const visitedElements = /* @__PURE__ */ new WeakMap();
 const renderElement = async (element, parent, options, attachOptions) => {
   var _a, _b, _c, _d;
   if (visitedElements.has(element)) {
-    if (ENV === "testing" || ENV === "development") console.warn("Cyclic rendering detected:", element.__ref.path);
+    if (isNotProduction(ENV))
+      console.warn("Cyclic rendering detected:", element.__ref.path);
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
@@ -157,21 +165,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
     await createNode(element, options);
     ref.__uniqId = Math.random();
   };
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction(ENV)) {
     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);
+      if (path.includes("ComponentsGrid"))
+        path.splice(0, path.indexOf("ComponentsGrid") + 2);
+      if (path.includes("demoComponent"))
+        path.splice(0, path.indexOf("demoComponent") + 1);
       const isDemoComponent = (_b = (_a = element.lookup((el) => el.state.key)) == null ? void 0 : _a.state) == null ? void 0 : _b.key;
-      element.warn("Error happened in:", isDemoComponent ? isDemoComponent + " " : "" + path.join("."));
+      element.warn(
+        "Error happened in:",
+        isDemoComponent ? isDemoComponent + " " : "" + path.join(".")
+      );
       element.verbose();
       element.error(e, options);
-      if ((_c = element.on) == null ? void 0 : _c.error) element.on.error(e, element, element.state, element.context, options);
-      if ((_d = element.props) == null ? void 0 : _d.onError) element.props.onError(e, element, element.state, element.context, options);
+      if ((_c = element.on) == null ? void 0 : _c.error)
+        element.on.error(e, element, element.state, element.context, options);
+      if ((_d = element.props) == null ? void 0 : _d.onError)
+        element.props.onError(
+          e,
+          element,
+          element.state,
+          element.context,
+          options
+        );
     }
   }
   if (!ref.__if) {
@@ -199,7 +220,8 @@ const applyValueAsText = (element, parent, key) => {
 const applyContext = (element, parent, options) => {
   const forcedOptionsContext = options.context && !ROOT.context && !element.context;
   if (forcedOptionsContext) ROOT.context = options.context;
-  if (!element.context) element.context = parent.context || options.context || ROOT.context;
+  if (!element.context)
+    element.context = parent.context || options.context || ROOT.context;
 };
 const createScope = (element, parent) => {
   const { __ref: ref } = element;
@@ -224,7 +246,8 @@ const addCaching = (element, parent) => {
   if (!ref.__attr) ref.__attr = {};
   if (!ref.__changes) ref.__changes = [];
   if (!ref.__children) ref.__children = [];
-  if (checkIfKeyIsComponent(key)) ref.__componentKey = key.split("_")[0].split(".")[0].split("+")[0];
+  if (checkIfKeyIsComponent(key))
+    ref.__componentKey = key.split("_")[0].split(".")[0].split("+")[0];
   const hasRoot = parent && parent.key === ":root";
   if (!ref.root) ref.root = hasRoot ? element : parentRef.root;
   if (!parentRef) parentRef = parent.ref = {};
@@ -241,7 +264,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
     if (element.scope === "state") element.scope = element.state;
     createIfConditionFlag(element, parent);
     createProps(element, parent, options);
-    if (element.scope === "props" || element.scope === true) element.scope = element.props;
+    if (element.scope === "props" || element.scope === true)
+      element.scope = element.props;
     if (element.node && ref.__if) {
       parent[key || element.key] = element;
     }
@@ -253,7 +277,8 @@ const onlyResolveExtends = (element, parent, key, options) => {
     throughInitialDefine(element);
     throughInitialExec(element);
     for (const k in element) {
-      if (isUndefined(element[k]) || isMethod(k, element) || isObject((registry.default || registry)[k]) || isVariant(k)) continue;
+      if (isUndefined(element[k]) || isMethod(k, element) || isObject((registry.default || registry)[k]) || isVariant(k))
+        continue;
       const hasDefine = element.define && element.define[k];
       const contextHasDefine = element.context && element.context.define && element.context.define[k];
       const optionsHasDefine = options.define && options.define[k];

package/dist/esm/extend.js

@@ -1,4 +1,4 @@
-import { isFunction, exec } from "@domql/utils";
+import { isFunction, exec, isProduction } from "@domql/utils";
 import {
   getExtendStack,
   jointStacks,
@@ -16,7 +16,7 @@ const applyExtend = (element, parent, options = {}) => {
   const context = element.context || parent.context;
   extend = fallbackStringExtend(extend, context, options, variant);
   const extendStack = getExtendStack(extend, context);
-  if (ENV !== "testing" || ENV !== "development") delete element.extend;
+  if (isProduction(ENV)) delete element.extend;
   let childExtendStack = [];
   if (parent) {
     element.parent = parent;
@@ -26,7 +26,10 @@ const applyExtend = (element, parent, options = {}) => {
       if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
         const canExtendRecursive = element.key !== "__text";
         if (canExtendRecursive) {
-          const childExtendRecursiveStack = getExtendStack(parent.childExtendRecursive, context);
+          const childExtendRecursiveStack = getExtendStack(
+            parent.childExtendRecursive,
+            context
+          );
           childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
           element.childExtendRecursive = parent.childExtendRecursive;
         }
@@ -45,7 +48,10 @@ const applyExtend = (element, parent, options = {}) => {
   } else if (!context.defaultExtends) return element;
   if (context.defaultExtends) {
     if (!mainExtend) {
-      const defaultOptionsExtend = getExtendStack(context.defaultExtends, context);
+      const defaultOptionsExtend = getExtendStack(
+        context.defaultExtends,
+        context
+      );
       mainExtend = cloneAndMergeArrayExtend(defaultOptionsExtend);
       delete mainExtend.extend;
     }
@@ -56,7 +62,9 @@ const applyExtend = (element, parent, options = {}) => {
   const COMPONENTS = context && context.components || options.components;
   const component = exec(element.component || mergedExtend.component, element);
   if (component && COMPONENTS && COMPONENTS[component]) {
-    const componentExtend = cloneAndMergeArrayExtend(getExtendStack(COMPONENTS[component]));
+    const componentExtend = cloneAndMergeArrayExtend(
+      getExtendStack(COMPONENTS[component])
+    );
     mergedExtend = deepMergeExtend(componentExtend, mergedExtend);
   }
   const merged = deepMergeExtend(element, mergedExtend);

package/dist/esm/methods/index.js

@@ -6,7 +6,8 @@ import {
   isObjectLike,
   isProduction,
   removeValueFromArray,
-  deepClone
+  deepClone,
+  isNotProduction
 } from "@domql/utils";
 import { TREE } from "../tree.js";
 import { parseFilters, REGISTRY } from "../mixins/index.js";
@@ -169,7 +170,7 @@ function parseDeep(excl = []) {
   return obj;
 }
 function verbose(element, ...args) {
-  if (ENV !== "testing" && ENV !== "development") return;
+  if (isProduction(ENV)) return;
   const parent = this;
   const { __ref: ref } = parent;
   console.groupCollapsed(parent.key);
@@ -186,18 +187,18 @@ function verbose(element, ...args) {
   return parent;
 }
 function log(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction(ENV)) {
     console.log(...params);
   }
 }
 function warn(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction(ENV)) {
     console.warn(...params);
   }
 }
 function error(...params) {
   var _a, _b;
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction(ENV)) {
     if ((_a = params[params.length - 1]) == null ? void 0 : _a.debugger) debugger;
     if ((_b = params[params.length - 1]) == null ? void 0 : _b.verbose) verbose.call(this, ...params);
     console.error(...params, this);

package/dist/esm/node.js

@@ -1,4 +1,10 @@
-import { exec, isFunction, isObject, isUndefined, isVariant } from "@domql/utils";
+import {
+  exec,
+  isFunction,
+  isObject,
+  isUndefined,
+  isVariant
+} from "@domql/utils";
 import { applyEventsOnNode, triggerEventOn } from "@domql/event";
 import { cacheNode } from "@domql/render";
 import { isMethod } from "./methods/index.js";
@@ -11,6 +17,7 @@ import {
 import { REGISTRY } from "./mixins/index.js";
 import { applyParam } from "./utils/applyParam.js";
 import { propagateEventsFromProps } from "./utils/propEvents.js";
+import { isNotProduction } from "@domql/utils/env.js";
 const ENV = "development";
 const createNode = async (element, options) => {
   let { node, tag, __ref: ref } = element;
@@ -23,7 +30,7 @@ const createNode = async (element, options) => {
     } else node = element.node = cacheNode(element);
     await triggerEventOn("attachNode", element, options);
   }
-  if (ENV === "testing" || ENV === "development" || options.alowRefReference) {
+  if (isNotProduction(ENV) || options.alowRefReference) {
     node.ref = element;
     if (isFunction(node.setAttribute)) node.setAttribute("key", element.key);
   }
@@ -39,7 +46,8 @@ const createNode = async (element, options) => {
   for (const param in element) {
     const value = element[param];
     if (!Object.hasOwnProperty.call(element, param)) continue;
-    if (isUndefined(value) || isMethod(param, element) || isVariant(param) || isObject(REGISTRY[param])) continue;
+    if (isUndefined(value) || isMethod(param, element) || isVariant(param) || isObject(REGISTRY[param]))
+      continue;
     const isElement = await applyParam(param, element, options);
     if (isElement) {
       const { hasDefine, hasContextDefine } = isElement;

package/dist/esm/utils/extendUtils.js

@@ -1,4 +1,11 @@
-import { isArray, isFunction, isObject, isString, deepClone } from "@domql/utils";
+import {
+  isArray,
+  isFunction,
+  isObject,
+  isString,
+  deepClone,
+  isNotProduction
+} from "@domql/utils";
 const ENV = "development";
 const generateHash = () => Math.random().toString(36).substring(2);
 const extendStackRegistry = {};
@@ -73,7 +80,7 @@ const fallbackStringExtend = (extend, context, options = {}, variant) => {
     if (componentExists) return componentExists;
     else if (pageExists) return pageExists;
     else {
-      if (options.verbose && (ENV === "testing" || ENV === "development")) {
+      if (options.verbose && isNotProduction(ENV)) {
         console.warn("Extend is string but component was not found:", extend);
       }
       return {};

package/extend.js

@@ -1,6 +1,6 @@
 'use strict'
 
-import { isFunction, exec } from '@domql/utils'
+import { isFunction, exec, isProduction } from '@domql/utils'
 import {
   getExtendStack,
   jointStacks,
@@ -29,7 +29,7 @@ export const applyExtend = (element, parent, options = {}) => {
 
   const extendStack = getExtendStack(extend, context)
 
-  if (ENV !== 'testing' || ENV !== 'development') delete element.extend
+  if (isProduction(ENV)) delete element.extend
 
   let childExtendStack = []
   if (parent) {
@@ -41,11 +41,15 @@ export const applyExtend = (element, parent, options = {}) => {
       // if (!options.ignoreChildExtend && !(props && exec(props, element).ignoreChildExtend)) {
       //   const ignoreChildExtendRecursive = props && exec(props, element).ignoreChildExtendRecursive
 
-      const ignoreChildExtendRecursive = props && props.ignoreChildExtendRecursive
+      const ignoreChildExtendRecursive =
+        props && props.ignoreChildExtendRecursive
       if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
         const canExtendRecursive = element.key !== '__text'
         if (canExtendRecursive) {
-          const childExtendRecursiveStack = getExtendStack(parent.childExtendRecursive, context)
+          const childExtendRecursiveStack = getExtendStack(
+            parent.childExtendRecursive,
+            context
+          )
           // add error if childExtendRecursive contains element which goes to infinite loop
           childExtendStack = childExtendStack.concat(childExtendRecursiveStack)
           element.childExtendRecursive = parent.childExtendRecursive
@@ -68,7 +72,10 @@ export const applyExtend = (element, parent, options = {}) => {
 
   if (context.defaultExtends) {
     if (!mainExtend) {
-      const defaultOptionsExtend = getExtendStack(context.defaultExtends, context)
+      const defaultOptionsExtend = getExtendStack(
+        context.defaultExtends,
+        context
+      )
       mainExtend = cloneAndMergeArrayExtend(defaultOptionsExtend)
       delete mainExtend.extend
     }
@@ -81,7 +88,9 @@ export const applyExtend = (element, parent, options = {}) => {
   const COMPONENTS = (context && context.components) || options.components
   const component = exec(element.component || mergedExtend.component, element)
   if (component && COMPONENTS && COMPONENTS[component]) {
-    const componentExtend = cloneAndMergeArrayExtend(getExtendStack(COMPONENTS[component]))
+    const componentExtend = cloneAndMergeArrayExtend(
+      getExtendStack(COMPONENTS[component])
+    )
     mergedExtend = deepMergeExtend(componentExtend, mergedExtend)
   }
 

package/methods/index.js

@@ -8,7 +8,8 @@ import {
   isObjectLike,
   isProduction,
   removeValueFromArray,
-  deepClone
+  deepClone,
+  isNotProduction
 } from '@domql/utils'
 import { TREE } from '../tree.js'
 import { parseFilters, REGISTRY } from '../mixins/index.js'
@@ -211,7 +212,7 @@ export function parseDeep (excl = []) {
 }
 
 export function verbose (element, ...args) {
-  if (ENV !== 'testing' && ENV !== 'development') return
+  if (isProduction(ENV)) return
 
   const parent = this
   const { __ref: ref } = parent
@@ -229,19 +230,19 @@ export function verbose (element, ...args) {
 }
 
 export function log (...params) {
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction(ENV)) {
     console.log(...params)
   }
 }
 
 export function warn (...params) {
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction(ENV)) {
     console.warn(...params)
   }
 }
 
 export function error (...params) {
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction(ENV)) {
     if (params[params.length - 1]?.debugger) debugger // eslint-disable-line
     if (params[params.length - 1]?.verbose) verbose.call(this, ...params)
     console.error(...params, this)

package/node.js

@@ -1,6 +1,12 @@
 'use strict'
 
-import { exec, isFunction, isObject, isUndefined, isVariant } from '@domql/utils'
+import {
+  exec,
+  isFunction,
+  isObject,
+  isUndefined,
+  isVariant
+} from '@domql/utils'
 import { applyEventsOnNode, triggerEventOn } from '@domql/event'
 import { cacheNode } from '@domql/render'
 import { isMethod } from './methods/index.js'
@@ -14,6 +20,7 @@ import {
 import { REGISTRY } from './mixins/index.js'
 import { applyParam } from './utils/applyParam.js'
 import { propagateEventsFromProps } from './utils/propEvents.js'
+import { isNotProduction } from '@domql/utils/env.js'
 // import { defineSetter } from './methods'
 
 const ENV = process.env.NODE_ENV
@@ -38,7 +45,7 @@ export const createNode = async (element, options) => {
   }
   // node.dataset // .key = element.key
 
-  if (ENV === 'testing' || ENV === 'development' || options.alowRefReference) {
+  if (isNotProduction(ENV) || options.alowRefReference) {
     node.ref = element
     if (isFunction(node.setAttribute)) node.setAttribute('key', element.key)
   }
@@ -70,7 +77,8 @@ export const createNode = async (element, options) => {
       isMethod(param, element) ||
       isVariant(param) ||
       isObject(REGISTRY[param])
-    ) continue
+    )
+      continue
 
     const isElement = await applyParam(param, element, options)
     if (isElement) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "2.27.8",
+  "version": "2.27.11",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -27,12 +27,12 @@
     "prepublish": "npx rimraf -I dist && npm run build && npm run copy:package:cjs"
   },
   "dependencies": {
-    "@domql/event": "^2.27.8",
-    "@domql/render": "^2.27.8",
-    "@domql/state": "^2.27.8",
-    "@domql/utils": "^2.27.8"
+    "@domql/event": "^2.27.11",
+    "@domql/render": "^2.27.11",
+    "@domql/state": "^2.27.11",
+    "@domql/utils": "^2.27.11"
   },
-  "gitHead": "e783fd54228d5c7aaab9d4b5624199a17a6c4713",
+  "gitHead": "0189e4620f901c763754d06de65bcf6075c05618",
   "devDependencies": {
     "@babel/core": "^7.26.0"
   }

package/utils/extendUtils.js

@@ -1,6 +1,13 @@
 'use strict'
 
-import { isArray, isFunction, isObject, isString, deepClone } from '@domql/utils'
+import {
+  isArray,
+  isFunction,
+  isObject,
+  isString,
+  deepClone,
+  isNotProduction
+} from '@domql/utils'
 const ENV = process.env.NODE_ENV
 
 export const generateHash = () => Math.random().toString(36).substring(2)
@@ -15,13 +22,17 @@ export const getHashedExtend = extend => {
 
 export const setHashedExtend = (extend, stack) => {
   const hash = generateHash()
-  if (!isString(extend)) { extend.__hash = hash }
+  if (!isString(extend)) {
+    extend.__hash = hash
+  }
   extendStackRegistry[hash] = stack
   return stack
 }
 
 export const getExtendStackRegistry = (extend, stack) => {
-  if (extend.__hash) { return stack.concat(getHashedExtend(extend)) }
+  if (extend.__hash) {
+    return stack.concat(getHashedExtend(extend))
+  }
   return setHashedExtend(extend, stack) // stack .concat(hashedExtend)
 }
 
@@ -75,20 +86,25 @@ export const cloneAndMergeArrayExtend = stack => {
   }, {})
 }
 
-export const fallbackStringExtend = (extend, context, options = {}, variant) => {
+export const fallbackStringExtend = (
+  extend,
+  context,
+  options = {},
+  variant
+) => {
   const COMPONENTS = (context && context.components) || options.components
   const PAGES = (context && context.pages) || options.pages
   if (isString(extend)) {
-    const componentExists = COMPONENTS && (
-      COMPONENTS[extend + '.' + variant] ||
-      COMPONENTS[extend] ||
-      COMPONENTS['smbls.' + extend]
-    )
+    const componentExists =
+      COMPONENTS &&
+      (COMPONENTS[extend + '.' + variant] ||
+        COMPONENTS[extend] ||
+        COMPONENTS['smbls.' + extend])
     const pageExists = PAGES && extend.startsWith('/') && PAGES[extend]
     if (componentExists) return componentExists
     else if (pageExists) return pageExists
     else {
-      if (options.verbose && (ENV === 'testing' || ENV === 'development')) {
+      if (options.verbose && isNotProduction(ENV)) {
         console.warn('Extend is string but component was not found:', extend)
       }
       return {}