@favish/staffbase-utils 0.14.0 → 0.15.0

package/README.md

@@ -27,7 +27,8 @@ minimumReleaseAgeExclude:
 | `@favish/staffbase-utils/content` | `resolveLocalizedContent`, `resolveActiveLanguage`, `detectEditorLanguage`, `detectPreviewLanguage` |
 | `@favish/staffbase-utils/links/react` | `useInAppLinkHandling` (React peer) |
 | `@favish/staffbase-utils/shadow` | `injectShadowStyles`, `isShadowRoot` |
-| `@favish/staffbase-utils/shadow/react` | `ensureShadowMount`, `PortalContainerProvider`, `usePortalContainer` (React + @emotion/cache peers) |
+| `@favish/staffbase-utils/shadow/portal` | `PortalContainerProvider`, `usePortalContainer` (React peer only, no Emotion) |
+| `@favish/staffbase-utils/shadow/react` | `ensureShadowMount` (+ re-exports portal) (React + @emotion/cache peers) |
 | `@favish/staffbase-utils/log` | `logError`, `logWarn`, `logDebug`, `setLoggingEnabled` |
 | `@favish/staffbase-utils/dom` | `getDynamicClasses` |
 | `@favish/staffbase-utils/types` | `Channel`, `ChannelLink`, `ChannelLinkParameter`, `DropdownOption`, `LocalizedContent`, `ArticleImage`, `ArticleImageVariant` (type-only) |

package/dist/shadow/portal.cjs.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../usePortalContainer-BcMPb5ai.js");exports.PortalContainerProvider=e.n,exports.usePortalContainer=e.t;

package/dist/shadow/portal.es.mjs

@@ -0,0 +1,2 @@
+import { n as e, t } from "../usePortalContainer-BYW2B6g7.mjs";
+export { e as PortalContainerProvider, t as usePortalContainer };

package/dist/shadow/react.cjs.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../chunk-CMqjfN_6.js"),t=require("../injectShadowStyles-SjxVBpXH.js");let n=require("react"),r=require("@emotion/cache");r=e.t(r);var i=(e,t)=>{let n=e.getElementById(t);if(n instanceof HTMLDivElement)return n;let r=document.createElement(`div`);return r.id=t,e.appendChild(r),r},a=(e,t)=>{let n=e.getElementById(t);if(n instanceof HTMLMetaElement)return n;let r=document.createElement(`meta`);return r.id=t,r.setAttribute(`name`,`emotion-insertion-point`),e.appendChild(r),r},o=`sbu-shadow-styles`,s=`sbu-react-root`,c=`sbu-portal-root`,l=`sbu-emotion-insertion-point`,u=(e,{cacheKey:n,cssText:u})=>{let d=e.shadowRoot??e.attachShadow({mode:`open`}),f=i(d,`${s}-${n}`),p=i(d,`${c}-${n}`),m=a(d,`${l}-${n}`);return t.t(d,u,`${o}-${n}`),{shadowRoot:d,reactMountEl:f,portalContainerEl:p,emotionCache:(0,r.default)({key:n,container:d,insertionPoint:m})}},d=(0,n.createContext)(null),f=({portalContainer:e,children:t})=>(0,n.createElement)(d.Provider,{value:e},t),p=()=>(0,n.useContext)(d);exports.PortalContainerProvider=f,exports.ensureShadowMount=u,exports.usePortalContainer=p;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../chunk-CMqjfN_6.js"),t=require("../injectShadowStyles-SjxVBpXH.js"),n=require("../usePortalContainer-BcMPb5ai.js");let r=require("@emotion/cache");r=e.t(r);var i=(e,t)=>{let n=e.getElementById(t);if(n instanceof HTMLDivElement)return n;let r=document.createElement(`div`);return r.id=t,e.appendChild(r),r},a=(e,t)=>{let n=e.getElementById(t);if(n instanceof HTMLMetaElement)return n;let r=document.createElement(`meta`);return r.id=t,r.setAttribute(`name`,`emotion-insertion-point`),e.appendChild(r),r},o=`sbu-shadow-styles`,s=`sbu-react-root`,c=`sbu-portal-root`,l=`sbu-emotion-insertion-point`,u=(e,{cacheKey:n,cssText:u})=>{let d=e.shadowRoot??e.attachShadow({mode:`open`}),f=i(d,`${s}-${n}`),p=i(d,`${c}-${n}`),m=a(d,`${l}-${n}`);return t.t(d,u,`${o}-${n}`),{shadowRoot:d,reactMountEl:f,portalContainerEl:p,emotionCache:(0,r.default)({key:n,container:d,insertionPoint:m})}};exports.PortalContainerProvider=n.n,exports.ensureShadowMount=u,exports.usePortalContainer=n.t;
 //# sourceMappingURL=react.cjs.js.map

package/dist/shadow/react.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.cjs.js","names":[],"sources":["../../src/shadow/react/getOrCreateDiv.ts","../../src/shadow/react/getOrCreateEmotionInsertionPoint.ts","../../src/shadow/react/ensureShadowMount.ts","../../src/shadow/react/PortalContainerContext.ts","../../src/shadow/react/PortalContainerProvider.ts","../../src/shadow/react/usePortalContainer.ts"],"sourcesContent":["/**\n * Returns the shadow-root child `<div>` with the given id, creating it if absent.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLDivElement} The existing or newly created div.\n */\nexport const getOrCreateDiv = (\n  root: ShadowRoot,\n  id: string,\n): HTMLDivElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLDivElement) return existing\n\n  const el = document.createElement('div')\n  el.id = id\n  root.appendChild(el)\n  return el\n}\n","/**\n * Returns the shadow-root `<meta name=\"emotion-insertion-point\">` with the given\n * id, creating it if absent. Keeps Emotion's styles ordered before shadow content.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLMetaElement} The existing or newly created insertion-point meta.\n */\nexport const getOrCreateEmotionInsertionPoint = (\n  root: ShadowRoot,\n  id: string,\n): HTMLMetaElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLMetaElement) return existing\n\n  const el = document.createElement('meta')\n  el.id = id\n  el.setAttribute('name', 'emotion-insertion-point')\n  root.appendChild(el)\n  return el\n}\n","import createCache from '@emotion/cache'\n\nimport type { EnsureShadowMountOptions } from '../../types/shadow/EnsureShadowMountOptions'\nimport type { ShadowMount } from '../../types/shadow/ShadowMount'\nimport { injectShadowStyles } from '../injectShadowStyles'\nimport { getOrCreateDiv } from './getOrCreateDiv'\nimport { getOrCreateEmotionInsertionPoint } from './getOrCreateEmotionInsertionPoint'\n\nconst STYLE_ELEMENT_ID = 'sbu-shadow-styles'\nconst REACT_MOUNT_ID = 'sbu-react-root'\nconst PORTAL_CONTAINER_ID = 'sbu-portal-root'\nconst EMOTION_INSERTION_POINT_ID = 'sbu-emotion-insertion-point'\n\n/**\n * Ensures a ShadowRoot mount exists on the host element for a widget.\n *\n * Creates stable React-mount and portal-container nodes, injects the widget's CSS\n * into the shadow root only (never into the document), and configures an Emotion\n * cache scoped to the shadow root. All internal ids are namespaced by `cacheKey`\n * so editor and runtime mounts on the same host never collide.\n * @param {HTMLElement} host - The host element to attach the shadow root to.\n * @param {EnsureShadowMountOptions} options - The cache key and the widget's CSS text.\n * @returns {ShadowMount} The shadow root, mount nodes and the scoped Emotion cache.\n */\nexport const ensureShadowMount = (\n  host: HTMLElement,\n  { cacheKey, cssText }: EnsureShadowMountOptions,\n): ShadowMount => {\n  const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: 'open' })\n\n  const reactMountEl = getOrCreateDiv(\n    shadowRoot,\n    `${REACT_MOUNT_ID}-${cacheKey}`,\n  )\n  const portalContainerEl = getOrCreateDiv(\n    shadowRoot,\n    `${PORTAL_CONTAINER_ID}-${cacheKey}`,\n  )\n  const insertionPoint = getOrCreateEmotionInsertionPoint(\n    shadowRoot,\n    `${EMOTION_INSERTION_POINT_ID}-${cacheKey}`,\n  )\n\n  injectShadowStyles(shadowRoot, cssText, `${STYLE_ELEMENT_ID}-${cacheKey}`)\n\n  // Emotion's `container` is typed as HTMLElement but supports ShadowRoot targets\n  // at runtime; the localized cast keeps the rest of the call type-safe.\n  const emotionCache = createCache({\n    key: cacheKey,\n    container: shadowRoot as unknown as HTMLElement,\n    insertionPoint,\n  })\n\n  return { shadowRoot, reactMountEl, portalContainerEl, emotionCache }\n}\n","import { createContext } from 'react'\n\n/**\n * Holds the DOM element portalled components should render into, so portals stay\n * inside the widget's ShadowRoot (preserving style isolation).\n */\nexport const PortalContainerContext = createContext<HTMLElement | null>(null)\n","import type { ReactElement } from 'react'\nimport { createElement } from 'react'\n\nimport type { PortalContainerProviderProps } from '../../types/shadow/PortalContainerProviderProps'\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Provides the portal container element to descendants. Built with createElement\n * (no JSX) so the library has no JSX-runtime build coupling.\n * @param {PortalContainerProviderProps} props - The portal container and children.\n * @returns {ReactElement} The provider element wrapping the children.\n */\nexport const PortalContainerProvider = ({\n  portalContainer,\n  children,\n}: PortalContainerProviderProps): ReactElement =>\n  createElement(\n    PortalContainerContext.Provider,\n    { value: portalContainer },\n    children,\n  )\n","import { useContext } from 'react'\n\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Returns the portal container element used to keep portals inside the ShadowRoot.\n * @returns {HTMLElement | null} The portal container, or null when not provided.\n */\nexport const usePortalContainer = (): HTMLElement | null => {\n  return useContext(PortalContainerContext)\n}\n"],"mappings":"sNAMA,IAAa,GACX,EACA,IACmB,CACnB,IAAM,EAAW,EAAK,eAAe,CAAE,EACvC,GAAI,aAAoB,eAAgB,OAAO,EAE/C,IAAM,EAAK,SAAS,cAAc,KAAK,EAGvC,MAFA,GAAG,GAAK,EACR,EAAK,YAAY,CAAE,EACZ,CACT,ECVa,GACX,EACA,IACoB,CACpB,IAAM,EAAW,EAAK,eAAe,CAAE,EACvC,GAAI,aAAoB,gBAAiB,OAAO,EAEhD,IAAM,EAAK,SAAS,cAAc,MAAM,EAIxC,MAHA,GAAG,GAAK,EACR,EAAG,aAAa,OAAQ,yBAAyB,EACjD,EAAK,YAAY,CAAE,EACZ,CACT,ECXM,EAAmB,oBACnB,EAAiB,iBACjB,EAAsB,kBACtB,EAA6B,8BAatB,GACX,EACA,CAAE,WAAU,aACI,CAChB,IAAM,EAAa,EAAK,YAAc,EAAK,aAAa,CAAE,KAAM,MAAO,CAAC,EAElE,EAAe,EACnB,EACA,GAAG,EAAe,GAAG,GACvB,EACM,EAAoB,EACxB,EACA,GAAG,EAAoB,GAAG,GAC5B,EACM,EAAiB,EACrB,EACA,GAAG,EAA2B,GAAG,GACnC,EAYA,OAVA,EAAA,EAAmB,EAAY,EAAS,GAAG,EAAiB,GAAG,GAAU,EAUlE,CAAE,aAAY,eAAc,oBAAmB,cAAA,EAAA,EAAA,SANrB,CAC/B,IAAK,EACL,UAAW,EACX,gBACF,CAEsD,CAAa,CACrE,EChDa,GAAA,EAAA,EAAA,eAA2D,IAAI,ECM/D,GAA2B,CACtC,kBACA,eAAA,EAAA,EAAA,eAGE,EAAuB,SACvB,CAAE,MAAO,CAAgB,EACzB,CACF,ECZW,OACX,EAAA,EAAA,YAAkB,CAAsB"}
+{"version":3,"file":"react.cjs.js","names":[],"sources":["../../src/shadow/react/getOrCreateDiv.ts","../../src/shadow/react/getOrCreateEmotionInsertionPoint.ts","../../src/shadow/react/ensureShadowMount.ts"],"sourcesContent":["/**\n * Returns the shadow-root child `<div>` with the given id, creating it if absent.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLDivElement} The existing or newly created div.\n */\nexport const getOrCreateDiv = (\n  root: ShadowRoot,\n  id: string,\n): HTMLDivElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLDivElement) return existing\n\n  const el = document.createElement('div')\n  el.id = id\n  root.appendChild(el)\n  return el\n}\n","/**\n * Returns the shadow-root `<meta name=\"emotion-insertion-point\">` with the given\n * id, creating it if absent. Keeps Emotion's styles ordered before shadow content.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLMetaElement} The existing or newly created insertion-point meta.\n */\nexport const getOrCreateEmotionInsertionPoint = (\n  root: ShadowRoot,\n  id: string,\n): HTMLMetaElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLMetaElement) return existing\n\n  const el = document.createElement('meta')\n  el.id = id\n  el.setAttribute('name', 'emotion-insertion-point')\n  root.appendChild(el)\n  return el\n}\n","import createCache from '@emotion/cache'\n\nimport type { EnsureShadowMountOptions } from '../../types/shadow/EnsureShadowMountOptions'\nimport type { ShadowMount } from '../../types/shadow/ShadowMount'\nimport { injectShadowStyles } from '../injectShadowStyles'\nimport { getOrCreateDiv } from './getOrCreateDiv'\nimport { getOrCreateEmotionInsertionPoint } from './getOrCreateEmotionInsertionPoint'\n\nconst STYLE_ELEMENT_ID = 'sbu-shadow-styles'\nconst REACT_MOUNT_ID = 'sbu-react-root'\nconst PORTAL_CONTAINER_ID = 'sbu-portal-root'\nconst EMOTION_INSERTION_POINT_ID = 'sbu-emotion-insertion-point'\n\n/**\n * Ensures a ShadowRoot mount exists on the host element for a widget.\n *\n * Creates stable React-mount and portal-container nodes, injects the widget's CSS\n * into the shadow root only (never into the document), and configures an Emotion\n * cache scoped to the shadow root. All internal ids are namespaced by `cacheKey`\n * so editor and runtime mounts on the same host never collide.\n * @param {HTMLElement} host - The host element to attach the shadow root to.\n * @param {EnsureShadowMountOptions} options - The cache key and the widget's CSS text.\n * @returns {ShadowMount} The shadow root, mount nodes and the scoped Emotion cache.\n */\nexport const ensureShadowMount = (\n  host: HTMLElement,\n  { cacheKey, cssText }: EnsureShadowMountOptions,\n): ShadowMount => {\n  const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: 'open' })\n\n  const reactMountEl = getOrCreateDiv(\n    shadowRoot,\n    `${REACT_MOUNT_ID}-${cacheKey}`,\n  )\n  const portalContainerEl = getOrCreateDiv(\n    shadowRoot,\n    `${PORTAL_CONTAINER_ID}-${cacheKey}`,\n  )\n  const insertionPoint = getOrCreateEmotionInsertionPoint(\n    shadowRoot,\n    `${EMOTION_INSERTION_POINT_ID}-${cacheKey}`,\n  )\n\n  injectShadowStyles(shadowRoot, cssText, `${STYLE_ELEMENT_ID}-${cacheKey}`)\n\n  // Emotion's `container` is typed as HTMLElement but supports ShadowRoot targets\n  // at runtime; the localized cast keeps the rest of the call type-safe.\n  const emotionCache = createCache({\n    key: cacheKey,\n    container: shadowRoot as unknown as HTMLElement,\n    insertionPoint,\n  })\n\n  return { shadowRoot, reactMountEl, portalContainerEl, emotionCache }\n}\n"],"mappings":"kPAMA,IAAa,GACX,EACA,IACmB,CACnB,IAAM,EAAW,EAAK,eAAe,CAAE,EACvC,GAAI,aAAoB,eAAgB,OAAO,EAE/C,IAAM,EAAK,SAAS,cAAc,KAAK,EAGvC,MAFA,GAAG,GAAK,EACR,EAAK,YAAY,CAAE,EACZ,CACT,ECVa,GACX,EACA,IACoB,CACpB,IAAM,EAAW,EAAK,eAAe,CAAE,EACvC,GAAI,aAAoB,gBAAiB,OAAO,EAEhD,IAAM,EAAK,SAAS,cAAc,MAAM,EAIxC,MAHA,GAAG,GAAK,EACR,EAAG,aAAa,OAAQ,yBAAyB,EACjD,EAAK,YAAY,CAAE,EACZ,CACT,ECXM,EAAmB,oBACnB,EAAiB,iBACjB,EAAsB,kBACtB,EAA6B,8BAatB,GACX,EACA,CAAE,WAAU,aACI,CAChB,IAAM,EAAa,EAAK,YAAc,EAAK,aAAa,CAAE,KAAM,MAAO,CAAC,EAElE,EAAe,EACnB,EACA,GAAG,EAAe,GAAG,GACvB,EACM,EAAoB,EACxB,EACA,GAAG,EAAoB,GAAG,GAC5B,EACM,EAAiB,EACrB,EACA,GAAG,EAA2B,GAAG,GACnC,EAYA,OAVA,EAAA,EAAmB,EAAY,EAAS,GAAG,EAAiB,GAAG,GAAU,EAUlE,CAAE,aAAY,eAAc,oBAAmB,cAAA,EAAA,EAAA,SANrB,CAC/B,IAAK,EACL,UAAW,EACX,gBACF,CAEsD,CAAa,CACrE"}

package/dist/shadow/react.es.mjs

@@ -1,31 +1,31 @@
 import { t as e } from "../injectShadowStyles-C40qdwKI.mjs";
-import { createContext as t, createElement as n, useContext as r } from "react";
-import i from "@emotion/cache";
+import { n as t, t as n } from "../usePortalContainer-BYW2B6g7.mjs";
+import r from "@emotion/cache";
 //#region src/shadow/react/getOrCreateDiv.ts
-var a = (e, t) => {
+var i = (e, t) => {
 	let n = e.getElementById(t);
 	if (n instanceof HTMLDivElement) return n;
 	let r = document.createElement("div");
 	return r.id = t, e.appendChild(r), r;
-}, o = (e, t) => {
+}, a = (e, t) => {
 	let n = e.getElementById(t);
 	if (n instanceof HTMLMetaElement) return n;
 	let r = document.createElement("meta");
 	return r.id = t, r.setAttribute("name", "emotion-insertion-point"), e.appendChild(r), r;
-}, s = "sbu-shadow-styles", c = "sbu-react-root", l = "sbu-portal-root", u = "sbu-emotion-insertion-point", d = (t, { cacheKey: n, cssText: r }) => {
-	let d = t.shadowRoot ?? t.attachShadow({ mode: "open" }), f = a(d, `${c}-${n}`), p = a(d, `${l}-${n}`), m = o(d, `${u}-${n}`);
-	return e(d, r, `${s}-${n}`), {
+}, o = "sbu-shadow-styles", s = "sbu-react-root", c = "sbu-portal-root", l = "sbu-emotion-insertion-point", u = (t, { cacheKey: n, cssText: u }) => {
+	let d = t.shadowRoot ?? t.attachShadow({ mode: "open" }), f = i(d, `${s}-${n}`), p = i(d, `${c}-${n}`), m = a(d, `${l}-${n}`);
+	return e(d, u, `${o}-${n}`), {
 		shadowRoot: d,
 		reactMountEl: f,
 		portalContainerEl: p,
-		emotionCache: i({
+		emotionCache: r({
 			key: n,
 			container: d,
 			insertionPoint: m
 		})
 	};
-}, f = t(null), p = ({ portalContainer: e, children: t }) => n(f.Provider, { value: e }, t), m = () => r(f);
+};
 //#endregion
-export { p as PortalContainerProvider, d as ensureShadowMount, m as usePortalContainer };
+export { t as PortalContainerProvider, u as ensureShadowMount, n as usePortalContainer };
 
 //# sourceMappingURL=react.es.mjs.map

package/dist/shadow/react.es.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"react.es.mjs","names":[],"sources":["../../src/shadow/react/getOrCreateDiv.ts","../../src/shadow/react/getOrCreateEmotionInsertionPoint.ts","../../src/shadow/react/ensureShadowMount.ts","../../src/shadow/react/PortalContainerContext.ts","../../src/shadow/react/PortalContainerProvider.ts","../../src/shadow/react/usePortalContainer.ts"],"sourcesContent":["/**\n * Returns the shadow-root child `<div>` with the given id, creating it if absent.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLDivElement} The existing or newly created div.\n */\nexport const getOrCreateDiv = (\n  root: ShadowRoot,\n  id: string,\n): HTMLDivElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLDivElement) return existing\n\n  const el = document.createElement('div')\n  el.id = id\n  root.appendChild(el)\n  return el\n}\n","/**\n * Returns the shadow-root `<meta name=\"emotion-insertion-point\">` with the given\n * id, creating it if absent. Keeps Emotion's styles ordered before shadow content.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLMetaElement} The existing or newly created insertion-point meta.\n */\nexport const getOrCreateEmotionInsertionPoint = (\n  root: ShadowRoot,\n  id: string,\n): HTMLMetaElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLMetaElement) return existing\n\n  const el = document.createElement('meta')\n  el.id = id\n  el.setAttribute('name', 'emotion-insertion-point')\n  root.appendChild(el)\n  return el\n}\n","import createCache from '@emotion/cache'\n\nimport type { EnsureShadowMountOptions } from '../../types/shadow/EnsureShadowMountOptions'\nimport type { ShadowMount } from '../../types/shadow/ShadowMount'\nimport { injectShadowStyles } from '../injectShadowStyles'\nimport { getOrCreateDiv } from './getOrCreateDiv'\nimport { getOrCreateEmotionInsertionPoint } from './getOrCreateEmotionInsertionPoint'\n\nconst STYLE_ELEMENT_ID = 'sbu-shadow-styles'\nconst REACT_MOUNT_ID = 'sbu-react-root'\nconst PORTAL_CONTAINER_ID = 'sbu-portal-root'\nconst EMOTION_INSERTION_POINT_ID = 'sbu-emotion-insertion-point'\n\n/**\n * Ensures a ShadowRoot mount exists on the host element for a widget.\n *\n * Creates stable React-mount and portal-container nodes, injects the widget's CSS\n * into the shadow root only (never into the document), and configures an Emotion\n * cache scoped to the shadow root. All internal ids are namespaced by `cacheKey`\n * so editor and runtime mounts on the same host never collide.\n * @param {HTMLElement} host - The host element to attach the shadow root to.\n * @param {EnsureShadowMountOptions} options - The cache key and the widget's CSS text.\n * @returns {ShadowMount} The shadow root, mount nodes and the scoped Emotion cache.\n */\nexport const ensureShadowMount = (\n  host: HTMLElement,\n  { cacheKey, cssText }: EnsureShadowMountOptions,\n): ShadowMount => {\n  const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: 'open' })\n\n  const reactMountEl = getOrCreateDiv(\n    shadowRoot,\n    `${REACT_MOUNT_ID}-${cacheKey}`,\n  )\n  const portalContainerEl = getOrCreateDiv(\n    shadowRoot,\n    `${PORTAL_CONTAINER_ID}-${cacheKey}`,\n  )\n  const insertionPoint = getOrCreateEmotionInsertionPoint(\n    shadowRoot,\n    `${EMOTION_INSERTION_POINT_ID}-${cacheKey}`,\n  )\n\n  injectShadowStyles(shadowRoot, cssText, `${STYLE_ELEMENT_ID}-${cacheKey}`)\n\n  // Emotion's `container` is typed as HTMLElement but supports ShadowRoot targets\n  // at runtime; the localized cast keeps the rest of the call type-safe.\n  const emotionCache = createCache({\n    key: cacheKey,\n    container: shadowRoot as unknown as HTMLElement,\n    insertionPoint,\n  })\n\n  return { shadowRoot, reactMountEl, portalContainerEl, emotionCache }\n}\n","import { createContext } from 'react'\n\n/**\n * Holds the DOM element portalled components should render into, so portals stay\n * inside the widget's ShadowRoot (preserving style isolation).\n */\nexport const PortalContainerContext = createContext<HTMLElement | null>(null)\n","import type { ReactElement } from 'react'\nimport { createElement } from 'react'\n\nimport type { PortalContainerProviderProps } from '../../types/shadow/PortalContainerProviderProps'\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Provides the portal container element to descendants. Built with createElement\n * (no JSX) so the library has no JSX-runtime build coupling.\n * @param {PortalContainerProviderProps} props - The portal container and children.\n * @returns {ReactElement} The provider element wrapping the children.\n */\nexport const PortalContainerProvider = ({\n  portalContainer,\n  children,\n}: PortalContainerProviderProps): ReactElement =>\n  createElement(\n    PortalContainerContext.Provider,\n    { value: portalContainer },\n    children,\n  )\n","import { useContext } from 'react'\n\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Returns the portal container element used to keep portals inside the ShadowRoot.\n * @returns {HTMLElement | null} The portal container, or null when not provided.\n */\nexport const usePortalContainer = (): HTMLElement | null => {\n  return useContext(PortalContainerContext)\n}\n"],"mappings":";;;;AAMA,IAAa,KACX,GACA,MACmB;CACnB,IAAM,IAAW,EAAK,eAAe,CAAE;CACvC,IAAI,aAAoB,gBAAgB,OAAO;CAE/C,IAAM,IAAK,SAAS,cAAc,KAAK;CAGvC,OAFA,EAAG,KAAK,GACR,EAAK,YAAY,CAAE,GACZ;AACT,GCVa,KACX,GACA,MACoB;CACpB,IAAM,IAAW,EAAK,eAAe,CAAE;CACvC,IAAI,aAAoB,iBAAiB,OAAO;CAEhD,IAAM,IAAK,SAAS,cAAc,MAAM;CAIxC,OAHA,EAAG,KAAK,GACR,EAAG,aAAa,QAAQ,yBAAyB,GACjD,EAAK,YAAY,CAAE,GACZ;AACT,GCXM,IAAmB,qBACnB,IAAiB,kBACjB,IAAsB,mBACtB,IAA6B,+BAatB,KACX,GACA,EAAE,aAAU,iBACI;CAChB,IAAM,IAAa,EAAK,cAAc,EAAK,aAAa,EAAE,MAAM,OAAO,CAAC,GAElE,IAAe,EACnB,GACA,GAAG,EAAe,GAAG,GACvB,GACM,IAAoB,EACxB,GACA,GAAG,EAAoB,GAAG,GAC5B,GACM,IAAiB,EACrB,GACA,GAAG,EAA2B,GAAG,GACnC;CAYA,OAVA,EAAmB,GAAY,GAAS,GAAG,EAAiB,GAAG,GAAU,GAUlE;EAAE;EAAY;EAAc;EAAmB,cANjC,EAAY;GAC/B,KAAK;GACL,WAAW;GACX;EACF,CAEsD;CAAa;AACrE,GChDa,IAAyB,EAAkC,IAAI,GCM/D,KAA2B,EACtC,oBACA,kBAEA,EACE,EAAuB,UACvB,EAAE,OAAO,EAAgB,GACzB,CACF,GCZW,UACJ,EAAW,CAAsB"}
+{"version":3,"file":"react.es.mjs","names":[],"sources":["../../src/shadow/react/getOrCreateDiv.ts","../../src/shadow/react/getOrCreateEmotionInsertionPoint.ts","../../src/shadow/react/ensureShadowMount.ts"],"sourcesContent":["/**\n * Returns the shadow-root child `<div>` with the given id, creating it if absent.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLDivElement} The existing or newly created div.\n */\nexport const getOrCreateDiv = (\n  root: ShadowRoot,\n  id: string,\n): HTMLDivElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLDivElement) return existing\n\n  const el = document.createElement('div')\n  el.id = id\n  root.appendChild(el)\n  return el\n}\n","/**\n * Returns the shadow-root `<meta name=\"emotion-insertion-point\">` with the given\n * id, creating it if absent. Keeps Emotion's styles ordered before shadow content.\n * @param {ShadowRoot} root - The shadow root to search/append within.\n * @param {string} id - The element id.\n * @returns {HTMLMetaElement} The existing or newly created insertion-point meta.\n */\nexport const getOrCreateEmotionInsertionPoint = (\n  root: ShadowRoot,\n  id: string,\n): HTMLMetaElement => {\n  const existing = root.getElementById(id)\n  if (existing instanceof HTMLMetaElement) return existing\n\n  const el = document.createElement('meta')\n  el.id = id\n  el.setAttribute('name', 'emotion-insertion-point')\n  root.appendChild(el)\n  return el\n}\n","import createCache from '@emotion/cache'\n\nimport type { EnsureShadowMountOptions } from '../../types/shadow/EnsureShadowMountOptions'\nimport type { ShadowMount } from '../../types/shadow/ShadowMount'\nimport { injectShadowStyles } from '../injectShadowStyles'\nimport { getOrCreateDiv } from './getOrCreateDiv'\nimport { getOrCreateEmotionInsertionPoint } from './getOrCreateEmotionInsertionPoint'\n\nconst STYLE_ELEMENT_ID = 'sbu-shadow-styles'\nconst REACT_MOUNT_ID = 'sbu-react-root'\nconst PORTAL_CONTAINER_ID = 'sbu-portal-root'\nconst EMOTION_INSERTION_POINT_ID = 'sbu-emotion-insertion-point'\n\n/**\n * Ensures a ShadowRoot mount exists on the host element for a widget.\n *\n * Creates stable React-mount and portal-container nodes, injects the widget's CSS\n * into the shadow root only (never into the document), and configures an Emotion\n * cache scoped to the shadow root. All internal ids are namespaced by `cacheKey`\n * so editor and runtime mounts on the same host never collide.\n * @param {HTMLElement} host - The host element to attach the shadow root to.\n * @param {EnsureShadowMountOptions} options - The cache key and the widget's CSS text.\n * @returns {ShadowMount} The shadow root, mount nodes and the scoped Emotion cache.\n */\nexport const ensureShadowMount = (\n  host: HTMLElement,\n  { cacheKey, cssText }: EnsureShadowMountOptions,\n): ShadowMount => {\n  const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: 'open' })\n\n  const reactMountEl = getOrCreateDiv(\n    shadowRoot,\n    `${REACT_MOUNT_ID}-${cacheKey}`,\n  )\n  const portalContainerEl = getOrCreateDiv(\n    shadowRoot,\n    `${PORTAL_CONTAINER_ID}-${cacheKey}`,\n  )\n  const insertionPoint = getOrCreateEmotionInsertionPoint(\n    shadowRoot,\n    `${EMOTION_INSERTION_POINT_ID}-${cacheKey}`,\n  )\n\n  injectShadowStyles(shadowRoot, cssText, `${STYLE_ELEMENT_ID}-${cacheKey}`)\n\n  // Emotion's `container` is typed as HTMLElement but supports ShadowRoot targets\n  // at runtime; the localized cast keeps the rest of the call type-safe.\n  const emotionCache = createCache({\n    key: cacheKey,\n    container: shadowRoot as unknown as HTMLElement,\n    insertionPoint,\n  })\n\n  return { shadowRoot, reactMountEl, portalContainerEl, emotionCache }\n}\n"],"mappings":";;;;AAMA,IAAa,KACX,GACA,MACmB;CACnB,IAAM,IAAW,EAAK,eAAe,CAAE;CACvC,IAAI,aAAoB,gBAAgB,OAAO;CAE/C,IAAM,IAAK,SAAS,cAAc,KAAK;CAGvC,OAFA,EAAG,KAAK,GACR,EAAK,YAAY,CAAE,GACZ;AACT,GCVa,KACX,GACA,MACoB;CACpB,IAAM,IAAW,EAAK,eAAe,CAAE;CACvC,IAAI,aAAoB,iBAAiB,OAAO;CAEhD,IAAM,IAAK,SAAS,cAAc,MAAM;CAIxC,OAHA,EAAG,KAAK,GACR,EAAG,aAAa,QAAQ,yBAAyB,GACjD,EAAK,YAAY,CAAE,GACZ;AACT,GCXM,IAAmB,qBACnB,IAAiB,kBACjB,IAAsB,mBACtB,IAA6B,+BAatB,KACX,GACA,EAAE,aAAU,iBACI;CAChB,IAAM,IAAa,EAAK,cAAc,EAAK,aAAa,EAAE,MAAM,OAAO,CAAC,GAElE,IAAe,EACnB,GACA,GAAG,EAAe,GAAG,GACvB,GACM,IAAoB,EACxB,GACA,GAAG,EAAoB,GAAG,GAC5B,GACM,IAAiB,EACrB,GACA,GAAG,EAA2B,GAAG,GACnC;CAYA,OAVA,EAAmB,GAAY,GAAS,GAAG,EAAiB,GAAG,GAAU,GAUlE;EAAE;EAAY;EAAc;EAAmB,cANjC,EAAY;GAC/B,KAAK;GACL,WAAW;GACX;EACF,CAEsD;CAAa;AACrE"}

package/dist/src/shadow/portal/PortalContainerContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortalContainerContext.d.ts","sourceRoot":"","sources":["../../../../src/shadow/portal/PortalContainerContext.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,sBAAsB,6CAA0C,CAAA"}

package/dist/src/shadow/portal/PortalContainerProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortalContainerProvider.d.ts","sourceRoot":"","sources":["../../../../src/shadow/portal/PortalContainerProvider.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,iDAAiD,CAAA;AAGnG;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,GAAI,gCAGrC,4BAA4B,KAAG,YAK/B,CAAA"}

package/dist/src/shadow/portal/index.d.ts

@@ -0,0 +1,4 @@
+export { PortalContainerProvider } from './PortalContainerProvider';
+export { usePortalContainer } from './usePortalContainer';
+export type { PortalContainerProviderProps } from '../../types/shadow/PortalContainerProviderProps';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/shadow/portal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/shadow/portal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,4BAA4B,EAAE,MAAM,iDAAiD,CAAA"}

package/dist/src/shadow/portal/usePortalContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePortalContainer.d.ts","sourceRoot":"","sources":["../../../../src/shadow/portal/usePortalContainer.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,kBAAkB,QAAO,WAAW,GAAG,IAEnD,CAAA"}

package/dist/src/shadow/react/index.d.ts

@@ -1,7 +1,7 @@
+export { ensureShadowMount } from './ensureShadowMount';
+export { PortalContainerProvider } from '../portal/PortalContainerProvider';
+export { usePortalContainer } from '../portal/usePortalContainer';
 export type { EnsureShadowMountOptions } from '../../types/shadow/EnsureShadowMountOptions';
 export type { PortalContainerProviderProps } from '../../types/shadow/PortalContainerProviderProps';
 export type { ShadowMount } from '../../types/shadow/ShadowMount';
-export { ensureShadowMount } from './ensureShadowMount';
-export { PortalContainerProvider } from './PortalContainerProvider';
-export { usePortalContainer } from './usePortalContainer';
 //# sourceMappingURL=index.d.ts.map

package/dist/src/shadow/react/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/shadow/react/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,wBAAwB,EAAE,MAAM,6CAA6C,CAAA;AAC3F,YAAY,EAAE,4BAA4B,EAAE,MAAM,iDAAiD,CAAA;AACnG,YAAY,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAA;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/shadow/react/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,mCAAmC,CAAA;AAC3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAA;AACjE,YAAY,EAAE,wBAAwB,EAAE,MAAM,6CAA6C,CAAA;AAC3F,YAAY,EAAE,4BAA4B,EAAE,MAAM,iDAAiD,CAAA;AACnG,YAAY,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAA"}

package/dist/usePortalContainer-BYW2B6g7.mjs

@@ -0,0 +1,7 @@
+import { createContext as e, createElement as t, useContext as n } from "react";
+//#region src/shadow/portal/PortalContainerContext.ts
+var r = e(null), i = ({ portalContainer: e, children: n }) => t(r.Provider, { value: e }, n), a = () => n(r);
+//#endregion
+export { i as n, a as t };
+
+//# sourceMappingURL=usePortalContainer-BYW2B6g7.mjs.map

package/dist/usePortalContainer-BYW2B6g7.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePortalContainer-BYW2B6g7.mjs","names":[],"sources":["../src/shadow/portal/PortalContainerContext.ts","../src/shadow/portal/PortalContainerProvider.ts","../src/shadow/portal/usePortalContainer.ts"],"sourcesContent":["import { createContext } from 'react'\n\n/**\n * Holds the DOM element portalled components should render into, so portals stay\n * inside the widget's ShadowRoot (preserving style isolation).\n */\nexport const PortalContainerContext = createContext<HTMLElement | null>(null)\n","import type { ReactElement } from 'react'\nimport { createElement } from 'react'\n\nimport type { PortalContainerProviderProps } from '../../types/shadow/PortalContainerProviderProps'\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Provides the portal container element to descendants. Built with createElement\n * (no JSX) so the library has no JSX-runtime build coupling.\n * @param {PortalContainerProviderProps} props - The portal container and children.\n * @returns {ReactElement} The provider element wrapping the children.\n */\nexport const PortalContainerProvider = ({\n  portalContainer,\n  children,\n}: PortalContainerProviderProps): ReactElement =>\n  createElement(\n    PortalContainerContext.Provider,\n    { value: portalContainer },\n    children,\n  )\n","import { useContext } from 'react'\n\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Returns the portal container element used to keep portals inside the ShadowRoot.\n * @returns {HTMLElement | null} The portal container, or null when not provided.\n */\nexport const usePortalContainer = (): HTMLElement | null => {\n  return useContext(PortalContainerContext)\n}\n"],"mappings":";;AAMA,IAAa,IAAyB,EAAkC,IAAI,GCM/D,KAA2B,EACtC,oBACA,kBAEA,EACE,EAAuB,UACvB,EAAE,OAAO,EAAgB,GACzB,CACF,GCZW,UACJ,EAAW,CAAsB"}

package/dist/usePortalContainer-BcMPb5ai.js

@@ -0,0 +1,2 @@
+let e=require("react");var t=(0,e.createContext)(null),n=({portalContainer:n,children:r})=>(0,e.createElement)(t.Provider,{value:n},r),r=()=>(0,e.useContext)(t);Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return r}});
+//# sourceMappingURL=usePortalContainer-BcMPb5ai.js.map

package/dist/usePortalContainer-BcMPb5ai.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePortalContainer-BcMPb5ai.js","names":[],"sources":["../src/shadow/portal/PortalContainerContext.ts","../src/shadow/portal/PortalContainerProvider.ts","../src/shadow/portal/usePortalContainer.ts"],"sourcesContent":["import { createContext } from 'react'\n\n/**\n * Holds the DOM element portalled components should render into, so portals stay\n * inside the widget's ShadowRoot (preserving style isolation).\n */\nexport const PortalContainerContext = createContext<HTMLElement | null>(null)\n","import type { ReactElement } from 'react'\nimport { createElement } from 'react'\n\nimport type { PortalContainerProviderProps } from '../../types/shadow/PortalContainerProviderProps'\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Provides the portal container element to descendants. Built with createElement\n * (no JSX) so the library has no JSX-runtime build coupling.\n * @param {PortalContainerProviderProps} props - The portal container and children.\n * @returns {ReactElement} The provider element wrapping the children.\n */\nexport const PortalContainerProvider = ({\n  portalContainer,\n  children,\n}: PortalContainerProviderProps): ReactElement =>\n  createElement(\n    PortalContainerContext.Provider,\n    { value: portalContainer },\n    children,\n  )\n","import { useContext } from 'react'\n\nimport { PortalContainerContext } from './PortalContainerContext'\n\n/**\n * Returns the portal container element used to keep portals inside the ShadowRoot.\n * @returns {HTMLElement | null} The portal container, or null when not provided.\n */\nexport const usePortalContainer = (): HTMLElement | null => {\n  return useContext(PortalContainerContext)\n}\n"],"mappings":"uBAMA,IAAa,GAAA,EAAA,EAAA,eAA2D,IAAI,ECM/D,GAA2B,CACtC,kBACA,eAAA,EAAA,EAAA,eAGE,EAAuB,SACvB,CAAE,MAAO,CAAgB,EACzB,CACF,ECZW,OACX,EAAA,EAAA,YAAkB,CAAsB"}

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "@favish/staffbase-utils",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "Shared internal/host utilities for Staffbase widgets",
   "author": "Favish <dev@favish.com>",
   "license": "UNLICENSED",
+  "sideEffects": false,
   "files": [
     "dist"
   ],
@@ -58,6 +59,11 @@
       "import": "./dist/shadow.es.mjs",
       "require": "./dist/shadow.cjs.js"
     },
+    "./shadow/portal": {
+      "types": "./dist/src/shadow/portal/index.d.ts",
+      "import": "./dist/shadow/portal.es.mjs",
+      "require": "./dist/shadow/portal.cjs.js"
+    },
     "./shadow/react": {
       "types": "./dist/src/shadow/react/index.d.ts",
       "import": "./dist/shadow/react.es.mjs",

package/dist/src/shadow/react/PortalContainerContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PortalContainerContext.d.ts","sourceRoot":"","sources":["../../../../src/shadow/react/PortalContainerContext.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,sBAAsB,6CAA0C,CAAA"}

package/dist/src/shadow/react/PortalContainerProvider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PortalContainerProvider.d.ts","sourceRoot":"","sources":["../../../../src/shadow/react/PortalContainerProvider.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,iDAAiD,CAAA;AAGnG;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,GAAI,gCAGrC,4BAA4B,KAAG,YAK/B,CAAA"}

package/dist/src/shadow/react/usePortalContainer.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"usePortalContainer.d.ts","sourceRoot":"","sources":["../../../../src/shadow/react/usePortalContainer.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,kBAAkB,QAAO,WAAW,GAAG,IAEnD,CAAA"}