eleva 1.2.5-alpha → 1.2.7-alpha

package/src/core/Eleva.js

@@ -62,6 +62,8 @@ export class Eleva {
     this._isMounted = false;
     /** @private {Emitter} Instance of the event emitter for handling component events */
     this.emitter = new Emitter();
+    /** @private {Signal} Instance of the signal for handling plugin and component signals */
+    this.signal = Signal;
     /** @private {Renderer} Instance of the renderer for handling DOM updates and patching */
     this.renderer = new Renderer();
   }
@@ -133,7 +135,7 @@ export class Eleva {
     const context = {
       props,
       emitter: this.emitter,
-      signal: (v) => new Signal(v),
+      signal: (v) => new this.signal(v),
       ...this._prepareLifecycleHooks(),
     };
 

package/src/modules/Renderer.js

@@ -22,15 +22,10 @@ export class Renderer {
       throw new Error("newHtml must be a string");
     }
 
-    const tempContainer = document.createElement("div");
-    try {
-      tempContainer.innerHTML = newHtml;
-      this.diff(container, tempContainer);
-    } catch (error) {
-      throw new Error(`Failed to patch DOM: ${error.message}`);
-    } finally {
-      tempContainer.innerHTML = "";
-    }
+    const temp = document.createElement("div");
+    temp.innerHTML = newHtml;
+    this.diff(container, temp);
+    temp.innerHTML = "";
   }
 
   /**
@@ -48,76 +43,61 @@ export class Renderer {
       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 oldC = oldParent.childNodes;
+    const newC = newParent.childNodes;
+    const len = Math.max(oldC.length, newC.length);
     const operations = [];
 
-    for (let i = 0; i < max; i++) {
-      const oldNode = oldNodes[i];
-      const newNode = newNodes[i];
+    for (let i = 0; i < len; i++) {
+      const oldNode = oldC[i];
+      const newNode = newC[i];
 
-      // Case 1: Append new nodes that don't exist in the old tree.
       if (!oldNode && newNode) {
         operations.push(() => oldParent.appendChild(newNode.cloneNode(true)));
         continue;
       }
-      // Case 2: Remove old nodes not present in the new tree.
       if (oldNode && !newNode) {
         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
-      ) {
-        const oldKey = oldNode.getAttribute("key");
-        const newKey = newNode.getAttribute("key");
-        if (oldKey || newKey) {
-          if (oldKey !== newKey) {
-            operations.push(() =>
-              oldParent.replaceChild(newNode.cloneNode(true), oldNode)
-            );
-            continue;
-          }
-        }
-      }
+      const isSameType =
+        oldNode.nodeType === newNode.nodeType &&
+        oldNode.nodeName === newNode.nodeName;
 
-      // Case 4: Replace nodes if types or tag names differ.
-      if (
-        oldNode?.nodeType !== newNode?.nodeType ||
-        oldNode?.nodeName !== newNode?.nodeName
-      ) {
+      if (!isSameType) {
         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.nodeValue !== newNode.nodeValue) {
-          oldNode.nodeValue = newNode.nodeValue;
+      if (oldNode.nodeType === Node.ELEMENT_NODE) {
+        const oldKey = oldNode.getAttribute("key");
+        const newKey = newNode.getAttribute("key");
+
+        if (oldKey !== newKey && (oldKey || newKey)) {
+          operations.push(() =>
+            oldParent.replaceChild(newNode.cloneNode(true), oldNode)
+          );
+          continue;
         }
-        continue;
-      }
 
-      // Case 6: For element nodes, update attributes and then diff children.
-      if (oldNode?.nodeType === Node.ELEMENT_NODE) {
         this.updateAttributes(oldNode, newNode);
         this.diff(oldNode, newNode);
+      } else if (
+        oldNode.nodeType === Node.TEXT_NODE &&
+        oldNode.nodeValue !== newNode.nodeValue
+      ) {
+        oldNode.nodeValue = newNode.nodeValue;
       }
     }
 
-    // Execute batched operations
-    operations.forEach((op) => op());
+    if (operations.length) {
+      operations.forEach((op) => op());
+    }
   }
 
   /**
@@ -132,67 +112,60 @@ export class Renderer {
       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,
-    };
-
-    // Batch attribute operations for better performance
+    const oldAttrs = oldEl.attributes;
+    const newAttrs = newEl.attributes;
     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)) {
-        operations.push(() => oldEl.removeAttribute(attr.name));
+    // Remove old attributes
+    for (const { name } of oldAttrs) {
+      if (!name.startsWith("@") && !newEl.hasAttribute(name)) {
+        operations.push(() => oldEl.removeAttribute(name));
       }
-    });
-
-    // Add or update attributes from newEl
-    Array.from(newEl.attributes).forEach((attr) => {
-      if (attr.name.startsWith("@")) return;
-      if (oldEl.getAttribute(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;
+    // Update/add new attributes
+    for (const attr of newAttrs) {
+      const { name, value } = attr;
+      if (name.startsWith("@")) continue;
+
+      if (oldEl.getAttribute(name) === value) continue;
+
+      operations.push(() => {
+        oldEl.setAttribute(name, value);
+
+        if (name.startsWith("aria-")) {
+          const prop =
+            "aria" +
+            name.slice(5).replace(/-([a-z])/g, (_, l) => l.toUpperCase());
+          oldEl[prop] = value;
+        } else if (name.startsWith("data-")) {
+          oldEl.dataset[name.slice(5)] = value;
+        } else {
+          const prop = name.replace(/-([a-z])/g, (_, l) => l.toUpperCase());
+          if (prop in oldEl) {
+            const descriptor = Object.getOwnPropertyDescriptor(
+              Object.getPrototypeOf(oldEl),
+              prop
+            );
+            const isBoolean =
+              typeof oldEl[prop] === "boolean" ||
+              (descriptor?.get &&
+                typeof descriptor.get.call(oldEl) === "boolean");
+
+            if (isBoolean) {
+              oldEl[prop] =
+                value !== "false" &&
+                (value === "" || value === prop || value === "true");
+            } else {
+              oldEl[prop] = value;
+            }
           }
-        });
-      }
-    });
+        }
+      });
+    }
 
-    // Execute batched operations
-    operations.forEach((op) => op());
+    if (operations.length) {
+      operations.forEach((op) => op());
+    }
   }
 }

package/types/core/Eleva.d.ts

@@ -54,6 +54,8 @@ export class Eleva {
     private _isMounted;
     /** @private {Emitter} Instance of the event emitter for handling component events */
     private emitter;
+    /** @private {Signal} Instance of the signal for handling plugin and component signals */
+    private signal;
     /** @private {Renderer} Instance of the renderer for handling DOM updates and patching */
     private renderer;
     /**

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;;;;;;;;OAQG;IACH,uBAiBC;IAED;;;;;;;;OAQG;IACH,sBAYC;IAED;;;;;;;OAOG;IACH,uBAgBC;CACF;;;;;;;;;;;;UAtS4C,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;;OA4BhB;IAxBC,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,eAAoB;IACpB,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;;;;;;;;OAQG;IACH,uBAiBC;IAED;;;;;;;;OAQG;IACH,sBAYC;IAED;;;;;;;OAOG;IACH,uBAgBC;CACF;;;;;;;;;;;;UAxS4C,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.map

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../src/modules/Renderer.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH;IACE;;;;;;OAMG;IACH,oBAJW,WAAW,WACX,MAAM,QAehB;IAED;;;;;;OAMG;IACH,gBAJW,WAAW,aACX,WAAW,QAkErB;IAED;;;;;;OAMG;IACH,wBAJW,WAAW,SACX,WAAW,QA+DrB;CACF"}