@domql/element 3.1.2 → 3.2.7

package/dist/cjs/event/animationFrame.js

@@ -0,0 +1,96 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var animationFrame_exports = {};
+__export(animationFrame_exports, {
+  applyAnimationFrame: () => applyAnimationFrame,
+  initAnimationFrame: () => initAnimationFrame,
+  registerFrameListener: () => registerFrameListener
+});
+module.exports = __toCommonJS(animationFrame_exports);
+const registerFrameListener = (el) => {
+  if (!el || !el.__ref) {
+    throw new Error("Element reference is invalid");
+  }
+  const { __ref: ref } = el;
+  if (!ref.root) {
+    throw new Error("Root reference is invalid");
+  }
+  if (!ref.root.data) {
+    throw new Error("Data are undefined");
+  }
+  const { frameListeners } = ref.root.data;
+  if (frameListeners && !frameListeners.has(el)) {
+    frameListeners.add(el);
+  }
+};
+const processFrameListeners = (frameListeners) => {
+  for (const element of frameListeners) {
+    if (!element.__ref.__frameHandler) {
+      const handler = element.on?.frame || element.onFrame || element.props?.onFrame;
+      if (handler) element.__ref.__frameHandler = handler;
+      else {
+        frameListeners.delete(element);
+        continue;
+      }
+    }
+    if (!element.node?.parentNode) {
+      frameListeners.delete(element);
+      delete element.__ref.__frameHandler;
+    } else {
+      try {
+        element.__ref.__frameHandler(element, element.state, element.context);
+      } catch (e) {
+        console.warn(e);
+        frameListeners.delete(element);
+        delete element.__ref.__frameHandler;
+      }
+    }
+  }
+};
+const startFrameLoop = (frameListeners) => {
+  if (_frameRunning) return;
+  _frameRunning = true;
+  function requestFrame() {
+    if (frameListeners.size === 0) {
+      _frameRunning = false;
+      return;
+    }
+    processFrameListeners(frameListeners);
+    window.requestAnimationFrame(requestFrame);
+  }
+  window.requestAnimationFrame(requestFrame);
+};
+const applyAnimationFrame = (element) => {
+  if (!element) {
+    throw new Error("Element is invalid");
+  }
+  const { on, props, __ref: ref } = element;
+  if (!ref.root || !ref.root.data) return;
+  const { frameListeners } = ref.root.data;
+  if (frameListeners && (on?.frame || element.onFrame || props?.onFrame)) {
+    registerFrameListener(element);
+    startFrameLoop(frameListeners);
+  }
+};
+let _frameRunning = false;
+const initAnimationFrame = () => {
+  const frameListeners = /* @__PURE__ */ new Set();
+  startFrameLoop(frameListeners);
+  return frameListeners;
+};

package/dist/cjs/event/can.js

@@ -0,0 +1,28 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var can_exports = {};
+__export(can_exports, {
+  canRenderTag: () => canRenderTag
+});
+module.exports = __toCommonJS(can_exports);
+var import_report = require("@domql/report");
+var import_utils = require("@domql/utils");
+const canRenderTag = (tag) => {
+  return (0, import_utils.isValidHtmlTag)(tag || "div") || (0, import_report.report)("HTMLInvalidTag");
+};

package/dist/cjs/event/index.js

@@ -0,0 +1,20 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var event_exports = {};
+module.exports = __toCommonJS(event_exports);
+__reExport(event_exports, require("./on.js"), module.exports);
+__reExport(event_exports, require("./can.js"), module.exports);
+__reExport(event_exports, require("./animationFrame.js"), module.exports);

package/dist/cjs/event/on.js

@@ -0,0 +1,84 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var on_exports = {};
+__export(on_exports, {
+  applyEvent: () => import_utils2.applyEvent,
+  applyEventUpdate: () => import_utils2.applyEventUpdate,
+  applyEventsOnNode: () => applyEventsOnNode,
+  triggerEventOn: () => import_utils2.triggerEventOn,
+  triggerEventOnUpdate: () => import_utils2.triggerEventOnUpdate
+});
+module.exports = __toCommonJS(on_exports);
+var import_utils = require("@domql/utils");
+var import_utils2 = require("@domql/utils");
+const getOnOrPropsEvent = (param, element) => {
+  const onEvent = element.on?.[param];
+  if (onEvent) return onEvent;
+  const props = element.props;
+  if (!props) return;
+  const propKey = "on" + param.charAt(0).toUpperCase() + param.slice(1);
+  return props[propKey];
+};
+const registerNodeEvent = (param, element, node, options) => {
+  const appliedFunction = getOnOrPropsEvent(param, element);
+  if ((0, import_utils.isFunction)(appliedFunction)) {
+    const { __ref: ref } = element;
+    if (!ref.__eventListeners) ref.__eventListeners = {};
+    if (ref.__eventListeners[param]) {
+      node.removeEventListener(param, ref.__eventListeners[param]);
+    }
+    const handler = (event) => {
+      const { state, context } = element;
+      const result = appliedFunction.call(
+        element,
+        event,
+        element,
+        state,
+        context,
+        options
+      );
+      if (result && typeof result.then === "function") {
+        result.catch(() => {
+        });
+      }
+    };
+    ref.__eventListeners[param] = handler;
+    node.addEventListener(param, handler);
+  }
+};
+const applyEventsOnNode = (element, options) => {
+  const { node, on, props } = element;
+  const handled = /* @__PURE__ */ new Set();
+  for (const param in on) {
+    if (import_utils.DOMQL_EVENTS.has(param)) continue;
+    handled.add(param);
+    registerNodeEvent(param, element, node, options);
+  }
+  if (props) {
+    for (const key in props) {
+      if (key.length > 2 && key.charCodeAt(0) === 111 && key.charCodeAt(1) === 110 && (0, import_utils.isFunction)(props[key])) {
+        const thirdChar = key[2];
+        if (thirdChar !== thirdChar.toUpperCase()) continue;
+        const eventName = thirdChar.toLowerCase() + key.slice(3);
+        if (handled.has(eventName) || import_utils.DOMQL_EVENTS.has(eventName)) continue;
+        registerNodeEvent(eventName, element, node, options);
+      }
+    }
+  }
+};

package/dist/cjs/event/store.js

@@ -0,0 +1,27 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var store_exports = {};
+__export(store_exports, {
+  default: () => store_default
+});
+module.exports = __toCommonJS(store_exports);
+var store_default = {
+  click: [],
+  render: []
+};

package/dist/cjs/extend.js

@@ -0,0 +1,88 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var extend_exports = {};
+__export(extend_exports, {
+  applyExtend: () => applyExtend
+});
+module.exports = __toCommonJS(extend_exports);
+var import_utils = require("@domql/utils");
+var import_utils2 = require("./utils/index.js");
+let mainExtend;
+const applyExtend = (element, parent, options = {}) => {
+  if ((0, import_utils.isFunction)(element)) element = (0, import_utils.exec)(element, parent);
+  const { props, __ref } = element;
+  let extend = props?.extends || element.extends || element.extend;
+  const variant = props?.variant;
+  const context = element.context || parent.context;
+  extend = (0, import_utils2.fallbackStringExtend)(extend, context, options, variant);
+  const extendStack = (0, import_utils2.getExtendStack)(extend, context);
+  delete element.extend;
+  let childExtendStack = [];
+  if (parent) {
+    element.parent = parent;
+    if (!options.ignoreChildExtend && !props?.ignoreChildExtend) {
+      childExtendStack = (0, import_utils2.getExtendStack)(parent.childExtend, context);
+      const ignoreChildExtendRecursive = props?.ignoreChildExtendRecursive;
+      if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
+        const canExtendRecursive = element.key !== "__text";
+        if (canExtendRecursive) {
+          const childExtendRecursiveStack = (0, import_utils2.getExtendStack)(
+            parent.childExtendRecursive,
+            context
+          );
+          childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
+          element.childExtendRecursive = parent.childExtendRecursive;
+        }
+      }
+    }
+  }
+  const extendLength = extendStack.length;
+  const childExtendLength = childExtendStack.length;
+  let stack = [];
+  if (extendLength && childExtendLength) {
+    stack = (0, import_utils2.jointStacks)(extendStack, childExtendStack);
+  } else if (extendLength) {
+    stack = extendStack;
+  } else if (childExtendLength) {
+    stack = childExtendStack;
+  } else if (!context.defaultExtends) return element;
+  if (context.defaultExtends) {
+    if (!mainExtend) {
+      const defaultOptionsExtend = (0, import_utils2.getExtendStack)(
+        context.defaultExtends,
+        context
+      );
+      mainExtend = (0, import_utils2.cloneAndMergeArrayExtend)(defaultOptionsExtend);
+      delete mainExtend.extend;
+    }
+    stack = [].concat(stack, mainExtend);
+  }
+  if (__ref) __ref.__extend = stack;
+  let mergedExtend = (0, import_utils2.cloneAndMergeArrayExtend)(stack);
+  const COMPONENTS = context?.components || options.components;
+  const component = (0, import_utils.exec)(element.component || mergedExtend.component, element);
+  if (component && 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);
+  return merged;
+};

package/dist/cjs/index.js

@@ -17,6 +17,7 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
   // If the importer is in node compatibility mode or this is not an ESM
   // file that has been converted to a CommonJS file using a Babel-
@@ -36,9 +37,11 @@ __export(index_exports, {
   update: () => import_update.default
 });
 module.exports = __toCommonJS(index_exports);
-var import_tree = require("./tree");
-var import_create = __toESM(require("./create"), 1);
-var import_node = __toESM(require("./node"), 1);
-var import_define = __toESM(require("./define"), 1);
-var import_update = __toESM(require("./update"), 1);
-var import_set = __toESM(require("./set"), 1);
+var import_tree = require("./tree.js");
+var import_create = __toESM(require("./create.js"), 1);
+var import_node = __toESM(require("./node.js"), 1);
+var import_define = __toESM(require("./define.js"), 1);
+var import_update = __toESM(require("./update.js"), 1);
+var import_set = __toESM(require("./set.js"), 1);
+__reExport(index_exports, require("./event/index.js"), module.exports);
+__reExport(index_exports, require("./render/index.js"), module.exports);

package/dist/cjs/iterate.js

@@ -18,7 +18,6 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var iterate_exports = {};
 __export(iterate_exports, {
-  isPropertyInDefines: () => isPropertyInDefines,
   throughExecProps: () => throughExecProps,
   throughInitialDefine: () => throughInitialDefine,
   throughInitialExec: () => throughInitialExec,
@@ -27,14 +26,21 @@ __export(iterate_exports, {
 });
 module.exports = __toCommonJS(iterate_exports);
 var import_utils = require("@domql/utils");
-const throughInitialExec = async (element, exclude = {}) => {
+const throughInitialExec = (element, exclude = {}) => {
   const { __ref: ref } = element;
   for (const param in element) {
     if (exclude[param]) continue;
     const prop = element[param];
     if ((0, import_utils.isFunction)(prop) && !(0, import_utils.isMethod)(param, element)) {
       ref.__exec[param] = prop;
-      element[param] = await prop(element, element.state, element.context);
+      const result = prop(element, element.state, element.context);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          element[param] = resolved;
+        });
+      } else {
+        element[param] = result;
+      }
     }
   }
 };
@@ -46,8 +52,14 @@ const throughUpdatedExec = (element, options = {}) => {
     const isDefinedParam = ref.__defineCache[param];
     if (isDefinedParam) continue;
     const newExec = ref.__exec[param](element, element.state, element.context);
+    if (newExec && typeof newExec.then === "function") {
+      newExec.then((resolved) => {
+        element[param] = resolved;
+      });
+      continue;
+    }
     const execReturnsString = (0, import_utils.isString)(newExec) || (0, import_utils.isNumber)(newExec);
-    if (prop && prop.node && execReturnsString) {
+    if (prop?.node && execReturnsString) {
       (0, import_utils.overwrite)(prop, { text: newExec });
     } else if (newExec !== prop) {
       if ((0, import_utils.matchesComponentNaming)(param)) {
@@ -65,66 +77,110 @@ const throughUpdatedExec = (element, options = {}) => {
   }
   return changes;
 };
-const throughExecProps = async (element) => {
+const throughExecProps = (element) => {
   const { __ref: ref } = element;
   const { props } = element;
   for (const k in props) {
-    const isDefine = k.startsWith("is") || k.startsWith("has") || k.startsWith("use");
+    const c0 = k.charCodeAt(0);
+    const c1 = k.charCodeAt(1);
+    const isDefine = c0 === 105 && c1 === 115 || // 'is'
+    c0 === 104 && c1 === 97 && k.charCodeAt(2) === 115 || // 'has'
+    c0 === 117 && c1 === 115 && k.charCodeAt(2) === 101;
     const cachedExecProp = ref.__execProps[k];
     if ((0, import_utils.isFunction)(cachedExecProp)) {
-      props[k] = await (0, import_utils.execPromise)(cachedExecProp, element);
+      const result = (0, import_utils.exec)(cachedExecProp, element);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          props[k] = resolved;
+        });
+      } else {
+        props[k] = result;
+      }
     } else if (isDefine && (0, import_utils.isFunction)(props[k])) {
       ref.__execProps[k] = props[k];
-      props[k] = await (0, import_utils.execPromise)(props[k], element);
+      const result = (0, import_utils.exec)(props[k], element);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          props[k] = resolved;
+        });
+      } else {
+        props[k] = result;
+      }
     }
   }
 };
-const isPropertyInDefines = (key, element) => {
-};
-const throughInitialDefine = async (element) => {
+const throughInitialDefine = (element) => {
   const { define, context, __ref: ref } = element;
-  let defineObj = {};
+  const hasLocalDefine = (0, import_utils.isObject)(define);
   const hasGlobalDefine = context && (0, import_utils.isObject)(context.define);
-  if ((0, import_utils.isObject)(define)) defineObj = { ...define };
-  if (hasGlobalDefine) defineObj = { ...defineObj, ...context.define };
+  if (!hasLocalDefine && !hasGlobalDefine) return element;
+  const defineObj = hasLocalDefine && hasGlobalDefine ? { ...define, ...context.define } : hasLocalDefine ? define : context.define;
   for (const param in defineObj) {
     let elementProp = element[param];
     if ((0, import_utils.isFunction)(elementProp) && !(0, import_utils.isMethod)(param, element)) {
       ref.__exec[param] = elementProp;
-      const execParam2 = elementProp = await (0, import_utils.execPromise)(elementProp, element);
-      if (execParam2) {
-        elementProp = element[param] = execParam2.parse ? execParam2.parse() : execParam2;
-        ref.__defineCache[param] = elementProp;
+      let execParam2 = (0, import_utils.exec)(elementProp, element);
+      if (execParam2 && typeof execParam2.then === "function") {
+        execParam2.then((resolved) => {
+          elementProp = element[param] = resolved && resolved.parse ? resolved.parse() : resolved;
+          if (resolved) {
+            ref.__defineCache[param] = elementProp;
+          }
+        });
+      } else {
+        elementProp = element[param] = execParam2 && execParam2.parse ? execParam2.parse() : execParam2;
+        if (execParam2) {
+          ref.__defineCache[param] = elementProp;
+        }
       }
     }
-    const execParam = await defineObj[param](
+    const execParam = defineObj[param](
       elementProp,
       element,
       element.state,
       element.context
     );
-    if (execParam) element[param] = execParam;
+    if (execParam && typeof execParam.then === "function") {
+      execParam.then((resolved) => {
+        if (resolved) element[param] = resolved;
+      });
+    } else if (execParam) {
+      element[param] = execParam;
+    }
   }
   return element;
 };
-const throughUpdatedDefine = async (element) => {
+const throughUpdatedDefine = (element) => {
   const { context, define, __ref: ref } = element;
-  const changes = {};
-  let obj = {};
-  if ((0, import_utils.isObject)(define)) obj = { ...define };
-  if ((0, import_utils.isObject)(context && context.define)) obj = { ...obj, ...context.define };
+  const hasLocalDefine = (0, import_utils.isObject)(define);
+  const hasGlobalDefine = (0, import_utils.isObject)(context?.define);
+  if (!hasLocalDefine && !hasGlobalDefine) return;
+  const obj = hasLocalDefine && hasGlobalDefine ? { ...define, ...context.define } : hasLocalDefine ? define : context.define;
   for (const param in obj) {
     const execParam = ref.__exec[param];
     if (execParam) {
-      ref.__defineCache[param] = await execParam(
-        element,
-        element.state,
-        element.context
-      );
+      const result = execParam(element, element.state, element.context);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          ref.__defineCache[param] = resolved;
+        });
+      } else {
+        ref.__defineCache[param] = result;
+      }
+    }
+    const cached = (0, import_utils.exec)(ref.__defineCache[param], element);
+    if (cached && typeof cached.then === "function") {
+      cached.then((resolved) => {
+      });
+      continue;
     }
-    const cached = await (0, import_utils.execPromise)(ref.__defineCache[param], element);
     const newExecParam = typeof obj[param] === "function" ? obj[param](cached, element, element.state, element.context) : void 0;
-    if (newExecParam) element[param] = newExecParam;
+    if (newExecParam && typeof newExecParam.then === "function") {
+      newExecParam.then((resolved) => {
+        element[param] = resolved;
+      });
+    } else if (newExecParam) {
+      element[param] = newExecParam;
+    }
   }
-  return changes;
 };

package/dist/cjs/methods/set.js

@@ -40,6 +40,11 @@ const addMethods = (element, parent, options = {}) => {
     lookdownAll: import_methods.lookdownAll,
     getRef: import_methods.getRef,
     getPath: import_methods.getPath,
+    getRootState: import_methods.getRootState,
+    getRoot: import_methods.getRoot,
+    getRootData: import_methods.getRootData,
+    getRootContext: import_methods.getRootContext,
+    getContext: import_methods.getContext,
     setNodeStyles: import_methods.setNodeStyles,
     spotByPath: import_methods.spotByPath,
     parse: import_methods.parse,

package/dist/cjs/methods/v2.js

@@ -73,7 +73,7 @@ const log = function(...args) {
     args.forEach((v) => console.log(`%c${v}:
 `, "font-weight: bold", element[v]));
   } else {
-    console.log(__ref == null ? void 0 : __ref.path);
+    console.log(__ref?.path);
     const keys2 = element.keys();
     keys2.forEach((v) => console.log(`%c${v}:
 `, "font-weight: bold", element[v]));

package/dist/cjs/mixins/attr.js

@@ -27,13 +27,14 @@ var import_report = require("@domql/report");
 function attr(params, element, node) {
   const { __ref: ref, props } = element;
   const { __attr } = ref;
-  if ((0, import_utils.isNot)("object")) (0, import_report.report)("HTMLInvalidAttr", params);
+  if ((0, import_utils.isNot)(params)("object")) (0, import_report.report)("HTMLInvalidAttr", params);
   if (params) {
     const attrs = (0, import_utils.exec)(params, element);
     if (props.attr) (0, import_utils.deepMerge)(attrs, props.attr);
     for (const attr2 in attrs) {
       const val = (0, import_utils.exec)(attrs[attr2], element);
-      if (val !== false && !(0, import_utils.isUndefined)(val) && !(0, import_utils.isNull)(val) && node.setAttribute) {
+      if (val === __attr[attr2]) continue;
+      if (val !== false && val !== void 0 && val !== null && node.setAttribute) {
         node.setAttribute(attr2, val);
       } else if (node.removeAttribute) node.removeAttribute(attr2);
       __attr[attr2] = val;

package/dist/cjs/mixins/classList.js

@@ -57,7 +57,17 @@ const classList = (params, element) => {
 };
 const applyClassListOnNode = (params, element, node) => {
   const className = classList(params, element);
-  node.classList = className;
+  const { __ref } = element;
+  if (className === __ref.__className) return className;
+  __ref.__className = className;
+  if (node && typeof node.setAttribute === "function") {
+    node.setAttribute("class", className);
+  } else if (node) {
+    try {
+      node.className = className;
+    } catch (e) {
+    }
+  }
   return className;
 };
 function applyClasslist(params, element, node) {