eleva 1.2.2-alpha → 1.2.3-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eleva",
-  "version": "1.2.2-alpha",
+  "version": "1.2.3-alpha",
   "description": "A minimalist and lightweight, pure vanilla JavaScript frontend runtime framework.",
   "type": "module",
   "main": "dist/eleva.js",
@@ -10,7 +10,8 @@
   "exports": {
     ".": {
       "require": "./dist/eleva.js",
-      "import": "./dist/eleva.esm.js"
+      "import": "./dist/eleva.esm.js",
+      "types": "./dist/eleva.d.ts"
     }
   },
   "scripts": {
@@ -18,45 +19,129 @@
     "build": "rollup -c",
     "build:types": "tsc --emitDeclarationOnly",
     "build:types:bundle": "rollup -c rollup.dts.config.js",
-    "build:all": "npm run build && npm run build:types && npm run build:types:bundle",
-    "test": "jest",
+    "build:all": "npm run clean && npm run build && npm run build:types && npm run build:types:bundle",
+    "docs:dev": "vitepress dev docs",
+    "docs:build": "vitepress build docs",
+    "docs:preview": "vitepress preview docs",
+    "docs:api": "jsdoc -c jsdoc.json",
+    "docs:generate": "npm run docs:api && npm run docs:build",
+    "test": "npm run test:all",
+    "test:source": "jest -c jest.source.config.js",
+    "test:source:unit": "jest -c jest.source.config.js --testPathPattern=source/unit",
+    "test:source:performance": "jest -c jest.source.config.js --testPathPattern=source/performance",
+    "test:source:coverage": "jest -c jest.source.config.js --testPathPattern=source/unit --coverage",
+    "test:source:watch": "jest -c jest.source.config.js --watch",
+    "test:source:debug": "jest -c jest.source.config.js --runInBand --no-cache --watchAll",
+    "test:build": "jest -c jest.build.config.js",
+    "test:build:unit": "jest -c jest.build.config.js --testPathPattern=build/unit",
+    "test:build:performance": "jest -c jest.build.config.js --testPathPattern=build/performance",
+    "test:build:coverage": "jest -c jest.build.config.js --coverage",
+    "test:build:watch": "jest -c jest.build.config.js --watch",
+    "test:build:debug": "jest -c jest.build.config.js --runInBand --no-cache --watchAll",
+    "test:all": "npm run test:source && npm run test:build",
+    "codecov": "npx codecov",
     "lint": "eslint src/**/*.js",
+    "format": "npx prettier \"src/**/*\" \"types/**/*\" --write",
     "size": "size-limit",
-    "prepublishOnly": "npm run build && npm run build:types && npm run build:types:bundle"
+    "clean": "rimraf dist types",
+    "prepublishOnly": "npm run format && npm run lint && npm run test:source:coverage && npm run build:all",
+    "prepare": "npm run build:all"
+  },
+  "engines": {
+    "node": ">=16.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.1",
-    "@babel/preset-env": "^7.22.4",
+    "@babel/core": "^7.26.10",
+    "@babel/preset-env": "^7.26.9",
+    "@codecov/rollup-plugin": "^1.9.0",
     "@rollup/plugin-babel": "^6.0.3",
     "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-terser": "^0.4.4",
     "@size-limit/preset-app": "^11.2.0",
+    "babel-jest": "^29.7.0",
     "eslint": "^9.0.0",
+    "eslint-plugin-prettier": "^5.2.5",
+    "husky": "^9.1.7",
     "jest": "^29.6.1",
+    "jest-environment-jsdom": "^29.7.0",
+    "jest-html-reporters": "^3.1.7",
+    "jest-watch-typeahead": "^2.2.2",
+    "jsdoc": "^4.0.4",
+    "lint-staged": "^15.5.0",
+    "prettier": "^3.5.3",
+    "rimraf": "^6.0.1",
     "rollup": "^4.34.8",
     "rollup-plugin-dts": "^6.1.1",
     "size-limit": "^11.2.0",
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "vitepress": "^1.6.3"
+  },
+  "lint-staged": {
+    "src/**/*.{js,ts}": [
+      "eslint --fix",
+      "prettier --write"
+    ]
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
   },
   "size-limit": [
     {
       "limit": "5 kB",
       "path": "dist/eleva.min.js",
       "name": "eleva",
-      "brotli": false
+      "brotli": true
     }
   ],
   "keywords": [
-    "modern",
-    "frontend",
-    "framework",
-    "lightweight",
-    "fast",
-    "ui",
-    "components",
-    "speed",
-    "performance"
+    "modern javascript framework",
+    "lightweight JavaScript framework",
+    "lightweight JS framework",
+    "frontend performance optimization",
+    "frontend performance",
+    "performance optimization",
+    "tiny footprint",
+    "minimal framework",
+    "fast framework",
+    "highly performant",
+    "lightweight framework",
+    "frontend optimization",
+    "small bundle size",
+    "tree-shakable",
+    "ui components",
+    "vanilla JavaScript",
+    "vanilla-js",
+    "vanilla framework",
+    "vanilla JavaScript framework",
+    "signal-based reactivity",
+    "reactivity",
+    "frontend runtime",
+    "runtime framework",
+    "web components",
+    "javascript framework",
+    "frontend framework",
+    "direct DOM",
+    "high performance",
+    "open source",
+    "modular",
+    "developer friendly",
+    "efficient",
+    "scalable",
+    "pure JavaScript",
+    "minimalist framework",
+    "high-speed rendering",
+    "unopinionated",
+    "typescript",
+    "typescript support",
+    "single-page applications",
+    "UI library",
+    "web development",
+    "web development framework",
+    "web development tools",
+    "micro frontends"
   ],
   "author": {
     "name": "Tarek Raafat",
@@ -64,7 +149,7 @@
     "url": "https://www.tarekraafat.com"
   },
   "license": "MIT",
-  "homepage": "https://tarekraafat.github.io/eleva",
+  "homepage": "https://elevajs.com",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/TarekRaafat/eleva.git"
@@ -76,12 +161,32 @@
   "directories": {
     "doc": "docs",
     "example": "examples",
-    "test": "test"
+    "test": "test",
+    "dist": "dist",
+    "src": "src",
+    "types": "types"
   },
   "files": [
     "dist",
     "types",
     "src"
   ],
-  "sideEffects": false
+  "sideEffects": false,
+  "funding": [
+    {
+      "type": "github",
+      "url": "https://github.com/sponsors/TarekRaafat"
+    },
+    {
+      "type": "buymeacoffee",
+      "url": "https://www.buymeacoffee.com/tarekraafat"
+    }
+  ],
+  "browserslist": [
+    "> 0.25%",
+    "last 2 versions",
+    "not dead",
+    "not op_mini all",
+    "not ie 11"
+  ]
 }

package/src/core/Eleva.js

@@ -151,6 +151,7 @@ export class Eleva {
       const mergedContext = { ...context, ...data };
       const watcherUnsubscribers = [];
       const childInstances = [];
+      const cleanupListeners = [];
 
       if (!this._isMounted) {
         mergedContext.onBeforeMount && mergedContext.onBeforeMount();
@@ -168,7 +169,7 @@ export class Eleva {
           mergedContext
         );
         this.renderer.patchDOM(container, newHtml);
-        this._processEvents(container, mergedContext);
+        this._processEvents(container, mergedContext, cleanupListeners);
         this._injectStyles(container, compName, style, mergedContext);
         this._mountChildren(container, children, childInstances);
         if (!this._isMounted) {
@@ -194,12 +195,13 @@ export class Eleva {
         container,
         data: mergedContext,
         /**
-         * Unmounts the component, cleaning up watchers, child components, and clearing the container.
+         * Unmounts the component, cleaning up watchers and listeners, child components, and clearing the container.
          *
          * @returns {void}
          */
         unmount: () => {
           watcherUnsubscribers.forEach((fn) => fn());
+          cleanupListeners.forEach((fn) => fn());
           childInstances.forEach((child) => child.unmount());
           mergedContext.onUnmount && mergedContext.onUnmount();
           container.innerHTML = "";
@@ -228,12 +230,14 @@ export class Eleva {
 
   /**
    * Processes DOM elements for event binding based on attributes starting with "@".
+   * Tracks listeners for cleanup during unmount.
    *
    * @param {HTMLElement} container - The container element in which to search for events.
    * @param {Object<string, any>} context - The current context containing event handler definitions.
+   * @param {Array<Function>} cleanupListeners - Array to collect cleanup functions for each event listener.
    * @private
    */
-  _processEvents(container, context) {
+  _processEvents(container, context, cleanupListeners) {
     container.querySelectorAll("*").forEach((el) => {
       [...el.attributes].forEach(({ name, value }) => {
         if (name.startsWith("@")) {
@@ -242,6 +246,7 @@ export class Eleva {
           if (typeof handler === "function") {
             el.addEventListener(event, handler);
             el.removeAttribute(name);
+            cleanupListeners.push(() => el.removeEventListener(event, handler));
           }
         }
       });
@@ -288,7 +293,7 @@ export class Eleva {
         const props = {};
         [...childEl.attributes].forEach(({ name, value }) => {
           if (name.startsWith("eleva-prop-")) {
-            props[name.slice("eleva-prop-".length)] = value;
+            props[name.replace("eleva-prop-", "")] = value;
           }
         });
         const instance = this.mount(childEl, children[childSelector], props);

package/src/modules/Renderer.js

@@ -12,11 +12,25 @@ export class Renderer {
    *
    * @param {HTMLElement} container - The container element to patch.
    * @param {string} newHtml - The new HTML content to apply.
+   * @throws {Error} If container is not an HTMLElement or newHtml is not a string
    */
   patchDOM(container, newHtml) {
+    if (!(container instanceof HTMLElement)) {
+      throw new Error("Container must be an HTMLElement");
+    }
+    if (typeof newHtml !== "string") {
+      throw new Error("newHtml must be a string");
+    }
+
     const tempContainer = document.createElement("div");
-    tempContainer.innerHTML = newHtml;
-    this.diff(container, tempContainer);
+    try {
+      tempContainer.innerHTML = newHtml;
+      this.diff(container, tempContainer);
+    } catch (error) {
+      throw new Error(`Failed to patch DOM: ${error.message}`);
+    } finally {
+      tempContainer.innerHTML = "";
+    }
   }
 
   /**
@@ -24,36 +38,53 @@ export class Renderer {
    *
    * @param {HTMLElement} oldParent - The original DOM element.
    * @param {HTMLElement} newParent - The new DOM element.
+   * @throws {Error} If either parent is not an HTMLElement
    */
   diff(oldParent, newParent) {
+    if (
+      !(oldParent instanceof HTMLElement) ||
+      !(newParent instanceof HTMLElement)
+    ) {
+      throw new Error("Both parents must be HTMLElements");
+    }
+
+    // Fast path for identical nodes
+    if (oldParent.isEqualNode(newParent)) return;
+
     const oldNodes = Array.from(oldParent.childNodes);
     const newNodes = Array.from(newParent.childNodes);
     const max = Math.max(oldNodes.length, newNodes.length);
+
+    // Batch DOM operations for better performance
+    const operations = [];
+
     for (let i = 0; i < max; i++) {
       const oldNode = oldNodes[i];
       const newNode = newNodes[i];
 
       // Case 1: Append new nodes that don't exist in the old tree.
       if (!oldNode && newNode) {
-        oldParent.appendChild(newNode.cloneNode(true));
+        operations.push(() => oldParent.appendChild(newNode.cloneNode(true)));
         continue;
       }
       // Case 2: Remove old nodes not present in the new tree.
       if (oldNode && !newNode) {
-        oldParent.removeChild(oldNode);
+        operations.push(() => oldParent.removeChild(oldNode));
         continue;
       }
 
       // Case 3: For element nodes, compare keys if available.
       if (
-        oldNode.nodeType === Node.ELEMENT_NODE &&
-        newNode.nodeType === Node.ELEMENT_NODE
+        oldNode?.nodeType === Node.ELEMENT_NODE &&
+        newNode?.nodeType === Node.ELEMENT_NODE
       ) {
         const oldKey = oldNode.getAttribute("key");
         const newKey = newNode.getAttribute("key");
         if (oldKey || newKey) {
           if (oldKey !== newKey) {
-            oldParent.replaceChild(newNode.cloneNode(true), oldNode);
+            operations.push(() =>
+              oldParent.replaceChild(newNode.cloneNode(true), oldNode)
+            );
             continue;
           }
         }
@@ -61,25 +92,32 @@ export class Renderer {
 
       // Case 4: Replace nodes if types or tag names differ.
       if (
-        oldNode.nodeType !== newNode.nodeType ||
-        oldNode.nodeName !== newNode.nodeName
+        oldNode?.nodeType !== newNode?.nodeType ||
+        oldNode?.nodeName !== newNode?.nodeName
       ) {
-        oldParent.replaceChild(newNode.cloneNode(true), oldNode);
+        operations.push(() =>
+          oldParent.replaceChild(newNode.cloneNode(true), oldNode)
+        );
         continue;
       }
+
       // Case 5: For text nodes, update content if different.
-      if (oldNode.nodeType === Node.TEXT_NODE) {
+      if (oldNode?.nodeType === Node.TEXT_NODE) {
         if (oldNode.nodeValue !== newNode.nodeValue) {
           oldNode.nodeValue = newNode.nodeValue;
         }
         continue;
       }
+
       // Case 6: For element nodes, update attributes and then diff children.
-      if (oldNode.nodeType === Node.ELEMENT_NODE) {
+      if (oldNode?.nodeType === Node.ELEMENT_NODE) {
         this.updateAttributes(oldNode, newNode);
         this.diff(oldNode, newNode);
       }
     }
+
+    // Execute batched operations
+    operations.forEach((op) => op());
   }
 
   /**
@@ -87,33 +125,74 @@ export class Renderer {
    *
    * @param {HTMLElement} oldEl - The element to update.
    * @param {HTMLElement} newEl - The element providing the updated attributes.
+   * @throws {Error} If either element is not an HTMLElement
    */
   updateAttributes(oldEl, newEl) {
-    const attributeToPropertyMap = {
-      value: "value",
-      checked: "checked",
-      selected: "selected",
-      disabled: "disabled",
+    if (!(oldEl instanceof HTMLElement) || !(newEl instanceof HTMLElement)) {
+      throw new Error("Both elements must be HTMLElements");
+    }
+
+    // Special cases for properties that don't map directly to attributes
+    const specialProperties = {
+      value: true,
+      checked: true,
+      selected: true,
+      disabled: true,
+      readOnly: true,
+      multiple: true,
     };
 
-    // Remove old attributes that no longer exist.
+    // Batch attribute operations for better performance
+    const operations = [];
+
+    // Remove old attributes that no longer exist
     Array.from(oldEl.attributes).forEach((attr) => {
       if (attr.name.startsWith("@")) return;
       if (!newEl.hasAttribute(attr.name)) {
-        oldEl.removeAttribute(attr.name);
+        operations.push(() => oldEl.removeAttribute(attr.name));
       }
     });
-    // Add or update attributes from newEl.
+
+    // Add or update attributes from newEl
     Array.from(newEl.attributes).forEach((attr) => {
       if (attr.name.startsWith("@")) return;
       if (oldEl.getAttribute(attr.name) !== attr.value) {
-        oldEl.setAttribute(attr.name, attr.value);
-        if (attributeToPropertyMap[attr.name]) {
-          oldEl[attributeToPropertyMap[attr.name]] = attr.value;
-        } else if (attr.name in oldEl) {
-          oldEl[attr.name] = attr.value;
-        }
+        operations.push(() => {
+          oldEl.setAttribute(attr.name, attr.value);
+
+          // Convert kebab-case to camelCase for property names
+          const propName = attr.name.replace(/-([a-z])/g, (_, letter) =>
+            letter.toUpperCase()
+          );
+
+          // Handle special cases first
+          if (specialProperties[propName]) {
+            oldEl[propName] = attr.value === "" ? true : attr.value;
+          }
+          // Handle ARIA attributes
+          else if (attr.name.startsWith("aria-")) {
+            const ariaName =
+              "aria" +
+              attr.name
+                .slice(5)
+                .replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
+            oldEl[ariaName] = attr.value;
+          }
+          // Handle data attributes
+          else if (attr.name.startsWith("data-")) {
+            // dataset handles the camelCase conversion automatically
+            const dataName = attr.name.slice(5);
+            oldEl.dataset[dataName] = attr.value;
+          }
+          // Handle standard properties
+          else if (propName in oldEl) {
+            oldEl[propName] = attr.value;
+          }
+        });
       }
     });
+
+    // Execute batched operations
+    operations.forEach((op) => op());
   }
 }

package/src/modules/Signal.js

@@ -17,6 +17,8 @@ export class Signal {
     this._value = value;
     /** @private {Set<function>} Collection of callback functions to be notified when value changes */
     this._watchers = new Set();
+    /** @private {boolean} Flag to prevent multiple synchronous watcher notifications and batch updates into microtasks */
+    this._pending = false;
   }
 
   /**
@@ -36,7 +38,7 @@ export class Signal {
   set value(newVal) {
     if (newVal !== this._value) {
       this._value = newVal;
-      this._watchers.forEach((fn) => fn(newVal));
+      this._notifyWatchers();
     }
   }
 
@@ -50,4 +52,22 @@ export class Signal {
     this._watchers.add(fn);
     return () => this._watchers.delete(fn);
   }
+
+  /**
+   * Notifies all registered watchers of a value change using microtask scheduling.
+   * Uses a pending flag to batch multiple synchronous updates into a single notification.
+   * All watcher callbacks receive the current value when executed.
+   *
+   * @private
+   * @returns {void}
+   */
+  _notifyWatchers() {
+    if (!this._pending) {
+      this._pending = true;
+      queueMicrotask(() => {
+        this._pending = false;
+        this._watchers.forEach((fn) => fn(this._value));
+      });
+    }
+  }
 }

package/src/modules/TemplateEngine.js

@@ -15,9 +15,10 @@ export class TemplateEngine {
    * @returns {string} The resulting string with evaluated values.
    */
   static parse(template, data) {
+    if (!template || typeof template !== "string") return template;
+
     return template.replace(/\{\{\s*(.*?)\s*\}\}/g, (_, expr) => {
-      const value = this.evaluate(expr, data);
-      return value === undefined ? "" : value;
+      return this.evaluate(expr, data);
     });
   }
 
@@ -29,11 +30,11 @@ export class TemplateEngine {
    * @returns {any} The result of the evaluated expression, or an empty string if undefined or on error.
    */
   static evaluate(expr, data) {
+    if (!expr || typeof expr !== "string") return expr;
+
     try {
-      const keys = Object.keys(data);
-      const values = Object.values(data);
-      const result = new Function(...keys, `return ${expr}`)(...values);
-      return result === undefined ? "" : result;
+      const compiledFn = new Function("data", `with(data) { return ${expr} }`);
+      return compiledFn(data);
     } catch (error) {
       console.error(`Template evaluation error:`, {
         expression: expr,

package/types/core/Eleva.d.ts

@@ -95,9 +95,11 @@ export class Eleva {
     private _prepareLifecycleHooks;
     /**
      * Processes DOM elements for event binding based on attributes starting with "@".
+     * Tracks listeners for cleanup during unmount.
      *
      * @param {HTMLElement} container - The container element in which to search for events.
      * @param {Object<string, any>} context - The current context containing event handler definitions.
+     * @param {Array<Function>} cleanupListeners - Array to collect cleanup functions for each event listener.
      * @private
      */
     private _processEvents;

package/types/core/Eleva.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Eleva.d.ts","sourceRoot":"","sources":["../../src/core/Eleva.js"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH;;;;GAIG;AACH;IACE;;;;;OAKG;IACH,kBAHW,MAAM;;OA0BhB;IAtBC,wEAAwE;IACxE,MADW,MAAM,CACD;IAChB,uFAAuF;IACvF;;MAAoB;IACpB,0GAA0G;IAC1G;;MAAqB;IACrB,wEAAwE;IACxE,iBAAkB;IAClB,mFAAmF;IACnF,wBAMC;IACD,2EAA2E;IAC3E,mBAAuB;IACvB,qFAAqF;IACrF,gBAA4B;IAC5B,yFAAyF;IACzF,iBAA8B;IAGhC;;;;;;OAMG;IACH,YAJW,MAAM;;QAEJ,KAAK,CAQjB;IAED;;;;;;OAMG;IACH,gBAJW,MAAM,cACN,mBAAmB,GACjB,KAAK,CAKjB;IAED;;;;;;;;OAQG;IACH,iBANW,WAAW,YACX,MAAM,GAAC,mBAAmB;;QAExB,MAAM,GAAC,OAAO,CAAC,MAAM,CAAC,CAgHlC;IAED;;;;;OAKG;IACH,+BAKC;IAED;;;;;;OAMG;IACH,uBAaC;IAED;;;;;;;;OAQG;IACH,sBAYC;IAED;;;;;;;OAOG;IACH,uBAgBC;CACF;;;;;;;;;;;;UAhS4C,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,GAAC,OAAO,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,CAAC,CAAC;;;;;;cAKjF,CAAS,IAAmB,EAAnB;YAAO,MAAM,GAAE,GAAG;KAAC,KAAG,MAAM;;;;;;;;UAKN,MAAM"}
+{"version":3,"file":"Eleva.d.ts","sourceRoot":"","sources":["../../src/core/Eleva.js"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH;;;;GAIG;AACH;IACE;;;;;OAKG;IACH,kBAHW,MAAM;;OA0BhB;IAtBC,wEAAwE;IACxE,MADW,MAAM,CACD;IAChB,uFAAuF;IACvF;;MAAoB;IACpB,0GAA0G;IAC1G;;MAAqB;IACrB,wEAAwE;IACxE,iBAAkB;IAClB,mFAAmF;IACnF,wBAMC;IACD,2EAA2E;IAC3E,mBAAuB;IACvB,qFAAqF;IACrF,gBAA4B;IAC5B,yFAAyF;IACzF,iBAA8B;IAGhC;;;;;;OAMG;IACH,YAJW,MAAM;;QAEJ,KAAK,CAQjB;IAED;;;;;;OAMG;IACH,gBAJW,MAAM,cACN,mBAAmB,GACjB,KAAK,CAKjB;IAED;;;;;;;;OAQG;IACH,iBANW,WAAW,YACX,MAAM,GAAC,mBAAmB;;QAExB,MAAM,GAAC,OAAO,CAAC,MAAM,CAAC,CAkHlC;IAED;;;;;OAKG;IACH,+BAKC;IAED;;;;;;;;OAQG;IACH,uBAcC;IAED;;;;;;;;OAQG;IACH,sBAYC;IAED;;;;;;;OAOG;IACH,uBAgBC;CACF;;;;;;;;;;;;UArS4C,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,GAAC,OAAO,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,CAAC,CAAC;;;;;;cAKjF,CAAS,IAAmB,EAAnB;YAAO,MAAM,GAAE,GAAG;KAAC,KAAG,MAAM;;;;;;;;UAKN,MAAM"}

package/types/modules/Renderer.d.ts

@@ -10,6 +10,7 @@ export class Renderer {
      *
      * @param {HTMLElement} container - The container element to patch.
      * @param {string} newHtml - The new HTML content to apply.
+     * @throws {Error} If container is not an HTMLElement or newHtml is not a string
      */
     patchDOM(container: HTMLElement, newHtml: string): void;
     /**
@@ -17,6 +18,7 @@ export class Renderer {
      *
      * @param {HTMLElement} oldParent - The original DOM element.
      * @param {HTMLElement} newParent - The new DOM element.
+     * @throws {Error} If either parent is not an HTMLElement
      */
     diff(oldParent: HTMLElement, newParent: HTMLElement): void;
     /**
@@ -24,6 +26,7 @@ export class Renderer {
      *
      * @param {HTMLElement} oldEl - The element to update.
      * @param {HTMLElement} newEl - The element providing the updated attributes.
+     * @throws {Error} If either element is not an HTMLElement
      */
     updateAttributes(oldEl: HTMLElement, newEl: HTMLElement): void;
 }

package/types/modules/Renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../src/modules/Renderer.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;;OAKG;IACH,oBAHW,WAAW,WACX,MAAM,QAMhB;IAED;;;;;OAKG;IACH,gBAHW,WAAW,aACX,WAAW,QAyDrB;IAED;;;;;OAKG;IACH,wBAHW,WAAW,SACX,WAAW,QA6BrB;CACF"}
+{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../src/modules/Renderer.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;;;OAMG;IACH,oBAJW,WAAW,WACX,MAAM,QAoBhB;IAED;;;;;;OAMG;IACH,gBAJW,WAAW,aACX,WAAW,QAiFrB;IAED;;;;;;OAMG;IACH,wBAJW,WAAW,SACX,WAAW,QAsErB;CACF"}

package/types/modules/Signal.d.ts

@@ -15,6 +15,8 @@ export class Signal {
     private _value;
     /** @private {Set<function>} Collection of callback functions to be notified when value changes */
     private _watchers;
+    /** @private {boolean} Flag to prevent multiple synchronous watcher notifications and batch updates into microtasks */
+    private _pending;
     /**
      * Sets a new value for the signal and notifies all registered watchers if the value has changed.
      *
@@ -34,5 +36,14 @@ export class Signal {
      * @returns {function(): boolean} A function to unsubscribe the watcher.
      */
     watch(fn: (arg0: any) => void): () => boolean;
+    /**
+     * Notifies all registered watchers of a value change using microtask scheduling.
+     * Uses a pending flag to batch multiple synchronous updates into a single notification.
+     * All watcher callbacks receive the current value when executed.
+     *
+     * @private
+     * @returns {void}
+     */
+    private _notifyWatchers;
 }
 //# sourceMappingURL=Signal.d.ts.map

package/types/modules/Signal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Signal.d.ts","sourceRoot":"","sources":["../../src/modules/Signal.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;OAIG;IACH,mBAFW,GAAC,EAOX;IAJC,mEAAmE;IACnE,eAAmB;IACnB,kGAAkG;IAClG,kBAA0B;IAY5B;;;;OAIG;IACH,kBAFW,GAAC,EAOX;IAnBD;;;;OAIG;IACH,aAFa,GAAC,CAIb;IAcD;;;;;OAKG;IACH,UAHW,CAAS,IAAG,EAAH,GAAG,KAAG,IAAI,GACjB,MAAY,OAAO,CAK/B;CACF"}
+{"version":3,"file":"Signal.d.ts","sourceRoot":"","sources":["../../src/modules/Signal.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;OAIG;IACH,mBAFW,GAAC,EASX;IANC,mEAAmE;IACnE,eAAmB;IACnB,kGAAkG;IAClG,kBAA0B;IAC1B,sHAAsH;IACtH,iBAAqB;IAYvB;;;;OAIG;IACH,kBAFW,GAAC,EAOX;IAnBD;;;;OAIG;IACH,aAFa,GAAC,CAIb;IAcD;;;;;OAKG;IACH,UAHW,CAAS,IAAG,EAAH,GAAG,KAAG,IAAI,GACjB,MAAY,OAAO,CAK/B;IAED;;;;;;;OAOG;IACH,wBAQC;CACF"}

package/types/modules/TemplateEngine.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateEngine.d.ts","sourceRoot":"","sources":["../../src/modules/TemplateEngine.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;;;OAMG;IACH,uBAJW,MAAM;;QAEJ,MAAM,CAOlB;IAED;;;;;;OAMG;IACH,sBAJW,MAAM;;QAEJ,GAAG,CAgBf;CACF"}
+{"version":3,"file":"TemplateEngine.d.ts","sourceRoot":"","sources":["../../src/modules/TemplateEngine.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;;;OAMG;IACH,uBAJW,MAAM;;QAEJ,MAAM,CAQlB;IAED;;;;;;OAMG;IACH,sBAJW,MAAM;;QAEJ,GAAG,CAgBf;CACF"}