@acorex/platform 21.0.0-next.71 → 21.0.0-next.72

package/fesm2022/acorex-platform-layout-builder.mjs

@@ -5,7 +5,7 @@ import { Injectable, inject, input, model, signal, computed, effect, output, vie
 import { provideCommandSetups, AXPCommandService } from '@acorex/platform/runtime';
 import { AXPopupService } from '@acorex/components/popup';
 import * as i4 from '@acorex/platform/core';
-import { AXPHookService, AXPExpressionEvaluatorService, captureFormContextBaseline, isFormContextDirty, AXPComponentSlotModule, AXPContextStore } from '@acorex/platform/core';
+import { normalizeKeyboardShortcuts, AXPHookService, findOverlayContainerAncestor, getNestedVisibleOverlayPanes, getTopVisibleOverlayContainer, AXPExpressionEvaluatorService, AXPComponentSlotModule, AXPContextStore } from '@acorex/platform/core';
 import * as i1 from '@acorex/platform/layout/widget-core';
 import { AXPWidgetSerializationHelper, AXPWidgetContainerComponent, AXPPageStatus, AXPWidgetCoreModule, AXPWidgetRegistryService } from '@acorex/platform/layout/widget-core';
 import { cloneDeep, isNil, set, isEqual, merge } from 'lodash-es';
@@ -15,7 +15,6 @@ import { Subject, debounceTime, distinctUntilChanged, startWith } from 'rxjs';
 import { AXOverlayService } from '@acorex/cdk/overlay';
 import * as i1$1 from '@acorex/components/button';
 import { AXButtonModule } from '@acorex/components/button';
-import { AXDialogService } from '@acorex/components/dialog';
 import * as i2$1 from '@acorex/components/decorators';
 import { AXDecoratorModule } from '@acorex/components/decorators';
 import * as i3 from '@acorex/components/loading';
@@ -23,6 +22,7 @@ import { AXLoadingModule } from '@acorex/components/loading';
 import { AXBasePageComponent } from '@acorex/components/page';
 import * as i6 from '@acorex/core/translation';
 import { AXTranslationService, AXTranslationModule } from '@acorex/core/translation';
+import { AXPUnsavedChangesConfirmService } from '@acorex/platform/common';
 import { AXP_ENTITY_DEFINITION_CRUD_SERVICE } from '@acorex/platform/domain';
 
 //#region ----   Dialog Action Shortcut Utilities   ----
@@ -75,9 +75,9 @@ function resolveDialogActionShortcuts(defaults, overrides) {
         if (overrides.length === 0) {
             return undefined;
         }
-        return dedupeDialogActionShortcuts([...defaults, ...overrides]);
+        return flattenDialogActionShortcutChords([...defaults, ...overrides]);
     }
-    return defaults.length ? [...defaults] : undefined;
+    return flattenDialogActionShortcutChords(defaults);
 }
 /**
  * Applies built-in footer shortcuts when actions are declared without `shortcuts`
@@ -95,6 +95,11 @@ function resolveConfiguredFooterActionShortcuts(command, explicit) {
     }
     return undefined;
 }
+function flattenDialogActionShortcutChords(shortcuts) {
+    const chords = normalizeKeyboardShortcuts(shortcuts).flatMap((shortcut) => shortcut.keys);
+    const deduped = dedupeDialogActionShortcuts(chords);
+    return deduped.length ? deduped : undefined;
+}
 function dedupeDialogActionShortcuts(shortcuts) {
     const seen = new Set();
     const result = [];
@@ -2555,8 +2560,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 }]
         }] });
 
-const OVERLAY_CONTAINER_SELECTOR = '.ax-overlay-container';
-const OVERLAY_PANE_SELECTOR = '.ax-overlay-pane';
 /**
  * Returns true when a nested overlay is open and Esc should close it first.
  * Returns false when only the dialog shell is on top.
@@ -2578,52 +2581,6 @@ function hasOpenNestedOverlayFromAcorexService(overlayService, dialogOverlay) {
     }
     return null;
 }
-/**
- * Returns true when the overlay element is rendered and visible in the viewport.
- */
-function isVisibleOverlayElement(element) {
-    if (!(element instanceof HTMLElement)) {
-        return false;
-    }
-    const style = getComputedStyle(element);
-    if (style.display === 'none' || style.visibility === 'hidden' || Number(style.opacity) === 0) {
-        return false;
-    }
-    const rect = element.getBoundingClientRect();
-    return rect.width > 0 && rect.height > 0;
-}
-/**
- * Collects visible overlay containers in stacking order (later / higher z-index wins).
- */
-function getVisibleOverlayContainers(document) {
-    return Array.from(document.querySelectorAll(OVERLAY_CONTAINER_SELECTOR))
-        .filter(isVisibleOverlayElement)
-        .sort(compareOverlayStackOrder);
-}
-/**
- * Compares two overlay containers by z-index, then DOM order.
- */
-function compareOverlayStackOrder(a, b) {
-    const za = Number(getComputedStyle(a).zIndex) || 0;
-    const zb = Number(getComputedStyle(b).zIndex) || 0;
-    if (za !== zb) {
-        return za - zb;
-    }
-    const position = a.compareDocumentPosition(b);
-    if (position & Node.DOCUMENT_POSITION_FOLLOWING) {
-        return -1;
-    }
-    if (position & Node.DOCUMENT_POSITION_PRECEDING) {
-        return 1;
-    }
-    return 0;
-}
-/**
- * Returns visible anchored overlay panes that belong to widget popovers, not the dialog shell.
- */
-function getNestedOverlayPanes(document, dialogOverlay) {
-    return Array.from(document.querySelectorAll(OVERLAY_PANE_SELECTOR)).filter((pane) => isVisibleOverlayElement(pane) && !dialogOverlay?.contains(pane));
-}
 /**
  * DOM fallback until {@link AXOverlayService} exposes open-overlay queries.
  *
@@ -2631,15 +2588,14 @@ function getNestedOverlayPanes(document, dialogOverlay) {
  * Widget popovers (select, datetime, dropdown) use anchored containers with `.ax-overlay-pane`.
  */
 function shouldDeferEscapeToNestedOverlayFromDom(document, dialogHost) {
-    const dialogOverlay = dialogHost.closest(OVERLAY_CONTAINER_SELECTOR);
-    if (getNestedOverlayPanes(document, dialogOverlay).length > 0) {
+    const dialogOverlay = findOverlayContainerAncestor(dialogHost);
+    if (getNestedVisibleOverlayPanes(document, dialogOverlay).length > 0) {
         return true;
     }
-    const visibleContainers = getVisibleOverlayContainers(document);
-    if (!visibleContainers.length) {
+    const topContainer = getTopVisibleOverlayContainer(document);
+    if (!topContainer) {
         return false;
     }
-    const topContainer = visibleContainers[visibleContainers.length - 1];
     if (!dialogOverlay) {
         return topContainer.contains(dialogHost) === false;
     }
@@ -2650,7 +2606,7 @@ function shouldDeferEscapeToNestedOverlayFromDom(document, dialogHost) {
  * should not run on the parent dialog.
  */
 function shouldDeferDialogShortcutsToNestedOverlay(document, dialogHost, overlayService) {
-    const dialogOverlay = dialogHost.closest(OVERLAY_CONTAINER_SELECTOR);
+    const dialogOverlay = findOverlayContainerAncestor(dialogHost);
     if (overlayService) {
         const fromService = hasOpenNestedOverlayFromAcorexService(overlayService, dialogOverlay);
         if (fromService !== null) {
@@ -2687,10 +2643,6 @@ function shouldRouteOnActionCancelThroughDismissGate(confirmCloseWhenDirtyEnable
     return confirmCloseWhenDirtyEnabled === true;
 }
 
-/** Idle period after the last context change before capturing the clean baseline. */
-const DIALOG_DIRTY_BASELINE_IDLE_MS = 500;
-/** Hard fallback when idle detection never settles. */
-const DIALOG_DIRTY_BASELINE_FALLBACK_DELAY_MS = 2000;
 /** Debounce after widget count stabilizes before re-evaluating footer actions. */
 const DIALOG_WIDGET_COUNT_STABLE_DELAY_MS = 350;
 class AXPDialogRendererComponent extends AXBasePageComponent {
@@ -2700,17 +2652,17 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         this.expressionEvaluator = inject(AXPExpressionEvaluatorService);
         this.commandService = inject(AXPCommandService);
         this.hookService = inject(AXPHookService, { optional: true });
-        this.dialogService = inject(AXDialogService);
+        this.unsavedChangesConfirm = inject(AXPUnsavedChangesConfirmService);
         this.overlayService = inject(AXOverlayService);
         this.translationService = inject(AXTranslationService);
         this.document = inject(DOCUMENT);
         this.host = inject((ElementRef));
         /** Ensures `show()` resolves once when the dialog closes (footer action or header close). */
         this.callbackInvoked = false;
-        /** True after the post-init baseline snapshot has been captured. */
-        this.dirtyBaselineCaptured = false;
         /** Skips dirty confirmation on the next {@link onClosing} (successful submit / programmatic close). */
         this.skipNextOnClosingDirtyCheck = false;
+        /** Blocks re-entrant {@link onClosing} while the first close gate is still resolving. */
+        this.closeGateInProgress = false;
         this.destroyRef = inject(DestroyRef);
         this.context = signal({}, ...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
         // This will be set by the popup service automatically - same as dynamic-dialog
@@ -2733,7 +2685,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
                 return;
             }
             // Unsaved-changes confirm is modal — parent footer shortcuts must not run underneath it.
-            if (this.dismissConfirmPromise) {
+            if (this.unsavedChangesConfirm.isConfirmPending()) {
                 return;
             }
             if (shouldDeferDialogShortcutsToNestedOverlay(this.document, this.host.nativeElement, this.overlayService)) {
@@ -2784,36 +2736,15 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
                 this.aggregateAndEvaluateActions();
             }, DIALOG_WIDGET_COUNT_STABLE_DELAY_MS);
         }, ...(ngDevMode ? [{ debugName: "#widgetActionsEffect" }] : /* istanbul ignore next */ []));
-        this.#dirtyBaselineEffect = effect(() => {
-            if (this.dirtyBaselineCaptured) {
-                return;
-            }
-            const store = this.getWidgetContextStore();
-            if (!store) {
-                return;
-            }
-            store.data();
-            this.widgetCoreService?.registeredWidgetsCount();
-            this.scheduleDirtyBaselineCapture();
-        }, ...(ngDevMode ? [{ debugName: "#dirtyBaselineEffect" }] : /* istanbul ignore next */ []));
     }
     //#endregion
     //#region ----   Lifecycle   ----
     ngOnInit() {
         const initialContext = this.config?.context || {};
         this.context.set(initialContext);
-        this.dirtyBaselineFallbackTimer = setTimeout(() => {
-            this.captureDirtyBaselineIfNeeded();
-        }, DIALOG_DIRTY_BASELINE_FALLBACK_DELAY_MS);
         this.document.addEventListener('keydown', this.onDialogShortcutCapture, true);
         this.destroyRef.onDestroy(() => {
             this.document.removeEventListener('keydown', this.onDialogShortcutCapture, true);
-            if (this.dirtyBaselineIdleTimer) {
-                clearTimeout(this.dirtyBaselineIdleTimer);
-            }
-            if (this.dirtyBaselineFallbackTimer) {
-                clearTimeout(this.dirtyBaselineFallbackTimer);
-            }
         });
         void this.invokeLayoutContextChangedHooks();
     }
@@ -2824,25 +2755,31 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
      * This is the only place that prompts for unsaved changes.
      */
     async onClosing(e) {
-        if (this.dismissConfirmPromise) {
+        if (this.unsavedChangesConfirm.isConfirmPending() || this.closeGateInProgress) {
             e.cancel = true;
             return;
         }
-        if (this.skipNextOnClosingDirtyCheck) {
-            this.skipNextOnClosingDirtyCheck = false;
-            this.completeDismissResolve();
-            return;
-        }
-        if (!this.config?.confirmCloseWhenDirty?.enabled) {
+        this.closeGateInProgress = true;
+        try {
+            if (this.skipNextOnClosingDirtyCheck) {
+                this.skipNextOnClosingDirtyCheck = false;
+                this.completeDismissResolve();
+                return;
+            }
+            if (!this.config?.confirmCloseWhenDirty?.enabled) {
+                this.completeDismissResolve();
+                return;
+            }
+            if (!(await this.confirmDismissIfDirty())) {
+                e.cancel = true;
+                this.pendingDismissResolvePayload = undefined;
+                return;
+            }
             this.completeDismissResolve();
-            return;
         }
-        if (!(await this.confirmDismissIfDirty())) {
-            e.cancel = true;
-            this.pendingDismissResolvePayload = undefined;
-            return;
+        finally {
+            this.closeGateInProgress = false;
         }
-        this.completeDismissResolve();
     }
     /**
      * Footer cancel and other in-app dismiss actions. Routes through `super.close()` so the
@@ -2866,50 +2803,10 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
     }
     //#endregion
     //#region ----   Dirty State   ----
-    getWidgetContextStore() {
-        return this.layoutRenderer()?.getContainer()?.contextService;
-    }
-    scheduleDirtyBaselineCapture() {
-        if (this.dirtyBaselineCaptured) {
-            return;
-        }
-        if (this.dirtyBaselineIdleTimer) {
-            clearTimeout(this.dirtyBaselineIdleTimer);
-        }
-        this.dirtyBaselineIdleTimer = setTimeout(() => {
-            this.captureDirtyBaselineIfNeeded();
-        }, DIALOG_DIRTY_BASELINE_IDLE_MS);
-    }
-    /**
-     * Captures a dialog-local baseline once after widget init/normalization goes idle.
-     */
-    captureDirtyBaselineIfNeeded() {
-        if (this.dirtyBaselineCaptured) {
-            return;
-        }
-        const store = this.getWidgetContextStore();
-        if (!store) {
-            return;
-        }
-        const widgetCount = this.widgetCoreService?.registeredWidgetsCount() ?? 0;
-        if (widgetCount === 0) {
-            return;
-        }
-        const snapshot = store.data();
-        this.dirtyBaseline = captureFormContextBaseline(snapshot);
-        store.commitBaseline();
-        this.dirtyBaselineCaptured = true;
-        if (this.dirtyBaselineIdleTimer) {
-            clearTimeout(this.dirtyBaselineIdleTimer);
-            this.dirtyBaselineIdleTimer = undefined;
-        }
-        if (this.dirtyBaselineFallbackTimer) {
-            clearTimeout(this.dirtyBaselineFallbackTimer);
-            this.dirtyBaselineFallbackTimer = undefined;
-        }
+    getWidgetContainer() {
+        return this.layoutRenderer()?.getContainer();
     }
     #widgetActionsEffect;
-    #dirtyBaselineEffect;
     //#endregion
     handleContextChanged(event) {
         this.context.set(event);
@@ -2929,7 +2826,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         const payload = {
             sessionKey: this.contextChangedHooksSessionKey,
             getContext: () => {
-                const store = this.getWidgetContextStore();
+                const store = this.getWidgetContainer()?.contextService;
                 return (store?.data() ?? this.context() ?? {});
             },
             metadata: meta,
@@ -3037,43 +2934,29 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
     }
     isDialogDirty() {
         const confirmOptions = this.config?.confirmCloseWhenDirty;
-        if (!confirmOptions?.enabled || !this.dirtyBaselineCaptured) {
+        if (!confirmOptions?.enabled) {
             return false;
         }
-        const store = this.getWidgetContextStore();
-        if (!store) {
+        const container = this.getWidgetContainer();
+        if (!container?.isSavedCommitted()) {
             return false;
         }
-        const current = store.data();
-        const baseline = this.dirtyBaseline ?? store.initial();
+        const store = container.contextService;
         if (typeof confirmOptions.isDirty === 'function') {
-            return confirmOptions.isDirty(current, baseline);
+            return confirmOptions.isDirty(store.data(), store.saved());
         }
-        return (store.isUserDirty() ||
-            (this.widgetCoreService?.hasDirtyWidgets() ?? false) ||
-            isFormContextDirty(current, baseline));
+        return container.isFormDirty();
     }
-    async confirmDismissIfDirty() {
-        if (this.dismissConfirmPromise) {
-            return this.dismissConfirmPromise;
-        }
+    confirmDismissIfDirty() {
         const confirmOptions = this.config?.confirmCloseWhenDirty;
         if (!confirmOptions?.enabled || !this.isDialogDirty()) {
-            return true;
-        }
-        this.dismissConfirmPromise = this.promptUnsavedChangesConfirm(confirmOptions);
-        try {
-            return await this.dismissConfirmPromise;
+            return Promise.resolve(true);
         }
-        finally {
-            this.dismissConfirmPromise = undefined;
-        }
-    }
-    async promptUnsavedChangesConfirm(confirmOptions) {
-        const title = await this.translationService.translateAsync(confirmOptions.title ?? '@general:messages.unsaved-changes.title');
-        const message = await this.translationService.translateAsync(confirmOptions.message ?? '@general:messages.unsaved-changes.message');
-        const dialogResult = await this.dialogService.confirm(title, message, 'warning', 'horizontal', false, 'cancel');
-        return dialogResult.result === true;
+        return this.unsavedChangesConfirm.confirmIfDirty(true, {
+            enabled: confirmOptions.enabled,
+            title: confirmOptions.title,
+            message: confirmOptions.message,
+        });
     }
     /** Whether the layout form should be validated before running this footer command. */
     shouldValidateBeforeAction(cmd) {