@wordpress/components 19.10.0 → 19.13.0

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

@@ -35,7 +35,7 @@ export declare const UnitControl: import("react").ForwardRefExoticComponent<Pick
     onBlur?: FocusEventHandler<HTMLInputElement | HTMLSelectElement> | undefined;
 } & Omit<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>> & {
     ref?: ((instance: HTMLInputElement | null) => void) | import("react").RefObject<HTMLInputElement> | null | undefined;
-}, "children" | "value" | "label" | "as" | "onBlur" | "onChange" | "size" | "hideLabelFromVision" | "__next36pxDefaultSize" | "__unstableInputWidth" | "isPressEnterToChange" | "__unstableStateReducer" | "unit" | "isUnitSelectTabbable" | "units" | "disableUnits" | "isShiftStepEnabled" | "shiftStep" | "isResetValueOnUnitChange" | "onUnitChange">, "type" | "value" | "form" | "label" | "slot" | "style" | "title" | "pattern" | "className" | "color" | "height" | "id" | "lang" | "max" | "min" | "name" | "width" | "role" | "tabIndex" | "crossOrigin" | "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" | "onChange" | "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" | "css" | "key" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "alt" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "enterKeyHint" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "size" | "step" | "hideLabelFromVision" | "__next36pxDefaultSize" | "__unstableInputWidth" | "isPressEnterToChange" | "__unstableStateReducer" | "unit" | "isUnitSelectTabbable" | "units" | "disableUnits" | "isShiftStepEnabled" | "shiftStep" | "isResetValueOnUnitChange" | "onUnitChange"> & import("react").RefAttributes<any>>;
+}, "children" | "value" | "label" | "as" | "onBlur" | "onChange" | "size" | "hideLabelFromVision" | "__next36pxDefaultSize" | "__unstableInputWidth" | "isPressEnterToChange" | "__unstableStateReducer" | "unit" | "isUnitSelectTabbable" | "units" | "disableUnits" | "isShiftStepEnabled" | "shiftStep" | "isResetValueOnUnitChange" | "onUnitChange">, "type" | "value" | "form" | "label" | "slot" | "style" | "title" | "pattern" | "className" | "color" | "height" | "id" | "lang" | "max" | "min" | "name" | "width" | "role" | "tabIndex" | "crossOrigin" | "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" | "onChange" | "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" | "key" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "alt" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "enterKeyHint" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "size" | "step" | "hideLabelFromVision" | "__next36pxDefaultSize" | "__unstableInputWidth" | "isPressEnterToChange" | "__unstableStateReducer" | "unit" | "isUnitSelectTabbable" | "units" | "disableUnits" | "isShiftStepEnabled" | "shiftStep" | "isResetValueOnUnitChange" | "onUnitChange"> & import("react").RefAttributes<any>>;
 export { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';
 export default UnitControl;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/unit-control/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EACX,iBAAiB,EAMjB,MAAM,OAAO,CAAC;AAyBf,OAAO,KAAK,EAAoB,2BAA2B,EAAE,MAAM,SAAS,CAAC;AAC7E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AA0PnE;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;8gLAAuC,CAAC;AAEhE,OAAO,EAAE,gCAAgC,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC3E,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/unit-control/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EACX,iBAAiB,EAMjB,MAAM,OAAO,CAAC;AAyBf,OAAO,KAAK,EAAoB,2BAA2B,EAAE,MAAM,SAAS,CAAC;AAC7E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAwPnE;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;sgLAAuC,CAAC;AAEhE,OAAO,EAAE,gCAAgC,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC3E,eAAe,WAAW,CAAC"}

package/build-types/unit-control/stories/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/unit-control/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAOtE;;GAEG;AACH,OAAO,EAAE,WAAW,EAAE,MAAM,KAAK,CAAC;AAGlC,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,WAAW,CA8B5C,CAAC;AACF,eAAe,IAAI,CAAC;AAsBpB,eAAO,MAAM,OAAO,EAAE,cAAc,CACnC,OAAO,WAAW,CACW,CAAC;AAK/B;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,EAAE,cAAc,CAC9C,OAAO,WAAW,CACW,CAAC;AAU/B;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,cAAc,CAClD,OAAO,WAAW,CACW,CAAC;AAS/B;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,cAAc,CAC1C,OAAO,WAAW,CACW,CAAC;AAM/B;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,cAAc,CAAE,OAAO,WAAW,CAkB/D,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/unit-control/stories/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAOtE;;GAEG;AACH,OAAO,EAAE,WAAW,EAAE,MAAM,KAAK,CAAC;AAGlC,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,WAAW,CA8B5C,CAAC;AACF,eAAe,IAAI,CAAC;AAsBpB,eAAO,MAAM,OAAO,EAAE,cAAc,CAAE,OAAO,WAAW,CAC7B,CAAC;AAK5B;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,EAAE,cAAc,CAAE,OAAO,WAAW,CACxC,CAAC;AAU5B;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,cAAc,CAAE,OAAO,WAAW,CAC5C,CAAC;AAS5B;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,cAAc,CAAE,OAAO,WAAW,CACpC,CAAC;AAM5B;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,cAAc,CAAE,OAAO,WAAW,CAkB/D,CAAC"}

package/build-types/utils/hooks/index.d.ts

@@ -1,6 +1,5 @@
 export { default as useControlledState } from "./use-controlled-state";
 export { default as useUpdateEffect } from "./use-update-effect";
-export { useCombinedRef } from "./use-combined-ref";
 export { useControlledValue } from "./use-controlled-value";
 export { useCx } from "./use-cx";
 export { useLatestRef } from "./use-latest-ref";

package/build-types/utils/unit-values.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"unit-values.d.ts","sourceRoot":"","sources":["../../src/utils/unit-values.ts"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAChC,OAAO,EAAE,MAAM,GACb,CAAE,MAAM,GAAG,SAAS,EAAE,MAAM,GAAG,SAAS,CAAE,CAY5C;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CACjC,KAAK,EAAE,MAAM,GAAG,MAAM,EACtB,IAAI,EAAE,MAAM,GACV,MAAM,CAER"}
+{"version":3,"file":"unit-values.d.ts","sourceRoot":"","sources":["../../src/utils/unit-values.ts"],"names":[],"mappings":"AAGA;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAChC,OAAO,EAAE,MAAM,GACb,CAAE,MAAM,GAAG,SAAS,EAAE,MAAM,GAAG,SAAS,CAAE,CAY5C;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CACjC,KAAK,EAAE,MAAM,GAAG,MAAM,EACtB,IAAI,EAAE,MAAM,GACV,MAAM,CAER"}

package/build-types/utils/values.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"values.d.ts","sourceRoot":"","sources":["../../src/utils/values.js"],"names":[],"mappings":"AACA;;;;;;;GAOG;AACH,2EAEC;AAID;;;;;;;GAOG;AACH,8EAIC;AAGD;;;;;;;;GAQG;AACH,sGAEC;AAuBD;;;;;;;;;GASG;AACH,sCAJW,GAAG,gCAEF,OAAO,CA6BlB"}
+{"version":3,"file":"values.d.ts","sourceRoot":"","sources":["../../src/utils/values.js"],"names":[],"mappings":"AACA;;;;;;;GAOG;AACH,2EAEC;AAID;;;;;;;GAOG;AACH,8EAIC;AAGD;;;;;;;;GAQG;AACH,sGAEC;AAuBD;;;;;;;;;GASG;AACH,sCAJW,GAAG,gCAEF,OAAO,CA4BlB"}

package/build-types/v-stack/hook.d.ts

@@ -227,7 +227,6 @@ export function useVStack(props: import('../ui/context').WordPressComponentProps
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    css?: import("@emotion/core").InterpolationWithTheme<any>;
     key?: import("react").Key | null | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;

package/build-types/v-stack/hook.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hook.d.ts","sourceRoot":"","sources":["../../src/v-stack/hook.js"],"names":[],"mappings":"AAMA;;;GAGG;AACH,iCAFW,OAAO,eAAe,EAAE,uBAAuB,CAAC,OAAO,SAAS,EAAE,KAAK,EAAE,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAezF"}
+{"version":3,"file":"hook.d.ts","sourceRoot":"","sources":["../../src/v-stack/hook.js"],"names":[],"mappings":"AAMA;;;GAGG;AACH,iCAFW,OAAO,eAAe,EAAE,uBAAuB,CAAC,OAAO,SAAS,EAAE,KAAK,EAAE,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAezF"}

package/build-types/z-stack/component.d.ts

@@ -1,31 +1,21 @@
+import type { ZStackProps } from './types';
 /**
- * External dependencies
+ * `ZStack` allows you to stack things along the Z-axis.
+ *
+ * ```jsx
+ * import { __experimentalZStack as ZStack } from '@wordpress/components';
+ *
+ * function Example() {
+ *   return (
+ *     <ZStack offset={ 20 } isLayered>
+ *       <ExampleImage />
+ *       <ExampleImage />
+ *       <ExampleImage />
+ *     </ZStack>
+ *   );
+ * }
+ * ```
  */
-import type { ReactNode } from 'react';
-export interface ZStackProps {
-    /**
-     * Layers children elements on top of each other (first: highest z-index, last: lowest z-index).
-     *
-     * @default true
-     */
-    isLayered?: boolean;
-    /**
-     * Reverse the layer ordering (first: lowest z-index, last: highest z-index).
-     *
-     * @default false
-     */
-    isReversed?: boolean;
-    /**
-     * The amount of offset between each child element. The amount of space between each child element. Defaults to `0`. Its value is automatically inverted (i.e. from positive to negative, and viceversa) when switching from LTR to RTL.
-     *
-     * @default 0
-     */
-    offset?: number;
-    /**
-     * Child elements.
-     */
-    children: ReactNode;
-}
-declare const _default: import("../ui/context").WordPressComponent<"div", ZStackProps, true>;
-export default _default;
+export declare const ZStack: import("../ui/context").WordPressComponent<"div", ZStackProps, true>;
+export default ZStack;
 //# sourceMappingURL=component.d.ts.map

package/build-types/z-stack/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/z-stack/component.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAerD,MAAM,WAAW,WAAW;IAC3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB;;AA+CD,wBAAkD"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/z-stack/component.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAgD3C;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,MAAM,sEAAgD,CAAC;AAEpE,eAAe,MAAM,CAAC"}

package/build-types/z-stack/stories/index.d.ts

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

package/build-types/z-stack/stories/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/z-stack/stories/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAQtE,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC;AAE5B,QAAA,MAAM,IAAI,EAAE,aAAa,CAAE,OAAO,MAAM,CAavC,CAAC;AACF,eAAe,IAAI,CAAC;AA4CpB,eAAO,MAAM,OAAO,EAAE,cAAc,CAAE,OAAO,MAAM,CAAwB,CAAC"}

package/build-types/z-stack/types.d.ts

@@ -0,0 +1,33 @@
+/**
+ * External dependencies
+ */
+import type { ReactNode } from 'react';
+export declare type ZStackProps = {
+    /**
+     * Layers children elements on top of each other (first: highest z-index,
+     * last: lowest z-index).
+     *
+     * @default true
+     */
+    isLayered?: boolean;
+    /**
+     * Reverse the layer ordering (first: lowest z-index, last: highest
+     * z-index).
+     *
+     * @default false
+     */
+    isReversed?: boolean;
+    /**
+     * The amount of space between each child element. Its value is
+     * automatically inverted (i.e. from positive to negative, and viceversa)
+     * when switching from LTR to RTL.
+     *
+     * @default 0
+     */
+    offset?: number;
+    /**
+     * The children to stack.
+     */
+    children: ReactNode;
+};
+//# sourceMappingURL=types.d.ts.map

package/build-types/z-stack/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/z-stack/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,oBAAY,WAAW,GAAG;IACzB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/components",
-	"version": "19.10.0",
+	"version": "19.13.0",
 	"description": "UI components for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -36,22 +36,23 @@
 		"@emotion/serialize": "^1.0.2",
 		"@emotion/styled": "^11.6.0",
 		"@emotion/utils": "1.0.0",
+		"@floating-ui/react-dom": "0.6.3",
 		"@use-gesture/react": "^10.2.6",
-		"@wordpress/a11y": "^3.8.0",
-		"@wordpress/compose": "^5.6.0",
-		"@wordpress/date": "^4.8.0",
-		"@wordpress/deprecated": "^3.8.0",
-		"@wordpress/dom": "^3.8.0",
-		"@wordpress/element": "^4.6.0",
-		"@wordpress/escape-html": "^2.8.0",
-		"@wordpress/hooks": "^3.8.0",
-		"@wordpress/i18n": "^4.8.0",
-		"@wordpress/icons": "^8.4.0",
-		"@wordpress/is-shallow-equal": "^4.8.0",
-		"@wordpress/keycodes": "^3.8.0",
-		"@wordpress/primitives": "^3.6.0",
-		"@wordpress/rich-text": "^5.6.0",
-		"@wordpress/warning": "^2.8.0",
+		"@wordpress/a11y": "^3.11.0",
+		"@wordpress/compose": "^5.9.0",
+		"@wordpress/date": "^4.11.0",
+		"@wordpress/deprecated": "^3.11.0",
+		"@wordpress/dom": "^3.11.0",
+		"@wordpress/element": "^4.9.0",
+		"@wordpress/escape-html": "^2.11.0",
+		"@wordpress/hooks": "^3.11.0",
+		"@wordpress/i18n": "^4.11.0",
+		"@wordpress/icons": "^9.2.0",
+		"@wordpress/is-shallow-equal": "^4.11.0",
+		"@wordpress/keycodes": "^3.11.0",
+		"@wordpress/primitives": "^3.9.0",
+		"@wordpress/rich-text": "^5.9.0",
+		"@wordpress/warning": "^2.11.0",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
 		"dom-scroll-into-view": "^1.2.1",
@@ -61,11 +62,10 @@
 		"highlight-words-core": "^1.2.2",
 		"lodash": "^4.17.21",
 		"memize": "^1.1.0",
-		"moment": "^2.22.1",
+		"moment": "^2.26.0",
 		"re-resizable": "^6.4.0",
 		"react-colorful": "^5.3.1",
-		"react-dates": "^17.1.1",
-		"react-resize-aware": "^3.1.0",
+		"react-dates": "^21.8.0",
 		"reakit": "^1.3.8",
 		"uuid": "^8.3.0"
 	},
@@ -76,5 +76,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "4631d515033397fcfeda77e5755960253caef9bf"
+	"gitHead": "48d5f37dfb52d2e77c8eeb662f9874cf141b8c6b"
 }

package/src/alignment-matrix-control/index.js

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { noop } from 'lodash';
 import classnames from 'classnames';
 
 /**
@@ -20,6 +19,8 @@ import { Root, Row } from './styles/alignment-matrix-control-styles';
 import AlignmentMatrixControlIcon from './icon';
 import { GRID, getItemId } from './utils';
 
+const noop = () => {};
+
 function useBaseId( id ) {
 	const instanceId = useInstanceId(
 		AlignmentMatrixControl,
@@ -53,11 +54,13 @@ export default function AlignmentMatrixControl( {
 		onChange( nextValue );
 	};
 
+	const { setCurrentId } = composite;
+
 	useEffect( () => {
 		if ( typeof value !== 'undefined' ) {
-			composite.setCurrentId( getItemId( baseId, value ) );
+			setCurrentId( getItemId( baseId, value ) );
 		}
-	}, [ value, composite.setCurrentId ] );
+	}, [ value, setCurrentId, baseId ] );
 
 	const classes = classnames(
 		'component-alignment-matrix-control',

package/src/angle-picker-control/index.js

@@ -12,7 +12,7 @@ import { __ } from '@wordpress/i18n';
  * Internal dependencies
  */
 import { FlexBlock, FlexItem } from '../flex';
-import NumberControl from '../input-control';
+import NumberControl from '../number-control';
 import AngleCircle from './angle-circle';
 import { Root } from './styles/angle-picker-control-styles';
 import { space } from '../ui/utils/space';

package/src/autocomplete/autocompleter-ui.js

@@ -39,7 +39,7 @@ export function getAutoCompleterUI( autocompleter ) {
 
 		useLayoutEffect( () => {
 			onChangeOptions( items );
-		}, [ items ] );
+		}, [ onChangeOptions, items ] );
 
 		if ( ! items.length > 0 ) {
 			return null;

package/src/autocomplete/autocompleter-ui.native.js

@@ -71,7 +71,7 @@ export function getAutoCompleterUI( autocompleter ) {
 			} else if ( isVisible && text.length === 0 ) {
 				startAnimation( false );
 			}
-		}, [ items, isVisible, text ] );
+		}, [ onChangeOptions, items, isVisible, text, startAnimation ] );
 
 		const activeItemStyles = usePreferredColorSchemeStyle(
 			styles[ 'components-autocomplete__item-active' ],
@@ -111,7 +111,7 @@ export function getAutoCompleterUI( autocompleter ) {
 					}
 				} );
 			},
-			[ isVisible ]
+			[ animationValue, isVisible, reset ]
 		);
 
 		const contentStyles = {

package/src/autocomplete/index.js

@@ -11,6 +11,7 @@ import {
 	useEffect,
 	useState,
 	useRef,
+	useMemo,
 } from '@wordpress/element';
 import {
 	ENTER,
@@ -132,7 +133,7 @@ function useAutocomplete( {
 	const [ filterValue, setFilterValue ] = useState( '' );
 	const [ autocompleter, setAutocompleter ] = useState( null );
 	const [ AutocompleterUI, setAutocompleterUI ] = useState( null );
-	const [ backspacing, setBackspacing ] = useState( false );
+	const backspacing = useRef( false );
 
 	function insertCompletion( replacement ) {
 		const end = record.start;
@@ -218,7 +219,7 @@ function useAutocomplete( {
 	}
 
 	function handleKeyDown( event ) {
-		setBackspacing( event.keyCode === BACKSPACE );
+		backspacing.current = event.keyCode === BACKSPACE;
 
 		if ( ! autocompleter ) {
 			return;
@@ -268,11 +269,14 @@ function useAutocomplete( {
 		event.preventDefault();
 	}
 
-	let textContent;
-
-	if ( isCollapsed( record ) ) {
-		textContent = getTextContent( slice( record, 0 ) );
-	}
+	// textContent is a primitive (string), memoizing is not strictly necessary
+	// but this is a preemptive performance improvement, since the autocompleter
+	// is a potential bottleneck for the editor type metric.
+	const textContent = useMemo( () => {
+		if ( isCollapsed( record ) ) {
+			return getTextContent( slice( record, 0 ) );
+		}
+	}, [ record ] );
 
 	useEffect( () => {
 		if ( ! textContent ) {
@@ -325,7 +329,8 @@ function useAutocomplete( {
 				// Ex: "Some text @marcelo sekkkk" <--- "kkkk" caused a mismatch, but
 				// if the user presses backspace here, it will show the completion popup again.
 				const matchingWhileBackspacing =
-					backspacing && textWithoutTrigger.split( /\s/ ).length <= 3;
+					backspacing.current &&
+					textWithoutTrigger.split( /\s/ ).length <= 3;
 
 				if (
 					mismatch &&
@@ -370,7 +375,14 @@ function useAutocomplete( {
 				: AutocompleterUI
 		);
 		setFilterValue( query );
-	}, [ textContent ] );
+	}, [
+		textContent,
+		AutocompleterUI,
+		autocompleter,
+		completers,
+		record,
+		filteredOptions.length,
+	] );
 
 	const { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};
 	const { className } = autocompleter || {};

package/src/autocomplete/style.scss

@@ -1,4 +1,4 @@
-.components-autocomplete__popover .components-popover__content > div {
+.components-autocomplete__popover .components-popover__content {
 	padding: $grid-unit-20;
 	min-width: 220px;
 }

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

@@ -35,9 +35,8 @@ const BaseControlWithTextarea: ComponentStory< typeof BaseControl > = ( {
 	);
 };
 
-export const Default: ComponentStory<
-	typeof BaseControl
-> = BaseControlWithTextarea.bind( {} );
+export const Default: ComponentStory< typeof BaseControl > =
+	BaseControlWithTextarea.bind( {} );
 Default.args = {
 	__nextHasNoMarginBottom: true,
 	id: 'textarea-default-1',

package/src/border-box-control/border-box-control/README.md

@@ -122,23 +122,19 @@ _Note: The will be `undefined` if a user clears all borders._
 
 - Required: Yes
 
-### `popoverClassNames`: `Object`
+### `popoverPlacement`: `string`
 
-An object defining CSS classnames for all the inner `BorderControl` popover
-content.
+The position of the color popover relative to the control wrapper.
 
-Example:
-```js
-{
-	linked: 'linked-border-popover-content',
-	top: 'top-border-popover-content',
-	right: 'right-border-popover-content',
-	bottom: 'bottom-border-popover-content',
-	left: 'left-border-popover-content',
-}
-```
+By default, popovers are displayed relative to the button that initiated the popover. By supplying a popover placement, you force the popover to display in a specific location.
+
+The available base placements are 'top', 'right', 'bottom', 'left'. Each of these base placements has an alignment in the form -start and -end. For example, 'right-start', or 'bottom-end'. These allow you to align the tooltip to the edges of the button, rather than centering it.
+
+- Required: No
+
+### `popoverOffset`: `number`
 
-By default, popovers are displayed relative to the button that initiated the popover. By supplying classnames for each individual popover, it is possible to add styling rules to align the popover positions to an unrelated design element, for example, the sidebar inspector in the block editor.
+Works in conjunctions with `popoverPlacement` and allows leaving a space between the color popover and the control wrapper.
 
 - Required: No
 

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

@@ -2,6 +2,8 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
+import { useRef } from '@wordpress/element';
+import { useMergeRefs } from '@wordpress/compose';
 
 /**
  * Internal dependencies
@@ -51,16 +53,27 @@ const BorderBoxControl = (
 		linkedValue,
 		onLinkedChange,
 		onSplitChange,
-		popoverClassNames,
+		popoverPlacement,
+		popoverOffset,
 		splitValue,
 		toggleLinked,
 		__experimentalHasMultipleOrigins,
 		__experimentalIsRenderedInSidebar,
+		__next36pxDefaultSize = false,
 		...otherProps
 	} = useBorderBoxControl( props );
+	const containerRef = useRef();
+	const mergedRef = useMergeRefs( [ containerRef, forwardedRef ] );
+	const popoverProps = popoverPlacement
+		? {
+				placement: popoverPlacement,
+				offset: popoverOffset,
+				anchorRef: containerRef,
+		  }
+		: undefined;
 
 	return (
-		<View className={ className } { ...otherProps } ref={ forwardedRef }>
+		<View className={ className } { ...otherProps } ref={ mergedRef }>
 			<BorderLabel
 				label={ label }
 				hideLabelFromVision={ hideLabelFromVision }
@@ -77,7 +90,7 @@ const BorderBoxControl = (
 						placeholder={
 							hasMixedBorders ? __( 'Mixed' ) : undefined
 						}
-						popoverContentClassName={ popoverClassNames?.linked }
+						__unstablePopoverProps={ popoverProps }
 						shouldSanitizeBorder={ false } // This component will handle that.
 						value={ linkedValue }
 						withSlider={ true }
@@ -88,6 +101,7 @@ const BorderBoxControl = (
 						__experimentalIsRenderedInSidebar={
 							__experimentalIsRenderedInSidebar
 						}
+						__next36pxDefaultSize={ __next36pxDefaultSize }
 					/>
 				) : (
 					<BorderBoxControlSplitControls
@@ -96,7 +110,8 @@ const BorderBoxControl = (
 						enableAlpha={ enableAlpha }
 						enableStyle={ enableStyle }
 						onChange={ onSplitChange }
-						popoverClassNames={ popoverClassNames }
+						popoverPlacement={ popoverPlacement }
+						popoverOffset={ popoverOffset }
 						value={ splitValue }
 						__experimentalHasMultipleOrigins={
 							__experimentalHasMultipleOrigins
@@ -104,11 +119,13 @@ const BorderBoxControl = (
 						__experimentalIsRenderedInSidebar={
 							__experimentalIsRenderedInSidebar
 						}
+						__next36pxDefaultSize={ __next36pxDefaultSize }
 					/>
 				) }
 				<BorderBoxControlLinkedButton
 					onClick={ toggleLinked }
 					isLinked={ isLinked }
+					__next36pxDefaultSize={ __next36pxDefaultSize }
 				/>
 			</HStack>
 		</View>

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

@@ -98,11 +98,11 @@ export function useBorderBoxControl(
 	const cx = useCx();
 	const classes = useMemo( () => {
 		return cx( styles.BorderBoxControl, className );
-	}, [ className ] );
+	}, [ cx, className ] );
 
 	const linkedControlClassName = useMemo( () => {
 		return cx( styles.LinkedBorderControl );
-	}, [] );
+	}, [ cx ] );
 
 	return {
 		...otherProps,

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

@@ -19,11 +19,8 @@ const BorderBoxControlLinkedButton = (
 	props: WordPressComponentProps< LinkedButtonProps, 'div' >,
 	forwardedRef: React.ForwardedRef< any >
 ) => {
-	const {
-		className,
-		isLinked,
-		...buttonProps
-	} = useBorderBoxControlLinkedButton( props );
+	const { className, isLinked, ...buttonProps } =
+		useBorderBoxControlLinkedButton( props );
 	const label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );
 
 	return (

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

@@ -15,16 +15,20 @@ import type { LinkedButtonProps } from '../types';
 export function useBorderBoxControlLinkedButton(
 	props: WordPressComponentProps< LinkedButtonProps, 'div' >
 ) {
-	const { className, ...otherProps } = useContextSystem(
-		props,
-		'BorderBoxControlLinkedButton'
-	);
+	const {
+		className,
+		__next36pxDefaultSize = false,
+		...otherProps
+	} = useContextSystem( props, 'BorderBoxControlLinkedButton' );
 
 	// Generate class names.
 	const cx = useCx();
 	const classes = useMemo( () => {
-		return cx( styles.BorderBoxControlLinkedButton, className );
-	}, [ className ] );
+		return cx(
+			styles.BorderBoxControlLinkedButton( __next36pxDefaultSize ),
+			className
+		);
+	}, [ className, cx, __next36pxDefaultSize ] );
 
 	return { ...otherProps, className: classes };
 }