@mintjamsinc/ichigojs 0.1.15 → 0.1.16

package/dist/ichigo.umd.js

@@ -7257,7 +7257,7 @@
          * @inheritdoc
          */
         get needsAnchor() {
-            return true;
+            return false;
         }
         /**
          * @inheritdoc
@@ -7328,7 +7328,12 @@
         get onUnmounted() {
             return undefined;
         }
-        #cloneNode() {
+        /**
+         * Clones the component's template and returns the root element.
+         * @returns The cloned root HTMLElement of the component.
+         * @throws Error if the component or its template is not found.
+         */
+        cloneNode() {
             // Get component definition from the application's component registry
             const component = this.#vNode.vApplication.componentRegistry.get(this.#componentId);
             if (!component) {
@@ -7376,8 +7381,6 @@
                 // Already rendered, no action needed
                 return;
             }
-            const clone = this.#cloneNode();
-            this.#vNode.anchorNode?.parentNode?.insertBefore(clone, this.#vNode.anchorNode.nextSibling);
             // Get properties from :options or :options.component directive
             let properties = {};
             const optionsDirective = this.#vNode.directiveManager?.optionsDirective('component');
@@ -7402,7 +7405,7 @@
             const instance = component.createInstance(properties);
             // Create and mount child application using the parent application's registries
             this.#componentApp = this.#vNode.vApplication.createChildApp(instance);
-            this.#componentApp.mount(clone);
+            this.#componentApp.mount(this.#vNode.node);
         }
     }
 
@@ -7737,6 +7740,11 @@
          * The keys are directive names (e.g., 'options', 'options.intersection').
          */
         #optionsDirectives = {};
+        /**
+         * The v-component directive associated with this node, if any.
+         * This may be undefined if there is no v-component directive.
+         */
+        #componentDirective;
         constructor(vNode) {
             // Directives can only be associated with element nodes
             if (vNode.nodeType !== Node.ELEMENT_NODE) {
@@ -7794,6 +7802,13 @@
         get keyDirective() {
             return this.#keyDirective;
         }
+        /**
+         * Gets the v-component directive associated with this node, if any.
+         * This may be undefined if there is no v-component directive.
+         */
+        get componentDirective() {
+            return this.#componentDirective;
+        }
         /**
          * Gets the VBindDirective for options specific to the given directive name.
          * Searches in order: `:options.{directive}` -> `:options`
@@ -7883,6 +7898,10 @@
                             this.#optionsDirectives[attrName] = bindDirective;
                         }
                     }
+                    // If this is a v-component directive, store it separately
+                    if (directive.name === StandardDirectiveName.V_COMPONENT) {
+                        this.#componentDirective = directive;
+                    }
                 }
             }
             // Sort directives by priority: v-for > v-if > v-else-if > v-else > v-show > others
@@ -8836,8 +8855,14 @@
          */
         #cloneTemplate() {
             // Clone the original element
-            const element = this.#vNode.node;
-            const clone = element.cloneNode(true);
+            let clone;
+            if (this.vNode.directiveManager?.componentDirective) {
+                clone = this.vNode.directiveManager.componentDirective.cloneNode();
+            }
+            else {
+                const element = this.#vNode.node;
+                clone = element.cloneNode(true);
+            }
             // Create a new VNode for the cloned element
             const vNode = new VNode({
                 node: clone,
@@ -9272,8 +9297,14 @@
          */
         #cloneTemplate(context) {
             // Clone the original element
-            const element = this.#vNode.node;
-            const clone = element.cloneNode(true);
+            let clone;
+            if (this.vNode.directiveManager?.componentDirective) {
+                clone = this.vNode.directiveManager.componentDirective.cloneNode();
+            }
+            else {
+                const element = this.#vNode.node;
+                clone = element.cloneNode(true);
+            }
             // Prepare identifiers for the item
             this.#itemName;
             this.#indexName;