@wordpress/components 23.0.0 → 23.2.0

package/build-types/resizable-box/index.d.ts

@@ -1,12 +1,11 @@
 import { Resizable } from 're-resizable';
 import type { ResizableProps } from 're-resizable';
 import type { ReactNode } from 'react';
-declare const _default: import("react").ForwardRefExoticComponent<ResizableProps & {
-    className: string;
+export declare const ResizableBox: import("react").ForwardRefExoticComponent<ResizableProps & {
     children: ReactNode;
-    showHandle: boolean;
-    __experimentalShowTooltip: boolean;
-    __experimentalTooltipProps: Pick<{
+    showHandle?: boolean | undefined;
+    __experimentalShowTooltip?: boolean | undefined;
+    __experimentalTooltipProps?: (Pick<{
         theme?: import("@emotion/react").Theme | undefined;
         as?: import("react").ElementType<any> | undefined;
     } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
@@ -23,7 +22,7 @@ declare const _default: import("react").ForwardRefExoticComponent<ResizableProps
         position?: import("./resize-tooltip/utils").Position | undefined;
         showPx?: boolean | undefined;
         zIndex?: number | undefined;
-    }, "position" | "zIndex" | "key" | "as" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme" | "axis" | "isVisible" | "fadeTimeout" | "onResize" | "showPx" | "labelRef"> & import("react").RefAttributes<HTMLDivElement>;
+    }, "position" | "zIndex" | "key" | "as" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme" | "axis" | "isVisible" | "fadeTimeout" | "onResize" | "showPx" | "labelRef"> & import("react").RefAttributes<HTMLDivElement>) | undefined;
 } & import("react").RefAttributes<Resizable>>;
-export default _default;
+export default ResizableBox;
 //# sourceMappingURL=index.d.ts.map

package/build-types/resizable-box/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/resizable-box/index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAgB,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;AAmHrD,wBAA0C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/resizable-box/index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAgB,MAAM,OAAO,CAAC;AAkHrD,eAAO,MAAM,YAAY;cAnCd,SAAS;;;;;;;;;;;;;;;;;;;;;6CAmC6C,CAAC;AAElE,eAAe,YAAY,CAAC"}

package/build-types/resizable-box/stories/index.d.ts

@@ -0,0 +1,61 @@
+/// <reference types="react" />
+/**
+ * External dependencies
+ */
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+/**
+ * Internal dependencies
+ */
+import ResizableBox from '..';
+declare const meta: ComponentMeta<typeof ResizableBox>;
+export default meta;
+export declare const Default: ComponentStory<import("react").ForwardRefExoticComponent<import("re-resizable").ResizableProps & {
+    children: import("react").ReactNode;
+    showHandle?: boolean | undefined;
+    __experimentalShowTooltip?: boolean | undefined;
+    __experimentalTooltipProps?: (Pick<{
+        theme?: import("@emotion/react").Theme | undefined;
+        as?: import("react").ElementType<any> | undefined;
+    } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+        'aria-hidden'?: boolean | undefined;
+        axis?: import("../resize-tooltip/utils").Axis | undefined;
+        className?: string | undefined;
+        fadeTimeout?: number | undefined;
+        isVisible?: boolean | undefined;
+        labelRef?: import("react").Ref<HTMLDivElement> | undefined;
+        onResize?: ((data: {
+            width: number | null;
+            height: number | null;
+        }) => void) | undefined;
+        position?: import("../resize-tooltip/utils").Position | undefined;
+        showPx?: boolean | undefined;
+        zIndex?: number | undefined;
+    }, "position" | "zIndex" | "key" | "as" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme" | "axis" | "isVisible" | "fadeTimeout" | "onResize" | "showPx" | "labelRef"> & import("react").RefAttributes<HTMLDivElement>) | undefined;
+} & import("react").RefAttributes<import("re-resizable").Resizable>>>;
+/**
+ * The `enable` prop can be used to disable resizing in specific directions.
+ */
+export declare const DisabledDirections: ComponentStory<import("react").ForwardRefExoticComponent<import("re-resizable").ResizableProps & {
+    children: import("react").ReactNode;
+    showHandle?: boolean | undefined;
+    __experimentalShowTooltip?: boolean | undefined;
+    __experimentalTooltipProps?: (Pick<{
+        theme?: import("@emotion/react").Theme | undefined;
+        as?: import("react").ElementType<any> | undefined;
+    } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+        'aria-hidden'?: boolean | undefined;
+        axis?: import("../resize-tooltip/utils").Axis | undefined;
+        className?: string | undefined;
+        fadeTimeout?: number | undefined;
+        isVisible?: boolean | undefined;
+        labelRef?: import("react").Ref<HTMLDivElement> | undefined;
+        onResize?: ((data: {
+            width: number | null;
+            height: number | null;
+        }) => void) | undefined;
+        position?: import("../resize-tooltip/utils").Position | undefined;
+        showPx?: boolean | undefined;
+        zIndex?: number | undefined;
+    }, "position" | "zIndex" | "key" | "as" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme" | "axis" | "isVisible" | "fadeTimeout" | "onResize" | "showPx" | "labelRef"> & import("react").RefAttributes<HTMLDivElement>) | undefined;
+} & import("react").RefAttributes<import("re-resizable").Resizable>>>;
+//# sourceMappingURL=index.d.ts.map

package/build-types/resizable-box/stories/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/resizable-box/stories/index.tsx"],"names":[],"mappings":";AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE;;GAEG;AACH,OAAO,YAAY,MAAM,IAAI,CAAC;AAO9B,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,YAAY,CAY7C,CAAC;AACF,eAAe,IAAI,CAAC;AA6BpB,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;qEAAsB,CAAC;AAkB3C;;GAEG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;qEAAsB,CAAC"}

package/build-types/responsive-wrapper/index.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+/**
+ * Internal dependencies
+ */
+import type { ResponsiveWrapperProps } from './types';
+/**
+ * A wrapper component that maintains its aspect ratio when resized.
+ *
+ * ```jsx
+ * import { ResponsiveWrapper } from '@wordpress/components';
+ *
+ * const MyResponsiveWrapper = () => (
+ * 	<ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>
+ * 		<img
+ * 			src="https://s.w.org/style/images/about/WordPress-logotype-standard.png"
+ * 			alt="WordPress"
+ * 		/>
+ * 	</ResponsiveWrapper>
+ * );
+ * ```
+ */
+declare function ResponsiveWrapper({ naturalWidth, naturalHeight, children, isInline, }: ResponsiveWrapperProps): JSX.Element | null;
+export default ResponsiveWrapper;
+//# sourceMappingURL=index.d.ts.map

package/build-types/responsive-wrapper/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/responsive-wrapper/index.tsx"],"names":[],"mappings":";AAWA;;GAEG;AACH,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAEtD;;;;;;;;;;;;;;;GAeG;AACH,iBAAS,iBAAiB,CAAE,EAC3B,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,QAAgB,GAChB,EAAE,sBAAsB,sBAyBxB;AAED,eAAe,iBAAiB,CAAC"}

package/build-types/responsive-wrapper/stories/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * External dependencies
+ */
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+/**
+ * Internal dependencies
+ */
+import ResponsiveWrapper from '..';
+declare const meta: ComponentMeta<typeof ResponsiveWrapper>;
+export default meta;
+export declare const Default: ComponentStory<typeof ResponsiveWrapper>;
+//# sourceMappingURL=index.d.ts.map

package/build-types/responsive-wrapper/stories/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/responsive-wrapper/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE;;GAEG;AACH,OAAO,iBAAiB,MAAM,IAAI,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,iBAAiB,CAUlD,CAAC;AACF,eAAe,IAAI,CAAC;AAMpB,eAAO,MAAM,OAAO,0CAAsB,CAAC"}

package/build-types/responsive-wrapper/types.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+export declare type ResponsiveWrapperProps = {
+    /**
+     * The intrinsic width of the element to wrap. Will be used to determine the aspect ratio.
+     */
+    naturalWidth: number;
+    /**
+     * The intrinsic height of the element to wrap. Will be used to determine the aspect ratio.
+     */
+    naturalHeight: number;
+    /**
+     * The element to wrap.
+     */
+    children: React.ReactElement;
+    /**
+     * If true, the wrapper will be `span` instead of `div`.
+     *
+     * @default false
+     */
+    isInline?: boolean;
+};
+//# sourceMappingURL=types.d.ts.map

package/build-types/responsive-wrapper/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/responsive-wrapper/types.ts"],"names":[],"mappings":";AAAA,oBAAY,sBAAsB,GAAG;IACpC;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IAC7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}

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

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+/**
+ * Internal dependencies
+ */
+import type { SandBoxProps } from './types';
+/**
+ * This component provides an isolated environment for arbitrary HTML via iframes.
+ *
+ * ```jsx
+ * import { SandBox } from '@wordpress/components';
+ *
+ * const MySandBox = () => (
+ * 	<SandBox html="<p>Content</p>" title="SandBox" type="embed" />
+ * );
+ * ```
+ */
+declare function SandBox({ html, title, type, styles, scripts, onFocus, }: SandBoxProps): JSX.Element;
+export default SandBox;
+//# sourceMappingURL=index.d.ts.map

package/build-types/sandbox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/sandbox/index.tsx"],"names":[],"mappings":";AAWA;;GAEG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAoG5C;;;;;;;;;;GAUG;AACH,iBAAS,OAAO,CAAE,EACjB,IAAS,EACT,KAAU,EACV,IAAI,EACJ,MAAW,EACX,OAAY,EACZ,OAAO,GACP,EAAE,YAAY,eA4Jd;AAED,eAAe,OAAO,CAAC"}

package/build-types/sandbox/stories/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * External dependencies
+ */
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+/**
+ * Internal dependencies
+ */
+import SandBox from '..';
+declare const meta: ComponentMeta<typeof SandBox>;
+export default meta;
+export declare const Default: ComponentStory<typeof SandBox>;
+//# sourceMappingURL=index.d.ts.map

package/build-types/sandbox/stories/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/sandbox/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE;;GAEG;AACH,OAAO,OAAO,MAAM,IAAI,CAAC;AAEzB,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,OAAO,CAWxC,CAAC;AACF,eAAe,IAAI,CAAC;AAMpB,eAAO,MAAM,OAAO,gCAAsB,CAAC"}

package/build-types/sandbox/test/index.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.d.ts.map

package/build-types/sandbox/test/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/sandbox/test/index.tsx"],"names":[],"mappings":""}

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

@@ -0,0 +1,36 @@
+/// <reference types="react" />
+export declare type SandBoxProps = {
+    /**
+     * The HTML to render in the body of the iframe document.
+     *
+     * @default ''
+     */
+    html?: string;
+    /**
+     * The `<title>` of the iframe document.
+     *
+     * @default ''
+     */
+    title?: string;
+    /**
+     * The CSS class name to apply to the `<html>` and `<body>` elements of the iframe.
+     */
+    type?: string;
+    /**
+     * An array of CSS strings to inject into the `<head>` of the iframe document.
+     *
+     * @default []
+     */
+    styles?: string[];
+    /**
+     * An array of script URLs to inject as `<script>` tags into the bottom of the `<body>` of the iframe document.
+     *
+     * @default []
+     */
+    scripts?: string[];
+    /**
+     * The `onFocus` callback for the iframe.
+     */
+    onFocus?: React.DOMAttributes<HTMLIFrameElement>['onFocus'];
+};
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/sandbox/types.ts"],"names":[],"mappings":";AAAA,oBAAY,YAAY,GAAG;IAC1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAE,iBAAiB,CAAE,CAAE,SAAS,CAAE,CAAC;CAChE,CAAC"}

package/build-types/tab-panel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tab-panel/index.tsx"],"names":[],"mappings":";AAiBA,OAAO,KAAK,EAAkB,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAqB7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,QAAQ,CAAE,EACzB,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,YAAmB,EACnB,cAAc,EACd,WAA0B,EAC1B,WAAyB,EACzB,QAAQ,GACR,EAAE,uBAAuB,CAAE,aAAa,EAAE,KAAK,EAAE,KAAK,CAAE,eA0ExD;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tab-panel/index.tsx"],"names":[],"mappings":";AAgBA,OAAO,KAAK,EAAkB,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAoB7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,QAAQ,CAAE,EACzB,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,YAAmB,EACnB,cAAc,EACd,WAA0B,EAC1B,WAAyB,EACzB,QAAQ,GACR,EAAE,uBAAuB,CAAE,aAAa,EAAE,KAAK,EAAE,KAAK,CAAE,eAyFxD;AAED,eAAe,QAAQ,CAAC"}

package/build-types/tab-panel/stories/index.d.ts

@@ -9,4 +9,5 @@ import TabPanel from '..';
 declare const meta: ComponentMeta<typeof TabPanel>;
 export default meta;
 export declare const Default: ComponentStory<typeof TabPanel>;
+export declare const DisabledTab: ComponentStory<typeof TabPanel>;
 //# sourceMappingURL=index.d.ts.map

package/build-types/tab-panel/stories/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tab-panel/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE;;GAEG;AACH,OAAO,QAAQ,MAAM,IAAI,CAAC;AAE1B,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,QAAQ,CAMzC,CAAC;AACF,eAAe,IAAI,CAAC;AAMpB,eAAO,MAAM,OAAO,iCAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tab-panel/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE;;GAEG;AACH,OAAO,QAAQ,MAAM,IAAI,CAAC;AAE1B,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,QAAQ,CAMzC,CAAC;AACF,eAAe,IAAI,CAAC;AAMpB,eAAO,MAAM,OAAO,iCAAsB,CAAC;AAe3C,eAAO,MAAM,WAAW,iCAAsB,CAAC"}

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

@@ -6,7 +6,7 @@ import type { ReactNode } from 'react';
  * Internal dependencies
  */
 import type { IconType } from '../icon';
-declare type Tab = {
+declare type Tab<IconProps = unknown> = {
     /**
      * The key of the tab.
      */
@@ -19,17 +19,23 @@ declare type Tab = {
      * The class name to apply to the tab button.
      */
     className?: string;
+    /**
+     * The icon used for the tab button.
+     */
+    icon?: IconType<IconProps>;
+    /**
+     * Determines if the tab button should be disabled.
+     */
+    disabled?: boolean;
 } & Record<any, any>;
 export declare type TabButtonProps<IconProps = unknown> = {
     children: ReactNode;
-    className?: string;
-    icon?: IconType<IconProps>;
     label?: string;
     onClick: (event: MouseEvent) => void;
     selected: boolean;
     showTooltip?: boolean;
     tabId: string;
-};
+} & Pick<Tab<IconProps>, 'className' | 'icon' | 'disabled'>;
 export declare type TabPanelProps = {
     /**
      * The class name to add to the active tab.

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tab-panel/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,aAAK,GAAG,GAAG;IACV;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,MAAM,CAAE,GAAG,EAAE,GAAG,CAAE,CAAC;AAEvB,oBAAY,cAAc,CAAE,SAAS,GAAG,OAAO,IAAK;IACnD,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAE,SAAS,CAAE,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,CAAE,KAAK,EAAE,UAAU,KAAM,IAAI,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,oBAAY,aAAa,GAAG;IAC3B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,QAAQ,EAAE,CAAE,GAAG,EAAE,GAAG,KAAM,SAAS,CAAC;IACpC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAE,OAAO,EAAE,MAAM,KAAM,IAAI,CAAC;IACvC;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;OAEG;IACH,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tab-panel/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,aAAK,GAAG,CAAE,SAAS,GAAG,OAAO,IAAK;IACjC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAE,SAAS,CAAE,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,MAAM,CAAE,GAAG,EAAE,GAAG,CAAE,CAAC;AAEvB,oBAAY,cAAc,CAAE,SAAS,GAAG,OAAO,IAAK;IACnD,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,CAAE,KAAK,EAAE,UAAU,KAAM,IAAI,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;CACd,GAAG,IAAI,CAAE,GAAG,CAAE,SAAS,CAAE,EAAE,WAAW,GAAG,MAAM,GAAG,UAAU,CAAE,CAAC;AAEhE,oBAAY,aAAa,GAAG;IAC3B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,QAAQ,EAAE,CAAE,GAAG,EAAE,GAAG,KAAM,SAAS,CAAC;IACpC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAE,OAAO,EAAE,MAAM,KAAM,IAAI,CAAC;IACvC;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;OAEG;IACH,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/components",
-	"version": "23.0.0",
+	"version": "23.2.0",
 	"description": "UI components for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -38,21 +38,21 @@
 		"@emotion/utils": "^1.0.0",
 		"@floating-ui/react-dom": "^1.0.0",
 		"@use-gesture/react": "^10.2.6",
-		"@wordpress/a11y": "^3.23.0",
-		"@wordpress/compose": "^6.0.0",
-		"@wordpress/date": "^4.23.0",
-		"@wordpress/deprecated": "^3.23.0",
-		"@wordpress/dom": "^3.23.0",
-		"@wordpress/element": "^5.0.0",
-		"@wordpress/escape-html": "^2.23.0",
-		"@wordpress/hooks": "^3.23.0",
-		"@wordpress/i18n": "^4.23.0",
-		"@wordpress/icons": "^9.14.0",
-		"@wordpress/is-shallow-equal": "^4.23.0",
-		"@wordpress/keycodes": "^3.23.0",
-		"@wordpress/primitives": "^3.21.0",
-		"@wordpress/rich-text": "^6.0.0",
-		"@wordpress/warning": "^2.23.0",
+		"@wordpress/a11y": "^3.25.0",
+		"@wordpress/compose": "^6.2.0",
+		"@wordpress/date": "^4.25.0",
+		"@wordpress/deprecated": "^3.25.0",
+		"@wordpress/dom": "^3.25.0",
+		"@wordpress/element": "^5.2.0",
+		"@wordpress/escape-html": "^2.25.0",
+		"@wordpress/hooks": "^3.25.0",
+		"@wordpress/i18n": "^4.25.0",
+		"@wordpress/icons": "^9.16.0",
+		"@wordpress/is-shallow-equal": "^4.25.0",
+		"@wordpress/keycodes": "^3.25.0",
+		"@wordpress/primitives": "^3.23.0",
+		"@wordpress/rich-text": "^6.2.0",
+		"@wordpress/warning": "^2.25.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -80,5 +80,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "1eb65aabe6738097f4c062e78f69ae8f05879848"
+	"gitHead": "204c880ff65295768e9695dfee6c7a9fee1fdd05"
 }

package/src/autocomplete/index.js

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { find } from 'lodash';
 import removeAccents from 'remove-accents';
 
 /**
@@ -290,8 +289,7 @@ function useAutocomplete( {
 		const textAfterSelection = getTextContent(
 			slice( record, undefined, getTextContent( record ).length )
 		);
-		const completer = find(
-			completers,
+		const completer = completers?.find(
 			( { triggerPrefix, allowContext } ) => {
 				const index = text.lastIndexOf( triggerPrefix );
 

package/src/autocomplete/test/index.js

@@ -14,6 +14,8 @@ import { useRef } from '@wordpress/element';
  */
 import { getAutoCompleterUI } from '../autocompleter-ui';
 
+jest.useFakeTimers();
+
 describe( 'AutocompleterUI', () => {
 	describe( 'click outside behavior', () => {
 		it( 'should call reset function when a click on another element occurs', async () => {

package/src/base-control/test/index.tsx

@@ -46,6 +46,7 @@ describe( 'BaseControl', () => {
 
 		expect( textarea ).toHaveAttribute( 'aria-details' );
 		expect(
+			// eslint-disable-next-line testing-library/no-node-access
 			help.closest( `#${ textarea.getAttribute( 'aria-details' ) }` )
 		).toBeVisible();
 	} );

package/src/border-box-control/border-box-control/component.tsx

@@ -62,7 +62,6 @@ const UnconnectedBorderBoxControl = (
 		splitValue,
 		toggleLinked,
 		wrapperClassName,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 		...otherProps
 	} = useBorderBoxControl( props );
@@ -116,9 +115,6 @@ const UnconnectedBorderBoxControl = (
 						width={
 							size === '__unstable-large' ? '116px' : '110px'
 						}
-						__experimentalHasMultipleOrigins={
-							__experimentalHasMultipleOrigins
-						}
 						__experimentalIsRenderedInSidebar={
 							__experimentalIsRenderedInSidebar
 						}
@@ -134,9 +130,6 @@ const UnconnectedBorderBoxControl = (
 						popoverPlacement={ popoverPlacement }
 						popoverOffset={ popoverOffset }
 						value={ splitValue }
-						__experimentalHasMultipleOrigins={
-							__experimentalHasMultipleOrigins
-						}
 						__experimentalIsRenderedInSidebar={
 							__experimentalIsRenderedInSidebar
 						}

package/src/border-box-control/border-box-control/hook.ts

@@ -33,7 +33,6 @@ export function useBorderBoxControl(
 		enableStyle = true,
 		size = 'default',
 		value,
-		__experimentalHasMultipleOrigins = false,
 		__experimentalIsRenderedInSidebar = false,
 		...otherProps
 	} = useContextSystem( props, 'BorderBoxControl' );
@@ -136,7 +135,6 @@ export function useBorderBoxControl(
 		size,
 		splitValue,
 		wrapperClassName,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 	};
 }

package/src/border-box-control/border-box-control-split-controls/component.tsx

@@ -33,7 +33,6 @@ const BorderBoxControlSplitControls = (
 		rightAlignedClassName,
 		size = 'default',
 		value,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 		...otherProps
 	} = useBorderBoxControlSplitControls( props );
@@ -65,7 +64,6 @@ const BorderBoxControlSplitControls = (
 		enableAlpha,
 		enableStyle,
 		isCompact: true,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 		size,
 	};

package/src/border-box-control/border-box-control-split-controls/hook.ts

@@ -21,7 +21,6 @@ export function useBorderBoxControlSplitControls(
 		enableAlpha = false,
 		enableStyle = true,
 		size = 'default',
-		__experimentalHasMultipleOrigins = false,
 		__experimentalIsRenderedInSidebar = false,
 		...otherProps
 	} = useContextSystem( props, 'BorderBoxControlSplitControls' );
@@ -49,7 +48,6 @@ export function useBorderBoxControlSplitControls(
 		enableStyle,
 		rightAlignedClassName,
 		size,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 	};
 }

package/src/border-box-control/test/index.js

@@ -10,6 +10,8 @@ import { act } from 'react-test-renderer';
  */
 import { BorderBoxControl } from '../';
 
+jest.useFakeTimers();
+
 const colors = [
 	{ name: 'Gray', color: '#f6f7f7' },
 	{ name: 'Blue', color: '#72aee6' },

package/src/border-control/border-control/component.tsx

@@ -59,7 +59,6 @@ const UnconnectedBorderControl = (
 		widthUnit,
 		widthValue,
 		withSlider,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 		...otherProps
 	} = useBorderControl( props );
@@ -83,9 +82,6 @@ const UnconnectedBorderControl = (
 							onChange={ onBorderChange }
 							previousStyleSelection={ previousStyleSelection }
 							showDropdownHeader={ showDropdownHeader }
-							__experimentalHasMultipleOrigins={
-								__experimentalHasMultipleOrigins
-							}
 							__experimentalIsRenderedInSidebar={
 								__experimentalIsRenderedInSidebar
 							}

package/src/border-control/border-control/hook.ts

@@ -39,7 +39,6 @@ export function useBorderControl(
 		size = 'default',
 		value: border,
 		width,
-		__experimentalHasMultipleOrigins = false,
 		__experimentalIsRenderedInSidebar = false,
 		...otherProps
 	} = useContextSystem( props, 'BorderControl' );
@@ -156,7 +155,6 @@ export function useBorderControl(
 		widthUnit,
 		widthValue,
 		size,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 	};
 }

package/src/border-control/border-control-dropdown/component.tsx

@@ -25,19 +25,18 @@ import { StyledLabel } from '../../base-control/styles/base-control-styles';
 import DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';
 
 import type { ColorObject, PaletteObject } from '../../color-palette/types';
+import type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';
 import type { ColorProps, DropdownProps } from '../types';
 
-const noop = () => undefined;
 const getColorObject = (
 	colorValue: CSSProperties[ 'borderColor' ],
-	colors: ColorProps[ 'colors' ] | undefined,
-	hasMultipleColorOrigins: boolean
+	colors: ColorProps[ 'colors' ] | undefined
 ) => {
-	if ( ! colorValue || ! colors ) {
+	if ( ! colorValue || ! colors || colors.length === 0 ) {
 		return;
 	}
 
-	if ( hasMultipleColorOrigins ) {
+	if ( ( colors as PaletteObject[] )[ 0 ].colors !== undefined ) {
 		let matchedColor;
 
 		( colors as PaletteObject[] ).some( ( origin ) =>
@@ -126,7 +125,6 @@ const BorderControlDropdown = (
 	forwardedRef: React.ForwardedRef< any >
 ) => {
 	const {
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 		border,
 		colors,
@@ -147,11 +145,7 @@ const BorderControlDropdown = (
 	} = useBorderControlDropdown( props );
 
 	const { color, style } = border || {};
-	const colorObject = getColorObject(
-		color,
-		colors,
-		!! __experimentalHasMultipleOrigins
-	);
+	const colorObject = getColorObject( color, colors );
 
 	const toggleAriaLabel = getToggleAriaLabel(
 		color,
@@ -165,7 +159,9 @@ const BorderControlDropdown = (
 		? 'bottom left'
 		: undefined;
 
-	const renderToggle = ( { onToggle = noop } ) => (
+	const renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {
+		onToggle,
+	} ) => (
 		<Button
 			onClick={ onToggle }
 			variant="tertiary"
@@ -183,8 +179,9 @@ const BorderControlDropdown = (
 		</Button>
 	);
 
-	// TODO: update types once Dropdown component is refactored to TypeScript.
-	const renderContent = ( { onClose }: { onClose: () => void } ) => (
+	const renderContent: DropdownComponentProps[ 'renderContent' ] = ( {
+		onClose,
+	} ) => (
 		<>
 			<DropdownContentWrapper paddingSize="medium">
 				<VStack className={ popoverControlsClassName } spacing={ 6 }>
@@ -204,9 +201,6 @@ const BorderControlDropdown = (
 						value={ color }
 						onChange={ onColorChange }
 						{ ...{ colors, disableCustomColors } }
-						__experimentalHasMultipleOrigins={
-							__experimentalHasMultipleOrigins
-						}
 						__experimentalIsRenderedInSidebar={
 							__experimentalIsRenderedInSidebar
 						}

package/src/border-control/border-control-dropdown/hook.ts

@@ -25,7 +25,6 @@ export function useBorderControlDropdown(
 		onChange,
 		previousStyleSelection,
 		size = 'default',
-		__experimentalHasMultipleOrigins = false,
 		__experimentalIsRenderedInSidebar = false,
 		...otherProps
 	} = useContextSystem( props, 'BorderControlDropdown' );
@@ -95,7 +94,6 @@ export function useBorderControlDropdown(
 		popoverContentClassName,
 		popoverControlsClassName,
 		resetButtonClassName,
-		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
 	};
 }

package/src/border-control/stories/index.tsx

@@ -138,7 +138,6 @@ export const WithMultipleOrigins = Template.bind( {} );
 WithMultipleOrigins.args = {
 	...Default.args,
 	colors: multipleOriginColors,
-	__experimentalHasMultipleOrigins: true,
 };
 
 /**