@wordpress/components 23.4.0 → 23.6.0

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

@@ -6,29 +6,29 @@ import type { ReactNode } from 'react';
  * Internal dependencies
  */
 import type { ButtonAsButtonProps } from '../button/types';
-export declare type MatchParams = Record<string, string | string[]>;
-declare type NavigateOptions = {
+export type MatchParams = Record<string, string | string[]>;
+type NavigateOptions = {
     focusTargetSelector?: string;
     isBack?: boolean;
 };
-export declare type NavigatorLocation = NavigateOptions & {
+export type NavigatorLocation = NavigateOptions & {
     isInitial?: boolean;
     path?: string;
     hasRestoredFocus?: boolean;
 };
-export declare type Navigator = {
+export type Navigator = {
     location: NavigatorLocation;
     params: MatchParams;
     goTo: (path: string, options?: NavigateOptions) => void;
     goBack: () => void;
     goToParent: () => void;
 };
-export declare type NavigatorContext = Navigator & {
+export type NavigatorContext = Navigator & {
     addScreen: (screen: Screen) => void;
     removeScreen: (screen: Screen) => void;
     match?: string;
 };
-export declare type NavigatorProviderProps = {
+export type NavigatorProviderProps = {
     /**
      * The initial active path.
      */
@@ -38,7 +38,7 @@ export declare type NavigatorProviderProps = {
      */
     children: ReactNode;
 };
-export declare type NavigatorScreenProps = {
+export type NavigatorScreenProps = {
     /**
      * The screen's path, matched against the current path stored in the navigator.
      */
@@ -48,8 +48,8 @@ export declare type NavigatorScreenProps = {
      */
     children: ReactNode;
 };
-export declare type NavigatorBackButtonProps = ButtonAsButtonProps;
-export declare type NavigatorBackButtonHookProps = NavigatorBackButtonProps & {
+export type NavigatorBackButtonProps = ButtonAsButtonProps;
+export type NavigatorBackButtonHookProps = NavigatorBackButtonProps & {
     /**
      * Whether we should navigate to the parent screen.
      *
@@ -57,8 +57,8 @@ export declare type NavigatorBackButtonHookProps = NavigatorBackButtonProps & {
      */
     goToParent?: boolean;
 };
-export declare type NavigatorToParentButtonProps = NavigatorBackButtonProps;
-export declare type NavigatorButtonProps = NavigatorBackButtonProps & {
+export type NavigatorToParentButtonProps = NavigatorBackButtonProps;
+export type NavigatorButtonProps = NavigatorBackButtonProps & {
     /**
      * The path of the screen to navigate to. The value of this prop needs to be
      * a valid value for an HTML attribute.
@@ -72,7 +72,7 @@ export declare type NavigatorButtonProps = NavigatorBackButtonProps & {
      */
     attributeName?: string;
 };
-export declare type Screen = {
+export type Screen = {
     id: string;
     path: string;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/navigator/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,oBAAY,WAAW,GAAG,MAAM,CAAE,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAE,CAAC;AAE9D,aAAK,eAAe,GAAG;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,oBAAY,iBAAiB,GAAG,eAAe,GAAG;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAGF,oBAAY,SAAS,GAAG;IACvB,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,MAAM,EAAE,WAAW,CAAC;IACpB,IAAI,EAAE,CAAE,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,eAAe,KAAM,IAAI,CAAC;IAC1D,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,UAAU,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,oBAAY,gBAAgB,GAAG,SAAS,GAAG;IAC1C,SAAS,EAAE,CAAE,MAAM,EAAE,MAAM,KAAM,IAAI,CAAC;IACtC,YAAY,EAAE,CAAE,MAAM,EAAE,MAAM,KAAM,IAAI,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,oBAAY,sBAAsB,GAAG;IACpC;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,oBAAY,oBAAoB,GAAG;IAClC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,oBAAY,wBAAwB,GAAG,mBAAmB,CAAC;AAE3D,oBAAY,4BAA4B,GAAG,wBAAwB,GAAG;IACrE;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,oBAAY,4BAA4B,GAAG,wBAAwB,CAAC;AAEpE,oBAAY,oBAAoB,GAAG,wBAAwB,GAAG;IAC7D;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,oBAAY,MAAM,GAAG;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACb,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/navigator/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,MAAM,MAAM,WAAW,GAAG,MAAM,CAAE,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAE,CAAC;AAE9D,KAAK,eAAe,GAAG;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAGF,MAAM,MAAM,SAAS,GAAG;IACvB,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,MAAM,EAAE,WAAW,CAAC;IACpB,IAAI,EAAE,CAAE,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,eAAe,KAAM,IAAI,CAAC;IAC1D,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,UAAU,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG;IAC1C,SAAS,EAAE,CAAE,MAAM,EAAE,MAAM,KAAM,IAAI,CAAC;IACtC,YAAY,EAAE,CAAE,MAAM,EAAE,MAAM,KAAM,IAAI,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACpC;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IAClC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,mBAAmB,CAAC;AAE3D,MAAM,MAAM,4BAA4B,GAAG,wBAAwB,GAAG;IACrE;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG,wBAAwB,CAAC;AAEpE,MAAM,MAAM,oBAAoB,GAAG,wBAAwB,GAAG;IAC7D;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACb,CAAC"}

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

@@ -2,23 +2,23 @@
  * External dependencies
  */
 import type { MouseEventHandler, ReactNode } from 'react';
-declare type CommonNoticeActionProps = {
+type CommonNoticeActionProps = {
     label: string;
     className?: string;
     noDefaultClasses?: boolean;
     variant?: 'primary' | 'secondary' | 'link';
 };
-declare type NoticeActionWithURL = CommonNoticeActionProps & {
+type NoticeActionWithURL = CommonNoticeActionProps & {
     url: string;
     onClick?: never;
 };
-declare type NoticeActionWithOnClick = CommonNoticeActionProps & {
+type NoticeActionWithOnClick = CommonNoticeActionProps & {
     url?: never;
     onClick: MouseEventHandler<HTMLButtonElement>;
 };
-export declare type NoticeAction = NoticeActionWithURL | NoticeActionWithOnClick;
-export declare type NoticeChildren = string | JSX.Element;
-export declare type NoticeProps = {
+export type NoticeAction = NoticeActionWithURL | NoticeActionWithOnClick;
+export type NoticeChildren = string | JSX.Element;
+export type NoticeProps = {
     /**
      * A CSS `class` to give to the wrapper element.
      */
@@ -107,7 +107,7 @@ export declare type NoticeProps = {
      */
     __unstableHTML?: boolean;
 };
-export declare type NoticeListProps = {
+export type NoticeListProps = {
     /**
      * Array of notices to render.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/notice/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1D,aAAK,uBAAuB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,MAAM,CAAC;CAC3C,CAAC;AAIF,aAAK,mBAAmB,GAAG,uBAAuB,GAAG;IACpD,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,KAAK,CAAC;CAChB,CAAC;AACF,aAAK,uBAAuB,GAAG,uBAAuB,GAAG;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,iBAAiB,CAAE,iBAAiB,CAAE,CAAC;CAChD,CAAC;AAEF,oBAAY,YAAY,GAAG,mBAAmB,GAAG,uBAAuB,CAAC;AAEzE,oBAAY,cAAc,GAAG,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;AAElD,oBAAY,WAAW,GAAG;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAClD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;;;;;;;;;;;;;;;OAiBG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;IACpC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;;;;;;;;;;;;;;;;;OAkBG;IACH,OAAO,CAAC,EAAE,KAAK,CAAE,YAAY,CAAE,CAAC;IAChC;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC7B;;OAEG;IACH,OAAO,EAAE,KAAK,CACb,IAAI,CAAE,WAAW,EAAE,UAAU,CAAE,GAAG;QACjC,EAAE,EAAE,MAAM,CAAC;QACX,OAAO,EAAE,MAAM,CAAC;KAChB,CACD,CAAC;IACF;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAE,EAAE,EAAE,MAAM,KAAM,IAAI,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/notice/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1D,KAAK,uBAAuB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,MAAM,CAAC;CAC3C,CAAC;AAIF,KAAK,mBAAmB,GAAG,uBAAuB,GAAG;IACpD,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,KAAK,CAAC;CAChB,CAAC;AACF,KAAK,uBAAuB,GAAG,uBAAuB,GAAG;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,iBAAiB,CAAE,iBAAiB,CAAE,CAAC;CAChD,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,mBAAmB,GAAG,uBAAuB,CAAC;AAEzE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;AAElD,MAAM,MAAM,WAAW,GAAG;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAClD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;;;;;;;;;;;;;;;OAiBG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;IACpC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;;;;;;;;;;;;;;;;;OAkBG;IACH,OAAO,CAAC,EAAE,KAAK,CAAE,YAAY,CAAE,CAAC;IAChC;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC7B;;OAEG;IACH,OAAO,EAAE,KAAK,CACb,IAAI,CAAE,WAAW,EAAE,UAAU,CAAE,GAAG;QACjC,EAAE,EAAE,MAAM,CAAC;QACX,OAAO,EAAE,MAAM,CAAC;KAChB,CACD,CAAC;IACF;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAE,EAAE,EAAE,MAAM,KAAM,IAAI,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/number-control/index.tsx"],"names":[],"mappings":";AAiRA,eAAO,MAAM,aAAa;;;;;;;;;;;;m6KAAyC,CAAC;AAEpE,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/number-control/index.tsx"],"names":[],"mappings":";AA+QA,eAAO,MAAM,aAAa;;;;;;;;;;;;m6KAAyC,CAAC;AAEpE,eAAe,aAAa,CAAC"}

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

@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import type { InputControlProps } from '../input-control/types';
-export declare type NumberControlProps = Omit<InputControlProps, 'isDragEnabled' | 'min' | 'max' | 'required' | 'step' | 'type' | 'value'> & {
+export type NumberControlProps = Omit<InputControlProps, 'isDragEnabled' | 'min' | 'max' | 'required' | 'step' | 'type' | 'value'> & {
     /**
      * If true, the default `input` HTML arrows will be hidden.
      *

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/number-control/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,oBAAY,kBAAkB,GAAG,IAAI,CACpC,iBAAiB,EACjB,eAAe,GAAG,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CACxE,GAAG;IACH;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC5C;;;;OAIG;IACH,aAAa,CAAC,EAAE,iBAAiB,CAAE,eAAe,CAAE,CAAC;IACrD;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAE,UAAU,CAAE,CAAC;IAC3C;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAE,MAAM,CAAE,CAAC;IACnC;;;;OAIG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAE,MAAM,CAAE,CAAC;IACnC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/number-control/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACpC,iBAAiB,EACjB,eAAe,GAAG,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CACxE,GAAG;IACH;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC5C;;;;OAIG;IACH,aAAa,CAAC,EAAE,iBAAiB,CAAE,eAAe,CAAE,CAAC;IACrD;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAE,UAAU,CAAE,CAAC;IAC3C;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAE,MAAM,CAAE,CAAC;IACnC;;;;OAIG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAE,MAAM,CAAE,CAAC;IACnC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB,CAAC"}

package/build-types/palette-edit/index.d.ts

@@ -0,0 +1,37 @@
+/// <reference types="react" />
+import type { PaletteEditProps, PaletteElement } from './types';
+/**
+ * Returns a temporary name for a palette item in the format "Color + id".
+ * To ensure there are no duplicate ids, this function checks all slugs for temporary names.
+ * It expects slugs to be in the format: slugPrefix + color- + number.
+ * It then sets the id component of the new name based on the incremented id of the highest existing slug id.
+ *
+ * @param elements   An array of color palette items.
+ * @param slugPrefix The slug prefix used to match the element slug.
+ *
+ * @return A unique name for a palette item.
+ */
+export declare function getNameForPosition(elements: PaletteElement[], slugPrefix: string): string;
+/**
+ * Allows editing a palette of colors or gradients.
+ *
+ * ```jsx
+ * import { PaletteEdit } from '@wordpress/components';
+ * const MyPaletteEdit = () => {
+ *   const [ controlledColors, setControlledColors ] = useState( colors );
+ *
+ *   return (
+ *     <PaletteEdit
+ *       colors={ controlledColors }
+ *       onChange={ ( newColors?: Color[] ) => {
+ *         setControlledColors( newColors );
+ *       } }
+ *       paletteLabel="Here is a label"
+ *     />
+ *   );
+ * };
+ * ```
+ */
+export declare function PaletteEdit({ gradients, colors, onChange, paletteLabel, paletteLabelHeadingLevel, emptyMessage, canOnlyChangeValues, canReset, slugPrefix, }: PaletteEditProps): JSX.Element;
+export default PaletteEdit;
+//# sourceMappingURL=index.d.ts.map

package/build-types/palette-edit/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/palette-edit/index.tsx"],"names":[],"mappings":";AA4CA,OAAO,KAAK,EAOX,gBAAgB,EAChB,cAAc,EACd,MAAM,SAAS,CAAC;AAejB;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CACjC,QAAQ,EAAE,cAAc,EAAE,EAC1B,UAAU,EAAE,MAAM,UAqBlB;AAkOD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,WAAW,CAAE,EAC5B,SAAS,EACT,MAAoB,EACpB,QAAQ,EACR,YAAY,EACZ,wBAA4B,EAC5B,YAAY,EACZ,mBAAmB,EACnB,QAAQ,EACR,UAAe,GACf,EAAE,gBAAgB,eA6OlB;AAED,eAAe,WAAW,CAAC"}

package/build-types/palette-edit/stories/index.d.ts

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

package/build-types/palette-edit/stories/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/palette-edit/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAOtE;;GAEG;AACH,OAAO,WAAW,MAAM,IAAI,CAAC;AAG7B,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,WAAW,CAQ5C,CAAC;AACF,eAAe,IAAI,CAAC;AA4BpB,eAAO,MAAM,OAAO,oCAAsB,CAAC;AAU3C,eAAO,MAAM,SAAS,oCAAsB,CAAC"}

package/build-types/palette-edit/styles.d.ts

@@ -0,0 +1,51 @@
+export const IndicatorStyled: import("@emotion/styled").StyledComponent<Omit<import("../ui/context").WordPressComponentProps<import("../button/types").ButtonAsButtonProps, "button", false>, "className" | "isPressed"> & {
+    className?: string | undefined;
+    tooltipText?: string | undefined;
+    isSelected?: boolean | undefined;
+    selectedIconProps?: Omit<{
+        icon: JSX.Element;
+        size?: number | undefined;
+    } & {
+        isPressed?: boolean | undefined;
+    } & Pick<import("react").SVGProps<SVGSVGElement>, "string" | "onChange" | "name" | "cx" | "clipPath" | "color" | "cursor" | "direction" | "display" | "filter" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "height" | "imageRendering" | "letterSpacing" | "opacity" | "order" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "textRendering" | "transform" | "unicodeBidi" | "visibility" | "width" | "wordSpacing" | "writingMode" | "mask" | "offset" | "overflow" | "textDecoration" | "azimuth" | "clip" | "alignmentBaseline" | "baselineShift" | "clipRule" | "colorInterpolation" | "colorRendering" | "dominantBaseline" | "fill" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "glyphOrientationVertical" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "vectorEffect" | "end" | "local" | "style" | "x" | "y" | "alphabetic" | "hanging" | "ideographic" | "mathematical" | "values" | "key" | "children" | "path" | "type" | "className" | "id" | "lang" | "tabIndex" | "role" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "origin" | "target" | "from" | "crossOrigin" | "max" | "min" | "media" | "method" | "accentHeight" | "accumulate" | "additive" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorInterpolationFilters" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "fr" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "href" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "orientation" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan">, "size" | "icon"> | undefined;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export const NameInputControl: import("@emotion/styled").StyledComponent<import("../input-control/types").InputControlProps & import("react").RefAttributes<HTMLInputElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export const PaletteItem: import("@emotion/styled").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;
+export const NameContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export const PaletteHeading: import("@emotion/styled").StyledComponent<Omit<import("../text/types").Props, "size"> & {
+    level?: import("../heading/types").HeadingSize | undefined;
+} & import("react").RefAttributes<any> & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "key" | keyof import("react").HTMLAttributes<HTMLHeadingElement>>, "color" | "display" | "letterSpacing" | "lineHeight" | "ellipsis" | "weight" | "children" | "as" | "isBlock" | "align" | keyof import("react").RefAttributes<any> | "ellipsizeMode" | "limit" | "numberOfLines" | "adjustLineHeightForInnerControls" | "isDestructive" | "highlightEscape" | "highlightCaseSensitive" | "highlightSanitize" | "optimizeReadabilityFor" | "truncate" | "upperCase" | "variant" | "highlightWords" | "level"> & {
+    as?: keyof JSX.IntrinsicElements | undefined;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export const PaletteActionsContainer: import("@emotion/styled").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;
+export const PaletteHStackHeader: import("@emotion/styled").StyledComponent<Omit<import("../flex/types").FlexProps, "gap" | "align"> & {
+    alignment?: "initial" | "left" | "right" | (string & {}) | "bottom" | "top" | "-moz-initial" | "inherit" | "revert" | "unset" | "stretch" | "center" | "end" | "flex-end" | "flex-start" | "start" | "baseline" | "normal" | "self-end" | "self-start" | "edge" | "bottomLeft" | "bottomRight" | "topLeft" | "topRight" | undefined;
+    spacing?: import("csstype").Property.Width<string | number> | undefined;
+} & import("react").RefAttributes<any> & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "direction" | "wrap" | "expanded" | "justify" | "children" | "as" | "isReversed" | keyof import("react").RefAttributes<any> | "spacing" | "alignment"> & {
+    as?: keyof JSX.IntrinsicElements | undefined;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export const PaletteEditStyles: import("@emotion/styled").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;
+export const DoneButton: import("@emotion/styled").StyledComponent<(import("../button/types").ButtonProps & import("react").RefAttributes<any>) & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export const RemoveButton: import("@emotion/styled").StyledComponent<(import("../button/types").ButtonProps & import("react").RefAttributes<any>) & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+//# sourceMappingURL=styles.d.ts.map

package/build-types/palette-edit/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/palette-edit/styles.js"],"names":[],"mappings":"AAsBA;;;;;;;;;;;;WAIE;AAEF;;WAYE;AAEF;;GAoBE;AAEF;;;0GASE;AAEF;;;;;;WAQE;AAEF;;GAGE;AAEF;;;;;;;WAEE;AAEF;;GAOE;AAEF;;WAIE;AAEF;;WAIE"}

package/build-types/palette-edit/test/index.d.ts

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

package/build-types/palette-edit/test/index.d.ts.map

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

package/build-types/palette-edit/types.d.ts

@@ -0,0 +1,114 @@
+/**
+ * External dependencies
+ */
+import type { Key, MouseEventHandler } from 'react';
+/**
+ * Internal dependencies
+ */
+import type { HeadingSize } from '../heading/types';
+export type Color = {
+    color: string;
+    name: string;
+    slug: string;
+    gradient?: never;
+};
+export type Gradient = {
+    gradient: string;
+    name: string;
+    slug: string;
+    color?: never;
+};
+export type PaletteElement = Color | Gradient;
+export type BasePaletteEdit = {
+    /**
+     * Whether the user can only change the color or gradient values.
+     * If true, they cannot change names or delete values.
+     *
+     * @default false
+     */
+    canOnlyChangeValues?: boolean;
+    /**
+     * Whether the user can reset the editor.
+     *
+     * @default false
+     */
+    canReset?: boolean;
+    /**
+     * A message to show if there's nothing to edit.
+     */
+    emptyMessage?: string;
+    /**
+     * A heading label for the palette.
+     */
+    paletteLabel: string;
+    /**
+     * The label's heading level.
+     *
+     * @default 2
+     */
+    paletteLabelHeadingLevel?: HeadingSize;
+    /**
+     * The prefix for the element slug.
+     *
+     * @default ''
+     */
+    slugPrefix?: string;
+};
+type PaletteEditColors = {
+    /**
+     * The colors in the palette.
+     */
+    colors?: Color[];
+    /**
+     * Runs on changing the value.
+     */
+    onChange: (values?: Color[]) => void;
+    gradients?: never;
+};
+type PaletteEditGradients = {
+    /**
+     * The gradients in the palette.
+     */
+    gradients: Gradient[];
+    /**
+     * Runs on changing the value.
+     */
+    onChange: (values?: Gradient[]) => void;
+    colors?: never;
+};
+export type PaletteEditProps = BasePaletteEdit & (PaletteEditColors | PaletteEditGradients);
+type EditingElement = number | null;
+export type ColorPickerPopoverProps<T extends Color | Gradient> = {
+    element: T;
+    onChange: (newElement: T) => void;
+    isGradient?: T extends Gradient ? true : false;
+    onClose?: () => void;
+};
+export type NameInputProps = {
+    label: string;
+    onChange: (nextName?: PaletteElement['name']) => void;
+    value: PaletteElement['name'];
+};
+export type OptionProps<T extends Color | Gradient> = {
+    element: T;
+    onChange: (newElement: T) => void;
+    isGradient: T extends Gradient ? true : false;
+    canOnlyChangeValues: PaletteEditProps['canOnlyChangeValues'];
+    isEditing: boolean;
+    key: Key;
+    onRemove: MouseEventHandler<HTMLButtonElement>;
+    onStartEditing: () => void;
+    onStopEditing: () => void;
+    slugPrefix: string;
+};
+export type PaletteEditListViewProps<T extends Color | Gradient> = {
+    elements: T[];
+    onChange: (newElements?: T[]) => void;
+    isGradient: T extends Gradient ? true : false;
+    canOnlyChangeValues: PaletteEditProps['canOnlyChangeValues'];
+    editingElement?: EditingElement;
+    setEditingElement: (newEditingElement?: EditingElement) => void;
+    slugPrefix: string;
+};
+export {};
+//# sourceMappingURL=types.d.ts.map

package/build-types/palette-edit/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/palette-edit/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEpD;;GAEG;AACH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,MAAM,MAAM,KAAK,GAAG;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,KAAK,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG;IAC7B;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,wBAAwB,CAAC,EAAE,WAAW,CAAC;IACvC;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,KAAK,iBAAiB,GAAG;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,EAAE,CAAE,MAAM,CAAC,EAAE,KAAK,EAAE,KAAM,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,KAAK,CAAC;CAClB,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC3B;;OAEG;IACH,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,CAAE,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAM,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,eAAe,GAC7C,CAAE,iBAAiB,GAAG,oBAAoB,CAAE,CAAC;AAE9C,KAAK,cAAc,GAAG,MAAM,GAAG,IAAI,CAAC;AAEpC,MAAM,MAAM,uBAAuB,CAAE,CAAC,SAAS,KAAK,GAAG,QAAQ,IAAK;IACnE,OAAO,EAAE,CAAC,CAAC;IACX,QAAQ,EAAE,CAAE,UAAU,EAAE,CAAC,KAAM,IAAI,CAAC;IACpC,UAAU,CAAC,EAAE,CAAC,SAAS,QAAQ,GAAG,IAAI,GAAG,KAAK,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAE,QAAQ,CAAC,EAAE,cAAc,CAAE,MAAM,CAAE,KAAM,IAAI,CAAC;IAC1D,KAAK,EAAE,cAAc,CAAE,MAAM,CAAE,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,WAAW,CAAE,CAAC,SAAS,KAAK,GAAG,QAAQ,IAAK;IACvD,OAAO,EAAE,CAAC,CAAC;IACX,QAAQ,EAAE,CAAE,UAAU,EAAE,CAAC,KAAM,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,SAAS,QAAQ,GAAG,IAAI,GAAG,KAAK,CAAC;IAC9C,mBAAmB,EAAE,gBAAgB,CAAE,qBAAqB,CAAE,CAAC;IAC/D,SAAS,EAAE,OAAO,CAAC;IACnB,GAAG,EAAE,GAAG,CAAC;IACT,QAAQ,EAAE,iBAAiB,CAAE,iBAAiB,CAAE,CAAC;IACjD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,wBAAwB,CAAE,CAAC,SAAS,KAAK,GAAG,QAAQ,IAAK;IACpE,QAAQ,EAAE,CAAC,EAAE,CAAC;IACd,QAAQ,EAAE,CAAE,WAAW,CAAC,EAAE,CAAC,EAAE,KAAM,IAAI,CAAC;IACxC,UAAU,EAAE,CAAC,SAAS,QAAQ,GAAG,IAAI,GAAG,KAAK,CAAC;IAC9C,mBAAmB,EAAE,gBAAgB,CAAE,qBAAqB,CAAE,CAAC;IAC/D,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,iBAAiB,EAAE,CAAE,iBAAiB,CAAC,EAAE,cAAc,KAAM,IAAI,CAAC;IAClE,UAAU,EAAE,MAAM,CAAC;CACnB,CAAC"}

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+/**
+ * Internal dependencies
+ */
+import type { PanelBodyProps } from './types';
+export declare function UnforwardedPanelBody(props: PanelBodyProps, ref: React.ForwardedRef<HTMLDivElement>): JSX.Element;
+export declare const PanelBody: import("react").ForwardRefExoticComponent<PanelBodyProps & import("react").RefAttributes<HTMLDivElement>>;
+export default PanelBody;
+//# sourceMappingURL=body.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../src/panel/body.tsx"],"names":[],"mappings":";AAYA;;GAEG;AACH,OAAO,KAAK,EAAE,cAAc,EAAuB,MAAM,SAAS,CAAC;AAQnE,wBAAgB,oBAAoB,CACnC,KAAK,EAAE,cAAc,EACrB,GAAG,EAAE,KAAK,CAAC,YAAY,CAAE,cAAc,CAAE,eA0EzC;AA8CD,eAAO,MAAM,SAAS,2GAAqC,CAAC;AAE5D,eAAe,SAAS,CAAC"}

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

@@ -0,0 +1,19 @@
+/**
+ * External dependencies
+ */
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+/**
+ * Internal dependencies
+ */
+import Panel from '../';
+declare const meta: ComponentMeta<typeof Panel>;
+export default meta;
+export declare const Default: ComponentStory<typeof Panel>;
+/**
+ * `PanelRow` is a generic container for rows within a `PanelBody`.
+ * It is a flex container with a top margin for spacing.
+ */
+export declare const _PanelRow: ComponentStory<typeof Panel>;
+export declare const DisabledSection: ComponentStory<typeof Panel>;
+export declare const WithIcon: ComponentStory<typeof Panel>;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/panel/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEtE;;GAEG;AACH,OAAO,KAAK,MAAM,KAAK,CAAC;AAUxB,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,KAAK,CAWtC,CAAC;AACF,eAAe,IAAI,CAAC;AAMpB,eAAO,MAAM,OAAO,EAAE,cAAc,CAAE,OAAO,KAAK,CAAwB,CAAC;AA+B3E;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,cAAc,CAAE,OAAO,KAAK,CAAwB,CAAC;AAiB7E,eAAO,MAAM,eAAe,EAAE,cAAc,CAAE,OAAO,KAAK,CAEzD,CAAC;AAYF,eAAO,MAAM,QAAQ,EAAE,cAAc,CAAE,OAAO,KAAK,CAAwB,CAAC"}

package/build-types/panel/test/body.d.ts

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

package/build-types/panel/test/body.d.ts.map

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

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

@@ -1,5 +1,10 @@
 /// <reference types="react" />
-export declare type PanelProps = {
+/**
+ * Internal dependencies
+ */
+import type { ButtonAsButtonProps } from '../button/types';
+import type { WordPressComponentProps } from '../ui/context';
+export type PanelProps = {
     /**
      * The text that will be rendered as the title of the panel.
      * Text will be rendered inside an `<h2>` tag.
@@ -14,7 +19,7 @@ export declare type PanelProps = {
      */
     children: React.ReactNode;
 };
-export declare type PanelHeaderProps = {
+export type PanelHeaderProps = {
     /**
      * The text that will be rendered as the title of the panel.
      * Will be rendered in an `<h2>` tag.
@@ -25,7 +30,7 @@ export declare type PanelHeaderProps = {
      */
     children?: React.ReactNode;
 };
-export declare type PanelRowProps = {
+export type PanelRowProps = {
     /**
      * The CSS class to apply to the wrapper element.
      */
@@ -35,4 +40,69 @@ export declare type PanelRowProps = {
      */
     children: React.ReactNode;
 };
+export type PanelBodyProps = {
+    /**
+     * Props that are passed to the `Button` component in title within the
+     * `PanelBody`.
+     *
+     * @default {}
+     */
+    buttonProps?: WordPressComponentProps<Omit<ButtonAsButtonProps, 'icon'>, 'button', false>;
+    /**
+     * The content to display in the `PanelBody`.If a function is provided for
+     * this prop, it will receive an object with the `opened` prop as an argument.
+     */
+    children?: React.ReactNode | ((props: {
+        opened: boolean;
+    }) => React.ReactNode);
+    /**
+     * The CSS class to apply to the wrapper element.
+     */
+    className?: string;
+    /**
+     * An icon to be shown next to the title.
+     */
+    icon?: JSX.Element;
+    /**
+     * Whether or not the panel will start open.
+     */
+    initialOpen?: boolean;
+    /**
+     * A function that is called any time the component is toggled from its closed
+     * state to its opened state, or vice versa.
+     *
+     * @default noop
+     */
+    onToggle?: (next: boolean) => void;
+    /**
+     * When set to `true`, the component will remain open regardless of the
+     * `initialOpen` prop and the panel will be prevented from being closed.
+     */
+    opened?: boolean;
+    /**
+     * Title text. It shows even when it is closed.
+     */
+    title?: string;
+    /**
+     * Scrolls the content into view when visible. This improves the UX when
+     * multiple `PanelBody` components are stacked in a scrollable container.
+     *
+     * @default true
+     */
+    scrollAfterOpen?: boolean;
+};
+export type PanelBodyTitleProps = Omit<ButtonAsButtonProps, 'icon'> & {
+    /**
+     * An icon to be shown next to the title.
+     */
+    icon?: JSX.Element;
+    /**
+     * Whether or not the `PanelBody` is currently opened or not.
+     */
+    isOpened?: boolean;
+    /**
+     * The title text.
+     */
+    title?: string;
+};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/panel/types.ts"],"names":[],"mappings":";AAAA,oBAAY,UAAU,GAAG;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAE,OAAO,CAAE,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,oBAAY,gBAAgB,GAAG;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,oBAAY,aAAa,GAAG;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/panel/types.ts"],"names":[],"mappings":";AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAE7D,MAAM,MAAM,UAAU,GAAG;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAE,OAAO,CAAE,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC5B;;;;;OAKG;IACH,WAAW,CAAC,EAAE,uBAAuB,CACpC,IAAI,CAAE,mBAAmB,EAAE,MAAM,CAAE,EACnC,QAAQ,EACR,KAAK,CACL,CAAC;IACF;;;OAGG;IACH,QAAQ,CAAC,EACN,KAAK,CAAC,SAAS,GACf,CAAE,CAAE,KAAK,EAAE;QAAE,MAAM,EAAE,OAAO,CAAA;KAAE,KAAM,KAAK,CAAC,SAAS,CAAE,CAAC;IAEzD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CAAE,IAAI,EAAE,OAAO,KAAM,IAAI,CAAC;IACrC;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAE,mBAAmB,EAAE,MAAM,CAAE,GAAG;IACvE;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC"}

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

@@ -11,6 +11,6 @@ import type { WordPressComponentProps } from '../ui/context';
  * const MyPlaceholder = () => <Placeholder icon={ more } label="Placeholder" />;
  * ```
  */
-export declare function Placeholder<IconProps = unknown>(props: WordPressComponentProps<PlaceholderProps<IconProps>, 'div', false>): JSX.Element;
+export declare function Placeholder(props: WordPressComponentProps<PlaceholderProps, 'div', false>): JSX.Element;
 export default Placeholder;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/placeholder/index.tsx"],"names":[],"mappings":";AAeA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAc7D;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CAAE,SAAS,GAAG,OAAO,EAC/C,KAAK,EAAE,uBAAuB,CAC7B,gBAAgB,CAAE,SAAS,CAAE,EAC7B,KAAK,EACL,KAAK,CACL,eA4DD;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/placeholder/index.tsx"],"names":[],"mappings":";AAeA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAc7D;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CAC1B,KAAK,EAAE,uBAAuB,CAAE,gBAAgB,EAAE,KAAK,EAAE,KAAK,CAAE,eA4DhE;AAED,eAAe,WAAW,CAAC"}

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

@@ -6,7 +6,7 @@ import type { ReactNode } from 'react';
  * Internal dependencies
  */
 import type { IconType } from '../icon';
-export declare type PlaceholderProps<IconProps = unknown> = {
+export type PlaceholderProps = {
     /**
      * The children elements.
      */
@@ -18,7 +18,7 @@ export declare type PlaceholderProps<IconProps = unknown> = {
     /**
      * If provided, renders an icon next to the label.
      */
-    icon?: IconType<IconProps>;
+    icon?: IconType;
     /**
      * Instructions of the placeholder.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/placeholder/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,oBAAY,gBAAgB,CAAE,SAAS,GAAG,OAAO,IAAK;IACrD;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAE,SAAS,CAAE,CAAC;IAC7B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/placeholder/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,MAAM,MAAM,gBAAgB,GAAG;IAC9B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC"}