@wordpress/components 25.11.1-next.f8d8eceb.0 → 25.12.0

package/build-types/tabs/index.d.ts

@@ -5,9 +5,9 @@
 import type { TabsProps } from './types';
 declare function Tabs({ selectOnMove, initialTabId, orientation, onSelect, children, selectedTabId, }: TabsProps): JSX.Element;
 declare namespace Tabs {
-    var TabList: import("react").ForwardRefExoticComponent<import("./types").TabListProps & import("react").RefAttributes<HTMLDivElement>>;
-    var Tab: import("react").ForwardRefExoticComponent<import("./types").TabProps & import("react").RefAttributes<HTMLButtonElement>>;
-    var TabPanel: import("react").ForwardRefExoticComponent<import("./types").TabPanelProps & import("react").RefAttributes<HTMLDivElement>>;
+    var TabList: import("react").ForwardRefExoticComponent<import("./types").TabListProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "children" | "as"> & import("react").RefAttributes<HTMLDivElement>>;
+    var Tab: import("react").ForwardRefExoticComponent<import("./types").TabProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, "as" | keyof import("./types").TabProps> & import("react").RefAttributes<HTMLButtonElement>>;
+    var TabPanel: import("react").ForwardRefExoticComponent<import("./types").TabPanelProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "as" | keyof import("./types").TabPanelProps> & import("react").RefAttributes<HTMLDivElement>>;
 }
 export default Tabs;
 //# sourceMappingURL=index.d.ts.map

package/build-types/tabs/stories/index.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/tabs/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,kBAAkB,CAAC;AAQtD;;GAEG;AACH,OAAO,IAAI,MAAM,IAAI,CAAC;AAKtB,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,IAAI,CAQ5B,CAAC;AACF,eAAe,IAAI,CAAC;AAuBpB,eAAO,MAAM,OAAO,6HAAsB,CAAC;AAwB3C,eAAO,MAAM,WAAW,6HAAiC,CAAC;AAqC1D,eAAO,MAAM,uBAAuB,6HAEnC,CAAC;AAEF,eAAO,MAAM,gBAAgB,6HAAsB,CAAC;AA0CpD,eAAO,MAAM,aAAa,6HAAmC,CAAC;AA6D9D,eAAO,MAAM,oBAAoB,6HAAiC,CAAC;AA+DnE,eAAO,MAAM,cAAc,6HAAoC,CAAC;AAqChE,eAAO,MAAM,kBAAkB,6HAAwC,CAAC;AAgCxE,eAAO,MAAM,cAAc,6HAAoC,CAAC"}
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/tabs/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,kBAAkB,CAAC;AAQtD;;GAEG;AACH,OAAO,IAAI,MAAM,IAAI,CAAC;AAKtB,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,IAAI,CAQ5B,CAAC;AACF,eAAe,IAAI,CAAC;AA+BpB,eAAO,MAAM,OAAO,6HAAsB,CAAC;AAwB3C,eAAO,MAAM,WAAW,6HAAiC,CAAC;AAqC1D,eAAO,MAAM,uBAAuB,6HAEnC,CAAC;AAEF,eAAO,MAAM,gBAAgB,6HAAsB,CAAC;AA0CpD,eAAO,MAAM,aAAa,6HAAmC,CAAC;AA6D9D,eAAO,MAAM,oBAAoB,6HAAiC,CAAC;AA+DnE,eAAO,MAAM,cAAc,6HAAoC,CAAC;AAqChE,eAAO,MAAM,kBAAkB,6HAAwC,CAAC;AAgCxE,eAAO,MAAM,cAAc,6HAAoC,CAAC"}

package/build-types/tabs/styles.d.ts

@@ -14,4 +14,14 @@ export declare const Tab: import("@emotion/styled").StyledComponent<Ariakit.TabO
 }, "children" | keyof Ariakit.TabOptions<"button">> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
+export declare const TabPanel: import("@emotion/styled").StyledComponent<Ariakit.TabPanelOptions<"div"> & {
+    [index: `data-${string}`]: unknown;
+    wrapElement?: import("@ariakit/react-core/cjs/utils/types").WrapElement | undefined;
+    children?: import("@ariakit/react-core/cjs/utils/types").Children<any>;
+    render?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("@ariakit/react-core/cjs/utils/types").RenderProp<import("react").HTMLAttributes<any> & import("react").RefAttributes<any>> | undefined;
+} & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "children" | keyof Ariakit.TabPanelOptions<"div">> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
 //# sourceMappingURL=styles.d.ts.map

package/build-types/tabs/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/tabs/styles.ts"],"names":[],"mappings":";AAKA,OAAO,KAAK,OAAO,MAAM,gBAAgB,CAAC;AAS1C,eAAO,MAAM,cAAc;;;yGAO1B,CAAC;AAEF,eAAO,MAAM,GAAG;;;;;;;;;UA+Ef,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/tabs/styles.ts"],"names":[],"mappings":";AAKA,OAAO,KAAK,OAAO,MAAM,gBAAgB,CAAC;AAS1C,eAAO,MAAM,cAAc;;;yGAO1B,CAAC;AAEF,eAAO,MAAM,GAAG;;;;;;;;;UA+Ef,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;UAcpB,CAAC"}

package/build-types/tabs/tab.d.ts

@@ -6,5 +6,5 @@
  * Internal dependencies
  */
 import type { TabProps } from './types';
-export declare const Tab: import("react").ForwardRefExoticComponent<TabProps & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const Tab: import("react").ForwardRefExoticComponent<TabProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>>, "as" | keyof TabProps> & import("react").RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=tab.d.ts.map

package/build-types/tabs/tab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../src/tabs/tab.tsx"],"names":[],"mappings":"AAAA;;GAEG;;AAIH;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAKxC,eAAO,MAAM,GAAG,wGAwBb,CAAC"}
+{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../src/tabs/tab.tsx"],"names":[],"mappings":"AAAA;;GAEG;;AAIH;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAMxC,eAAO,MAAM,GAAG,kUAuBb,CAAC"}

package/build-types/tabs/tablist.d.ts

@@ -3,5 +3,5 @@
  * Internal dependencies
  */
 import type { TabListProps } from './types';
-export declare const TabList: import("react").ForwardRefExoticComponent<TabListProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabList: import("react").ForwardRefExoticComponent<TabListProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "children" | "as"> & import("react").RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=tablist.d.ts.map

package/build-types/tabs/tablist.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tablist.d.ts","sourceRoot":"","sources":["../../src/tabs/tablist.tsx"],"names":[],"mappings":";AAYA;;GAEG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAI5C,eAAO,MAAM,OAAO,yGAoBnB,CAAC"}
+{"version":3,"file":"tablist.d.ts","sourceRoot":"","sources":["../../src/tabs/tablist.tsx"],"names":[],"mappings":";AAYA;;GAEG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAK5C,eAAO,MAAM,OAAO,0SAoBjB,CAAC"}

package/build-types/tabs/tabpanel.d.ts

@@ -1,7 +1,10 @@
+/**
+ * External dependencies
+ */
 /// <reference types="react" />
 /**
  * Internal dependencies
  */
 import type { TabPanelProps } from './types';
-export declare const TabPanel: import("react").ForwardRefExoticComponent<TabPanelProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabPanel: import("react").ForwardRefExoticComponent<TabPanelProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "as" | keyof TabPanelProps> & import("react").RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=tabpanel.d.ts.map

package/build-types/tabs/tabpanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabpanel.d.ts","sourceRoot":"","sources":["../../src/tabs/tabpanel.tsx"],"names":[],"mappings":";AAYA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAK7C,eAAO,MAAM,QAAQ,0GAqBpB,CAAC"}
+{"version":3,"file":"tabpanel.d.ts","sourceRoot":"","sources":["../../src/tabs/tabpanel.tsx"],"names":[],"mappings":"AAAA;;GAEG;;AAQH;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAO7C,eAAO,MAAM,QAAQ,oTAsBlB,CAAC"}

package/build-types/tabs/types.d.ts

@@ -3,10 +3,6 @@
  * External dependencies
  */
 import type * as Ariakit from '@ariakit/react';
-/**
- * Internal dependencies
- */
-import type { IconType } from '../icon';
 export type TabsContextProps = {
     /**
      * The tabStore object returned by Ariakit's `useTabStore` hook.
@@ -71,36 +67,16 @@ export type TabListProps = {
      * The children elements, which should be a series of `Tabs.TabPanel` components.
      */
     children?: React.ReactNode;
-    /**
-     * The class name to apply to the tablist.
-     */
-    className?: string;
-    /**
-     * Custom CSS styles for the rendered tablist.
-     */
-    style?: React.CSSProperties;
 };
 export type TabProps = {
     /**
      * The id of the tab, which is prepended with the `Tabs` instanceId.
      */
     id: string;
-    /**
-     * Custom CSS styles for the tab.
-     */
-    style?: React.CSSProperties;
     /**
      * The children elements, generally the text to display on the tab.
      */
     children?: React.ReactNode;
-    /**
-     * The class name to apply to the tab button.
-     */
-    className?: string;
-    /**
-     * The icon used for the tab button.
-     */
-    icon?: IconType;
     /**
      * Determines if the tab button should be disabled.
      *
@@ -119,16 +95,16 @@ export type TabPanelProps = {
      */
     children?: React.ReactNode;
     /**
-     * A unique identifier for the TabPanel, which is used to generate a unique `id` for the underlying element.
+     * A unique identifier for the tabpanel, which is used to generate a unique `id` for the underlying element.
      */
     id: string;
     /**
-     * The class name to apply to the tabpanel.
-     */
-    className?: string;
-    /**
-     * Custom CSS styles for the rendered `TabPanel` component.
+     * Determines whether or not the tabpanel element should be focusable.
+     * If `false`, pressing the tab key will skip over the tabpanel, and instead
+     * focus on the first focusable element in the panel (if there is one).
+     *
+     * @default true
      */
-    style?: React.CSSProperties;
+    focusable?: boolean;
 };
 //# sourceMappingURL=types.d.ts.map

package/build-types/tabs/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tabs/types.ts"],"names":[],"mappings":";AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,OAAO,MAAM,gBAAgB,CAAC;AAE/C;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,MAAM,gBAAgB,GACzB;IACA;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC;IACxB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;CAClB,GACD,SAAS,CAAC;AAEb,MAAM,MAAM,SAAS,GAAG;IACvB;;;;OAIG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAE,UAAU,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,KAAM,IAAI,CAAC;IAE7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;;;;;;OAQG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC3B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tabs/types.ts"],"names":[],"mappings":";AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,OAAO,MAAM,gBAAgB,CAAC;AAE/C,MAAM,MAAM,gBAAgB,GACzB;IACA;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC;IACxB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;CAClB,GACD,SAAS,CAAC;AAEb,MAAM,MAAM,SAAS,GAAG;IACvB;;;;OAIG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAE,UAAU,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,KAAM,IAAI,CAAC;IAE7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;;;;;;OAQG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC3B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC"}

package/build-types/text-control/index.d.ts

@@ -23,6 +23,7 @@ export declare const TextControl: import("react").ForwardRefExoticComponent<Pick
     onChange: (value: string) => void;
     value: string | number;
     type?: "number" | "search" | "text" | "tel" | "url" | "email" | "password" | undefined;
-} & Omit<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, "className" | "children" | "label" | "help" | "type" | "onChange" | "as" | "value" | "hideLabelFromVision" | "__nextHasNoMarginBottom"> & import("react").RefAttributes<HTMLInputElement>>;
+    __next40pxDefaultSize?: boolean | undefined;
+} & Omit<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, "className" | "children" | "label" | "help" | "type" | "onChange" | "as" | "value" | "__next40pxDefaultSize" | "hideLabelFromVision" | "__nextHasNoMarginBottom"> & import("react").RefAttributes<HTMLInputElement>>;
 export default TextControl;
 //# sourceMappingURL=index.d.ts.map

package/build-types/text-control/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/text-control/index.tsx"],"names":[],"mappings":";AA6DA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,WAAW;;;;0XAAuC,CAAC;AAEhE,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/text-control/index.tsx"],"names":[],"mappings":";AAiEA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,WAAW;;;;;oZAAuC,CAAC;AAEhE,eAAe,WAAW,CAAC"}

package/build-types/text-control/types.d.ts

@@ -17,5 +17,11 @@ export type TextControlProps = Pick<BaseControlProps, 'className' | 'hideLabelFr
      * @default 'text'
      */
     type?: 'email' | 'number' | 'password' | 'tel' | 'text' | 'search' | 'url';
+    /**
+     * Start opting into the larger default height that will become the default size in a future version.
+     *
+     * @default false
+     */
+    __next40pxDefaultSize?: boolean;
 };
 //# sourceMappingURL=types.d.ts.map

package/build-types/text-control/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/text-control/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE9D,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAClC,gBAAgB,EACd,WAAW,GACX,qBAAqB,GACrB,MAAM,GACN,OAAO,GACP,yBAAyB,CAC3B,GAAG;IACH;;OAEG;IACH,QAAQ,EAAE,CAAE,KAAK,EAAE,MAAM,KAAM,IAAI,CAAC;IACpC;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,GAAG,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC;CAC3E,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/text-control/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE9D,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAClC,gBAAgB,EACd,WAAW,GACX,qBAAqB,GACrB,MAAM,GACN,OAAO,GACP,yBAAyB,CAC3B,GAAG;IACH;;OAEG;IACH,QAAQ,EAAE,CAAE,KAAK,EAAE,MAAM,KAAM,IAAI,CAAC;IACpC;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,GAAG,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC3E;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC"}

package/build-types/toggle-group-control/toggle-group-control/component.d.ts

@@ -38,6 +38,7 @@ export declare const ToggleGroupControl: import("../../context").WordPressCompon
     value?: string | number | undefined;
     children: import("react").ReactNode;
     size?: "default" | "__unstable-large" | undefined;
+    __next40pxDefaultSize?: boolean | undefined;
 } & import("react").RefAttributes<any>, false>;
 export default ToggleGroupControl;
 //# sourceMappingURL=component.d.ts.map

package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/toggle-group-control/toggle-group-control/component.tsx"],"names":[],"mappings":";AA2FA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;8CAG9B,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/toggle-group-control/toggle-group-control/component.tsx"],"names":[],"mappings":";AAiGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;8CAG9B,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/build-types/toggle-group-control/toggle-group-control/styles.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import type { ToggleGroupControlProps } from '../types';
-export declare const toggleGroupControl: ({ isBlock, isDeselectable, size, }: Pick<ToggleGroupControlProps, "isBlock" | "isDeselectable"> & {
+export declare const toggleGroupControl: ({ isBlock, isDeselectable, size, __next40pxDefaultSize, }: Pick<ToggleGroupControlProps, "isBlock" | "__next40pxDefaultSize" | "isDeselectable"> & {
     size: NonNullable<ToggleGroupControlProps['size']>;
 }) => import("@emotion/utils").SerializedStyles;
-export declare const toggleGroupControlSize: (size: NonNullable<ToggleGroupControlProps['size']>) => import("@emotion/utils").SerializedStyles;
+export declare const toggleGroupControlSize: (size: NonNullable<ToggleGroupControlProps['size']>, __next40pxDefaultSize: ToggleGroupControlProps['__next40pxDefaultSize']) => import("@emotion/utils").SerializedStyles;
 export declare const block: import("@emotion/utils").SerializedStyles;
 export declare const VisualLabelWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

package/build-types/toggle-group-control/toggle-group-control/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/toggle-group-control/toggle-group-control/styles.ts"],"names":[],"mappings":";AAUA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAC;AAExD,eAAO,MAAM,kBAAkB;UAKxB,YAAa,uBAAuB,CAAE,MAAM,CAAE,CAAE;+CAYtD,CAAC;AAyBF,eAAO,MAAM,sBAAsB,SAC5B,YAAa,uBAAuB,CAAE,MAAM,CAAE,CAAE,8CAUtD,CAAC;AAEF,eAAO,MAAM,KAAK,2CAGjB,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGAG9B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/toggle-group-control/toggle-group-control/styles.ts"],"names":[],"mappings":";AAUA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAC;AAExD,eAAO,MAAM,kBAAkB;UASxB,YAAa,uBAAuB,CAAE,MAAM,CAAE,CAAE;+CAYtD,CAAC;AAyBF,eAAO,MAAM,sBAAsB,SAC5B,YAAa,uBAAuB,CAAE,MAAM,CAAE,CAAE,yBAC/B,uBAAuB,CAAE,uBAAuB,CAAE,8CAczE,CAAC;AAEF,eAAO,MAAM,KAAK,2CAGjB,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGAG9B,CAAC"}

package/build-types/toggle-group-control/types.d.ts

@@ -107,6 +107,12 @@ export type ToggleGroupControlProps = Pick<BaseControlProps, 'help' | '__nextHas
      * @default 'default'
      */
     size?: 'default' | '__unstable-large';
+    /**
+     * Start opting into the larger default height that will become the default size in a future version.
+     *
+     * @default false
+     */
+    __next40pxDefaultSize?: boolean;
 };
 export type ToggleGroupControlContextProps = {
     isDeselectable?: boolean;

package/build-types/toggle-group-control/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/toggle-group-control/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD,MAAM,MAAM,iCAAiC,GAAG;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,iCAAiC,GAAG,IAAI,CACnD,iCAAiC,EACjC,OAAO,CACP,GAAG;IACH;;;OAGG;IACH,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAC/C,iCAAiC,EACjC,OAAO,GAAG,aAAa,CACvB,GAAG;IACH;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC9B;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAE,UAAU,CAAE,CAAC;IACrC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,IAAI,CACzC,gBAAgB,EAChB,MAAM,GAAG,yBAAyB,CAClC,GAAG;IACH;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAE,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,KAAM,IAAI,CAAC;IAC1D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG;IAC5C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,uBAAuB,CAAE,SAAS,CAAE,CAAC;IAC9C,IAAI,EAAE,uBAAuB,CAAE,MAAM,CAAE,CAAC;IACxC,KAAK,EAAE,uBAAuB,CAAE,OAAO,CAAE,CAAC;IAC1C,QAAQ,EAAE,CAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,KAAM,IAAI,CAAC;CAC5D,CAAC;AAEF,MAAM,MAAM,kCAAkC,GAAG,IAAI,CACpD,uBAAuB,EACvB,UAAU,GAAG,iBAAiB,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,CACxE,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/toggle-group-control/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD,MAAM,MAAM,iCAAiC,GAAG;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,iCAAiC,GAAG,IAAI,CACnD,iCAAiC,EACjC,OAAO,CACP,GAAG;IACH;;;OAGG;IACH,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAC/C,iCAAiC,EACjC,OAAO,GAAG,aAAa,CACvB,GAAG;IACH;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC9B;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAE,UAAU,CAAE,CAAC;IACrC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,IAAI,CACzC,gBAAgB,EAChB,MAAM,GAAG,yBAAyB,CAClC,GAAG;IACH;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAE,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,KAAM,IAAI,CAAC;IAC1D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;IACtC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG;IAC5C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,uBAAuB,CAAE,SAAS,CAAE,CAAC;IAC9C,IAAI,EAAE,uBAAuB,CAAE,MAAM,CAAE,CAAC;IACxC,KAAK,EAAE,uBAAuB,CAAE,OAAO,CAAE,CAAC;IAC1C,QAAQ,EAAE,CAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,KAAM,IAAI,CAAC;CAC5D,CAAC;AAEF,MAAM,MAAM,kCAAkC,GAAG,IAAI,CACpD,uBAAuB,EACvB,UAAU,GAAG,iBAAiB,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,CACxE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/components",
-	"version": "25.11.1-next.f8d8eceb.0",
+	"version": "25.12.0",
 	"description": "UI components for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -31,7 +31,6 @@
 	"types": "build-types",
 	"dependencies": {
 		"@ariakit/react": "^0.3.5",
-		"@ariakit/test": "^0.3.0",
 		"@babel/runtime": "^7.16.0",
 		"@emotion/cache": "^11.7.1",
 		"@emotion/css": "^11.7.1",
@@ -44,23 +43,23 @@
 		"@types/gradient-parser": "0.1.3",
 		"@types/highlight-words-core": "1.2.1",
 		"@use-gesture/react": "^10.2.24",
-		"@wordpress/a11y": "^3.44.1-next.f8d8eceb.0",
-		"@wordpress/compose": "^6.21.1-next.f8d8eceb.0",
-		"@wordpress/date": "^4.44.1-next.f8d8eceb.0",
-		"@wordpress/deprecated": "^3.44.1-next.f8d8eceb.0",
-		"@wordpress/dom": "^3.44.1-next.f8d8eceb.0",
-		"@wordpress/element": "^5.21.1-next.f8d8eceb.0",
-		"@wordpress/escape-html": "^2.44.1-next.f8d8eceb.0",
-		"@wordpress/hooks": "^3.44.1-next.f8d8eceb.0",
-		"@wordpress/html-entities": "^3.44.1-next.f8d8eceb.0",
-		"@wordpress/i18n": "^4.44.1-next.f8d8eceb.0",
-		"@wordpress/icons": "^9.35.1-next.f8d8eceb.0",
-		"@wordpress/is-shallow-equal": "^4.44.1-next.f8d8eceb.0",
-		"@wordpress/keycodes": "^3.44.1-next.f8d8eceb.0",
-		"@wordpress/primitives": "^3.42.1-next.f8d8eceb.0",
-		"@wordpress/private-apis": "^0.26.1-next.f8d8eceb.0",
-		"@wordpress/rich-text": "^6.21.1-next.f8d8eceb.0",
-		"@wordpress/warning": "^2.44.1-next.f8d8eceb.0",
+		"@wordpress/a11y": "^3.46.0",
+		"@wordpress/compose": "^6.23.0",
+		"@wordpress/date": "^4.46.0",
+		"@wordpress/deprecated": "^3.46.0",
+		"@wordpress/dom": "^3.46.0",
+		"@wordpress/element": "^5.23.0",
+		"@wordpress/escape-html": "^2.46.0",
+		"@wordpress/hooks": "^3.46.0",
+		"@wordpress/html-entities": "^3.46.0",
+		"@wordpress/i18n": "^4.46.0",
+		"@wordpress/icons": "^9.37.0",
+		"@wordpress/is-shallow-equal": "^4.46.0",
+		"@wordpress/keycodes": "^3.46.0",
+		"@wordpress/primitives": "^3.44.0",
+		"@wordpress/private-apis": "^0.28.0",
+		"@wordpress/rich-text": "^6.23.0",
+		"@wordpress/warning": "^2.46.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -90,5 +89,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "8d8fd197e202b8104ffb1cb83048efd0a6c3faf4"
+	"gitHead": "839018ff6029ba749780e288e08ff9cd898e50e8"
 }

package/src/disclosure/index.tsx

@@ -0,0 +1,44 @@
+/**
+ * External dependencies
+ */
+// eslint-disable-next-line no-restricted-imports
+import * as Ariakit from '@ariakit/react';
+
+/**
+ * WordPress dependencies
+ */
+import { forwardRef } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import type { DisclosureContentProps } from './types';
+import type { WordPressComponentProps } from '../context';
+
+/**
+ * Accessible Disclosure component that controls visibility of a section of
+ * content. It follows the WAI-ARIA Disclosure Pattern.
+ */
+const UnforwardedDisclosureContent = (
+	{
+		visible,
+		children,
+		...props
+	}: WordPressComponentProps< DisclosureContentProps, 'div', false >,
+	ref: React.ForwardedRef< any >
+) => {
+	const disclosure = Ariakit.useDisclosureStore( { open: visible } );
+
+	return (
+		<Ariakit.DisclosureContent
+			store={ disclosure }
+			ref={ ref }
+			{ ...props }
+		>
+			{ children }
+		</Ariakit.DisclosureContent>
+	);
+};
+
+export const DisclosureContent = forwardRef( UnforwardedDisclosureContent );
+export default DisclosureContent;

package/src/disclosure/types.tsx

@@ -0,0 +1,10 @@
+export type DisclosureContentProps = {
+	/**
+	 * If set to `true` the content will be shown, otherwise it's hidden.
+	 */
+	visible?: boolean;
+	/**
+	 * The content to display within the component.
+	 */
+	children: React.ReactNode;
+};

package/src/divider/component.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 // eslint-disable-next-line no-restricted-imports
-import { Separator } from 'reakit';
+import * as Ariakit from '@ariakit/react';
 import type { ForwardedRef } from 'react';
 
 /**
@@ -20,8 +20,8 @@ function UnconnectedDivider(
 	const contextProps = useContextSystem( props, 'Divider' );
 
 	return (
-		<Separator
-			as={ DividerView }
+		<Ariakit.Separator
+			render={ <DividerView /> }
 			{ ...contextProps }
 			ref={ forwardedRef }
 		/>

package/src/divider/stories/index.story.tsx

@@ -23,6 +23,14 @@ const meta: Meta< typeof Divider > = {
 		marginEnd: {
 			control: { type: 'text' },
 		},
+		wrapElement: {
+			control: { type: null },
+		},
+		ref: {
+			table: {
+				disable: true,
+			},
+		},
 	},
 	parameters: {
 		controls: { expanded: true },

package/src/divider/types.ts

@@ -2,7 +2,7 @@
  * External dependencies
  */
 // eslint-disable-next-line no-restricted-imports
-import type { SeparatorProps } from 'reakit';
+import type { SeparatorProps } from '@ariakit/react';
 
 /**
  * Internal dependencies
@@ -11,7 +11,7 @@ import type { SpaceInput } from '../utils/space';
 
 export type DividerProps = Omit<
 	SeparatorProps,
-	'children' | 'unstable_system' | 'orientation'
+	'children' | 'unstable_system' | 'orientation' | 'as' | 'render'
 > & {
 	/**
 	 * Adjusts all margins on the inline dimension.

package/src/dropdown-menu/style.scss

@@ -1,3 +1,7 @@
+.components-dropdown-menu__toggle {
+	vertical-align: top;
+}
+
 .components-dropdown-menu__menu {
 	width: 100%;
 	font-family: $default-font;

package/src/dropdown-menu-v2-ariakit/README.md

@@ -113,13 +113,6 @@ The skidding of the popover along the anchor element. Can be set to negative val
 - Required: no
 - Default: `0` for root-level menus, `-8` for nested menus
 
-##### `hideOnEscape`: `boolean | ( ( event: KeyboardEvent | React.KeyboardEvent< Element > ) => boolean )`
-
-Determines whether the menu popover will be hidden when the user presses the Escape key.
-
-- Required: no
-- Default: `true`
-
 ### `DropdownMenuItem`
 
 Used to render a menu item.

package/src/dropdown-menu-v2-ariakit/index.tsx

@@ -14,6 +14,7 @@ import {
 	useMemo,
 	cloneElement,
 	isValidElement,
+	useCallback,
 } from '@wordpress/element';
 import { isRTL } from '@wordpress/i18n';
 import { check, chevronRightSmall } from '@wordpress/icons';
@@ -99,6 +100,12 @@ export const DropdownMenuCheckboxItem = forwardRef<
 	);
 } );
 
+const radioCheck = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Circle cx={ 12 } cy={ 12 } r={ 3 }></Circle>
+	</SVG>
+);
+
 export const DropdownMenuRadioItem = forwardRef<
 	HTMLDivElement,
 	WordPressComponentProps< DropdownMenuRadioItemProps, 'div', false >
@@ -119,14 +126,7 @@ export const DropdownMenuRadioItem = forwardRef<
 				store={ dropdownMenuContext?.store }
 				render={ <Styled.ItemPrefixWrapper /> }
 			>
-				<SVG viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-					<Circle
-						cx={ 12 }
-						cy={ 12 }
-						r={ 3 }
-						fill="currentColor"
-					></Circle>
-				</SVG>
+				<Icon icon={ radioCheck } size={ 24 } />
 			</Ariakit.MenuItemCheck>
 			{ children }
 			{ suffix }
@@ -181,7 +181,6 @@ const UnconnectedDropdownMenu = (
 		children,
 		shift,
 		modal = true,
-		hideOnEscape = true,
 
 		// From internal components context
 		variant,
@@ -249,6 +248,28 @@ const UnconnectedDropdownMenu = (
 		);
 	}
 
+	const hideOnEscape = useCallback(
+		( event: React.KeyboardEvent< Element > ) => {
+			// Pressing Escape can cause unexpected consequences (ie. exiting
+			// full screen mode on MacOs, close parent modals...).
+			event.preventDefault();
+			// Returning `true` causes the menu to hide.
+			return true;
+		},
+		[]
+	);
+
+	const wrapperProps = useMemo(
+		() => ( {
+			dir: computedDirection,
+			style: {
+				direction:
+					computedDirection as React.CSSProperties[ 'direction' ],
+			},
+		} ),
+		[ computedDirection ]
+	);
+
 	return (
 		<>
 			{ /* Menu trigger */ }
@@ -281,12 +302,7 @@ const UnconnectedDropdownMenu = (
 				hideOnHoverOutside={ false }
 				data-side={ appliedPlacementSide }
 				variant={ variant }
-				wrapperProps={ {
-					dir: computedDirection,
-					style: {
-						direction: computedDirection,
-					},
-				} }
+				wrapperProps={ wrapperProps }
 				hideOnEscape={ hideOnEscape }
 				unmountOnHide
 			>

package/src/dropdown-menu-v2-ariakit/stories/index.story.tsx

@@ -40,6 +40,7 @@ const meta: Meta< typeof DropdownMenu > = {
 	},
 	argTypes: {
 		children: { control: { type: null } },
+		trigger: { control: { type: null } },
 	},
 	parameters: {
 		actions: { argTypesRegex: '^on.*' },
@@ -494,10 +495,6 @@ export const InsideModal: StoryFn< typeof DropdownMenu > = ( props ) => {
 };
 InsideModal.args = {
 	...Default.args,
-	hideOnEscape: ( e ) => {
-		e.stopPropagation();
-		return true;
-	},
 };
 InsideModal.parameters = {
 	docs: {

package/src/dropdown-menu-v2-ariakit/test/index.tsx

@@ -197,32 +197,6 @@ describe( 'DropdownMenu', () => {
 			);
 		} );
 
-		it( 'should not close when pressing the escape key if the `hideOnEscape` prop is set to `false`', async () => {
-			render(
-				<DropdownMenu
-					trigger={ <button>Open dropdown</button> }
-					hideOnEscape={ false }
-				>
-					<DropdownMenuItem>Dropdown menu item</DropdownMenuItem>
-				</DropdownMenu>
-			);
-
-			const trigger = screen.getByRole( 'button', {
-				name: 'Open dropdown',
-			} );
-
-			await click( trigger );
-
-			// Focuses menu on mouse click, focuses first item on keyboard press
-			// Can be changed with a custom useEffect
-			expect( screen.getByRole( 'menu' ) ).toHaveFocus();
-
-			// Pressing esc will close the menu and move focus to the toggle
-			await press.Escape();
-
-			expect( screen.getByRole( 'menu' ) ).toHaveFocus();
-		} );
-
 		it( 'should close when clicking outside of the content', async () => {
 			render(
 				<DropdownMenu

package/src/dropdown-menu-v2-ariakit/types.ts

@@ -72,7 +72,7 @@ export interface DropdownMenuProps {
 	 * Determines whether the menu popover will be hidden when the user presses
 	 * the Escape key.
 	 *
-	 * @default true
+	 * @default `( event ) => { event.preventDefault(); return true; }`
 	 */
 	hideOnEscape?:
 		| boolean

package/src/gradient-picker/index.tsx

@@ -257,7 +257,7 @@ export function GradientPicker( {
 						onChange={ onChange }
 					/>
 				) }
-				{ ( gradients.length || clearable ) && (
+				{ ( gradients.length > 0 || clearable ) && (
 					<Component
 						{ ...additionalProps }
 						className={ className }

package/src/index.native.js

@@ -141,4 +141,5 @@ export {
 	getGlobalStyles,
 	getColorsAndGradients,
 	useMobileGlobalStylesColors,
+	useEditorColorScheme,
 } from './mobile/global-styles-context/utils';