@vectoriox/iox-builder 1.4.44 → 1.4.45

package/fesm2022/vectoriox-iox-builder.mjs

@@ -1280,9 +1280,13 @@ class InteractionEngineService {
     }
     // ── Triggers ─────────────────────────────────────────────
     attachPageLoad(node, ix, element) {
-        // Execute immediately (next microtask to let rendering settle)
         const timer = setTimeout(() => {
-            this.runActions(node, ix.actions);
+            if (this.hasPreStatedAncestor(element)) {
+                this.deferUntilVisible(element, () => this.runActions(node, ix.actions));
+            }
+            else {
+                this.runActions(node, ix.actions);
+            }
         }, 50);
         return () => clearTimeout(timer);
     }
@@ -1294,6 +1298,17 @@ class InteractionEngineService {
                     const key = ix.id;
                     if (ix.actions.some(a => a.once) && firedSet.has(key))
                         continue;
+                    // Element is in viewport but may be inside a still-fading parent.
+                    // Defer until all pre-stated ancestors finish their entrance animation.
+                    if (this.hasPreStatedAncestor(element)) {
+                        this.deferUntilVisible(element, () => {
+                            if (ix.actions.some(a => a.once) && firedSet.has(key))
+                                return;
+                            firedSet.add(key);
+                            this.runActions(node, ix.actions);
+                        });
+                        continue;
+                    }
                     firedSet.add(key);
                     this.runActions(node, ix.actions);
                 }
@@ -1302,6 +1317,28 @@ class InteractionEngineService {
         observer.observe(element);
         return () => observer.disconnect();
     }
+    /** Returns true if any DOM ancestor of element is currently faded out via pre-state. */
+    hasPreStatedAncestor(element) {
+        let el = element.parentElement;
+        while (el && el !== document.body) {
+            if (this.preStatedElements.has(el))
+                return true;
+            el = el.parentElement;
+        }
+        return false;
+    }
+    /** Polls via RAF until no ancestor is in pre-state, then fires callback. */
+    deferUntilVisible(element, callback) {
+        const poll = () => {
+            if (!this.hasPreStatedAncestor(element)) {
+                callback();
+            }
+            else {
+                requestAnimationFrame(poll);
+            }
+        };
+        requestAnimationFrame(poll);
+    }
     attachClick(node, ix, element) {
         const handler = () => {
             if (ix.reverseActions?.length) {
@@ -1369,9 +1406,11 @@ class InteractionEngineService {
         });
         if (this.ENTRANCE_TYPES.has(action.type)) {
             // Once the entrance animation finishes the element is fully visible —
-            // restore pointer events so it can be interacted with.
+            // restore pointer events and clear the pre-state tracker so children
+            // waiting on this ancestor can fire their deferred animations.
             anim.finished.then(() => {
                 element.style.removeProperty('pointer-events');
+                this.preStatedElements.delete(element);
             }).catch(() => { });
         }
         else if (this.EXIT_TYPES.has(action.type)) {