udp-react-enterprise-component-library 26.7.0-beta.2 → 26.7.0-beta.4

package/dist/providers/UdpAppProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UdpAppProvider.d.ts","sourceRoot":"","sources":["../../src/providers/UdpAppProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AACpD,OAAO,EAAoB,qBAAqB,EAAE,MAAM,WAAW,CAAC;AAIpE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,kCAAkC,CAAC;AAM9E,MAAM,WAAW,kBAAkB;IACjC,8DAA8D;IAC9D,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC;;OAEG;IACH,SAAS,CAAC,EAAE;QACV,kBAAkB,CAAC,EAAE,OAAO,CAAC;KAC9B,CAAC;IACF;;OAEG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AAED;;;;GAIG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAyBxD,CAAC"}
+{"version":3,"file":"UdpAppProvider.d.ts","sourceRoot":"","sources":["../../src/providers/UdpAppProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAoB,qBAAqB,EAAE,MAAM,WAAW,CAAC;AAIpE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,kCAAkC,CAAC;AAM9E,MAAM,WAAW,kBAAkB;IACjC,8DAA8D;IAC9D,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC;;OAEG;IACH,SAAS,CAAC,EAAE;QACV,kBAAkB,CAAC,EAAE,OAAO,CAAC;KAC9B,CAAC;IACF;;OAEG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AA2FD;;;;GAIG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4BxD,CAAC"}

package/dist/providers/UdpAppProvider.js

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { SnackbarProvider } from 'notistack';
 import { ThemeProvider } from '../utilities/theme';
 import { AuthProvider } from '../utilities/auth/AuthProvider';
@@ -7,6 +7,91 @@ import { storeInitialPath } from '../utilities/redirect';
 import { storeInitialTenant } from '../utilities/storage';
 import { BrowserRouter } from 'react-router-dom';
 import { QueryProvider } from './QueryProvider';
+/**
+ * Strip the popover UA box entirely: notistack's own container is
+ * position: fixed and does all the positioning, so the host is a zero-size
+ * anchor that must not paint, size, or clip anything.
+ */
+const SNACKBAR_HOST_STYLE = 'position:fixed;inset:auto;width:0;height:0;margin:0;padding:0;border:0;background:none;overflow:visible';
+const createSnackbarHost = () => {
+    if (typeof document === 'undefined')
+        return undefined;
+    if (typeof HTMLElement.prototype.showPopover !== 'function')
+        return undefined;
+    const el = document.createElement('div');
+    el.setAttribute('popover', 'manual');
+    el.style.cssText = SNACKBAR_HOST_STYLE;
+    return el;
+};
+/**
+ * Creates the DOM element notistack portals its snackbar container into, and
+ * keeps it in the browser's **top layer**.
+ *
+ * Why this exists: `UdpDrawer` and `UdpDialog` open a native `<dialog>` with
+ * `showModal()`, which promotes them to the top layer. Top-layer elements paint
+ * above every element in ordinary DOM regardless of `z-index`, so notistack's
+ * container — a plain `position: fixed` element at `zIndex.snackbar` — is hidden
+ * behind an open drawer or dialog. No z-index can fix that; the container has to
+ * be in the top layer too, which the Popover API provides.
+ *
+ * Paint order inside the top layer is promotion order, so the host is
+ * re-promoted (`hidePopover()` then `showPopover()`, synchronously, so nothing
+ * paints in between) whenever a snackbar is added. That keeps it above whichever
+ * drawer or dialog opened most recently.
+ *
+ * Two consequences worth knowing:
+ * - While a modal drawer or dialog is open, everything outside it is inert, so a
+ *   snackbar `action` button is visible but not clickable. Auto-dismiss is
+ *   unaffected. Anything the user must act on belongs in a `UdpMessageBar`
+ *   inside the drawer, not a toast.
+ * - If a drawer opens while a snackbar is already showing, the drawer is
+ *   promoted last and covers it until the next snackbar arrives.
+ *
+ * Returns `undefined` when the browser has no Popover API, which leaves
+ * notistack rendering inline exactly as it did before.
+ */
+const useSnackbarTopLayerHost = () => {
+    const [host] = useState(createSnackbarHost);
+    useEffect(() => {
+        if (!host)
+            return undefined;
+        document.body.appendChild(host);
+        let scheduled = false;
+        const promote = () => {
+            if (scheduled)
+                return;
+            scheduled = true;
+            // Coalesce to one promotion per React commit.
+            queueMicrotask(() => {
+                scheduled = false;
+                if (!host.isConnected)
+                    return;
+                try {
+                    if (host.matches(':popover-open'))
+                        host.hidePopover();
+                    host.showPopover();
+                }
+                catch (_a) {
+                    // Popover refused: fall back to a plain element so snackbars still
+                    // render, just without top-layer promotion.
+                    host.removeAttribute('popover');
+                }
+            });
+        };
+        // Only additions matter — a snackbar leaving cannot change what sits above it.
+        const observer = new MutationObserver((records) => {
+            if (records.some((record) => record.addedNodes.length > 0))
+                promote();
+        });
+        observer.observe(host, { childList: true, subtree: true });
+        promote();
+        return () => {
+            observer.disconnect();
+            host.remove();
+        };
+    }, [host]);
+    return host;
+};
 /**
  * Bundles the core UDP providers (theme, snackbar, auth) and ensures the shared
  * i18n instance is initialised exactly once. Intended to be rendered beneath a
@@ -16,8 +101,11 @@ export const UdpAppProvider = ({ children, snackbarProps, authProps, i18nOptions
     useEffect(() => {
         initializeUnityI18n(i18nOptions);
     }, [i18nOptions]);
+    // Snackbars have to live in the browser top layer or the modal <dialog>
+    // behind UdpDrawer / UdpDialog paints over them. See useSnackbarTopLayerHost.
+    const snackbarHost = useSnackbarTopLayerHost();
     storeInitialPath();
     storeInitialTenant();
-    return (React.createElement(ThemeProvider, null, React.createElement(QueryProvider, { showDevTools: devTools === null || devTools === void 0 ? void 0 : devTools.query }, React.createElement(AuthProvider, Object.assign({}, authProps), React.createElement(BrowserRouter, null, React.createElement(SnackbarProvider, Object.assign({ maxSnack: 3 }, snackbarProps), children))))));
+    return (React.createElement(ThemeProvider, null, React.createElement(QueryProvider, { showDevTools: devTools === null || devTools === void 0 ? void 0 : devTools.query }, React.createElement(AuthProvider, Object.assign({}, authProps), React.createElement(BrowserRouter, null, React.createElement(SnackbarProvider, Object.assign({ maxSnack: 3, domRoot: snackbarHost }, snackbarProps), children))))));
 };
 //# sourceMappingURL=UdpAppProvider.js.map

package/dist/providers/UdpAppProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"UdpAppProvider.js","sourceRoot":"","sources":["../../src/providers/UdpAppProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,SAAS,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AA6BhD;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,QAAQ,EACR,aAAa,EACb,SAAS,EACT,WAAW,EACX,QAAQ,GACT,EAAE,EAAE,CAAC;IACJ,SAAS,CAAC,GAAG,EAAE,CAAC;QACd,mBAAmB,CAAC,WAAW,CAAC,CAAC;IAAA,CAClC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAClB,gBAAgB,EAAE,CAAC;IACnB,kBAAkB,EAAE,CAAC;IACrB,OAAO,CACL,oBAAC,aAAa,QACZ,oBAAC,aAAa,IAAC,YAAY,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,IAC1C,oBAAC,YAAY,oBAAK,SAAS,GACzB,oBAAC,aAAa,QACZ,oBAAC,gBAAgB,kBAAC,QAAQ,EAAE,CAAC,IAAM,aAAa,GAC7C,QAAQ,CACQ,CACL,CACH,CACD,CACF,CACjB,CAAC;AAAA,CACH,CAAC"}
+{"version":3,"file":"UdpAppProvider.js","sourceRoot":"","sources":["../../src/providers/UdpAppProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AA6BhD;;;;GAIG;AACH,MAAM,mBAAmB,GACvB,yGAAyG,CAAC;AAE5G,MAAM,kBAAkB,GAAG,GAA4B,EAAE,CAAC;IACxD,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO,SAAS,CAAC;IACtD,IAAI,OAAO,WAAW,CAAC,SAAS,CAAC,WAAW,KAAK,UAAU;QAAE,OAAO,SAAS,CAAC;IAE9E,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACzC,EAAE,CAAC,YAAY,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IACrC,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,mBAAmB,CAAC;IACvC,OAAO,EAAE,CAAC;AAAA,CACX,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,uBAAuB,GAAG,GAA4B,EAAE,CAAC;IAC7D,MAAM,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,kBAAkB,CAAC,CAAC;IAE5C,SAAS,CAAC,GAAG,EAAE,CAAC;QACd,IAAI,CAAC,IAAI;YAAE,OAAO,SAAS,CAAC;QAE5B,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAEhC,IAAI,SAAS,GAAG,KAAK,CAAC;QACtB,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC;YACpB,IAAI,SAAS;gBAAE,OAAO;YACtB,SAAS,GAAG,IAAI,CAAC;YACjB,8CAA8C;YAC9C,cAAc,CAAC,GAAG,EAAE,CAAC;gBACnB,SAAS,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,IAAI,CAAC,WAAW;oBAAE,OAAO;gBAC9B,IAAI,CAAC;oBACH,IAAI,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC;wBAAE,IAAI,CAAC,WAAW,EAAE,CAAC;oBACtD,IAAI,CAAC,WAAW,EAAE,CAAC;gBACrB,CAAC;2BAAO,CAAC;oBACP,mEAAmE;oBACnE,4CAA4C;oBAC5C,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;gBAClC,CAAC;YAAA,CACF,CAAC,CAAC;QAAA,CACJ,CAAC;QAEF,iFAA+E;QAC/E,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC;YACjD,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;gBAAE,OAAO,EAAE,CAAC;QAAA,CACvE,CAAC,CAAC;QACH,QAAQ,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QAE3D,OAAO,EAAE,CAAC;QAEV,OAAO,GAAG,EAAE,CAAC;YACX,QAAQ,CAAC,UAAU,EAAE,CAAC;YACtB,IAAI,CAAC,MAAM,EAAE,CAAC;QAAA,CACf,CAAC;IAAA,CACH,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,OAAO,IAAI,CAAC;AAAA,CACb,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,QAAQ,EACR,aAAa,EACb,SAAS,EACT,WAAW,EACX,QAAQ,GACT,EAAE,EAAE,CAAC;IACJ,SAAS,CAAC,GAAG,EAAE,CAAC;QACd,mBAAmB,CAAC,WAAW,CAAC,CAAC;IAAA,CAClC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAClB,wEAAwE;IACxE,8EAA8E;IAC9E,MAAM,YAAY,GAAG,uBAAuB,EAAE,CAAC;IAC/C,gBAAgB,EAAE,CAAC;IACnB,kBAAkB,EAAE,CAAC;IACrB,OAAO,CACL,oBAAC,aAAa,QACZ,oBAAC,aAAa,IAAC,YAAY,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,IAC1C,oBAAC,YAAY,oBAAK,SAAS,GACzB,oBAAC,aAAa,QACZ,oBAAC,gBAAgB,kBAAC,QAAQ,EAAE,CAAC,EAAE,OAAO,EAAE,YAAY,IAAM,aAAa,GACpE,QAAQ,CACQ,CACL,CACH,CACD,CACF,CACjB,CAAC;AAAA,CACH,CAAC"}

package/dist/providers/UdpAppProvider.mjs

@@ -5,17 +5,106 @@ import { storeInitialPath } from "../utilities/redirect/LocalRedirectUrlStorage.
 import { initializeUnityI18n } from "../utilities/i18n/initializeI18n.mjs";
 import { AuthProvider } from "../utilities/auth/AuthProvider.mjs";
 import { QueryProvider } from "./QueryProvider.mjs";
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { SnackbarProvider } from "notistack";
 import { BrowserRouter } from "react-router-dom";
 //#region src/providers/UdpAppProvider.tsx
 /**
+* Strip the popover UA box entirely: notistack's own container is
+* position: fixed and does all the positioning, so the host is a zero-size
+* anchor that must not paint, size, or clip anything.
+*/
+const SNACKBAR_HOST_STYLE = "position:fixed;inset:auto;width:0;height:0;margin:0;padding:0;border:0;background:none;overflow:visible";
+const createSnackbarHost = () => {
+	if (typeof document === "undefined") return void 0;
+	if (typeof HTMLElement.prototype.showPopover !== "function") return void 0;
+	const el = document.createElement("div");
+	el.setAttribute("popover", "manual");
+	el.style.cssText = SNACKBAR_HOST_STYLE;
+	return el;
+};
+/**
+* Creates the DOM element notistack portals its snackbar container into, and
+* keeps it in the browser's **top layer**.
+*
+* Why this exists: `UdpDrawer` and `UdpDialog` open a native `<dialog>` with
+* `showModal()`, which promotes them to the top layer. Top-layer elements paint
+* above every element in ordinary DOM regardless of `z-index`, so notistack's
+* container — a plain `position: fixed` element at `zIndex.snackbar` — is hidden
+* behind an open drawer or dialog. No z-index can fix that; the container has to
+* be in the top layer too, which the Popover API provides.
+*
+* Paint order inside the top layer is promotion order, so the host is
+* re-promoted (`hidePopover()` then `showPopover()`, synchronously, so nothing
+* paints in between) whenever a snackbar is added. That keeps it above whichever
+* drawer or dialog opened most recently.
+*
+* Two consequences worth knowing:
+* - While a modal drawer or dialog is open, everything outside it is inert, so a
+*   snackbar `action` button is visible but not clickable. Auto-dismiss is
+*   unaffected. Anything the user must act on belongs in a `UdpMessageBar`
+*   inside the drawer, not a toast.
+* - If a drawer opens while a snackbar is already showing, the drawer is
+*   promoted last and covers it until the next snackbar arrives.
+*
+* Returns `undefined` when the browser has no Popover API, which leaves
+* notistack rendering inline exactly as it did before.
+*/
+const useSnackbarTopLayerHost = () => {
+	const $ = c(3);
+	const [host] = useState(createSnackbarHost);
+	let t0;
+	let t1;
+	if ($[0] !== host) {
+		t0 = () => {
+			if (!host) return;
+			document.body.appendChild(host);
+			let scheduled = false;
+			const promote = () => {
+				if (scheduled) return;
+				scheduled = true;
+				queueMicrotask(() => {
+					scheduled = false;
+					if (!host.isConnected) return;
+					try {
+						if (host.matches(":popover-open")) host.hidePopover();
+						host.showPopover();
+					} catch {
+						host.removeAttribute("popover");
+					}
+				});
+			};
+			const observer = new MutationObserver((records) => {
+				if (records.some(_temp)) promote();
+			});
+			observer.observe(host, {
+				childList: true,
+				subtree: true
+			});
+			promote();
+			return () => {
+				observer.disconnect();
+				host.remove();
+			};
+		};
+		t1 = [host];
+		$[0] = host;
+		$[1] = t0;
+		$[2] = t1;
+	} else {
+		t0 = $[1];
+		t1 = $[2];
+	}
+	useEffect(t0, t1);
+	return host;
+};
+/**
 * Bundles the core UDP providers (theme, snackbar, auth) and ensures the shared
 * i18n instance is initialised exactly once. Intended to be rendered beneath a
 * react-router <Router /> so the auth provider has access to history.
 */
 const UdpAppProvider = (t0) => {
-	const $ = c(12);
+	const $ = c(13);
 	const { children, snackbarProps, authProps, i18nOptions, devTools } = t0;
 	let t1;
 	let t2;
@@ -32,35 +121,41 @@ const UdpAppProvider = (t0) => {
 		t2 = $[2];
 	}
 	useEffect(t1, t2);
+	const snackbarHost = useSnackbarTopLayerHost();
 	storeInitialPath();
 	storeInitialTenant();
 	const t3 = devTools?.query;
 	let t4;
-	if ($[3] !== children || $[4] !== snackbarProps) {
+	if ($[3] !== children || $[4] !== snackbarHost || $[5] !== snackbarProps) {
 		t4 = /* @__PURE__ */ React.createElement(BrowserRouter, null, /* @__PURE__ */ React.createElement(SnackbarProvider, {
 			maxSnack: 3,
+			domRoot: snackbarHost,
 			...snackbarProps
 		}, children));
 		$[3] = children;
-		$[4] = snackbarProps;
-		$[5] = t4;
-	} else t4 = $[5];
+		$[4] = snackbarHost;
+		$[5] = snackbarProps;
+		$[6] = t4;
+	} else t4 = $[6];
 	let t5;
-	if ($[6] !== authProps || $[7] !== t4) {
+	if ($[7] !== authProps || $[8] !== t4) {
 		t5 = /* @__PURE__ */ React.createElement(AuthProvider, authProps, t4);
-		$[6] = authProps;
-		$[7] = t4;
-		$[8] = t5;
-	} else t5 = $[8];
+		$[7] = authProps;
+		$[8] = t4;
+		$[9] = t5;
+	} else t5 = $[9];
 	let t6;
-	if ($[9] !== t3 || $[10] !== t5) {
+	if ($[10] !== t3 || $[11] !== t5) {
 		t6 = /* @__PURE__ */ React.createElement(ThemeProvider, null, /* @__PURE__ */ React.createElement(QueryProvider, { showDevTools: t3 }, t5));
-		$[9] = t3;
-		$[10] = t5;
-		$[11] = t6;
-	} else t6 = $[11];
+		$[10] = t3;
+		$[11] = t5;
+		$[12] = t6;
+	} else t6 = $[12];
 	return t6;
 };
+function _temp(record) {
+	return record.addedNodes.length > 0;
+}
 //#endregion
 export { UdpAppProvider };
 

package/dist/providers/UdpAppProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"UdpAppProvider.mjs","names":["React","ReactNode","useEffect","SnackbarProvider","SnackbarProviderProps","ThemeProvider","AuthProvider","initializeUnityI18n","InitializeI18nOptions","storeInitialPath","storeInitialTenant","BrowserRouter","QueryProvider","UdpDevToolsOptions","query","UdpAppProviderProps","children","snackbarProps","authProps","doNotWaitForTenant","i18nOptions","devTools","UdpAppProvider","FC","t0","$","_c","t1","t2","t3","t4","t5","t6"],"sources":["../../src/providers/UdpAppProvider.tsx"],"sourcesContent":["import React, { ReactNode, useEffect } from 'react';\nimport { SnackbarProvider, SnackbarProviderProps } from 'notistack';\nimport { ThemeProvider } from '../utilities/theme';\nimport { AuthProvider } from '../utilities/auth/AuthProvider';\nimport { initializeUnityI18n } from '../utilities/i18n/initializeI18n';\nimport type { InitializeI18nOptions } from '../utilities/i18n/initializeI18n';\nimport { storeInitialPath } from '../utilities/redirect';\nimport { storeInitialTenant } from '../utilities/storage';\nimport { BrowserRouter } from 'react-router-dom';\nimport { QueryProvider } from './QueryProvider';\n\nexport interface UdpDevToolsOptions {\n  /** Show the React Query DevTools panel. Defaults to false. */\n  query?: boolean;\n}\n\nexport interface UdpAppProviderProps {\n  children: ReactNode;\n  /**\n   * Props forwarded to the SnackbarProvider from notistack.\n   */\n  snackbarProps?: SnackbarProviderProps;\n  /**\n   * Props forwarded to the AuthProviderWrapper.\n   */\n  authProps?: {\n    doNotWaitForTenant?: boolean;\n  };\n  /**\n   * Optional configuration overrides for the shared i18n instance.\n   */\n  i18nOptions?: InitializeI18nOptions;\n  /**\n   * Enable developer tools for debugging. All options default to false.\n   */\n  devTools?: UdpDevToolsOptions;\n}\n\n/**\n * Bundles the core UDP providers (theme, snackbar, auth) and ensures the shared\n * i18n instance is initialised exactly once. Intended to be rendered beneath a\n * react-router <Router /> so the auth provider has access to history.\n */\nexport const UdpAppProvider: React.FC<UdpAppProviderProps> = ({\n  children,\n  snackbarProps,\n  authProps,\n  i18nOptions,\n  devTools,\n}) => {\n  useEffect(() => {\n    initializeUnityI18n(i18nOptions);\n  }, [i18nOptions]);\n  storeInitialPath();\n  storeInitialTenant();\n  return (\n    <ThemeProvider>\n      <QueryProvider showDevTools={devTools?.query}>\n        <AuthProvider {...authProps}>\n          <BrowserRouter>\n            <SnackbarProvider maxSnack={3} {...snackbarProps}>\n              {children}\n            </SnackbarProvider>\n          </BrowserRouter>\n        </AuthProvider>\n      </QueryProvider>\n    </ThemeProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AA2CA,MAAasB,kBAAgDE,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAAC,MAAA,EAAAV,UAAAC,eAAAC,WAAAE,aAAAC,aAAAG;CAM7D,IAAAG;CAAA,IAAAC;AAAA,KAAAH,EAAA,OAAAL,aAAA;AACWO,aAAA;AACRpB,uBAAoBa,YAAY;;AAC/BQ,OAAA,CAACR,YAAY;AAAAK,IAAA,KAAAL;AAAAK,IAAA,KAAAE;AAAAF,IAAA,KAAAG;QAAA;AAAAD,OAAAF,EAAA;AAAAG,OAAAH,EAAA;;AAFhBvB,WAAUyB,IAEPC,GAAc;AACjBnB,mBAAkB;AAClBC,qBAAoB;CAGa,MAAAmB,KAAAR,UAAQP;CAAO,IAAAgB;AAAA,KAAAL,EAAA,OAAAT,YAAAS,EAAA,OAAAR,eAAA;AAExCa,OAAA,sBAAA,cAAC,eAAA,MACC,sBAAA,cAAC,kBAAD;GAA4B,UAAA;GAAC,GAAMb;GAGrC,EAFKD,SAEL,CAAgB;AAAAS,IAAA,KAAAT;AAAAS,IAAA,KAAAR;AAAAQ,IAAA,KAAAK;OAAAA,MAAAL,EAAA;CAAA,IAAAM;AAAA,KAAAN,EAAA,OAAAP,aAAAO,EAAA,OAAAK,IAAA;AALlBC,OAAA,sBAAA,cAAC,cAAiBb,WAChBY,GAKa;AAAAL,IAAA,KAAAP;AAAAO,IAAA,KAAAK;AAAAL,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAAA,IAAAO;AAAA,KAAAP,EAAA,OAAAI,MAAAJ,EAAA,QAAAM,IAAA;AARnBC,OAAA,sBAAA,cAAC,eAAA,MACC,sBAAA,cAAC,eAAD,EAA6B,cAAAH,IAS/B,EARIE,GAQJ,CAAgB;AAAAN,IAAA,KAAAI;AAAAJ,IAAA,MAAAM;AAAAN,IAAA,MAAAO;OAAAA,MAAAP,EAAA;AAAA,QAVhBO"}
+{"version":3,"file":"UdpAppProvider.mjs","names":["React","ReactNode","useEffect","useState","SnackbarProvider","SnackbarProviderProps","ThemeProvider","AuthProvider","initializeUnityI18n","InitializeI18nOptions","storeInitialPath","storeInitialTenant","BrowserRouter","QueryProvider","UdpDevToolsOptions","query","UdpAppProviderProps","children","snackbarProps","authProps","doNotWaitForTenant","i18nOptions","devTools","SNACKBAR_HOST_STYLE","createSnackbarHost","HTMLElement","document","undefined","prototype","showPopover","el","createElement","setAttribute","style","cssText","useSnackbarTopLayerHost","$","_c","host","t0","t1","body","appendChild","scheduled","promote","queueMicrotask","isConnected","matches","hidePopover","removeAttribute","observer","MutationObserver","records","some","_temp","observe","childList","subtree","disconnect","remove","UdpAppProvider","FC","t2","snackbarHost","t3","t4","t5","t6","record","addedNodes","length"],"sources":["../../src/providers/UdpAppProvider.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from 'react';\nimport { SnackbarProvider, SnackbarProviderProps } from 'notistack';\nimport { ThemeProvider } from '../utilities/theme';\nimport { AuthProvider } from '../utilities/auth/AuthProvider';\nimport { initializeUnityI18n } from '../utilities/i18n/initializeI18n';\nimport type { InitializeI18nOptions } from '../utilities/i18n/initializeI18n';\nimport { storeInitialPath } from '../utilities/redirect';\nimport { storeInitialTenant } from '../utilities/storage';\nimport { BrowserRouter } from 'react-router-dom';\nimport { QueryProvider } from './QueryProvider';\n\nexport interface UdpDevToolsOptions {\n  /** Show the React Query DevTools panel. Defaults to false. */\n  query?: boolean;\n}\n\nexport interface UdpAppProviderProps {\n  children: ReactNode;\n  /**\n   * Props forwarded to the SnackbarProvider from notistack.\n   */\n  snackbarProps?: SnackbarProviderProps;\n  /**\n   * Props forwarded to the AuthProviderWrapper.\n   */\n  authProps?: {\n    doNotWaitForTenant?: boolean;\n  };\n  /**\n   * Optional configuration overrides for the shared i18n instance.\n   */\n  i18nOptions?: InitializeI18nOptions;\n  /**\n   * Enable developer tools for debugging. All options default to false.\n   */\n  devTools?: UdpDevToolsOptions;\n}\n\n/**\n * Strip the popover UA box entirely: notistack's own container is\n * position: fixed and does all the positioning, so the host is a zero-size\n * anchor that must not paint, size, or clip anything.\n */\nconst SNACKBAR_HOST_STYLE =\n  'position:fixed;inset:auto;width:0;height:0;margin:0;padding:0;border:0;background:none;overflow:visible';\n\nconst createSnackbarHost = (): HTMLElement | undefined => {\n  if (typeof document === 'undefined') return undefined;\n  if (typeof HTMLElement.prototype.showPopover !== 'function') return undefined;\n\n  const el = document.createElement('div');\n  el.setAttribute('popover', 'manual');\n  el.style.cssText = SNACKBAR_HOST_STYLE;\n  return el;\n};\n\n/**\n * Creates the DOM element notistack portals its snackbar container into, and\n * keeps it in the browser's **top layer**.\n *\n * Why this exists: `UdpDrawer` and `UdpDialog` open a native `<dialog>` with\n * `showModal()`, which promotes them to the top layer. Top-layer elements paint\n * above every element in ordinary DOM regardless of `z-index`, so notistack's\n * container — a plain `position: fixed` element at `zIndex.snackbar` — is hidden\n * behind an open drawer or dialog. No z-index can fix that; the container has to\n * be in the top layer too, which the Popover API provides.\n *\n * Paint order inside the top layer is promotion order, so the host is\n * re-promoted (`hidePopover()` then `showPopover()`, synchronously, so nothing\n * paints in between) whenever a snackbar is added. That keeps it above whichever\n * drawer or dialog opened most recently.\n *\n * Two consequences worth knowing:\n * - While a modal drawer or dialog is open, everything outside it is inert, so a\n *   snackbar `action` button is visible but not clickable. Auto-dismiss is\n *   unaffected. Anything the user must act on belongs in a `UdpMessageBar`\n *   inside the drawer, not a toast.\n * - If a drawer opens while a snackbar is already showing, the drawer is\n *   promoted last and covers it until the next snackbar arrives.\n *\n * Returns `undefined` when the browser has no Popover API, which leaves\n * notistack rendering inline exactly as it did before.\n */\nconst useSnackbarTopLayerHost = (): HTMLElement | undefined => {\n  const [host] = useState(createSnackbarHost);\n\n  useEffect(() => {\n    if (!host) return undefined;\n\n    document.body.appendChild(host);\n\n    let scheduled = false;\n    const promote = () => {\n      if (scheduled) return;\n      scheduled = true;\n      // Coalesce to one promotion per React commit.\n      queueMicrotask(() => {\n        scheduled = false;\n        if (!host.isConnected) return;\n        try {\n          if (host.matches(':popover-open')) host.hidePopover();\n          host.showPopover();\n        } catch {\n          // Popover refused: fall back to a plain element so snackbars still\n          // render, just without top-layer promotion.\n          host.removeAttribute('popover');\n        }\n      });\n    };\n\n    // Only additions matter — a snackbar leaving cannot change what sits above it.\n    const observer = new MutationObserver((records) => {\n      if (records.some((record) => record.addedNodes.length > 0)) promote();\n    });\n    observer.observe(host, { childList: true, subtree: true });\n\n    promote();\n\n    return () => {\n      observer.disconnect();\n      host.remove();\n    };\n  }, [host]);\n\n  return host;\n};\n\n/**\n * Bundles the core UDP providers (theme, snackbar, auth) and ensures the shared\n * i18n instance is initialised exactly once. Intended to be rendered beneath a\n * react-router <Router /> so the auth provider has access to history.\n */\nexport const UdpAppProvider: React.FC<UdpAppProviderProps> = ({\n  children,\n  snackbarProps,\n  authProps,\n  i18nOptions,\n  devTools,\n}) => {\n  useEffect(() => {\n    initializeUnityI18n(i18nOptions);\n  }, [i18nOptions]);\n  // Snackbars have to live in the browser top layer or the modal <dialog>\n  // behind UdpDrawer / UdpDialog paints over them. See useSnackbarTopLayerHost.\n  const snackbarHost = useSnackbarTopLayerHost();\n  storeInitialPath();\n  storeInitialTenant();\n  return (\n    <ThemeProvider>\n      <QueryProvider showDevTools={devTools?.query}>\n        <AuthProvider {...authProps}>\n          <BrowserRouter>\n            <SnackbarProvider maxSnack={3} domRoot={snackbarHost} {...snackbarProps}>\n              {children}\n            </SnackbarProvider>\n          </BrowserRouter>\n        </AuthProvider>\n      </QueryProvider>\n    </ThemeProvider>\n  );\n};\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "udp-react-enterprise-component-library",
-  "version": "26.7.0-beta.2",
+  "version": "26.7.0-beta.4",
   "description": "React-based UI component library implementing Fluent UI design for Univerus internal projects",
   "author": "Univerus",
   "license": "MIT",
@@ -3907,8 +3907,8 @@
     "@microlink/react-json-view": "^1.31.20",
     "@tanstack/react-query": "^5",
     "@tanstack/react-query-devtools": "^5",
-    "udp-react-stencil-component-library": "26.7.0-beta.1",
-    "udp-stencil-component-library": "26.7.0-beta.1",
+    "udp-react-stencil-component-library": "26.7.0-beta.3",
+    "udp-stencil-component-library": "26.7.0-beta.3",
     "axios": "^0.31.1",
     "axios-hooks": "^2.1.0",
     "broadcast-channel": "^4.17.0",