@mintjamsinc/ichigojs 0.1.38 → 0.1.40

package/dist/ichigo.cjs

@@ -8335,6 +8335,10 @@
                     }
                 }
             }
+            // Remove anchor node from DOM if it exists
+            if (this.#anchorNode?.parentNode) {
+                this.#anchorNode.parentNode.removeChild(this.#anchorNode);
+            }
         }
         #parseDirectives() {
             const element = this.#vNode.node;
@@ -9345,7 +9349,8 @@
          * @inheritdoc
          */
         destroy() {
-            // Default implementation does nothing. Override in subclasses if needed.
+            // Clean up the rendered VNode if it exists
+            this.#removedNode();
         }
         /**
          * Renders the node based on the evaluation of the directive's condition.
@@ -9387,10 +9392,12 @@
             // 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
+            // Pass the current bindings to ensure loop variables from v-for are available
             const vNode = new VNode({
                 node: clone,
                 vApplication: this.#vNode.vApplication,
-                parentVNode: this.#vNode.parentVNode
+                parentVNode: this.#vNode,
+                bindings: this.#vNode.bindings
             });
             this.#renderedVNode = vNode;
             this.#renderedVNode.forceUpdate();
@@ -9748,13 +9755,6 @@
                 if (!vNode) {
                     // Create new item
                     const clone = this.#cloneNode();
-                    // Insert after previous node
-                    if (prevNode.nextSibling) {
-                        parent.insertBefore(clone, prevNode.nextSibling);
-                    }
-                    else {
-                        parent.appendChild(clone);
-                    }
                     // Create bindings for this iteration
                     const bindings = new VBindings({
                         parent: this.#vNode.bindings
@@ -9762,16 +9762,31 @@
                     // Set item bindings (handles nested destructuring)
                     this.#setItemBindings(bindings, context);
                     // Create a new VNode for the cloned element
+                    // Note: VNode creation must happen BEFORE DOM insertion because
+                    // directives like v-if may modify the DOM structure (create anchors, remove template elements)
+                    let depIds = [
+                        `${this.#sourceName}[${context.index}]`,
+                        ...this.#vNode.vApplication.resolveDependentIdentifiers(this.#sourceName, context.item)
+                    ];
+                    if (this.#itemName) {
+                        depIds.push(this.#itemName);
+                    }
                     vNode = new VNode({
                         node: clone,
                         vApplication: this.#vNode.vApplication,
-                        parentVNode: this.#vNode.parentVNode,
+                        parentVNode: this.#vNode,
                         bindings,
-                        dependentIdentifiers: [
-                            `${this.#sourceName}[${context.index}]`,
-                            ...this.#vNode.vApplication.resolveDependentIdentifiers(this.#sourceName, context.item)
-                        ],
+                        dependentIdentifiers: depIds,
                     });
+                    // Determine what to insert: anchor node (if exists) or the clone itself
+                    const nodeToInsert = vNode.anchorNode || clone;
+                    // Insert after previous node
+                    if (prevNode.nextSibling) {
+                        parent.insertBefore(nodeToInsert, prevNode.nextSibling);
+                    }
+                    else {
+                        parent.appendChild(nodeToInsert);
+                    }
                     newRenderedItems.set(key, vNode);
                     vNode.forceUpdate();
                 }
@@ -9780,17 +9795,20 @@
                     newRenderedItems.set(key, vNode);
                     // Update bindings
                     this.#updateItemBindings(vNode, context);
+                    // Determine the actual node in DOM: anchor node (if exists) or vNode.node
+                    const actualNode = vNode.anchorNode || vNode.node;
                     // Move to correct position if needed
-                    if (prevNode.nextSibling !== vNode.node) {
+                    if (prevNode.nextSibling !== actualNode) {
                         if (prevNode.nextSibling) {
-                            parent.insertBefore(vNode.node, prevNode.nextSibling);
+                            parent.insertBefore(actualNode, prevNode.nextSibling);
                         }
                         else {
-                            parent.appendChild(vNode.node);
+                            parent.appendChild(actualNode);
                         }
                     }
                 }
-                prevNode = vNode.node;
+                // Use anchor node as prevNode if it exists, otherwise use vNode.node
+                prevNode = vNode.anchorNode || vNode.node;
             }
             // Update rendered items map
             this.#renderedItems = newRenderedItems;