@domql/element 2.27.0 → 2.27.10

package/create.js

@@ -40,13 +40,18 @@ import {
   applyVariant,
   createValidDomqlObjectFromSugar
 } from './utils/component.js'
-
-const ENV = process.env.NODE_ENV
+import { isNotProduction } from '@domql/utils/env.js'
 
 /**
  * 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 +98,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 +134,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()) {
+      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()) {
       console.warn(key, 'seems like to be in __ref')
     }
   }
@@ -152,7 +162,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 +201,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 +218,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())
+      console.warn('Cyclic rendering detected:', element.__ref.path)
   }
 
   visitedElements.set(element, true)
@@ -230,21 +241,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
   }
 
   // CREATE a real NODE
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction()) {
     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 +297,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 +335,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 +371,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()) {
   if (!parentRef) parentRef = parent.ref = {}
   if (!parentRef.path) parentRef.path = []
   ref.path = parentRef.path.concat(element.key)
@@ -367,9 +402,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 +425,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 +460,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,7 +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");
-const ENV = "development";
+var import_env = require("@domql/utils/env.js");
 const create = async (element, parent, key, options = import_options.OPTIONS.create || {}, attachOptions) => {
   cacheOptions(element, options);
   if (checkIfPrimitive(element)) {
@@ -66,7 +66,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 +85,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)()) {
+      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)()) {
       console.warn(key, "seems like to be in __ref");
     }
   }
@@ -145,13 +150,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)())
+      console.warn("Cyclic rendering detected:", element.__ref.path);
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
@@ -161,21 +168,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)()) {
     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 +223,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 +249,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 +267,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 +280,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

@@ -23,7 +23,6 @@ __export(extend_exports, {
 module.exports = __toCommonJS(extend_exports);
 var import_utils = require("@domql/utils");
 var import_utils2 = require("./utils/index.js");
-const ENV = "development";
 let mainExtend;
 const applyExtend = (element, parent, options = {}) => {
   if ((0, import_utils.isFunction)(element)) element = (0, import_utils.exec)(element, parent);
@@ -33,7 +32,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)()) delete element.extend;
   let childExtendStack = [];
   if (parent) {
     element.parent = parent;
@@ -43,7 +42,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 +64,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 +78,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

@@ -48,12 +48,12 @@ var import_event = require("@domql/event");
 var import_utils = require("@domql/utils");
 var import_tree = require("../tree.js");
 var import_mixins = require("../mixins/index.js");
-const ENV = "development";
 function spotByPath(path) {
   const element = this;
   const arr = [].concat(path);
   let active = import_tree.TREE[arr[0]];
-  if (!arr || !arr.length) return console.log(arr, "on", element.key, "is undefined");
+  if (!arr || !arr.length)
+    return console.log(arr, "on", element.key, "is undefined");
   while (active.key === arr[0]) {
     arr.shift();
     if (!arr.length) break;
@@ -66,7 +66,8 @@ function lookup(param) {
   const el = this;
   let { parent } = el;
   if ((0, import_utils.isFunction)(param)) {
-    if (parent.state && param(parent, parent.state, parent.context)) return parent;
+    if (parent.state && param(parent, parent.state, parent.context))
+      return parent;
     else if (parent.parent) return parent.lookup(param);
     else return;
   }
@@ -136,7 +137,11 @@ async function remove(opts) {
     element.log();
   }
   delete element.parent[element.key];
-  if (element.parent.__ref) element.parent.__ref.__children = (0, import_utils.removeValueFromArray)(element.parent.__ref.__children, element.key);
+  if (element.parent.__ref)
+    element.parent.__ref.__children = (0, import_utils.removeValueFromArray)(
+      element.parent.__ref.__children,
+      element.key
+    );
   await (0, import_event.triggerEventOn)("remove", element, opts);
 }
 function get(param) {
@@ -184,7 +189,8 @@ function parse(excl = []) {
     } else if (v === "props") {
       const { __element, update, ...props } = element[v];
       obj[v] = props;
-    } else if ((0, import_utils.isDefined)(val) && Object.hasOwnProperty.call(element, v)) obj[v] = val;
+    } else if ((0, import_utils.isDefined)(val) && Object.hasOwnProperty.call(element, v))
+      obj[v] = val;
   });
   return obj;
 }
@@ -200,7 +206,7 @@ function parseDeep(excl = []) {
   return obj;
 }
 function verbose(element, ...args) {
-  if (ENV !== "testing" && ENV !== "development") return;
+  if ((0, import_utils.isProduction)()) return;
   const parent = this;
   const { __ref: ref } = parent;
   console.groupCollapsed(parent.key);
@@ -217,18 +223,18 @@ function verbose(element, ...args) {
   return parent;
 }
 function log(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_utils.isNotProduction)()) {
     console.log(...params);
   }
 }
 function warn(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_utils.isNotProduction)()) {
     console.warn(...params);
   }
 }
 function error(...params) {
   var _a, _b;
-  if (ENV === "testing" || ENV === "development") {
+  if ((0, import_utils.isNotProduction)()) {
     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);
@@ -265,7 +271,7 @@ function variables(obj = {}) {
   }
   return {
     changed: (cb) => {
-      if (!changed) return;
+      if (!changed || !varCaches) return;
       const returns = cb(changes, (0, import_utils.deepClone)(varCaches));
       for (const key in changes) {
         varCaches[key] = changes[key];

package/dist/cjs/node.js

@@ -31,7 +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");
-const ENV = "development";
+var import_env = require("@domql/utils/env.js");
 const createNode = async (element, options) => {
   let { node, tag, __ref: ref } = element;
   let isNewNode;
@@ -43,7 +43,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)() || options.alowRefReference) {
     node.ref = element;
     if ((0, import_utils.isFunction)(node.setAttribute)) node.setAttribute("key", element.key);
   }
@@ -59,7 +59,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

@@ -36,7 +36,6 @@ __export(extendUtils_exports, {
 });
 module.exports = __toCommonJS(extendUtils_exports);
 var import_utils = require("@domql/utils");
-const ENV = "development";
 const generateHash = () => Math.random().toString(36).substring(2);
 const extendStackRegistry = {};
 const extendCachedRegistry = {};
@@ -110,7 +109,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)()) {
         console.warn("Extend is string but component was not found:", extend);
       }
       return {};

package/dist/esm/create.js

@@ -33,7 +33,7 @@ import {
   applyVariant,
   createValidDomqlObjectFromSugar
 } from "./utils/component.js";
-const ENV = "development";
+import { isNotProduction } from "@domql/utils/env.js";
 const create = async (element, parent, key, options = OPTIONS.create || {}, attachOptions) => {
   cacheOptions(element, options);
   if (checkIfPrimitive(element)) {
@@ -62,7 +62,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 +81,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()) {
+      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()) {
       console.warn(key, "seems like to be in __ref");
     }
   }
@@ -141,13 +146,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())
+      console.warn("Cyclic rendering detected:", element.__ref.path);
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
@@ -157,21 +164,34 @@ const renderElement = async (element, parent, options, attachOptions) => {
     await createNode(element, options);
     ref.__uniqId = Math.random();
   };
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction()) {
     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 +219,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 +245,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 +263,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 +276,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,
@@ -6,7 +6,6 @@ import {
   deepMergeExtend,
   fallbackStringExtend
 } from "./utils/index.js";
-const ENV = "development";
 let mainExtend;
 const applyExtend = (element, parent, options = {}) => {
   if (isFunction(element)) element = exec(element, parent);
@@ -16,7 +15,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()) delete element.extend;
   let childExtendStack = [];
   if (parent) {
     element.parent = parent;
@@ -26,7 +25,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 +47,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 +61,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

@@ -1,13 +1,22 @@
 import { triggerEventOn } from "@domql/event";
-import { isDefined, isObject, isFunction, isObjectLike, isProduction, removeValueFromArray, deepClone } from "@domql/utils";
+import {
+  isDefined,
+  isObject,
+  isFunction,
+  isObjectLike,
+  isProduction,
+  removeValueFromArray,
+  deepClone,
+  isNotProduction
+} from "@domql/utils";
 import { TREE } from "../tree.js";
 import { parseFilters, REGISTRY } from "../mixins/index.js";
-const ENV = "development";
 function spotByPath(path) {
   const element = this;
   const arr = [].concat(path);
   let active = TREE[arr[0]];
-  if (!arr || !arr.length) return console.log(arr, "on", element.key, "is undefined");
+  if (!arr || !arr.length)
+    return console.log(arr, "on", element.key, "is undefined");
   while (active.key === arr[0]) {
     arr.shift();
     if (!arr.length) break;
@@ -20,7 +29,8 @@ function lookup(param) {
   const el = this;
   let { parent } = el;
   if (isFunction(param)) {
-    if (parent.state && param(parent, parent.state, parent.context)) return parent;
+    if (parent.state && param(parent, parent.state, parent.context))
+      return parent;
     else if (parent.parent) return parent.lookup(param);
     else return;
   }
@@ -90,7 +100,11 @@ async function remove(opts) {
     element.log();
   }
   delete element.parent[element.key];
-  if (element.parent.__ref) element.parent.__ref.__children = removeValueFromArray(element.parent.__ref.__children, element.key);
+  if (element.parent.__ref)
+    element.parent.__ref.__children = removeValueFromArray(
+      element.parent.__ref.__children,
+      element.key
+    );
   await triggerEventOn("remove", element, opts);
 }
 function get(param) {
@@ -138,7 +152,8 @@ function parse(excl = []) {
     } else if (v === "props") {
       const { __element, update, ...props } = element[v];
       obj[v] = props;
-    } else if (isDefined(val) && Object.hasOwnProperty.call(element, v)) obj[v] = val;
+    } else if (isDefined(val) && Object.hasOwnProperty.call(element, v))
+      obj[v] = val;
   });
   return obj;
 }
@@ -154,7 +169,7 @@ function parseDeep(excl = []) {
   return obj;
 }
 function verbose(element, ...args) {
-  if (ENV !== "testing" && ENV !== "development") return;
+  if (isProduction()) return;
   const parent = this;
   const { __ref: ref } = parent;
   console.groupCollapsed(parent.key);
@@ -171,18 +186,18 @@ function verbose(element, ...args) {
   return parent;
 }
 function log(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction()) {
     console.log(...params);
   }
 }
 function warn(...params) {
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction()) {
     console.warn(...params);
   }
 }
 function error(...params) {
   var _a, _b;
-  if (ENV === "testing" || ENV === "development") {
+  if (isNotProduction()) {
     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);
@@ -219,7 +234,7 @@ function variables(obj = {}) {
   }
   return {
     changed: (cb) => {
-      if (!changed) return;
+      if (!changed || !varCaches) return;
       const returns = cb(changes, deepClone(varCaches));
       for (const key in changes) {
         varCaches[key] = changes[key];

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,7 +17,7 @@ import {
 import { REGISTRY } from "./mixins/index.js";
 import { applyParam } from "./utils/applyParam.js";
 import { propagateEventsFromProps } from "./utils/propEvents.js";
-const ENV = "development";
+import { isNotProduction } from "@domql/utils/env.js";
 const createNode = async (element, options) => {
   let { node, tag, __ref: ref } = element;
   let isNewNode;
@@ -23,7 +29,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() || options.alowRefReference) {
     node.ref = element;
     if (isFunction(node.setAttribute)) node.setAttribute("key", element.key);
   }
@@ -39,7 +45,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,5 +1,11 @@
-import { isArray, isFunction, isObject, isString, deepClone } from "@domql/utils";
-const ENV = "development";
+import {
+  isArray,
+  isFunction,
+  isObject,
+  isString,
+  deepClone,
+  isNotProduction
+} from "@domql/utils";
 const generateHash = () => Math.random().toString(36).substring(2);
 const extendStackRegistry = {};
 const extendCachedRegistry = {};
@@ -73,7 +79,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()) {
         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,
@@ -9,8 +9,6 @@ import {
   fallbackStringExtend
 } from './utils/index.js'
 
-const ENV = process.env.NODE_ENV
-
 let mainExtend
 
 /**
@@ -29,7 +27,7 @@ export const applyExtend = (element, parent, options = {}) => {
 
   const extendStack = getExtendStack(extend, context)
 
-  if (ENV !== 'testing' || ENV !== 'development') delete element.extend
+  if (isProduction()) delete element.extend
 
   let childExtendStack = []
   if (parent) {
@@ -41,11 +39,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 +70,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 +86,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

@@ -1,10 +1,18 @@
 'use strict'
 
 import { triggerEventOn } from '@domql/event'
-import { isDefined, isObject, isFunction, isObjectLike, isProduction, removeValueFromArray, deepClone } from '@domql/utils'
+import {
+  isDefined,
+  isObject,
+  isFunction,
+  isObjectLike,
+  isProduction,
+  removeValueFromArray,
+  deepClone,
+  isNotProduction
+} from '@domql/utils'
 import { TREE } from '../tree.js'
 import { parseFilters, REGISTRY } from '../mixins/index.js'
-const ENV = process.env.NODE_ENV
 
 // TODO: update these files
 export function spotByPath (path) {
@@ -12,7 +20,8 @@ export function spotByPath (path) {
   const arr = [].concat(path)
   let active = TREE[arr[0]]
 
-  if (!arr || !arr.length) return console.log(arr, 'on', element.key, 'is undefined')
+  if (!arr || !arr.length)
+    return console.log(arr, 'on', element.key, 'is undefined')
 
   while (active.key === arr[0]) {
     arr.shift()
@@ -30,7 +39,8 @@ export function lookup (param) {
   let { parent } = el
 
   if (isFunction(param)) {
-    if (parent.state && param(parent, parent.state, parent.context)) return parent
+    if (parent.state && param(parent, parent.state, parent.context))
+      return parent
     else if (parent.parent) return parent.lookup(param)
     else return
   }
@@ -111,7 +121,11 @@ export async function remove (opts) {
     element.log()
   }
   delete element.parent[element.key]
-  if (element.parent.__ref) element.parent.__ref.__children = removeValueFromArray(element.parent.__ref.__children, element.key)
+  if (element.parent.__ref)
+    element.parent.__ref.__children = removeValueFromArray(
+      element.parent.__ref.__children,
+      element.key
+    )
   await triggerEventOn('remove', element, opts)
 }
 
@@ -148,7 +162,12 @@ export function keys () {
   const element = this
   const keys = []
   for (const param in element) {
-    if ((REGISTRY[param] && !parseFilters.elementKeys.includes(param)) || !Object.hasOwnProperty.call(element, param)) { continue }
+    if (
+      (REGISTRY[param] && !parseFilters.elementKeys.includes(param)) ||
+      !Object.hasOwnProperty.call(element, param)
+    ) {
+      continue
+    }
     keys.push(param)
   }
   return keys
@@ -164,14 +183,17 @@ export function parse (excl = []) {
     if (v === 'state') {
       if (element.__ref && !element.__ref.__hasRootState) return
       const parsedVal = isFunction(val && val.parse) ? val.parse() : val
-      obj[v] = isFunction(parsedVal) ? parsedVal : JSON.parse(JSON.stringify(parsedVal || {}))
+      obj[v] = isFunction(parsedVal)
+        ? parsedVal
+        : JSON.parse(JSON.stringify(parsedVal || {}))
     } else if (v === 'scope') {
       if (element.__ref && !element.__ref.__hasRootScope) return
       obj[v] = JSON.parse(JSON.stringify(val || {}))
     } else if (v === 'props') {
       const { __element, update, ...props } = element[v]
       obj[v] = props
-    } else if (isDefined(val) && Object.hasOwnProperty.call(element, v)) obj[v] = val
+    } else if (isDefined(val) && Object.hasOwnProperty.call(element, v))
+      obj[v] = val
   })
   return obj
 }
@@ -181,13 +203,15 @@ export function parseDeep (excl = []) {
   const obj = parse.call(element, excl)
   for (const v in obj) {
     if (excl.includes(v)) return
-    if (isObjectLike(obj[v])) { obj[v] = parseDeep.call(obj[v], excl) }
+    if (isObjectLike(obj[v])) {
+      obj[v] = parseDeep.call(obj[v], excl)
+    }
   }
   return obj
 }
 
 export function verbose (element, ...args) {
-  if (ENV !== 'testing' && ENV !== 'development') return
+  if (isProduction()) return
 
   const parent = this
   const { __ref: ref } = parent
@@ -205,19 +229,19 @@ export function verbose (element, ...args) {
 }
 
 export function log (...params) {
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction()) {
     console.log(...params)
   }
 }
 
 export function warn (...params) {
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction()) {
     console.warn(...params)
   }
 }
 
 export function error (...params) {
-  if (ENV === 'testing' || ENV === 'development') {
+  if (isNotProduction()) {
     if (params[params.length - 1]?.debugger) debugger // eslint-disable-line
     if (params[params.length - 1]?.verbose) verbose.call(this, ...params)
     console.error(...params, this)
@@ -260,8 +284,8 @@ export function variables (obj = {}) {
     }
   }
   return {
-    changed: (cb) => {
-      if (!changed) return
+    changed: cb => {
+      if (!changed || !varCaches) return
       const returns = cb(changes, deepClone(varCaches))
       for (const key in changes) {
         varCaches[key] = changes[key]
@@ -280,7 +304,12 @@ export function variables (obj = {}) {
 
 export function call (fnKey, ...args) {
   const context = this.context
-  return (context.utils[fnKey] || context.functions[fnKey] || context.methods[fnKey] || context.snippets[fnKey])?.call(this, ...args)
+  return (
+    context.utils[fnKey] ||
+    context.functions[fnKey] ||
+    context.methods[fnKey] ||
+    context.snippets[fnKey]
+  )?.call(this, ...args)
 }
 
 export const METHODS = [

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,10 +20,9 @@ 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
-
 export const createNode = async (element, options) => {
   // create and assign a node
   let { node, tag, __ref: ref } = element
@@ -38,7 +43,7 @@ export const createNode = async (element, options) => {
   }
   // node.dataset // .key = element.key
 
-  if (ENV === 'testing' || ENV === 'development' || options.alowRefReference) {
+  if (isNotProduction() || options.alowRefReference) {
     node.ref = element
     if (isFunction(node.setAttribute)) node.setAttribute('key', element.key)
   }
@@ -70,7 +75,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.0",
+  "version": "2.27.10",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -21,18 +21,18 @@
   ],
   "scripts": {
     "copy:package:cjs": "cp ../../build/package-cjs.json dist/cjs/package.json",
-    "build:esm": "npx esbuild *.js **/*.js --target=es2019 --format=esm --outdir=dist/esm",
-    "build:cjs": "npx esbuild *.js **/*.js --target=node16 --format=cjs --outdir=dist/cjs",
+    "build:esm": "npx cross-env NODE_ENV=$NODE_ENV npx esbuild *.js **/*.js --target=es2019 --format=esm --outdir=dist/esm",
+    "build:cjs": "npx cross-env NODE_ENV=$NODE_ENV npx esbuild *.js **/*.js --target=node16 --format=cjs --outdir=dist/cjs",
     "build": "npx rimraf -I dist; npm run build:cjs; npm run build:esm",
     "prepublish": "npx rimraf -I dist && npm run build && npm run copy:package:cjs"
   },
   "dependencies": {
-    "@domql/event": "^2.27.0",
-    "@domql/render": "^2.27.0",
-    "@domql/state": "^2.27.0",
-    "@domql/utils": "^2.27.0"
+    "@domql/event": "^2.27.10",
+    "@domql/render": "^2.27.10",
+    "@domql/state": "^2.27.10",
+    "@domql/utils": "^2.27.10"
   },
-  "gitHead": "40a924693178a7d7b9e94aac0282b9d31602eca7",
+  "gitHead": "668d24f518bdb163357897504c5912c085638d3e",
   "devDependencies": {
     "@babel/core": "^7.26.0"
   }

package/utils/extendUtils.js

@@ -1,7 +1,13 @@
 'use strict'
 
-import { isArray, isFunction, isObject, isString, deepClone } from '@domql/utils'
-const ENV = process.env.NODE_ENV
+import {
+  isArray,
+  isFunction,
+  isObject,
+  isString,
+  deepClone,
+  isNotProduction
+} from '@domql/utils'
 
 export const generateHash = () => Math.random().toString(36).substring(2)
 
@@ -15,13 +21,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 +85,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()) {
         console.warn('Extend is string but component was not found:', extend)
       }
       return {}