@wordpress/ui 0.14.0 → 0.15.0

package/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 ## Unreleased
 
+## 0.15.0 (2026-06-04)
+
+### Breaking Changes
+
+-   Revert React back to v18 [#78940](https://github.com/WordPress/gutenberg/pull/78940).
+
 ## 0.14.0 (2026-05-27)
 
 ### Breaking Changes

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

@@ -1,7 +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 );\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,uBAAuB,IAAK;AAEpD,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;",
+  "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

@@ -25,10 +25,7 @@ __export(render_slot_with_children_exports, {
 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 }
-  );
+  return (0, import_element.cloneElement)(slot ?? defaultSlot, { children });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

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

@@ -1,7 +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(\n\t\t( slot ?? defaultSlot ) as ReactElement< { children?: ReactNode } >,\n\t\t{ children }\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA6B;AAwBtB,SAAS,uBACf,MACA,aACA,UACe;AACf,aAAO;AAAA,IACJ,QAAQ;AAAA,IACV,EAAE,SAAS;AAAA,EACZ;AACD;",
+  "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-module/utils/create-overlay-title-validation.mjs.map

@@ -1,7 +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 );\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,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,6BAA6B;AAuFnC,SASM,UATN;AAjFH,IAAM,qBAAqB,QAAQ,IAAI,aAAa;AAa7C,SAAS,6BAA8B,eAAwB;AACrE,QAAM,yBAAyB,cAAc,YAAY;AACzD,QAAM,2BAA2B,qBAC9B,cAAsD,IAAK,IACzD;AAEL,WAAS,0BAA0B;AAClC,WAAO,WAAY,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,kBAAkB,OAAuB,IAAK;AAEpD,UAAM,qBAAqB,sBAAuB,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,gBAAgB;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,eAAe;AAAA,MACpB,OAAQ,EAAE,cAAc;AAAA,MACxB,CAAE,aAAc;AAAA,IACjB;AAIA,cAAW,MAAM;AAChB,yBAAmB;AAAA,IACpB,GAAG,CAAE,kBAAmB,CAAE;AAE1B,WACC,oBAAC,yBAAyB,UAAzB,EAAkC,OAAQ,cACxC,UACH;AAAA,EAEF;AAEA,WAAS,uBAAwB;AAAA,IAChC;AAAA,EACD,GAAoC;AACnC,WAAO,gCAAI,UAAU;AAAA,EACtB;AAEA,QAAM,qBAAqB,qBACxB,wBACA;AAEH,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;",
+  "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,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,6BAA6B;AAuFnC,SASM,UATN;AAjFH,IAAM,qBAAqB,QAAQ,IAAI,aAAa;AAa7C,SAAS,6BAA8B,eAAwB;AACrE,QAAM,yBAAyB,cAAc,YAAY;AACzD,QAAM,2BAA2B,qBAC9B,cAAsD,IAAK,IACzD;AAEL,WAAS,0BAA0B;AAClC,WAAO,WAAY,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,kBAAkB,OAA8B,IAAK;AAE3D,UAAM,qBAAqB,sBAAuB,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,gBAAgB;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,eAAe;AAAA,MACpB,OAAQ,EAAE,cAAc;AAAA,MACxB,CAAE,aAAc;AAAA,IACjB;AAIA,cAAW,MAAM;AAChB,yBAAmB;AAAA,IACpB,GAAG,CAAE,kBAAmB,CAAE;AAE1B,WACC,oBAAC,yBAAyB,UAAzB,EAAkC,OAAQ,cACxC,UACH;AAAA,EAEF;AAEA,WAAS,uBAAwB;AAAA,IAChC;AAAA,EACD,GAAoC;AACnC,WAAO,gCAAI,UAAU;AAAA,EACtB;AAEA,QAAM,qBAAqB,qBACxB,wBACA;AAEH,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;",
   "names": []
 }

package/build-module/utils/render-slot-with-children.mjs

@@ -1,10 +1,7 @@
 // packages/ui/src/utils/render-slot-with-children.ts
 import { cloneElement } from "@wordpress/element";
 function renderSlotWithChildren(slot, defaultSlot, children) {
-  return cloneElement(
-    slot ?? defaultSlot,
-    { children }
-  );
+  return cloneElement(slot ?? defaultSlot, { children });
 }
 export {
   renderSlotWithChildren

package/build-module/utils/render-slot-with-children.mjs.map

@@ -1,7 +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(\n\t\t( slot ?? defaultSlot ) as ReactElement< { children?: ReactNode } >,\n\t\t{ children }\n\t);\n}\n"],
-  "mappings": ";AAAA,SAAS,oBAAoB;AAwBtB,SAAS,uBACf,MACA,aACA,UACe;AACf,SAAO;AAAA,IACJ,QAAQ;AAAA,IACV,EAAE,SAAS;AAAA,EACZ;AACD;",
+  "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,SAAS,oBAAoB;AAwBtB,SAAS,uBACf,MACA,aACA,UACe;AACf,SAAO,aAAc,QAAQ,aAAa,EAAE,SAAS,CAAE;AACxD;",
   "names": []
 }

package/build-types/utils/render-slot-with-children.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render-slot-with-children.d.ts","sourceRoot":"","sources":["../../src/utils/render-slot-with-children.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,sBAAsB,CACrC,IAAI,EAAE,YAAY,GAAG,SAAS,EAC9B,WAAW,EAAE,YAAY,EACzB,QAAQ,EAAE,SAAS,GACjB,YAAY,CAKd"}
+{"version":3,"file":"render-slot-with-children.d.ts","sourceRoot":"","sources":["../../src/utils/render-slot-with-children.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,sBAAsB,CACrC,IAAI,EAAE,YAAY,GAAG,SAAS,EAC9B,WAAW,EAAE,YAAY,EACzB,QAAQ,EAAE,SAAS,GACjB,YAAY,CAEd"}

package/build-types/utils/use-deprioritized-initial-focus.d.ts

@@ -31,7 +31,7 @@ export declare function useDeprioritizedInitialFocus({ initialFocus, deprioritiz
     deprioritizedAttributes: string[];
 }): {
     resolvedInitialFocus: boolean | import("react").RefObject<HTMLElement | null> | ((openType: import("@base-ui/utils/useEnhancedClickHandler").InteractionType) => void | boolean | HTMLElement | null) | undefined;
-    popupRef: import("react").RefObject<HTMLDivElement | null>;
+    popupRef: import("react").RefObject<HTMLDivElement>;
 };
 export {};
 //# sourceMappingURL=use-deprioritized-initial-focus.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/ui",
-	"version": "0.14.0",
+	"version": "0.15.0",
 	"description": "Themeable React UI components for the WordPress Design System.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -44,16 +44,16 @@
 	"sideEffects": false,
 	"dependencies": {
 		"@base-ui/react": "^1.4.1",
-		"@wordpress/a11y": "^4.47.0",
-		"@wordpress/compose": "^8.0.0",
-		"@wordpress/element": "^7.0.0",
-		"@wordpress/i18n": "^6.20.0",
-		"@wordpress/icons": "^13.2.0",
-		"@wordpress/keycodes": "^4.47.0",
-		"@wordpress/primitives": "^4.47.0",
-		"@wordpress/private-apis": "^1.47.0",
-		"@wordpress/style-runtime": "^0.3.0",
-		"@wordpress/theme": "^0.14.0",
+		"@wordpress/a11y": "^4.48.0",
+		"@wordpress/compose": "^8.1.0",
+		"@wordpress/element": "^8.0.0",
+		"@wordpress/i18n": "^6.21.0",
+		"@wordpress/icons": "^13.3.0",
+		"@wordpress/keycodes": "^4.48.0",
+		"@wordpress/primitives": "^4.48.0",
+		"@wordpress/private-apis": "^1.48.0",
+		"@wordpress/style-runtime": "^0.4.0",
+		"@wordpress/theme": "^0.15.0",
 		"clsx": "^2.1.1",
 		"tabbable": "^6.4.0"
 	},
@@ -66,11 +66,11 @@
 		"storybook": "^10.2.8"
 	},
 	"peerDependencies": {
-		"react": "^19.2.4",
-		"react-dom": "^19.2.4"
+		"react": "^18.0.0",
+		"react-dom": "^18.0.0"
 	},
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "d653c5fd6161571a0c2ebde28553d6e25624eacc"
+	"gitHead": "e7856693aeb4e2522d13608cd32c994e4a97cb9c"
 }

package/src/utils/create-overlay-title-validation.tsx

@@ -46,7 +46,7 @@ export function createOverlayTitleValidation( componentName: string ) {
 	function ValidationProviderDev( {
 		children,
 	}: OverlayValidationProviderProps ) {
-		const titleElementRef = useRef< HTMLElement >( null );
+		const titleElementRef = useRef< HTMLElement | null >( null );
 
 		const scheduleValidation = useScheduleValidation( () => {
 			const titleElement = titleElementRef.current;

package/src/utils/render-slot-with-children.ts

@@ -27,8 +27,5 @@ export function renderSlotWithChildren(
 	defaultSlot: ReactElement,
 	children: ReactNode
 ): ReactElement {
-	return cloneElement(
-		( slot ?? defaultSlot ) as ReactElement< { children?: ReactNode } >,
-		{ children }
-	);
+	return cloneElement( slot ?? defaultSlot, { children } );
 }