@vectoriox/iox-builder 1.4.50 → 1.4.52

package/fesm2022/vectoriox-iox-builder.mjs

@@ -414,7 +414,13 @@ class DragEngineService {
                 // (e.g. the built-in blocks panel stores one pre-built node object and
                 // reuses it across drags). Deep-clone with fresh IDs so each drop
                 // produces a fully independent node, preventing shared CSS rules.
-                const cloned = deepCloneNode(item);
+                // The panel may supply a bare ComponentNode OR a block wrapper object
+                // { node, symbolId, syncInstances } — extract the node first.
+                const nodeData = item.node ?? item;
+                const cloned = deepCloneNode(nodeData);
+                if (item.syncInstances && item.symbolId) {
+                    cloned.symbolId = item.symbolId;
+                }
                 children.splice(insertIndex, 0, cloned);
                 cdr.detectChanges();
                 this.dropComplete$.next(cloned);
@@ -692,9 +698,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 +1456,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 +1489,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 +1500,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);