@vectoriox/iox-builder 11.6.0 → 11.6.1

package/fesm2022/vectoriox-iox-builder.mjs

@@ -11431,13 +11431,14 @@ class BuilderDialogComponent {
         const allowed = ['center', 'top', 'bottom', 'start', 'end'];
         return allowed.indexOf(String(this.placement)) >= 0 ? String(this.placement) : 'center';
     }
-    constructor(dragEngine, instanceRegistry, overlayService, cdr, designState, panelEvents) {
+    constructor(dragEngine, instanceRegistry, overlayService, cdr, designState, panelEvents, zone) {
         this.dragEngine = dragEngine;
         this.instanceRegistry = instanceRegistry;
         this.overlayService = overlayService;
         this.cdr = cdr;
         this.designState = designState;
         this.panelEvents = panelEvents;
+        this.zone = zone;
         this.children = [];
         this.nodeId = '';
         this.dropListId = '';
@@ -11456,6 +11457,14 @@ class BuilderDialogComponent {
         /** Closed by its X / backdrop while the selection or the switcher still shows it: hidden until either changes. */
         this.dismissed = false;
     }
+    /** The canvas runs interactions OUTSIDE Angular's zone; an open / close they cause still has to reach the panels
+     *  and the toolbar that read the design state (CC1.3: the Phone menu preview, the Menu chip). */
+    inZone(fn) {
+        if (this.zone)
+            this.zone.run(fn);
+        else
+            fn();
+    }
     /** Open on the canvas right now (an exit that is playing counts as closed). */
     get isOpen() {
         return this.designOpen && !this.closing;
@@ -11559,9 +11568,9 @@ class BuilderDialogComponent {
         }
         // Open/close/toggle actions (and A1c's panel) reach the canvas twin through here.
         this.instanceRegistry.register(this.nodeId, {
-            open: () => this.openRuntime(),
-            close: () => this.closeRuntime(),
-            toggle: () => (this.isOpen ? this.closeRuntime() : this.openRuntime()),
+            open: () => this.inZone(() => this.openRuntime()),
+            close: () => this.inZone(() => this.closeRuntime()),
+            toggle: () => this.inZone(() => (this.isOpen ? this.closeRuntime() : this.openRuntime())),
             isOpen: () => this.isOpen,
         });
     }
@@ -11593,7 +11602,7 @@ class BuilderDialogComponent {
     onDrop(event) {
         this.dragEngine.handleDrop(this.children, event, this.dropListId, this.cdr);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.31", ngImport: i0, type: BuilderDialogComponent, deps: [{ token: DragEngineService }, { token: i1$1.ComponentInstanceRegistryService }, { token: OverlayService }, { token: i0.ChangeDetectorRef }, { token: CanvasDesignStateService, optional: true }, { token: PanelEventService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.31", ngImport: i0, type: BuilderDialogComponent, deps: [{ token: DragEngineService }, { token: i1$1.ComponentInstanceRegistryService }, { token: OverlayService }, { token: i0.ChangeDetectorRef }, { token: CanvasDesignStateService, optional: true }, { token: PanelEventService, optional: true }, { token: i0.NgZone, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.31", type: BuilderDialogComponent, isStandalone: false, selector: "app-builder-dialog", inputs: { children: "children", nodeId: "nodeId", dropListId: "dropListId", closeOnBackdrop: "closeOnBackdrop", showCloseButton: "showCloseButton", placement: "placement" }, outputs: { childClick: "childClick", childMouseEnter: "childMouseEnter", childMouseLeave: "childMouseLeave" }, viewQueries: [{ propertyName: "stageRef", first: true, predicate: ["stage"], descendants: true }], ngImport: i0, template: `
         <div *ngIf="designOpen" #stage class="dialog-stage" [attr.data-placement]="placementValue"
              (click)="onStageClick($event)">
@@ -11667,6 +11676,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.31", ngImpo
                     type: Optional
                 }] }, { type: PanelEventService, decorators: [{
                     type: Optional
+                }] }, { type: i0.NgZone, decorators: [{
+                    type: Optional
                 }] }], propDecorators: { children: [{
                 type: Input
             }], nodeId: [{