eleva 1.2.13-alpha → 1.2.15-beta

package/package.json

@@ -1,29 +1,104 @@
 {
   "name": "eleva",
-  "version": "1.2.13-alpha",
+  "version": "1.2.15-beta",
   "description": "A minimalist and lightweight, pure vanilla JavaScript frontend runtime framework.",
   "type": "module",
-  "main": "dist/eleva.cjs.js",
-  "module": "dist/eleva.esm.js",
-  "umd": "dist/eleva.umd.js",
-  "browser": "dist/eleva.min.js",
-  "unpkg": "dist/eleva.min.js",
-  "types": "dist/eleva.d.ts",
+  "private": false,
+  "license": "MIT",
+  "author": {
+    "name": "Tarek Raafat",
+    "email": "tarek.m.raafat@gmail.com",
+    "url": "https://www.tarekraafat.com"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/TarekRaafat/eleva.git"
+  },
+  "homepage": "https://elevajs.com",
+  "bugs": {
+    "url": "https://github.com/TarekRaafat/eleva/issues",
+    "email": "tarek.m.raafat@gmail.com"
+  },
+  "readme": "https://github.com/TarekRaafat/eleva#readme",
+  "main": "./dist/eleva.cjs.js",
+  "module": "./dist/eleva.esm.js",
+  "browser": "./dist/eleva.umd.min.js",
+  "types": "./dist/eleva.d.ts",
+  "unpkg": "./dist/eleva.umd.min.js",
+  "jsdelivr": "./dist/eleva.umd.min.js",
   "exports": {
     ".": {
       "types": "./dist/eleva.d.ts",
-      "node": "./dist/eleva.cjs.js",
+      "import": "./dist/eleva.esm.js",
       "require": "./dist/eleva.cjs.js",
+      "node": "./dist/eleva.cjs.js",
+      "browser": "./dist/eleva.umd.min.js",
+      "default": "./dist/eleva.umd.min.js"
+    },
+    "./esm": {
+      "types": "./dist/eleva.d.ts",
       "import": "./dist/eleva.esm.js",
-      "browser": "./dist/eleva.min.js",
-      "umd": "./dist/eleva.umd.js",
-      "default": "./dist/eleva.esm.js"
-    }
+      "require": "./dist/eleva.esm.js",
+      "browser": "./dist/eleva.umd.min.js"
+    },
+    "./cjs": {
+      "types": "./dist/eleva.d.ts",
+      "require": "./dist/eleva.cjs.js"
+    },
+    "./umd": {
+      "types": "./dist/eleva.d.ts",
+      "import": "./dist/eleva.umd.js",
+      "browser": "./dist/eleva.umd.js"
+    },
+    "./browser": {
+      "types": "./dist/eleva.d.ts",
+      "import": "./dist/eleva.umd.min.js",
+      "browser": "./dist/eleva.umd.min.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "types",
+    "src"
+  ],
+  "directories": {
+    "doc": "docs",
+    "example": "examples",
+    "test": "test",
+    "dist": "dist",
+    "src": "src",
+    "types": "types"
+  },
+  "sideEffects": false,
+  "devDependencies": {
+    "@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-node-resolve": "^16.0.0",
+    "@rollup/plugin-terser": "^0.4.4",
+    "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",
+    "typescript": "^5.1.6",
+    "vitepress": "^1.6.3"
   },
   "scripts": {
     "dev": "rollup -c -w",
     "build": "rollup -c",
-    "build:types": "tsc --emitDeclarationOnly",
+    "build:types": "tsc",
     "build:types:bundle": "rollup -c rollup.dts.config.js",
     "build:all": "npm run clean && npm run build && npm run build:types && npm run build:types:bundle",
     "docs:dev": "vitepress dev docs",
@@ -48,7 +123,6 @@
     "codecov": "npx codecov",
     "lint": "eslint src/**/*.js",
     "format": "npx prettier \"src/**/*\" \"types/**/*\" --write",
-    "size": "size-limit",
     "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"
@@ -56,31 +130,16 @@
   "engines": {
     "node": ">=16.0.0"
   },
-  "devDependencies": {
-    "@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",
-    "typescript": "^5.1.6",
-    "vitepress": "^1.6.3"
+  "browserslist": [
+    "> 0.25%",
+    "last 2 versions",
+    "not dead",
+    "not op_mini all",
+    "not ie 11"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
   },
   "lint-staged": {
     "src/**/*.{js,ts}": [
@@ -140,35 +199,6 @@
     "web development tools",
     "micro frontends"
   ],
-  "author": {
-    "name": "Tarek Raafat",
-    "email": "tarek.m.raafat@gmail.com",
-    "url": "https://www.tarekraafat.com"
-  },
-  "license": "MIT",
-  "homepage": "https://elevajs.com",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/TarekRaafat/eleva.git"
-  },
-  "bugs": {
-    "url": "https://github.com/TarekRaafat/eleva/issues",
-    "email": "tarek.m.raafat@gmail.com"
-  },
-  "directories": {
-    "doc": "docs",
-    "example": "examples",
-    "test": "test",
-    "dist": "dist",
-    "src": "src",
-    "types": "types"
-  },
-  "files": [
-    "dist",
-    "types",
-    "src"
-  ],
-  "sideEffects": false,
   "funding": [
     {
       "type": "github",
@@ -178,12 +208,5 @@
       "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

@@ -177,7 +177,7 @@ export class Eleva {
     const context = {
       props,
       emitter: this.emitter,
-      /** @type {(v: any) => Signal} */
+      /** @type {(v: any) => Signal<any>} */
       signal: (v) => new this.signal(v),
       ...this._prepareLifecycleHooks(),
     };
@@ -191,7 +191,7 @@ export class Eleva {
      * 4. Managing component lifecycle
      *
      * @param {Object<string, any>} data - Data returned from the component's setup function
-     * @returns {MountResult} An object containing:
+     * @returns {Promise<MountResult>} An object containing:
      *   - container: The mounted component's container element
      *   - data: The component's reactive state and context
      *   - unmount: Function to clean up and unmount the component
@@ -301,14 +301,17 @@ export class Eleva {
       const attrs = el.attributes;
       for (let i = 0; i < attrs.length; i++) {
         const attr = attrs[i];
-        if (attr.name.startsWith("@")) {
-          const event = attr.name.slice(1);
-          const handler = TemplateEngine.evaluate(attr.value, context);
-          if (typeof handler === "function") {
-            el.addEventListener(event, handler);
-            el.removeAttribute(attr.name);
-            cleanupListeners.push(() => el.removeEventListener(event, handler));
-          }
+
+        if (!attr.name.startsWith("@")) continue;
+
+        const event = attr.name.slice(1);
+        const handlerName = attr.value;
+        const handler =
+          context[handlerName] || TemplateEngine.evaluate(handlerName, context);
+        if (typeof handler === "function") {
+          el.addEventListener(event, handler);
+          el.removeAttribute(attr.name);
+          cleanupListeners.push(() => el.removeEventListener(event, handler));
         }
       }
     }
@@ -340,62 +343,29 @@ export class Eleva {
   }
 
   /**
-   * Extracts props from an element's attributes that start with 'eleva-prop-'.
+   * Extracts props from an element's attributes that start with the specified prefix.
    * This method is used to collect component properties from DOM elements.
    *
    * @private
    * @param {HTMLElement} element - The DOM element to extract props from
+   * @param {string} prefix - The prefix to look for in attributes
    * @returns {Object<string, any>} An object containing the extracted props
    * @example
    * // For an element with attributes:
-   * // <div eleva-prop-name="John" eleva-prop-age="25">
+   * // <div :name="John" :age="25">
    * // Returns: { name: "John", age: "25" }
    */
-  _extractProps(element) {
+  _extractProps(element, prefix) {
+    /** @type {Record<string, string>} */
     const props = {};
     for (const { name, value } of element.attributes) {
-      if (name.startsWith("eleva-prop-")) {
-        props[name.replace("eleva-prop-", "")] = value;
+      if (name.startsWith(prefix)) {
+        props[name.replace(prefix, "")] = value;
       }
     }
     return props;
   }
 
-  /**
-   * Mounts a single component instance to a container element.
-   * This method handles the actual mounting of a component with its props.
-   *
-   * @private
-   * @param {HTMLElement} container - The container element to mount the component to
-   * @param {string|ComponentDefinition} component - The component to mount, either as a name or definition
-   * @param {Object<string, any>} props - The props to pass to the component
-   * @returns {Promise<MountResult>} A promise that resolves to the mounted component instance
-   * @throws {Error} If the container is not a valid HTMLElement
-   */
-  async _mountComponentInstance(container, component, props) {
-    if (!(container instanceof HTMLElement)) return null;
-    return await this.mount(container, component, props);
-  }
-
-  /**
-   * Mounts components found by a selector in the container.
-   * This method handles mounting multiple instances of the same component type.
-   *
-   * @private
-   * @param {HTMLElement} container - The container to search for components
-   * @param {string} selector - The CSS selector to find components
-   * @param {string|ComponentDefinition} component - The component to mount
-   * @param {Array<MountResult>} instances - Array to store the mounted component instances
-   * @returns {Promise<void>}
-   */
-  async _mountComponentsBySelector(container, selector, component, instances) {
-    for (const el of container.querySelectorAll(selector)) {
-      const props = this._extractProps(el);
-      const instance = await this._mountComponentInstance(el, component, props);
-      if (instance) instances.push(instance);
-    }
-  }
-
   /**
    * Mounts all components within the parent component's container.
    * This method handles mounting of explicitly defined children components.
@@ -413,25 +383,25 @@ export class Eleva {
    * @example
    * // Explicit children mounting:
    * const children = {
-   *   '.user-profile': UserProfileComponent,
-   *   '.settings-panel': SettingsComponent
+   *   'UserProfile': UserProfileComponent,
+   *   '#settings-panel': "settings-panel"
    * };
    */
   async _mountComponents(container, children, childInstances) {
+    if (!children) return;
+
     // Clean up existing instances
     for (const child of childInstances) child.unmount();
     childInstances.length = 0;
 
     // Mount explicitly defined children components
-    if (children) {
-      for (const [selector, component] of Object.entries(children)) {
-        if (!selector) continue;
-        await this._mountComponentsBySelector(
-          container,
-          selector,
-          component,
-          childInstances
-        );
+    for (const [selector, component] of Object.entries(children)) {
+      if (!selector) continue;
+      for (const el of container.querySelectorAll(selector)) {
+        if (!(el instanceof HTMLElement)) continue;
+        const props = this._extractProps(el, ":");
+        const instance = await this.mount(el, component, props);
+        if (instance) childInstances.push(instance);
       }
     }
   }

package/src/modules/Emitter.js

@@ -29,7 +29,7 @@ export class Emitter {
    * @public
    * @param {string} event - The name of the event to listen for.
    * @param {function(any): void} handler - The callback function to invoke when the event occurs.
-   * @returns {function(): boolean} A function to unsubscribe the event handler.
+   * @returns {function(): void} A function to unsubscribe the event handler.
    * @example
    * const unsubscribe = emitter.on('user:login', (user) => console.log(user));
    * // Later...

package/src/modules/Renderer.js

@@ -13,16 +13,25 @@
  * renderer.patchDOM(container, newHtml);
  */
 export class Renderer {
+  /**
+   * Creates a new Renderer instance with a reusable temporary container for parsing HTML.
+   * @public
+   */
+  constructor() {
+    /** @private {HTMLElement} Reusable temporary container for parsing new HTML */
+    this._tempContainer = document.createElement("div");
+  }
+
   /**
    * Patches the DOM of a container element with new HTML content.
-   * This method efficiently updates the DOM by comparing the new content with the existing
-   * content and applying only the necessary changes.
+   * Efficiently updates the DOM by parsing new HTML into a reusable container
+   * and applying only the necessary changes.
    *
    * @public
    * @param {HTMLElement} container - The container element to patch.
    * @param {string} newHtml - The new HTML content to apply.
    * @returns {void}
-   * @throws {Error} If container is not an HTMLElement or newHtml is not a string.
+   * @throws {Error} If container is not an HTMLElement, newHtml is not a string, or patching fails.
    */
   patchDOM(container, newHtml) {
     if (!(container instanceof HTMLElement)) {
@@ -32,10 +41,14 @@ export class Renderer {
       throw new Error("newHtml must be a string");
     }
 
-    const temp = document.createElement("div");
-    temp.innerHTML = newHtml;
-    this._diff(container, temp);
-    temp.innerHTML = "";
+    try {
+      // Directly set new HTML, replacing any existing content
+      this._tempContainer.innerHTML = newHtml;
+
+      this._diff(container, this._tempContainer);
+    } catch {
+      throw new Error("Failed to patch DOM");
+    }
   }
 
   /**
@@ -47,16 +60,8 @@ export class Renderer {
    * @param {HTMLElement} oldParent - The original DOM element.
    * @param {HTMLElement} newParent - The new DOM element.
    * @returns {void}
-   * @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");
-    }
-
     if (oldParent.isEqualNode(newParent)) return;
 
     const oldChildren = oldParent.childNodes;
@@ -67,8 +72,6 @@ export class Renderer {
       const oldNode = oldChildren[i];
       const newNode = newChildren[i];
 
-      if (!oldNode && !newNode) continue;
-
       if (!oldNode && newNode) {
         oldParent.appendChild(newNode.cloneNode(true));
         continue;
@@ -115,13 +118,8 @@ export class Renderer {
    * @param {HTMLElement} oldEl - The element to update.
    * @param {HTMLElement} newEl - The element providing the updated attributes.
    * @returns {void}
-   * @throws {Error} If either element is not an HTMLElement.
    */
   _updateAttributes(oldEl, newEl) {
-    if (!(oldEl instanceof HTMLElement) || !(newEl instanceof HTMLElement)) {
-      throw new Error("Both elements must be HTMLElements");
-    }
-
     const oldAttrs = oldEl.attributes;
     const newAttrs = newEl.attributes;
 

package/src/modules/Signal.js

@@ -10,6 +10,7 @@
  * const count = new Signal(0);
  * count.watch((value) => console.log(`Count changed to: ${value}`));
  * count.value = 1; // Logs: "Count changed to: 1"
+ * @template T
  */
 export class Signal {
   /**

package/types/core/Eleva.d.ts

@@ -157,42 +157,19 @@ export class Eleva {
      */
     private _injectStyles;
     /**
-     * Extracts props from an element's attributes that start with 'eleva-prop-'.
+     * Extracts props from an element's attributes that start with the specified prefix.
      * This method is used to collect component properties from DOM elements.
      *
      * @private
      * @param {HTMLElement} element - The DOM element to extract props from
+     * @param {string} prefix - The prefix to look for in attributes
      * @returns {Object<string, any>} An object containing the extracted props
      * @example
      * // For an element with attributes:
-     * // <div eleva-prop-name="John" eleva-prop-age="25">
+     * // <div :name="John" :age="25">
      * // Returns: { name: "John", age: "25" }
      */
     private _extractProps;
-    /**
-     * Mounts a single component instance to a container element.
-     * This method handles the actual mounting of a component with its props.
-     *
-     * @private
-     * @param {HTMLElement} container - The container element to mount the component to
-     * @param {string|ComponentDefinition} component - The component to mount, either as a name or definition
-     * @param {Object<string, any>} props - The props to pass to the component
-     * @returns {Promise<MountResult>} A promise that resolves to the mounted component instance
-     * @throws {Error} If the container is not a valid HTMLElement
-     */
-    private _mountComponentInstance;
-    /**
-     * Mounts components found by a selector in the container.
-     * This method handles mounting multiple instances of the same component type.
-     *
-     * @private
-     * @param {HTMLElement} container - The container to search for components
-     * @param {string} selector - The CSS selector to find components
-     * @param {string|ComponentDefinition} component - The component to mount
-     * @param {Array<MountResult>} instances - Array to store the mounted component instances
-     * @returns {Promise<void>}
-     */
-    private _mountComponentsBySelector;
     /**
      * Mounts all components within the parent component's container.
      * This method handles mounting of explicitly defined children components.
@@ -210,8 +187,8 @@ export class Eleva {
      * @example
      * // Explicit children mounting:
      * const children = {
-     *   '.user-profile': UserProfileComponent,
-     *   '.settings-panel': SettingsComponent
+     *   'UserProfile': UserProfileComponent,
+     *   '#settings-panel': "settings-panel"
      * };
      */
     private _mountComponents;

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

@@ -1 +1 @@
-{"version":3,"file":"Eleva.d.ts","sourceRoot":"","sources":["../../src/core/Eleva.js"],"names":[],"mappings":"AAOA;;;;;;;;;;GAUG;AAEH;;;;;;GAMG;AAEH;;;;;;;;GAQG;AAEH;;;;;;;;;;;;;GAaG;AACH;IACE;;;;;;;OAOG;IACH,kBAJW,MAAM;;OA8BhB;IAzBC,0EAA0E;IAC1E,oBAAgB;IAChB,yFAAyF;IACzF;;MAAoB;IACpB,oFAAoF;IACpF,wBAA4B;IAC5B,+FAA+F;IAC/F,6BAAoB;IACpB,wFAAwF;IACxF,0BAA8B;IAE9B,gGAAgG;IAChG,oBAA4B;IAC5B,2FAA2F;IAC3F,iBAAyB;IACzB,gFAAgF;IAChF,wBAMC;IACD,oFAAoF;IACpF,mBAAuB;IAGzB;;;;;;;;;;;OAWG;IACH,mBANW,WAAW;;QAET,KAAK,CASjB;IAED;;;;;;;;;;;;;;OAcG;IACH,uBAVW,MAAM,cACN,mBAAmB,GACjB,KAAK,CAYjB;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,wBAdW,WAAW,YACX,MAAM,GAAC,mBAAmB;;QAExB,OAAO,CAAC,WAAW,CAAC,CAoIhC;IAED;;;;;;;OAOG;IACH,+BAOC;IAED;;;;;;;;;OASG;IACH,uBAiBC;IAED;;;;;;;;;;OAUG;IACH,sBAYC;IAED;;;;;;;;;;;OAWG;IACH,sBAQC;IAED;;;;;;;;;;OAUG;IACH,gCAGC;IAED;;;;;;;;;;OAUG;IACH,mCAMC;IAED;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,yBAiBC;CACF;;;;;;;UA5a4C,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,GAAC,OAAO,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,CAAC,CAAC;;;;cAEjF,CAAS,IAAmB,EAAnB;YAAO,MAAM,GAAE,GAAG;KAAC,KAAG,MAAM;;;;;;UAEN,MAAM;;;;;;;;;;;;aAQrC,CAAS,IAAK,EAAL,KAAK,EAAE,IAAmB,EAAnB;YAAO,MAAM,GAAE,GAAG;KAAC,KAAG,IAAI;;;;UAE1C,MAAM;;;;;;eAMN,WAAW;;;;;;;;;;aAIX,MAAY,IAAI;;wBA7BN,uBAAuB;uBADxB,sBAAsB;yBAEpB,wBAAwB"}
+{"version":3,"file":"Eleva.d.ts","sourceRoot":"","sources":["../../src/core/Eleva.js"],"names":[],"mappings":"AAOA;;;;;;;;;;GAUG;AAEH;;;;;;GAMG;AAEH;;;;;;;;GAQG;AAEH;;;;;;;;;;;;;GAaG;AACH;IACE;;;;;;;OAOG;IACH,kBAJW,MAAM;;OA8BhB;IAzBC,0EAA0E;IAC1E,oBAAgB;IAChB,yFAAyF;IACzF;;MAAoB;IACpB,oFAAoF;IACpF,wBAA4B;IAC5B,+FAA+F;IAC/F,6BAAoB;IACpB,wFAAwF;IACxF,0BAA8B;IAE9B,gGAAgG;IAChG,oBAA4B;IAC5B,2FAA2F;IAC3F,iBAAyB;IACzB,gFAAgF;IAChF,wBAMC;IACD,oFAAoF;IACpF,mBAAuB;IAGzB;;;;;;;;;;;OAWG;IACH,mBANW,WAAW;;QAET,KAAK,CASjB;IAED;;;;;;;;;;;;;;OAcG;IACH,uBAVW,MAAM,cACN,mBAAmB,GACjB,KAAK,CAYjB;IAED;;;;;;;;;;;;;;;;;;OAkBG;IACH,wBAdW,WAAW,YACX,MAAM,GAAC,mBAAmB;;QAExB,OAAO,CAAC,WAAW,CAAC,CAoIhC;IAED;;;;;;;OAOG;IACH,+BAOC;IAED;;;;;;;;;OASG;IACH,uBAoBC;IAED;;;;;;;;;;OAUG;IACH,sBAYC;IAED;;;;;;;;;;;;OAYG;IACH,sBASC;IAED;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,yBAiBC;CACF;;;;;;;UA9Y4C,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,GAAC,OAAO,CAAC;YAAO,MAAM,GAAE,GAAG;KAAC,CAAC,CAAC;;;;cAEjF,CAAS,IAAmB,EAAnB;YAAO,MAAM,GAAE,GAAG;KAAC,KAAG,MAAM;;;;;;UAEN,MAAM;;;;;;;;;;;;aAQrC,CAAS,IAAK,EAAL,KAAK,EAAE,IAAmB,EAAnB;YAAO,MAAM,GAAE,GAAG;KAAC,KAAG,IAAI;;;;UAE1C,MAAM;;;;;;eAMN,WAAW;;;;;;;;;;aAIX,MAAY,IAAI;;wBA7BN,uBAAuB;uBADxB,sBAAsB;yBAEpB,wBAAwB"}

package/types/modules/Emitter.d.ts

@@ -19,13 +19,13 @@ export class Emitter {
      * @public
      * @param {string} event - The name of the event to listen for.
      * @param {function(any): void} handler - The callback function to invoke when the event occurs.
-     * @returns {function(): boolean} A function to unsubscribe the event handler.
+     * @returns {function(): void} A function to unsubscribe the event handler.
      * @example
      * const unsubscribe = emitter.on('user:login', (user) => console.log(user));
      * // Later...
      * unsubscribe(); // Stops listening for the event
      */
-    public on(event: string, handler: (arg0: any) => void): () => boolean;
+    public on(event: string, handler: (arg0: any) => void): () => void;
     /**
      * Removes an event handler for the specified event name.
      * If no handler is provided, all handlers for the event are removed.

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

@@ -1 +1 @@
-{"version":3,"file":"Emitter.d.ts","sourceRoot":"","sources":["../../src/modules/Emitter.js"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH;IAOI,gHAAgH;IAChH,gBAAwB;IAG1B;;;;;;;;;;;;OAYG;IACH,iBARW,MAAM,WACN,CAAS,IAAG,EAAH,GAAG,KAAG,IAAI,GACjB,MAAY,OAAO,CAW/B;IAED;;;;;;;;OAQG;IACH,kBAJW,MAAM,YACN,CAAS,IAAG,EAAH,GAAG,KAAG,IAAI,GACjB,IAAI,CAYhB;IAED;;;;;;;;OAQG;IACH,mBAJW,MAAM,WACH,GAAG,EAAA,GACJ,IAAI,CAKhB;CACF"}
+{"version":3,"file":"Emitter.d.ts","sourceRoot":"","sources":["../../src/modules/Emitter.js"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH;IAOI,gHAAgH;IAChH,gBAAwB;IAG1B;;;;;;;;;;;;OAYG;IACH,iBARW,MAAM,WACN,CAAS,IAAG,EAAH,GAAG,KAAG,IAAI,GACjB,MAAY,IAAI,CAW5B;IAED;;;;;;;;OAQG;IACH,kBAJW,MAAM,YACN,CAAS,IAAG,EAAH,GAAG,KAAG,IAAI,GACjB,IAAI,CAYhB;IAED;;;;;;;;OAQG;IACH,mBAJW,MAAM,WACH,GAAG,EAAA,GACJ,IAAI,CAKhB;CACF"}

package/types/modules/Renderer.d.ts

@@ -11,16 +11,18 @@
  * renderer.patchDOM(container, newHtml);
  */
 export class Renderer {
+    /** @private {HTMLElement} Reusable temporary container for parsing new HTML */
+    private _tempContainer;
     /**
      * Patches the DOM of a container element with new HTML content.
-     * This method efficiently updates the DOM by comparing the new content with the existing
-     * content and applying only the necessary changes.
+     * Efficiently updates the DOM by parsing new HTML into a reusable container
+     * and applying only the necessary changes.
      *
      * @public
      * @param {HTMLElement} container - The container element to patch.
      * @param {string} newHtml - The new HTML content to apply.
      * @returns {void}
-     * @throws {Error} If container is not an HTMLElement or newHtml is not a string.
+     * @throws {Error} If container is not an HTMLElement, newHtml is not a string, or patching fails.
      */
     public patchDOM(container: HTMLElement, newHtml: string): void;
     /**
@@ -32,7 +34,6 @@ export class Renderer {
      * @param {HTMLElement} oldParent - The original DOM element.
      * @param {HTMLElement} newParent - The new DOM element.
      * @returns {void}
-     * @throws {Error} If either parent is not an HTMLElement.
      */
     private _diff;
     /**
@@ -43,7 +44,6 @@ export class Renderer {
      * @param {HTMLElement} oldEl - The element to update.
      * @param {HTMLElement} newEl - The element providing the updated attributes.
      * @returns {void}
-     * @throws {Error} If either element is not an HTMLElement.
      */
     private _updateAttributes;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../src/modules/Renderer.js"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH;IACE;;;;;;;;;;OAUG;IACH,2BALW,WAAW,WACX,MAAM,GACJ,IAAI,CAehB;IAED;;;;;;;;;;OAUG;IACH,cAwDC;IAED;;;;;;;;;OASG;IACH,0BAqDC;CACF"}
+{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../src/modules/Renderer.js"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH;IAMI,+EAA+E;IAC/E,uBAAmD;IAGrD;;;;;;;;;;OAUG;IACH,2BALW,WAAW,WACX,MAAM,GACJ,IAAI,CAmBhB;IAED;;;;;;;;;OASG;IACH,cA+CC;IAED;;;;;;;;OAQG;IACH,0BAiDC;CACF"}

package/types/modules/Signal.d.ts

@@ -8,8 +8,9 @@
  * const count = new Signal(0);
  * count.watch((value) => console.log(`Count changed to: ${value}`));
  * count.value = 1; // Logs: "Count changed to: 1"
+ * @template T
  */
-export class Signal {
+export class Signal<T> {
     /**
      * Creates a new Signal instance with the specified initial value.
      *

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

@@ -1 +1 @@
-{"version":3,"file":"Signal.d.ts","sourceRoot":"","sources":["../../src/modules/Signal.js"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH;IACE;;;;;OAKG;IACH,mBAFW,GAAC,EASX;IANC,6GAA6G;IAC7G,eAAmB;IACnB,sIAAsI;IACtI,kBAA0B;IAC1B,sHAAsH;IACtH,iBAAqB;IAavB;;;;;;;OAOG;IACH,yBAHW,CAAC,EAQX;IAvBD;;;;;OAKG;IACH,oBAFa,CAAC,CAIb;IAiBD;;;;;;;;;;;OAWG;IACH,iBAPW,CAAS,IAAC,EAAD,CAAC,KAAG,IAAI,GACf,MAAY,OAAO,CAS/B;IAED;;;;;;;OAOG;IACH,gBAQC;CACF"}
+{"version":3,"file":"Signal.d.ts","sourceRoot":"","sources":["../../src/modules/Signal.js"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH,oBAFa,CAAC;IAGZ;;;;;OAKG;IACH,mBAFW,GAAC,EASX;IANC,6GAA6G;IAC7G,eAAmB;IACnB,sIAAsI;IACtI,kBAA0B;IAC1B,sHAAsH;IACtH,iBAAqB;IAavB;;;;;;;OAOG;IACH,yBAHW,CAAC,EAQX;IAvBD;;;;;OAKG;IACH,oBAFa,CAAC,CAIb;IAiBD;;;;;;;;;;;OAWG;IACH,iBAPW,CAAS,IAAC,EAAD,CAAC,KAAG,IAAI,GACf,MAAY,OAAO,CAS/B;IAED;;;;;;;OAOG;IACH,gBAQC;CACF"}

package/dist/eleva.min.js

@@ -1,3 +0,0 @@
-/*! Eleva v1.2.13-alpha | MIT License | https://elevajs.com */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Eleva=t()}(this,(function(){"use strict";class e{static expressionPattern=/\{\{\s*(.*?)\s*\}\}/g;static parse(e,t){return"string"!=typeof e?e:e.replace(this.expressionPattern,((e,n)=>this.evaluate(n,t)))}static evaluate(e,t){if("string"!=typeof e)return e;try{return new Function("data",`with(data) { return ${e}; }`)(t)}catch{return""}}}class t{constructor(e){this._value=e,this._watchers=new Set,this._pending=!1}get value(){return this._value}set value(e){this._value!==e&&(this._value=e,this._notify())}watch(e){return this._watchers.add(e),()=>this._watchers.delete(e)}_notify(){this._pending||(this._pending=!0,queueMicrotask((()=>{this._watchers.forEach((e=>e(this._value))),this._pending=!1})))}}class n{constructor(){this._events=new Map}on(e,t){return this._events.has(e)||this._events.set(e,new Set),this._events.get(e).add(t),()=>this.off(e,t)}off(e,t){if(this._events.has(e))if(t){const n=this._events.get(e);n.delete(t),0===n.size&&this._events.delete(e)}else this._events.delete(e)}emit(e,...t){this._events.has(e)&&this._events.get(e).forEach((e=>e(...t)))}}class o{patchDOM(e,t){if(!(e instanceof HTMLElement))throw new Error("Container must be an HTMLElement");if("string"!=typeof t)throw new Error("newHtml must be a string");const n=document.createElement("div");n.innerHTML=t,this._diff(e,n),n.innerHTML=""}_diff(e,t){if(!(e instanceof HTMLElement&&t instanceof HTMLElement))throw new Error("Both parents must be HTMLElements");if(e.isEqualNode(t))return;const n=e.childNodes,o=t.childNodes,s=Math.max(n.length,o.length);for(let t=0;t<s;t++){const s=n[t],i=o[t];if(!s&&!i)continue;if(!s&&i){e.appendChild(i.cloneNode(!0));continue}if(s&&!i){e.removeChild(s);continue}if(s.nodeType===i.nodeType&&s.nodeName===i.nodeName)if(s.nodeType===Node.ELEMENT_NODE){const t=s.getAttribute("key"),n=i.getAttribute("key");if(t!==n&&(t||n)){e.replaceChild(i.cloneNode(!0),s);continue}this._updateAttributes(s,i),this._diff(s,i)}else s.nodeType===Node.TEXT_NODE&&s.nodeValue!==i.nodeValue&&(s.nodeValue=i.nodeValue);else e.replaceChild(i.cloneNode(!0),s)}}_updateAttributes(e,t){if(!(e instanceof HTMLElement&&t instanceof HTMLElement))throw new Error("Both elements must be HTMLElements");const n=e.attributes,o=t.attributes;for(const{name:o}of n)t.hasAttribute(o)||e.removeAttribute(o);for(const t of o){const{name:n,value:o}=t;if(!n.startsWith("@")&&e.getAttribute(n)!==o)if(e.setAttribute(n,o),n.startsWith("aria-")){e["aria"+n.slice(5).replace(/-([a-z])/g,((e,t)=>t.toUpperCase()))]=o}else if(n.startsWith("data-"))e.dataset[n.slice(5)]=o;else{const t=n.replace(/-([a-z])/g,((e,t)=>t.toUpperCase()));if(t in e){const n=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),t),s="boolean"==typeof e[t]||n?.get&&"boolean"==typeof n.get.call(e);e[t]=s?"false"!==o&&(""===o||o===t||"true"===o):o}}}}}return class{constructor(e,s={}){this.name=e,this.config=s,this.emitter=new n,this.signal=t,this.renderer=new o,this._components=new Map,this._plugins=new Map,this._lifecycleHooks=["onBeforeMount","onMount","onBeforeUpdate","onUpdate","onUnmount"],this._isMounted=!1}use(e,t={}){return e.install(this,t),this._plugins.set(e.name,e),this}component(e,t){return this._components.set(e,t),this}async mount(n,o,s={}){if(!n)throw new Error(`Container not found: ${n}`);const i="string"==typeof o?this._components.get(o):o;if(!i)throw new Error(`Component "${o}" not registered.`);if("function"!=typeof i.template)throw new Error("Component template must be a function");const{setup:r,template:a,style:c,children:l}=i,u={props:s,emitter:this.emitter,signal:e=>new this.signal(e),...this._prepareLifecycleHooks()},f="function"==typeof r?await r(u):{};return await(async s=>{const i={...u,...s},r=[],f=[],h=[];this._isMounted?i.onBeforeUpdate&&i.onBeforeUpdate():i.onBeforeMount&&i.onBeforeMount();const p=async()=>{const t=e.parse(a(i),i);this.renderer.patchDOM(n,t),this._processEvents(n,i,h),this._injectStyles(n,o,c,i),await this._mountComponents(n,l,f),this._isMounted?i.onUpdate&&i.onUpdate():(i.onMount&&i.onMount(),this._isMounted=!0)};for(const e of Object.values(s))e instanceof t&&r.push(e.watch(p));return await p(),{container:n,data:i,unmount:()=>{for(const e of r)e();for(const e of h)e();for(const e of f)e.unmount();i.onUnmount&&i.onUnmount(),n.innerHTML=""}}})(f)}_prepareLifecycleHooks(){const e={};for(const t of this._lifecycleHooks)e[t]=()=>{};return e}_processEvents(t,n,o){const s=t.querySelectorAll("*");for(const t of s){const s=t.attributes;for(let i=0;i<s.length;i++){const r=s[i];if(r.name.startsWith("@")){const s=r.name.slice(1),i=e.evaluate(r.value,n);"function"==typeof i&&(t.addEventListener(s,i),t.removeAttribute(r.name),o.push((()=>t.removeEventListener(s,i))))}}}}_injectStyles(t,n,o,s){if(!o)return;let i=t.querySelector(`style[data-eleva-style="${n}"]`);i||(i=document.createElement("style"),i.setAttribute("data-eleva-style",n),t.appendChild(i)),i.textContent=e.parse(o(s),s)}_extractProps(e){const t={};for(const{name:n,value:o}of e.attributes)n.startsWith("eleva-prop-")&&(t[n.replace("eleva-prop-","")]=o);return t}async _mountComponentInstance(e,t,n){return e instanceof HTMLElement?await this.mount(e,t,n):null}async _mountComponentsBySelector(e,t,n,o){for(const s of e.querySelectorAll(t)){const e=this._extractProps(s),t=await this._mountComponentInstance(s,n,e);t&&o.push(t)}}async _mountComponents(e,t,n){for(const e of n)e.unmount();if(n.length=0,t)for(const[o,s]of Object.entries(t))o&&await this._mountComponentsBySelector(e,o,s,n)}}}));
-//# sourceMappingURL=eleva.min.js.map