@breadstone/mosaik-elements-angular 0.0.255 → 0.0.257

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## 0.0.257 (2026-05-06)
+
+### 🚀 Features
+
+- **DialogService, DrawerService, MessageBoxService, SheetService, ToastService:** refactor click outside close handling ([34feb21a64](https://github.com/RueDeRennes/mosaik/commit/34feb21a64))
+
+### 🩹 Fixes
+
+- **docs:** update line numbers in overlay service documentation ([5c461a79b7](https://github.com/RueDeRennes/mosaik/commit/5c461a79b7))
+
+## 0.0.256 (2026-05-04)
+
+This was a version bump only for mosaik-elements-angular to align it with other projects, there were no code changes.
+
 ## 0.0.255 (2026-05-04)
 
 This was a version bump only for mosaik-elements-angular to align it with other projects, there were no code changes.

package/fesm2022/mosaik-elements-angular.mjs

@@ -5,7 +5,7 @@ import { AbsoluteItemElement, AbsoluteElement, ActionbarGroupElement, ActionbarI
 import { AbstractControl, FormGroupDirective, NgControl, TouchedChangeEvent, NG_VALUE_ACCESSOR, FormControl, FormArray, FormGroup } from '@angular/forms';
 import { BreakpointObserver } from '@angular/cdk/layout';
 import { CssLength, ThemeObserver, ThemeGeneratorServiceLocator, ThemeGenerator, ThemeObserverServiceLocator } from '@breadstone/mosaik-themes';
-import { Subscription, filter, of, isObservable, Subject, BehaviorSubject, fromEvent, takeUntil, timer, share, Observable } from 'rxjs';
+import { Subscription, filter, of, isObservable, Subject, BehaviorSubject, take, takeUntil, fromEvent, timer, share, Observable } from 'rxjs';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FORM_FIELD, validate } from '@angular/forms/signals';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
@@ -11876,6 +11876,66 @@ class PortalProvider {
     }
 }
 
+// #region Imports
+// #region Methods
+/**
+ * Subscribes to CDK outside interactions while preserving Mosaik portal ownership.
+ *
+ * @internal
+ */
+function connectOverlayOutsideClose(overlayRef, closed, close) {
+    overlayRef.backdropClick().pipe(take(1), takeUntil(closed))
+        .subscribe(() => close());
+    overlayRef.outsidePointerEvents().pipe(filter((event) => !isOwnedMosaikPortalProjectionEvent(overlayRef, event)), take(1), takeUntil(closed))
+        .subscribe(() => close());
+}
+function isOwnedMosaikPortalProjectionEvent(overlayRef, event) {
+    return event.composedPath()
+        .some((target) => isMosaikPortalProjectionElement(target) && isProjectionOwnedByOverlay(overlayRef, target));
+}
+function isMosaikPortalProjectionElement(target) {
+    return typeof HTMLElement !== 'undefined' && target instanceof HTMLElement && target.localName === 'mosaik-portal-projection';
+}
+function isProjectionOwnedByOverlay(overlayRef, projection) {
+    const portal = tryGetProjectionPortal(projection);
+    return portal !== null && isComposedDescendantOf(overlayRef.overlayElement, portal);
+}
+function tryGetProjectionPortal(projection) {
+    try {
+        return typeof HTMLElement !== 'undefined' && projection.portal instanceof HTMLElement
+            ? projection.portal
+            : null;
+    }
+    catch {
+        return null;
+    }
+}
+function isComposedDescendantOf(parent, child) {
+    let current = child;
+    while (current) {
+        if (current === parent) {
+            return true;
+        }
+        if (isShadowRoot(current)) {
+            current = current.host;
+        }
+        else if (current.parentNode) {
+            current = current.parentNode;
+        }
+        else {
+            const root = current.getRootNode();
+            current = isShadowRoot(root)
+                ? root.host
+                : null;
+        }
+    }
+    return false;
+}
+function isShadowRoot(node) {
+    return typeof ShadowRoot !== 'undefined' && node instanceof ShadowRoot;
+}
+// #endregion
+
 // #endregion
 /**
  * @public
@@ -12038,14 +12098,7 @@ class DialogService extends PortalProvider {
                 }
             });
             if (config.clickOutsideToClose) {
-                const backdropClickSubscription = overlayRef.backdropClick().subscribe(() => {
-                    backdropClickSubscription.unsubscribe();
-                    dialogRef.close(Cancel.negative());
-                });
-                const outsidePointerEventsSubscription = overlayRef.outsidePointerEvents().subscribe(() => {
-                    outsidePointerEventsSubscription.unsubscribe();
-                    dialogRef.close(Cancel.negative());
-                });
+                connectOverlayOutsideClose(overlayRef, dialogRef.closed, () => dialogRef.close(Cancel.negative()));
             }
             if (config.pressEscapeToClose) {
                 const documentKeyupSubscription = fromEvent(this._document, 'keyup').pipe(filter((event) => event.keyCode === Key.Escape), takeUntil(dialogRef.closed))
@@ -14898,14 +14951,7 @@ class DrawerService extends PortalProvider {
                 }
             });
             if (config.clickOutsideToClose) {
-                const backdropClickSubscription = overlayRef.backdropClick().subscribe(() => {
-                    backdropClickSubscription.unsubscribe();
-                    drawerRef.close(Cancel.negative());
-                });
-                const outsidePointerEventsSubscription = overlayRef.outsidePointerEvents().subscribe(() => {
-                    outsidePointerEventsSubscription.unsubscribe();
-                    drawerRef.close(Cancel.negative());
-                });
+                connectOverlayOutsideClose(overlayRef, drawerRef.closed, () => drawerRef.close(Cancel.negative()));
             }
             if (config.pressEscapeToClose) {
                 const documentKeyupSubscription = fromEvent(this._document, 'keyup').pipe(filter((event) => event.keyCode === Key.Escape), takeUntil(drawerRef.closed))
@@ -15845,14 +15891,7 @@ class MessageBoxService extends PortalProvider {
                 Object.assign(messageBoxRef.element.intl, config.intl);
             }
             if (config.clickOutsideToClose) {
-                const backdropClickSubscription = overlayRef.backdropClick().subscribe(() => {
-                    backdropClickSubscription.unsubscribe();
-                    messageBoxRef.close(Cancel.negative());
-                });
-                const outsidePointerEventsSubscription = overlayRef.outsidePointerEvents().subscribe(() => {
-                    outsidePointerEventsSubscription.unsubscribe();
-                    messageBoxRef.close(Cancel.negative());
-                });
+                connectOverlayOutsideClose(overlayRef, messageBoxRef.closed, () => messageBoxRef.close(Cancel.negative()));
             }
             if (config.pressEscapeToClose) {
                 const documentKeyupSubscription = fromEvent(this._document, 'keyup').pipe(filter((event) => event.keyCode === Key.Escape), takeUntil(messageBoxRef.closed))
@@ -17505,14 +17544,7 @@ class SheetService extends PortalProvider {
                 }
             });
             if (config.clickOutsideToClose) {
-                const backdropClickSubscription = overlayRef.backdropClick().subscribe(() => {
-                    backdropClickSubscription.unsubscribe();
-                    sheetRef.close(Cancel.negative());
-                });
-                const outsidePointerEventsSubscription = overlayRef.outsidePointerEvents().subscribe(() => {
-                    outsidePointerEventsSubscription.unsubscribe();
-                    sheetRef.close(Cancel.negative());
-                });
+                connectOverlayOutsideClose(overlayRef, sheetRef.closed, () => sheetRef.close(Cancel.negative()));
             }
             if (config.pressEscapeToClose) {
                 const documentKeyupSubscription = fromEvent(this._document, 'keyup').pipe(filter((event) => event.keyCode === Key.Escape), takeUntil(sheetRef.closed))
@@ -18272,14 +18304,7 @@ class ToastService extends PortalProvider {
                 }
             });
             if (config.clickOutsideToClose) {
-                const backdropClickSubscription = overlayRef.backdropClick().subscribe(() => {
-                    backdropClickSubscription.unsubscribe();
-                    toastRef.close(Cancel.negative());
-                });
-                const outsidePointerEventsSubscription = overlayRef.outsidePointerEvents().subscribe(() => {
-                    outsidePointerEventsSubscription.unsubscribe();
-                    toastRef.close(Cancel.negative());
-                });
+                connectOverlayOutsideClose(overlayRef, toastRef.closed, () => toastRef.close(Cancel.negative()));
             }
             if (config.pressEscapeToClose) {
                 const documentKeyupSubscription = fromEvent(this._document, 'keyup').pipe(filter((event) => event.keyCode === Key.Escape), takeUntil(toastRef.closed))