@vectoriox/iox-builder 1.4.50 → 1.4.51

package/fesm2022/vectoriox-iox-builder.mjs

@@ -692,9 +692,8 @@ class DragEngineService {
             // whose DOM element lives inside the dragged source wrapper.
             if (this._sourceEl?.contains(el))
                 continue;
-            // Skip elements hidden by interaction pre-state (pointer-events: none marks
-            // entrance-type targets that are currently opacity:0 in the canvas).
-            if (el.style.pointerEvents === 'none')
+            // Skip elements hidden by interaction pre-state, and any of their children.
+            if (el.closest('[data-iox-hidden]'))
                 continue;
             const rect = this._dropzoneRectCache.get(id) ?? el.getBoundingClientRect();
             if (px >= rect.left && px <= rect.right && py >= rect.top && py <= rect.bottom) {
@@ -1451,6 +1450,7 @@ class InteractionEngineService {
         if (this.ENTRANCE_TYPES.has(action.type)) {
             anim.finished.then(() => {
                 element.style.removeProperty('pointer-events');
+                element.removeAttribute('data-iox-hidden');
                 this.preStatedElements.delete(element);
                 // Builder: clear inline pre-state so cancelling animations later
                 // doesn't leave the element invisible after a play preview.
@@ -1483,11 +1483,10 @@ class InteractionEngineService {
         for (const [prop, val] of Object.entries(first)) {
             element.style[prop] = String(val);
         }
-        // Invisible element must not intercept pointer events.
-        const opacity = first['opacity'];
-        if (opacity === '0' || opacity === 0) {
-            element.style.setProperty('pointer-events', 'none');
-        }
+        // Mark as hidden so the builder overlay and drag engine can ignore this element
+        // and all of its children regardless of which entrance animation type is used.
+        element.setAttribute('data-iox-hidden', '');
+        element.style.setProperty('pointer-events', 'none');
         this.preStatedElements.add(element);
     }
     clearInlineAnimationStyles(element) {
@@ -1495,6 +1494,7 @@ class InteractionEngineService {
         element.style.removeProperty('transform');
         element.style.removeProperty('visibility');
         element.style.removeProperty('pointer-events');
+        element.removeAttribute('data-iox-hidden');
     }
     reverseAction(element, action) {
         const { keyframes } = this.buildAnimation(action);