@mintjamsinc/ichigojs 0.1.18 → 0.1.19

package/dist/ichigo.esm.js

@@ -8812,8 +8812,17 @@ class VConditionalDirective {
             // Already rendered, no action needed
             return;
         }
-        this.#renderedVNode = this.#cloneTemplate();
-        this.#vNode.anchorNode?.parentNode?.insertBefore(this.#renderedVNode.node, this.#vNode.anchorNode.nextSibling);
+        // Clone the original node and create a new VNode for it
+        const clone = this.#cloneNode();
+        // Insert the cloned node after the anchor node, or as a child of the parent if no anchor
+        this.#vNode.anchorNode?.parentNode?.insertBefore(clone, this.#vNode.anchorNode.nextSibling);
+        // Create a new VNode for the cloned element
+        const vNode = new VNode({
+            node: clone,
+            vApplication: this.#vNode.vApplication,
+            parentVNode: this.#vNode.parentVNode
+        });
+        this.#renderedVNode = vNode;
         this.#renderedVNode.forceUpdate();
     }
     /**
@@ -8832,19 +8841,13 @@ class VConditionalDirective {
         this.#renderedVNode = undefined;
     }
     /**
-     * Clones the template element and creates a new VNode for the cloned element.
+     * Clones the original node of the directive's virtual node.
+     * This is used to create a new instance of the node for rendering.
+     * @returns The cloned HTMLElement.
      */
-    #cloneTemplate() {
-        // Clone the original element
+    #cloneNode() {
         const element = this.#vNode.node;
-        const clone = element.cloneNode(true);
-        // Create a new VNode for the cloned element
-        const vNode = new VNode({
-            node: clone,
-            vApplication: this.#vNode.vApplication,
-            parentVNode: this.#vNode.parentVNode
-        });
-        return vNode;
+        return element.cloneNode(true);
     }
     /**
      * Creates a function to evaluate the directive's condition.
@@ -9184,15 +9187,36 @@ class VForDirective {
             let vNode = this.#renderedItems.get(key);
             if (!vNode) {
                 // Create new item
-                vNode = this.#cloneTemplate(context);
-                newRenderedItems.set(key, vNode);
+                const clone = this.#cloneNode();
                 // Insert after previous node
                 if (prevNode.nextSibling) {
-                    parent.insertBefore(vNode.node, prevNode.nextSibling);
+                    parent.insertBefore(clone, prevNode.nextSibling);
                 }
                 else {
-                    parent.appendChild(vNode.node);
+                    parent.appendChild(clone);
+                }
+                // Prepare identifiers for the item
+                this.#itemName;
+                this.#indexName;
+                // Create bindings for this iteration
+                const bindings = new VBindings({
+                    parent: this.#vNode.bindings
+                });
+                if (this.#itemName) {
+                    bindings.set(this.#itemName, context.item);
+                }
+                if (this.#indexName) {
+                    bindings.set(this.#indexName, context.index);
                 }
+                // Create a new VNode for the cloned element
+                vNode = new VNode({
+                    node: clone,
+                    vApplication: this.#vNode.vApplication,
+                    parentVNode: this.#vNode.parentVNode,
+                    bindings,
+                    dependentIdentifiers: [`${this.#sourceName}[${context.index}]`]
+                });
+                newRenderedItems.set(key, vNode);
                 vNode.forceUpdate();
             }
             else {
@@ -9268,34 +9292,14 @@ class VForDirective {
         };
     }
     /**
-     * Clone template element for each iteration and create a new VNode
+     * Clones the original node of the directive's virtual node.
+     * This is used to create a new instance of the node for rendering.
+     * @returns The cloned HTMLElement.
      */
-    #cloneTemplate(context) {
+    #cloneNode() {
         // Clone the original element
         const element = this.#vNode.node;
-        const clone = element.cloneNode(true);
-        // Prepare identifiers for the item
-        this.#itemName;
-        this.#indexName;
-        // Create bindings for this iteration
-        const bindings = new VBindings({
-            parent: this.#vNode.bindings
-        });
-        if (this.#itemName) {
-            bindings.set(this.#itemName, context.item);
-        }
-        if (this.#indexName) {
-            bindings.set(this.#indexName, context.index);
-        }
-        // Create a new VNode for the cloned element
-        const vNode = new VNode({
-            node: clone,
-            vApplication: this.#vNode.vApplication,
-            parentVNode: this.#vNode.parentVNode,
-            bindings,
-            dependentIdentifiers: [`${this.#sourceName}[${context.index}]`]
-        });
-        return vNode;
+        return element.cloneNode(true);
     }
     /**
      * Update bindings for an existing item