@wordpress/ui 0.12.1-next.v.202604201441.0 → 0.13.0

package/build/utils/create-overlay-modal-context.cjs

@@ -0,0 +1,48 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/ui/src/utils/create-overlay-modal-context.tsx
+var create_overlay_modal_context_exports = {};
+__export(create_overlay_modal_context_exports, {
+  createOverlayModalContext: () => createOverlayModalContext
+});
+module.exports = __toCommonJS(create_overlay_modal_context_exports);
+var import_element = require("@wordpress/element");
+var import_jsx_runtime = require("react/jsx-runtime");
+function createOverlayModalContext(initialValue) {
+  const OverlayModalContext = (0, import_element.createContext)(initialValue);
+  function OverlayModalProvider({
+    modal,
+    children
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(OverlayModalContext.Provider, { value: modal, children });
+  }
+  function useOverlayModal() {
+    return (0, import_element.useContext)(OverlayModalContext);
+  }
+  return {
+    Provider: OverlayModalProvider,
+    useModal: useOverlayModal
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createOverlayModalContext
+});
+//# sourceMappingURL=create-overlay-modal-context.cjs.map

package/build/utils/create-overlay-modal-context.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utils/create-overlay-modal-context.tsx"],
+  "sourcesContent": ["import { createContext, useContext } from '@wordpress/element';\n\ntype OverlayModalProviderProps< Modal > = {\n\tmodal: Modal;\n\tchildren: React.ReactNode;\n};\n\n/**\n * Creates a modal context pair (`Provider` + `useModal`) for overlay\n * primitives like Dialog and Drawer.\n */\nexport function createOverlayModalContext< Modal >( initialValue: Modal ) {\n\tconst OverlayModalContext = createContext< Modal >( initialValue );\n\n\tfunction OverlayModalProvider( {\n\t\tmodal,\n\t\tchildren,\n\t}: OverlayModalProviderProps< Modal > ) {\n\t\treturn (\n\t\t\t<OverlayModalContext.Provider value={ modal }>\n\t\t\t\t{ children }\n\t\t\t</OverlayModalContext.Provider>\n\t\t);\n\t}\n\n\tfunction useOverlayModal() {\n\t\treturn useContext( OverlayModalContext );\n\t}\n\n\treturn {\n\t\tProvider: OverlayModalProvider,\n\t\tuseModal: useOverlayModal,\n\t};\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA0C;AAmBvC;AARI,SAAS,0BAAoC,cAAsB;AACzE,QAAM,0BAAsB,8BAAwB,YAAa;AAEjE,WAAS,qBAAsB;AAAA,IAC9B;AAAA,IACA;AAAA,EACD,GAAwC;AACvC,WACC,4CAAC,oBAAoB,UAApB,EAA6B,OAAQ,OACnC,UACH;AAAA,EAEF;AAEA,WAAS,kBAAkB;AAC1B,eAAO,2BAAY,mBAAoB;AAAA,EACxC;AAEA,SAAO;AAAA,IACN,UAAU;AAAA,IACV,UAAU;AAAA,EACX;AACD;",
+  "names": []
+}

package/build/utils/create-overlay-title-validation.cjs

@@ -0,0 +1,93 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/ui/src/utils/create-overlay-title-validation.tsx
+var create_overlay_title_validation_exports = {};
+__export(create_overlay_title_validation_exports, {
+  createOverlayTitleValidation: () => createOverlayTitleValidation
+});
+module.exports = __toCommonJS(create_overlay_title_validation_exports);
+var import_element = require("@wordpress/element");
+var import_use_schedule_validation = require("./use-schedule-validation.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+var VALIDATION_ENABLED = process.env.NODE_ENV !== "production";
+function createOverlayTitleValidation(componentName) {
+  const componentNameLowerCase = componentName.toLowerCase();
+  const OverlayValidationContext = VALIDATION_ENABLED ? (0, import_element.createContext)(null) : null;
+  function useValidationContextDev() {
+    return (0, import_element.useContext)(OverlayValidationContext);
+  }
+  function useValidationContextProd() {
+    return null;
+  }
+  const useValidationContext = VALIDATION_ENABLED ? useValidationContextDev : useValidationContextProd;
+  function ValidationProviderDev({
+    children
+  }) {
+    const titleElementRef = (0, import_element.useRef)(null);
+    const scheduleValidation = (0, import_use_schedule_validation.useScheduleValidation)(() => {
+      const titleElement = titleElementRef.current;
+      if (!titleElement) {
+        throw new Error(
+          `${componentName}: Missing <${componentName}.Title>. For accessibility, every ${componentNameLowerCase} requires a title. If needed, the title can be visually hidden but must not be omitted.`
+        );
+      }
+      const textContent = titleElement.textContent?.trim();
+      if (!textContent) {
+        throw new Error(
+          `${componentName}: <${componentName}.Title> cannot be empty. Provide meaningful text content for the ${componentNameLowerCase} title.`
+        );
+      }
+    });
+    const registerTitle = (0, import_element.useCallback)(
+      (element) => {
+        titleElementRef.current = element;
+        scheduleValidation();
+        return () => {
+          titleElementRef.current = null;
+          scheduleValidation();
+        };
+      },
+      [scheduleValidation]
+    );
+    const contextValue = (0, import_element.useMemo)(
+      () => ({ registerTitle }),
+      [registerTitle]
+    );
+    (0, import_element.useEffect)(() => {
+      scheduleValidation();
+    }, [scheduleValidation]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(OverlayValidationContext.Provider, { value: contextValue, children });
+  }
+  function ValidationProviderProd({
+    children
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children });
+  }
+  const ValidationProvider = VALIDATION_ENABLED ? ValidationProviderDev : ValidationProviderProd;
+  return {
+    ValidationProvider,
+    useValidationContext
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createOverlayTitleValidation
+});
+//# sourceMappingURL=create-overlay-title-validation.cjs.map

package/build/utils/create-overlay-title-validation.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utils/create-overlay-title-validation.tsx"],
+  "sourcesContent": ["import {\n\tcreateContext,\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n} from '@wordpress/element';\nimport { useScheduleValidation } from './use-schedule-validation';\n\n/**\n * Whether validation is enabled. This is a build-time constant that allows\n * bundlers to tree-shake all validation code in production builds.\n */\nconst VALIDATION_ENABLED = process.env.NODE_ENV !== 'production';\n\ntype OverlayValidationContextType = {\n\tregisterTitle: ( element: HTMLElement | null ) => () => void;\n};\n\ntype OverlayValidationProviderProps = {\n\tchildren: React.ReactNode;\n};\n\n/**\n * Creates development-only title validation helpers for overlay primitives.\n */\nexport function createOverlayTitleValidation( componentName: string ) {\n\tconst componentNameLowerCase = componentName.toLowerCase();\n\tconst OverlayValidationContext = VALIDATION_ENABLED\n\t\t? createContext< OverlayValidationContextType | null >( null )\n\t\t: ( null as unknown as React.Context< OverlayValidationContextType | null > );\n\n\tfunction useValidationContextDev() {\n\t\treturn useContext( OverlayValidationContext );\n\t}\n\n\tfunction useValidationContextProd() {\n\t\treturn null;\n\t}\n\n\tconst useValidationContext = VALIDATION_ENABLED\n\t\t? useValidationContextDev\n\t\t: useValidationContextProd;\n\n\tfunction ValidationProviderDev( {\n\t\tchildren,\n\t}: OverlayValidationProviderProps ) {\n\t\tconst titleElementRef = useRef< HTMLElement | null >( null );\n\n\t\tconst scheduleValidation = useScheduleValidation( () => {\n\t\t\tconst titleElement = titleElementRef.current;\n\n\t\t\tif ( ! titleElement ) {\n\t\t\t\tthrow new Error(\n\t\t\t\t\t`${ componentName }: Missing <${ componentName }.Title>. ` +\n\t\t\t\t\t\t`For accessibility, every ${ componentNameLowerCase } requires a title. ` +\n\t\t\t\t\t\t'If needed, the title can be visually hidden but must not be omitted.'\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tconst textContent = titleElement.textContent?.trim();\n\t\t\tif ( ! textContent ) {\n\t\t\t\tthrow new Error(\n\t\t\t\t\t`${ componentName }: <${ componentName }.Title> cannot be empty. ` +\n\t\t\t\t\t\t`Provide meaningful text content for the ${ componentNameLowerCase } title.`\n\t\t\t\t);\n\t\t\t}\n\t\t} );\n\n\t\tconst registerTitle = useCallback(\n\t\t\t( element: HTMLElement | null ) => {\n\t\t\t\ttitleElementRef.current = element;\n\t\t\t\tscheduleValidation();\n\n\t\t\t\treturn () => {\n\t\t\t\t\ttitleElementRef.current = null;\n\t\t\t\t\tscheduleValidation();\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ scheduleValidation ]\n\t\t);\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( { registerTitle } ),\n\t\t\t[ registerTitle ]\n\t\t);\n\n\t\t// Schedule an initial validation on mount to catch missing titles\n\t\t// (when no Title component is rendered, registerTitle is never called).\n\t\tuseEffect( () => {\n\t\t\tscheduleValidation();\n\t\t}, [ scheduleValidation ] );\n\n\t\treturn (\n\t\t\t<OverlayValidationContext.Provider value={ contextValue }>\n\t\t\t\t{ children }\n\t\t\t</OverlayValidationContext.Provider>\n\t\t);\n\t}\n\n\tfunction ValidationProviderProd( {\n\t\tchildren,\n\t}: OverlayValidationProviderProps ) {\n\t\treturn <>{ children }</>;\n\t}\n\n\tconst ValidationProvider = VALIDATION_ENABLED\n\t\t? ValidationProviderDev\n\t\t: ValidationProviderProd;\n\n\treturn {\n\t\tValidationProvider,\n\t\tuseValidationContext,\n\t};\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOO;AACP,qCAAsC;AAuFnC;AAjFH,IAAM,qBAAqB,QAAQ,IAAI,aAAa;AAa7C,SAAS,6BAA8B,eAAwB;AACrE,QAAM,yBAAyB,cAAc,YAAY;AACzD,QAAM,2BAA2B,yBAC9B,8BAAsD,IAAK,IACzD;AAEL,WAAS,0BAA0B;AAClC,eAAO,2BAAY,wBAAyB;AAAA,EAC7C;AAEA,WAAS,2BAA2B;AACnC,WAAO;AAAA,EACR;AAEA,QAAM,uBAAuB,qBAC1B,0BACA;AAEH,WAAS,sBAAuB;AAAA,IAC/B;AAAA,EACD,GAAoC;AACnC,UAAM,sBAAkB,uBAA8B,IAAK;AAE3D,UAAM,yBAAqB,sDAAuB,MAAM;AACvD,YAAM,eAAe,gBAAgB;AAErC,UAAK,CAAE,cAAe;AACrB,cAAM,IAAI;AAAA,UACT,GAAI,aAAc,cAAe,aAAc,qCACjB,sBAAuB;AAAA,QAEtD;AAAA,MACD;AAEA,YAAM,cAAc,aAAa,aAAa,KAAK;AACnD,UAAK,CAAE,aAAc;AACpB,cAAM,IAAI;AAAA,UACT,GAAI,aAAc,MAAO,aAAc,oEACM,sBAAuB;AAAA,QACrE;AAAA,MACD;AAAA,IACD,CAAE;AAEF,UAAM,oBAAgB;AAAA,MACrB,CAAE,YAAiC;AAClC,wBAAgB,UAAU;AAC1B,2BAAmB;AAEnB,eAAO,MAAM;AACZ,0BAAgB,UAAU;AAC1B,6BAAmB;AAAA,QACpB;AAAA,MACD;AAAA,MACA,CAAE,kBAAmB;AAAA,IACtB;AAEA,UAAM,mBAAe;AAAA,MACpB,OAAQ,EAAE,cAAc;AAAA,MACxB,CAAE,aAAc;AAAA,IACjB;AAIA,kCAAW,MAAM;AAChB,yBAAmB;AAAA,IACpB,GAAG,CAAE,kBAAmB,CAAE;AAE1B,WACC,4CAAC,yBAAyB,UAAzB,EAAkC,OAAQ,cACxC,UACH;AAAA,EAEF;AAEA,WAAS,uBAAwB;AAAA,IAChC;AAAA,EACD,GAAoC;AACnC,WAAO,2EAAI,UAAU;AAAA,EACtB;AAEA,QAAM,qBAAqB,qBACxB,wBACA;AAEH,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;",
+  "names": []
+}

package/build/utils/render-slot-with-children.cjs

@@ -0,0 +1,34 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/ui/src/utils/render-slot-with-children.ts
+var render_slot_with_children_exports = {};
+__export(render_slot_with_children_exports, {
+  renderSlotWithChildren: () => renderSlotWithChildren
+});
+module.exports = __toCommonJS(render_slot_with_children_exports);
+var import_element = require("@wordpress/element");
+function renderSlotWithChildren(slot, defaultSlot, children) {
+  return (0, import_element.cloneElement)(slot ?? defaultSlot, { children });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  renderSlotWithChildren
+});
+//# sourceMappingURL=render-slot-with-children.cjs.map

package/build/utils/render-slot-with-children.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utils/render-slot-with-children.ts"],
+  "sourcesContent": ["import { cloneElement } from '@wordpress/element';\nimport type { ReactElement, ReactNode } from 'react';\n\n/**\n * Fills an optional \"slot\" element prop with content by cloning it and\n * injecting the given `children`. When `slot` is undefined, the provided\n * `defaultSlot` is used in its place.\n *\n * Shared by overlay `Popup` components for their slot-shaped customization\n * props (e.g. `portal`, `positioner`), so the merge behavior \u2014 defaults,\n * children injection \u2014 stays consistent across all of them.\n *\n * Callers should type the slot prop as `ReactElement<Omit<Props, 'children'>>`:\n * any subtree passed on the slot element is overwritten by `children`.\n *\n * @param slot        Optional element from the slot prop (e.g. `<Tooltip.Portal \u2026 />`\n *                    or `<Tooltip.Positioner \u2026 />`). When omitted, `defaultSlot`\n *                    is used. Injected `children` replace any subtree the caller\n *                    may have passed on the slot element.\n * @param defaultSlot Unpopulated default element used when `slot` is omitted\n *                    (e.g. `<Tooltip.Portal />`).\n * @param children    Content to inject as the slot's children (backdrop,\n *                    positioner, popup subtree, etc.).\n */\nexport function renderSlotWithChildren(\n\tslot: ReactElement | undefined,\n\tdefaultSlot: ReactElement,\n\tchildren: ReactNode\n): ReactElement {\n\treturn cloneElement( slot ?? defaultSlot, { children } );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA6B;AAwBtB,SAAS,uBACf,MACA,aACA,UACe;AACf,aAAO,6BAAc,QAAQ,aAAa,EAAE,SAAS,CAAE;AACxD;",
+  "names": []
+}

package/build/utils/use-deprioritized-initial-focus.cjs

@@ -31,14 +31,12 @@ var getTabbableOptions = () => ({
 });
 function useDeprioritizedInitialFocus({
   initialFocus,
-  deprioritizedAttribute
+  deprioritizedAttributes
 }) {
   const popupRef = (0, import_element.useRef)(null);
-  const resolvedInitialFocus = (0, import_element.useMemo)(() => {
-    if (initialFocus !== void 0 && initialFocus !== true) {
-      return initialFocus;
-    }
-    return (interactionType) => {
+  let resolvedInitialFocus = initialFocus;
+  if (initialFocus === void 0 || initialFocus === true) {
+    resolvedInitialFocus = (interactionType) => {
       if (interactionType === "touch") {
         return popupRef.current ?? true;
       }
@@ -48,13 +46,15 @@ function useDeprioritizedInitialFocus({
       }
       const tabbables = (0, import_tabbable.tabbable)(popup, getTabbableOptions());
       for (const el of tabbables) {
-        if (el instanceof HTMLElement && !el.hasAttribute(deprioritizedAttribute)) {
+        if (el instanceof HTMLElement && !deprioritizedAttributes.some(
+          (attr) => el.hasAttribute(attr)
+        )) {
           return el;
         }
       }
       return true;
     };
-  }, [initialFocus, deprioritizedAttribute]);
+  }
   return { resolvedInitialFocus, popupRef };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/build/utils/use-deprioritized-initial-focus.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/utils/use-deprioritized-initial-focus.ts"],
-  "sourcesContent": ["import type { Popover as _Popover } from '@base-ui/react/popover';\nimport { useMemo, useRef } from '@wordpress/element';\nimport { tabbable } from 'tabbable';\n\n/**\n * The `initialFocus` type shared by Base UI overlay popups (Dialog, Popover,\n * AlertDialog, etc.). We derive it from `Popover.Popup.Props` here, but it\n * is identical across all overlay components.\n */\ntype InitialFocus = _Popover.Popup.Props[ 'initialFocus' ];\n\n/**\n * Options matching Base UI's internal tabbable configuration.\n * @see https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/utils/tabbable.ts\n */\nconst getTabbableOptions = () => ( {\n\tgetShadowRoot: true,\n\tdisplayCheck:\n\t\ttypeof ResizeObserver === 'function' &&\n\t\tResizeObserver.toString().includes( '[native code]' )\n\t\t\t? ( 'full' as const )\n\t\t\t: ( 'none' as const ),\n} );\n\n/**\n * Returns a resolved `initialFocus` value that deprioritizes elements\n * marked with a given data attribute (e.g. a close icon), and an internal\n * ref that must be merged onto the popup element.\n *\n * When `initialFocus` is `undefined` or `true` (the default behavior),\n * the hook replaces it with a callback that:\n * 1. On touch interactions \u2014 focuses the popup element itself (preventing\n *    the virtual keyboard on Android), matching Base UI's default.\n * 2. On other interactions \u2014 returns the first tabbable element that does\n *    *not* carry `deprioritizedAttribute`. Falls back to Base UI's default\n *    when the deprioritized element is the only tabbable element.\n *\n * All other `initialFocus` values (`false`, `RefObject`, callback) pass\n * through unchanged.\n *\n * @param props\n * @param props.initialFocus           The consumer-provided `initialFocus` value.\n * @param props.deprioritizedAttribute The data attribute whose elements should be deprioritized.\n */\nexport function useDeprioritizedInitialFocus( {\n\tinitialFocus,\n\tdeprioritizedAttribute,\n}: {\n\tinitialFocus: InitialFocus;\n\tdeprioritizedAttribute: string;\n} ) {\n\tconst popupRef = useRef< HTMLDivElement >( null );\n\n\tconst resolvedInitialFocus = useMemo( (): InitialFocus => {\n\t\tif ( initialFocus !== undefined && initialFocus !== true ) {\n\t\t\treturn initialFocus;\n\t\t}\n\n\t\treturn ( interactionType ): HTMLElement | boolean | null => {\n\t\t\tif ( interactionType === 'touch' ) {\n\t\t\t\treturn popupRef.current ?? true;\n\t\t\t}\n\n\t\t\tconst popup = popupRef.current;\n\t\t\tif ( ! popup ) {\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\tconst tabbables = tabbable( popup, getTabbableOptions() );\n\t\t\tfor ( const el of tabbables ) {\n\t\t\t\tif (\n\t\t\t\t\tel instanceof HTMLElement &&\n\t\t\t\t\t! el.hasAttribute( deprioritizedAttribute )\n\t\t\t\t) {\n\t\t\t\t\treturn el;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn true;\n\t\t};\n\t}, [ initialFocus, deprioritizedAttribute ] );\n\n\treturn { resolvedInitialFocus, popupRef };\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAgC;AAChC,sBAAyB;AAazB,IAAM,qBAAqB,OAAQ;AAAA,EAClC,eAAe;AAAA,EACf,cACC,OAAO,mBAAmB,cAC1B,eAAe,SAAS,EAAE,SAAU,eAAgB,IAC/C,SACA;AACP;AAsBO,SAAS,6BAA8B;AAAA,EAC7C;AAAA,EACA;AACD,GAGI;AACH,QAAM,eAAW,uBAA0B,IAAK;AAEhD,QAAM,2BAAuB,wBAAS,MAAoB;AACzD,QAAK,iBAAiB,UAAa,iBAAiB,MAAO;AAC1D,aAAO;AAAA,IACR;AAEA,WAAO,CAAE,oBAAmD;AAC3D,UAAK,oBAAoB,SAAU;AAClC,eAAO,SAAS,WAAW;AAAA,MAC5B;AAEA,YAAM,QAAQ,SAAS;AACvB,UAAK,CAAE,OAAQ;AACd,eAAO;AAAA,MACR;AAEA,YAAM,gBAAY,0BAAU,OAAO,mBAAmB,CAAE;AACxD,iBAAY,MAAM,WAAY;AAC7B,YACC,cAAc,eACd,CAAE,GAAG,aAAc,sBAAuB,GACzC;AACD,iBAAO;AAAA,QACR;AAAA,MACD;AAEA,aAAO;AAAA,IACR;AAAA,EACD,GAAG,CAAE,cAAc,sBAAuB,CAAE;AAE5C,SAAO,EAAE,sBAAsB,SAAS;AACzC;",
+  "sourcesContent": ["import type { Popover as _Popover } from '@base-ui/react/popover';\nimport { useRef } from '@wordpress/element';\nimport { tabbable } from 'tabbable';\n\n/**\n * The `initialFocus` type shared by Base UI overlay popups (Dialog, Popover,\n * AlertDialog, etc.). We derive it from `Popover.Popup.Props` here, but it\n * is identical across all overlay components.\n */\ntype InitialFocus = _Popover.Popup.Props[ 'initialFocus' ];\n\n/**\n * Options matching Base UI's internal tabbable configuration.\n * @see https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/utils/tabbable.ts\n */\nconst getTabbableOptions = () => ( {\n\tgetShadowRoot: true,\n\tdisplayCheck:\n\t\ttypeof ResizeObserver === 'function' &&\n\t\tResizeObserver.toString().includes( '[native code]' )\n\t\t\t? ( 'full' as const )\n\t\t\t: ( 'none' as const ),\n} );\n\n/**\n * Returns a resolved `initialFocus` value that deprioritizes elements\n * marked with any of the given data attributes (e.g. a close icon, a\n * library-managed scroll container), and an internal ref that must be\n * merged onto the popup element.\n *\n * When `initialFocus` is `undefined` or `true` (the default behavior),\n * the hook replaces it with a callback that:\n * 1. On touch interactions \u2014 focuses the popup element itself (preventing\n *    the virtual keyboard on Android), matching Base UI's default.\n * 2. On other interactions \u2014 returns the first tabbable element that does\n *    *not* carry any of `deprioritizedAttributes`. Falls back to Base\n *    UI's default when every tabbable element is deprioritized.\n *\n * All other `initialFocus` values (`false`, `RefObject`, callback) pass\n * through unchanged.\n *\n * @param props\n * @param props.initialFocus            The consumer-provided `initialFocus` value.\n * @param props.deprioritizedAttributes The data attributes whose elements should be deprioritized.\n */\nexport function useDeprioritizedInitialFocus( {\n\tinitialFocus,\n\tdeprioritizedAttributes,\n}: {\n\tinitialFocus: InitialFocus;\n\tdeprioritizedAttributes: string[];\n} ) {\n\tconst popupRef = useRef< HTMLDivElement >( null );\n\n\t// Returning a fresh callback on every render is intentional. Base UI\n\t// stores `initialFocus` via `useValueAsRef` (see its FloatingFocusManager\n\t// source) and reads it through `ref.current` only at open time, so\n\t// reference identity doesn't affect behavior. Skipping `useMemo` also\n\t// avoids either forcing callers to memoize their attributes array or\n\t// fighting the React Compiler with a stringified dep key.\n\tlet resolvedInitialFocus: InitialFocus = initialFocus;\n\tif ( initialFocus === undefined || initialFocus === true ) {\n\t\tresolvedInitialFocus = ( interactionType ) => {\n\t\t\tif ( interactionType === 'touch' ) {\n\t\t\t\treturn popupRef.current ?? true;\n\t\t\t}\n\n\t\t\tconst popup = popupRef.current;\n\t\t\tif ( ! popup ) {\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\tconst tabbables = tabbable( popup, getTabbableOptions() );\n\t\t\tfor ( const el of tabbables ) {\n\t\t\t\tif (\n\t\t\t\t\tel instanceof HTMLElement &&\n\t\t\t\t\t! deprioritizedAttributes.some( ( attr ) =>\n\t\t\t\t\t\tel.hasAttribute( attr )\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn el;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn true;\n\t\t};\n\t}\n\n\treturn { resolvedInitialFocus, popupRef };\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAuB;AACvB,sBAAyB;AAazB,IAAM,qBAAqB,OAAQ;AAAA,EAClC,eAAe;AAAA,EACf,cACC,OAAO,mBAAmB,cAC1B,eAAe,SAAS,EAAE,SAAU,eAAgB,IAC/C,SACA;AACP;AAuBO,SAAS,6BAA8B;AAAA,EAC7C;AAAA,EACA;AACD,GAGI;AACH,QAAM,eAAW,uBAA0B,IAAK;AAQhD,MAAI,uBAAqC;AACzC,MAAK,iBAAiB,UAAa,iBAAiB,MAAO;AAC1D,2BAAuB,CAAE,oBAAqB;AAC7C,UAAK,oBAAoB,SAAU;AAClC,eAAO,SAAS,WAAW;AAAA,MAC5B;AAEA,YAAM,QAAQ,SAAS;AACvB,UAAK,CAAE,OAAQ;AACd,eAAO;AAAA,MACR;AAEA,YAAM,gBAAY,0BAAU,OAAO,mBAAmB,CAAE;AACxD,iBAAY,MAAM,WAAY;AAC7B,YACC,cAAc,eACd,CAAE,wBAAwB;AAAA,UAAM,CAAE,SACjC,GAAG,aAAc,IAAK;AAAA,QACvB,GACC;AACD,iBAAO;AAAA,QACR;AAAA,MACD;AAEA,aAAO;AAAA,IACR;AAAA,EACD;AAEA,SAAO,EAAE,sBAAsB,SAAS;AACzC;",
   "names": []
 }

package/build/utils/use-overlay-scroll-state-attributes.cjs

@@ -0,0 +1,140 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/ui/src/utils/use-overlay-scroll-state-attributes.ts
+var use_overlay_scroll_state_attributes_exports = {};
+__export(use_overlay_scroll_state_attributes_exports, {
+  SCROLL_CONTAINER_ATTR: () => SCROLL_CONTAINER_ATTR,
+  useOverlayScrollStateAttributes: () => useOverlayScrollStateAttributes
+});
+module.exports = __toCommonJS(use_overlay_scroll_state_attributes_exports);
+var import_element = require("@wordpress/element");
+var SCROLL_CONTAINER_ATTR = "data-wp-ui-overlay-scroll-container";
+var SCROLLED_FROM_TOP_ATTR = "data-wp-ui-overlay-scrolled-from-top";
+var SCROLLED_FROM_BOTTOM_ATTR = "data-wp-ui-overlay-scrolled-from-bottom";
+var SCROLL_TABBABLE_FLAG_ATTR = "data-wp-ui-overlay-scroll-tabbable";
+var SCROLL_END_EPSILON = 1;
+function reconcileTabbableFlag(el) {
+  if (el.hasAttribute(SCROLL_TABBABLE_FLAG_ATTR) && el.getAttribute("tabindex") !== "0") {
+    el.removeAttribute(SCROLL_TABBABLE_FLAG_ATTR);
+  }
+}
+function updateScrollAttributes(el) {
+  const { scrollTop, clientHeight, scrollHeight } = el;
+  const overflows = scrollHeight - clientHeight > SCROLL_END_EPSILON;
+  el.toggleAttribute(SCROLLED_FROM_TOP_ATTR, scrollTop > 0);
+  el.toggleAttribute(
+    SCROLLED_FROM_BOTTOM_ATTR,
+    scrollTop + clientHeight < scrollHeight - SCROLL_END_EPSILON
+  );
+  reconcileTabbableFlag(el);
+  if (overflows) {
+    if (!el.hasAttribute(SCROLL_TABBABLE_FLAG_ATTR) && el.getAttribute("tabindex") === null) {
+      el.setAttribute("tabindex", "0");
+      el.setAttribute(SCROLL_TABBABLE_FLAG_ATTR, "");
+    }
+  } else if (el.hasAttribute(SCROLL_TABBABLE_FLAG_ATTR)) {
+    el.removeAttribute("tabindex");
+    el.removeAttribute(SCROLL_TABBABLE_FLAG_ATTR);
+  }
+}
+var HOOK_OWNED_ATTRS = [
+  SCROLL_CONTAINER_ATTR,
+  SCROLLED_FROM_TOP_ATTR,
+  SCROLLED_FROM_BOTTOM_ATTR
+];
+function cleanupScrollAttributes(el) {
+  for (const attr of HOOK_OWNED_ATTRS) {
+    el.removeAttribute(attr);
+  }
+  reconcileTabbableFlag(el);
+  if (el.hasAttribute(SCROLL_TABBABLE_FLAG_ATTR)) {
+    el.removeAttribute("tabindex");
+    el.removeAttribute(SCROLL_TABBABLE_FLAG_ATTR);
+  }
+}
+function useOverlayScrollStateAttributes(onScroll) {
+  const [node, setNode] = (0, import_element.useState)(null);
+  const ref = (0, import_element.useCallback)((el) => {
+    setNode(el);
+  }, []);
+  (0, import_element.useLayoutEffect)(() => {
+    if (!node) {
+      return;
+    }
+    node.setAttribute(SCROLL_CONTAINER_ATTR, "");
+    updateScrollAttributes(node);
+    if (typeof ResizeObserver === "undefined") {
+      return () => {
+        cleanupScrollAttributes(node);
+      };
+    }
+    const resizeObserver = new ResizeObserver(() => {
+      updateScrollAttributes(node);
+    });
+    resizeObserver.observe(node);
+    for (const child of Array.from(node.children)) {
+      resizeObserver.observe(child);
+    }
+    let mutationObserver;
+    if (typeof MutationObserver !== "undefined") {
+      mutationObserver = new MutationObserver((records) => {
+        for (const record of records) {
+          if (record.target === node) {
+            for (const added of Array.from(record.addedNodes)) {
+              if (added instanceof Element) {
+                resizeObserver.observe(added);
+              }
+            }
+            for (const removed of Array.from(
+              record.removedNodes
+            )) {
+              if (removed instanceof Element) {
+                resizeObserver.unobserve(removed);
+              }
+            }
+          }
+        }
+        updateScrollAttributes(node);
+      });
+      mutationObserver.observe(node, {
+        childList: true
+      });
+    }
+    return () => {
+      resizeObserver.disconnect();
+      mutationObserver?.disconnect();
+      cleanupScrollAttributes(node);
+    };
+  }, [node]);
+  const handleScroll = (0, import_element.useCallback)(
+    (event) => {
+      updateScrollAttributes(event.currentTarget);
+      onScroll?.(event);
+    },
+    [onScroll]
+  );
+  return { ref, onScroll: handleScroll };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SCROLL_CONTAINER_ATTR,
+  useOverlayScrollStateAttributes
+});
+//# sourceMappingURL=use-overlay-scroll-state-attributes.cjs.map

package/build/utils/use-overlay-scroll-state-attributes.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utils/use-overlay-scroll-state-attributes.ts"],
+  "sourcesContent": ["import type { UIEvent, UIEventHandler } from 'react';\nimport { useCallback, useLayoutEffect, useState } from '@wordpress/element';\n\nexport const SCROLL_CONTAINER_ATTR = 'data-wp-ui-overlay-scroll-container';\nconst SCROLLED_FROM_TOP_ATTR = 'data-wp-ui-overlay-scrolled-from-top';\nconst SCROLLED_FROM_BOTTOM_ATTR = 'data-wp-ui-overlay-scrolled-from-bottom';\n/**\n * Marks a `tabindex` that this hook installed, so subsequent runs can tell\n * a hook-managed tabindex apart from one the consumer set on the element\n * themselves.\n *\n * Internal: the constant is not exported, but the literal string is named\n * in the public JSDoc on `useOverlayScrollStateAttributes` so consumers\n * grepping for \"why does this element have a `tabindex='0'` I didn't set?\"\n * can find the breadcrumb. If this string changes, update the JSDoc too.\n */\nconst SCROLL_TABBABLE_FLAG_ATTR = 'data-wp-ui-overlay-scroll-tabbable';\n\n/**\n * Allow fractional-pixel rounding when comparing scroll offsets. Browsers can\n * report `scrollTop + clientHeight` as slightly less than `scrollHeight` even\n * when fully scrolled to the bottom.\n */\nconst SCROLL_END_EPSILON = 1;\n\n/**\n * Detect consumer takeover of a previously hook-managed `tabindex` after the\n * hook had already installed its own: if the flag is set but the current\n * `tabindex` is no longer `\"0\"`, the consumer has overridden our value. Drop\n * the flag so subsequent ticks treat the `tabindex` as consumer-owned and\n * never touch it again.\n *\n * Limitation: the heuristic compares the DOM attribute, so a consumer who\n * passes `tabIndex={ 0 }` explicitly is indistinguishable from our own\n * managed `\"0\"` and would still be cleaned up on the next non-overflow\n * tick. See the contract paragraph on `useOverlayScrollStateAttributes`.\n *\n * @param el The scroll container.\n */\nfunction reconcileTabbableFlag( el: HTMLElement ) {\n\tif (\n\t\tel.hasAttribute( SCROLL_TABBABLE_FLAG_ATTR ) &&\n\t\tel.getAttribute( 'tabindex' ) !== '0'\n\t) {\n\t\tel.removeAttribute( SCROLL_TABBABLE_FLAG_ATTR );\n\t}\n}\n\nfunction updateScrollAttributes( el: HTMLElement ) {\n\tconst { scrollTop, clientHeight, scrollHeight } = el;\n\tconst overflows = scrollHeight - clientHeight > SCROLL_END_EPSILON;\n\n\tel.toggleAttribute( SCROLLED_FROM_TOP_ATTR, scrollTop > 0 );\n\tel.toggleAttribute(\n\t\tSCROLLED_FROM_BOTTOM_ATTR,\n\t\tscrollTop + clientHeight < scrollHeight - SCROLL_END_EPSILON\n\t);\n\n\t// Keyboard-scrollable regions must be reachable via Tab (WCAG 2.1.1),\n\t// but adding a stray tab stop to a non-scrolling `<div>` is an\n\t// anti-pattern. Toggle `tabindex=\"0\"` only while the element actually\n\t// overflows. The flag attribute guards against clobbering a\n\t// consumer-supplied tabindex: we only touch attributes we installed.\n\n\t// Takeover-after-install: detect a consumer who started overriding\n\t// our managed `\"0\"` *after* the hook installed it (e.g. a re-render\n\t// passing `tabIndex={ -1 }`). The flag is dropped so the install /\n\t// cleanup branches below leave the consumer's value untouched.\n\treconcileTabbableFlag( el );\n\n\tif ( overflows ) {\n\t\t// Pre-install opt-out: a consumer-supplied `tabindex` (including\n\t\t// `tabindex=\"-1\"` to hide the region from Tab order) keeps its\n\t\t// value because the flag is never installed in the first place.\n\t\t// If that consumer-supplied value is later *removed*, the hook\n\t\t// will install its own on the next overflow tick \u2014 the DOM\n\t\t// attribute alone can't distinguish a prior explicit opt-out\n\t\t// from an unconfigured state.\n\t\tif (\n\t\t\t! el.hasAttribute( SCROLL_TABBABLE_FLAG_ATTR ) &&\n\t\t\tel.getAttribute( 'tabindex' ) === null\n\t\t) {\n\t\t\tel.setAttribute( 'tabindex', '0' );\n\t\t\tel.setAttribute( SCROLL_TABBABLE_FLAG_ATTR, '' );\n\t\t}\n\t} else if ( el.hasAttribute( SCROLL_TABBABLE_FLAG_ATTR ) ) {\n\t\tel.removeAttribute( 'tabindex' );\n\t\tel.removeAttribute( SCROLL_TABBABLE_FLAG_ATTR );\n\t}\n}\n\nconst HOOK_OWNED_ATTRS = [\n\tSCROLL_CONTAINER_ATTR,\n\tSCROLLED_FROM_TOP_ATTR,\n\tSCROLLED_FROM_BOTTOM_ATTR,\n] as const;\n\nfunction cleanupScrollAttributes( el: HTMLElement ) {\n\tfor ( const attr of HOOK_OWNED_ATTRS ) {\n\t\tel.removeAttribute( attr );\n\t}\n\t// Reconcile first so a flag left over from a consumer-takeover never\n\t// causes us to clobber the consumer's `tabindex` here.\n\treconcileTabbableFlag( el );\n\t// After reconciliation the flag is set only when the current\n\t// `tabindex` is still `\"0\"` (i.e. ours). Any other value belongs to\n\t// the consumer and is left alone.\n\tif ( el.hasAttribute( SCROLL_TABBABLE_FLAG_ATTR ) ) {\n\t\tel.removeAttribute( 'tabindex' );\n\t\tel.removeAttribute( SCROLL_TABBABLE_FLAG_ATTR );\n\t}\n}\n\n/**\n * Keeps `data-wp-ui-overlay-scrolled-from-top` and\n * `data-wp-ui-overlay-scrolled-from-bottom` attributes in sync with a\n * scrollable overlay element's scroll position, and marks the element with\n * `data-wp-ui-overlay-scroll-container` so shared CSS (see\n * `overlay-chrome.module.css`) can target it without coupling to a specific\n * class name. Descendant selectors (e.g. sticky header/footer chrome) read\n * these attributes to toggle their separator border without forcing a React\n * re-render on every scroll frame.\n *\n * When the element overflows, a `tabindex=\"0\"` is also installed so keyboard\n * users can focus the region and arrow-scroll it (WCAG 2.1.1). The tabindex\n * is removed again as soon as the element no longer overflows \u2014 a stray tab\n * stop on a non-scrolling region is an anti-pattern. An internal flag\n * attribute (`data-wp-ui-overlay-scroll-tabbable`) marks tabindex values\n * the hook installed, so a consumer-supplied `tabindex` is never\n * overwritten.\n *\n * Tabindex contract:\n * - **Pre-install opt-out**: a `tabindex` set on the element before the\n *   first overflow is detected is left alone forever. The flag is never\n *   installed, so the hook never owns the attribute. (This means\n *   `tabIndex={ -1 }` on `Dialog.Content` / `Drawer.Content` reliably\n *   suppresses the auto tab stop.)\n * - **Takeover after install**: if the consumer overrides the hook's\n *   `\"0\"` with a *different* value after the fact, the flag is dropped\n *   on the next tick (`reconcileTabbableFlag`) and the consumer's value\n *   is preserved through subsequent overflow / non-overflow transitions\n *   and through cleanup.\n * - **Indistinguishable case**: a consumer who passes `tabIndex={ 0 }`\n *   explicitly while the hook also has `\"0\"` installed cannot be\n *   detected \u2014 the DOM attribute is identical to the hook-managed\n *   value, so the hook will still strip it on the next non-overflow\n *   tick. This is rarely intentional (the consumer's `0` matches the\n *   hook's behavior anyway), but consumers needing a guaranteed\n *   sticky `0` should avoid relying on it across overflow flips.\n *\n * Overflow detection is block-axis-only. Overlay popups are expected to\n * constrain content width (`overlay-chrome.module.css` clips `.content`\n * with `overflow-inline: hidden`); horizontal scrolling is intentionally\n * not supported, so this hook doesn't toggle tabindex on inline-axis\n * overflow and the scroll-state attributes don't track it.\n *\n * Returns a callback `ref` that the caller must attach to the scroll\n * container, and an `onScroll` handler to wire up to the same element. A\n * callback ref (not a `RefObject`) is used because overlay libraries like\n * Base UI mount the popup DOM lazily when the overlay opens, so the\n * attributes must be initialized the moment the node is attached, not when\n * the host component first renders. `useState` also absorbs repeated\n * attachments of the same node (Strict Mode remount, stable refs) without\n * re-running the effect.\n *\n * Change detection combines a `ResizeObserver` scoped to the container\n * and its direct children (to catch flex-layout growth) with a\n * `MutationObserver` on direct-child additions/removals only (to keep\n * the resize-observer set in sync as direct children come and go).\n *\n * Deeper subtree mutations are intentionally not observed: in practice,\n * any descendant whose growth changes the scroll size also propagates a\n * resize up the layout tree, so the existing `ResizeObserver` on direct\n * children catches it. Watching the full subtree would fan out the\n * mutation callback over every text-node insertion in content-heavy\n * overlays (rich-text editors, virtualized lists), which isn't worth\n * the cost of the rare deep-mutation-without-resize case. Revisit\n * (and consider rAF-coalescing the callback) if a real consumer hits\n * an attribute-staleness regression.\n *\n * Once CSS scroll-state container queries are supported across target\n * browsers, both the data attributes and this hook can be replaced with\n * `@container scroll-state(scrollable: top)` / `(scrollable: bottom)`.\n * See: https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Conditional_rules/Container_scroll-state_queries\n *\n * @param onScroll Optional `onScroll` from the parent; invoked after the\n *                 overlay scroll-state attributes are updated, so by the\n *                 time this handler runs, `data-wp-ui-overlay-scrolled-*`\n *                 on `event.currentTarget` already reflect the post-scroll\n *                 state.\n */\nexport function useOverlayScrollStateAttributes<\n\tT extends HTMLElement = HTMLElement,\n>( onScroll?: UIEventHandler< T > | undefined ) {\n\tconst [ node, setNode ] = useState< T | null >( null );\n\n\tconst ref = useCallback( ( el: T | null ) => {\n\t\tsetNode( el );\n\t}, [] );\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! node ) {\n\t\t\treturn;\n\t\t}\n\n\t\tnode.setAttribute( SCROLL_CONTAINER_ATTR, '' );\n\t\tupdateScrollAttributes( node );\n\n\t\tif ( typeof ResizeObserver === 'undefined' ) {\n\t\t\treturn () => {\n\t\t\t\tcleanupScrollAttributes( node );\n\t\t\t};\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( () => {\n\t\t\tupdateScrollAttributes( node );\n\t\t} );\n\t\tresizeObserver.observe( node );\n\t\tfor ( const child of Array.from( node.children ) ) {\n\t\t\tresizeObserver.observe( child );\n\t\t}\n\n\t\tlet mutationObserver: MutationObserver | undefined;\n\t\tif ( typeof MutationObserver !== 'undefined' ) {\n\t\t\tmutationObserver = new MutationObserver( ( records ) => {\n\t\t\t\tfor ( const record of records ) {\n\t\t\t\t\t// Only direct-child additions/removals affect what the\n\t\t\t\t\t// ResizeObserver is observing; deeper descendant changes\n\t\t\t\t\t// reach us through this callback for attribute refresh,\n\t\t\t\t\t// but we don't observe them individually to keep the\n\t\t\t\t\t// cost bounded on large subtrees.\n\t\t\t\t\tif ( record.target === node ) {\n\t\t\t\t\t\tfor ( const added of Array.from( record.addedNodes ) ) {\n\t\t\t\t\t\t\tif ( added instanceof Element ) {\n\t\t\t\t\t\t\t\tresizeObserver.observe( added );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tfor ( const removed of Array.from(\n\t\t\t\t\t\t\trecord.removedNodes\n\t\t\t\t\t\t) ) {\n\t\t\t\t\t\t\tif ( removed instanceof Element ) {\n\t\t\t\t\t\t\t\tresizeObserver.unobserve( removed );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tupdateScrollAttributes( node );\n\t\t\t} );\n\t\t\t// Direct children only \u2014 see the JSDoc above for why we\n\t\t\t// intentionally don't observe the full subtree.\n\t\t\tmutationObserver.observe( node, {\n\t\t\t\tchildList: true,\n\t\t\t} );\n\t\t}\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t\tmutationObserver?.disconnect();\n\t\t\tcleanupScrollAttributes( node );\n\t\t};\n\t}, [ node ] );\n\n\tconst handleScroll = useCallback(\n\t\t( event: UIEvent< T > ) => {\n\t\t\tupdateScrollAttributes( event.currentTarget );\n\t\t\tonScroll?.( event );\n\t\t},\n\t\t[ onScroll ]\n\t);\n\n\treturn { ref, onScroll: handleScroll };\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/build/visually-hidden/visually-hidden.cjs

@@ -26,12 +26,91 @@ module.exports = __toCommonJS(visually_hidden_exports);
 var import_react = require("@base-ui/react");
 var import_element = require("@wordpress/element");
 
+// packages/style-runtime/src/index.ts
+var STYLE_HASH_ATTRIBUTE = "data-wp-hash";
+function getRuntime() {
+  const globalScope = globalThis;
+  if (globalScope.__wpStyleRuntime) {
+    return globalScope.__wpStyleRuntime;
+  }
+  globalScope.__wpStyleRuntime = {
+    documents: /* @__PURE__ */ new Map(),
+    styles: /* @__PURE__ */ new Map(),
+    injectedStyles: /* @__PURE__ */ new WeakMap()
+  };
+  if (typeof document !== "undefined") {
+    registerDocument(document);
+  }
+  return globalScope.__wpStyleRuntime;
+}
+function documentContainsStyleHash(targetDocument, hash) {
+  if (!targetDocument.head) {
+    return false;
+  }
+  for (const style of targetDocument.head.querySelectorAll(
+    `style[${STYLE_HASH_ATTRIBUTE}]`
+  )) {
+    if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {
+      return true;
+    }
+  }
+  return false;
+}
+function injectStyle(targetDocument, hash, css) {
+  if (!targetDocument.head) {
+    return;
+  }
+  const runtime = getRuntime();
+  let injectedStyles = runtime.injectedStyles.get(targetDocument);
+  if (!injectedStyles) {
+    injectedStyles = /* @__PURE__ */ new Set();
+    runtime.injectedStyles.set(targetDocument, injectedStyles);
+  }
+  if (injectedStyles.has(hash)) {
+    return;
+  }
+  if (documentContainsStyleHash(targetDocument, hash)) {
+    injectedStyles.add(hash);
+    return;
+  }
+  const style = targetDocument.createElement("style");
+  style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);
+  style.appendChild(targetDocument.createTextNode(css));
+  targetDocument.head.appendChild(style);
+  injectedStyles.add(hash);
+}
+function registerDocument(targetDocument) {
+  const runtime = getRuntime();
+  runtime.documents.set(
+    targetDocument,
+    (runtime.documents.get(targetDocument) ?? 0) + 1
+  );
+  for (const [hash, css] of runtime.styles) {
+    injectStyle(targetDocument, hash, css);
+  }
+  return () => {
+    const count = runtime.documents.get(targetDocument);
+    if (count === void 0) {
+      return;
+    }
+    if (count <= 1) {
+      runtime.documents.delete(targetDocument);
+      return;
+    }
+    runtime.documents.set(targetDocument, count - 1);
+  };
+}
+function registerStyle(hash, css) {
+  const runtime = getRuntime();
+  runtime.styles.set(hash, css);
+  for (const targetDocument of runtime.documents.keys()) {
+    injectStyle(targetDocument, hash, css);
+  }
+}
+
 // packages/ui/src/visually-hidden/style.module.css
-if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='c46e8cb841']")) {
-  const style = document.createElement("style");
-  style.setAttribute("data-wp-hash", "c46e8cb841");
-  style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}"));
-  document.head.appendChild(style);
+if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
+  registerStyle("c46e8cb841", "@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}");
 }
 var style_default = { "visually-hidden": "f37b9e2e191ebd66__visually-hidden" };
 
@@ -43,7 +122,11 @@ var VisuallyHidden = (0, import_element.forwardRef)(
       ref,
       props: (0, import_react.mergeProps)(
         { className: style_default["visually-hidden"] },
-        restProps
+        restProps,
+        {
+          // @ts-expect-error Arbitrary data-* attributes aren't indexable on the typed div props. Kept hardcoded so consumers can't change or remove it.
+          "data-visually-hidden": ""
+        }
       )
     });
     return element;

package/build/visually-hidden/visually-hidden.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../src/visually-hidden/visually-hidden.tsx", "../../src/visually-hidden/style.module.css"],
-  "sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n *\n * Renders a `<div>` by default. Use the `render` prop to swap the\n * underlying element while preserving the visually-hidden behavior.\n *\n * ## Composing with other components\n *\n * When composing with another component that uses the `render` prop\n * pattern, there are two directions \u2014 and they produce different results.\n *\n * Most of the time you'll want `VisuallyHidden` as the **host** (outer\n * component) and pass the other component via `render`. This keeps the\n * other component's HTML element and semantics intact, while\n * `VisuallyHidden` only adds its hiding styles:\n *\n * ```jsx\n * // OtherComponent keeps its semantic element (e.g. <h2>).\n * <VisuallyHidden render={ <OtherComponent /> }>\n *   Accessible text\n * </VisuallyHidden>\n * ```\n *\n * The opposite direction is also possible, but be aware that it replaces\n * the other component's element with VisuallyHidden's default `<div>`:\n *\n * ```jsx\n * // OtherComponent's element becomes a <div>.\n * <OtherComponent render={ <VisuallyHidden /> }>\n *   Accessible text\n * </OtherComponent>\n * ```\n *\n * Choose based on what you need: if the other component's semantic\n * element matters (e.g. `<label>`, `<legend>`, `<h2>`), keep\n * `VisuallyHidden` as the host so the element is preserved.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='c46e8cb841']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"c46e8cb841\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"visually-hidden\":\"f37b9e2e191ebd66__visually-hidden\"};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsC;AACtC,qBAA2B;;;ACD3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,0RAA0R,CAAC;AACrU,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,mBAAkB,oCAAmC;;;ADqC9D,IAAM,qBAAiB;AAAA,EAC7B,SAASA,gBAAgB,EAAE,QAAQ,GAAG,UAAU,GAAG,KAAM;AACxD,UAAM,cAAU,wBAAW;AAAA,MAC1B;AAAA,MACA;AAAA,MACA,WAAO;AAAA,QACN,EAAE,WAAW,cAAQ,iBAAkB,EAAE;AAAA,QACzC;AAAA,MACD;AAAA,IACD,CAAE;AAEF,WAAO;AAAA,EACR;AACD;",
+  "sources": ["../../src/visually-hidden/visually-hidden.tsx", "../../../style-runtime/src/index.ts", "../../src/visually-hidden/style.module.css"],
+  "sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n *\n * Renders a `<div>` by default. Use the `render` prop to swap the\n * underlying element while preserving the visually-hidden behavior.\n *\n * ## Composing with other components\n *\n * When composing with another component that uses the `render` prop\n * pattern, keep `VisuallyHidden` as the **host** (outer component) and\n * pass the other component via `render`. This keeps the other\n * component's HTML element and semantics intact, while `VisuallyHidden`\n * only adds its hiding styles:\n *\n * ```jsx\n * // OtherComponent keeps its semantic element (e.g. <h2>).\n * <VisuallyHidden render={ <OtherComponent /> }>\n *   Accessible text\n * </VisuallyHidden>\n * ```\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps,\n\t\t\t\t{\n\t\t\t\t\t// @ts-expect-error Arbitrary data-* attributes aren't indexable on the typed div props. Kept hardcoded so consumers can't change or remove it.\n\t\t\t\t\t'data-visually-hidden': '',\n\t\t\t\t}\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash           Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash           Stable hash for the transformed CSS.\n * @param css            CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css  CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"c46e8cb841\", \"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}\");\n}\nexport default {\"visually-hidden\":\"f37b9e2e191ebd66__visually-hidden\"};\n"],
+  "mappings": "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",
   "names": ["VisuallyHidden"]
 }

package/build-module/alert-dialog/index.mjs

@@ -2,8 +2,10 @@
 import { Root } from "./root.mjs";
 import { Trigger } from "./trigger.mjs";
 import { Popup } from "./popup.mjs";
+import { Portal } from "./portal.mjs";
 export {
   Popup,
+  Portal,
   Root,
   Trigger
 };

package/build-module/alert-dialog/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/alert-dialog/index.ts"],
-  "sourcesContent": ["export { Root } from './root';\nexport { Trigger } from './trigger';\nexport { Popup } from './popup';\n"],
-  "mappings": ";AAAA,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,aAAa;",
+  "sourcesContent": ["export { Root } from './root';\nexport { Trigger } from './trigger';\nexport { Popup } from './popup';\nexport { Portal } from './portal';\n"],
+  "mappings": ";AAAA,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,cAAc;",
   "names": []
 }