@vectoriox/iox-builder 1.4.49 → 1.4.51

package/fesm2022/vectoriox-iox-builder.mjs

@@ -372,11 +372,26 @@ class DragEngineService {
     handleDrop(children, event, dropListId, cdr, afterDrop) {
         const { payload, insertIndex } = event;
         if (payload.type === 'external') {
-            const config = this.registry.createConfig(payload.data);
-            if (config) {
-                children.splice(insertIndex, 0, config);
+            const data = payload.data;
+            if (typeof data === 'string') {
+                // Built-in component type — create from registry.
+                const config = this.registry.createConfig(data);
+                if (config) {
+                    children.splice(insertIndex, 0, config);
+                    cdr.detectChanges();
+                    this.dropComplete$.next(config);
+                }
+            }
+            else {
+                // Full block object { node, symbolId, syncInstances } or bare ComponentNode.
+                const nodeData = data.node ?? data;
+                const cloned = deepCloneNode(nodeData);
+                if (data.syncInstances && data.symbolId) {
+                    cloned.symbolId = data.symbolId;
+                }
+                children.splice(insertIndex, 0, cloned);
                 cdr.detectChanges();
-                this.dropComplete$.next(config);
+                this.dropComplete$.next(cloned);
             }
             afterDrop?.();
             return;
@@ -677,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) {
@@ -1436,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.
@@ -1468,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) {
@@ -1480,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);