@wordpress/components 30.5.1-next.f56bd8138.0 → 30.6.1-next.b8c8708f3.0

package/build-module/range-control/tooltip.js

@@ -1,19 +1,8 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
-/**
- * WordPress dependencies
- */
-import { useCallback, useEffect, useState } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { Tooltip } from './styles/range-control-styles';
+import clsx from "clsx";
+import { useCallback, useEffect, useState } from "@wordpress/element";
+import { Tooltip } from "./styles/range-control-styles";
 import { jsx as _jsx } from "react/jsx-runtime";
-export default function SimpleTooltip(props) {
+function SimpleTooltip(props) {
   const {
     className,
     inputRef,
@@ -21,7 +10,7 @@ export default function SimpleTooltip(props) {
     show = false,
     style = {},
     value = 0,
-    renderTooltipContent = v => v,
+    renderTooltipContent = (v) => v,
     zIndex = 100,
     ...restProps
   } = props;
@@ -29,17 +18,17 @@ export default function SimpleTooltip(props) {
     inputRef,
     tooltipPlacement
   });
-  const classes = clsx('components-simple-tooltip', className);
+  const classes = clsx("components-simple-tooltip", className);
   const styles = {
     ...style,
     zIndex
   };
-  return /*#__PURE__*/_jsx(Tooltip, {
+  return /* @__PURE__ */ _jsx(Tooltip, {
     ...restProps,
     "aria-hidden": "false",
     className: classes,
-    placement: placement,
-    show: show,
+    placement,
+    show,
     role: "tooltip",
     style: styles,
     children: renderTooltipContent(value)
@@ -59,11 +48,14 @@ function useTooltipPlacement({
     setTooltipPlacement();
   }, [setTooltipPlacement]);
   useEffect(() => {
-    window.addEventListener('resize', setTooltipPlacement);
+    window.addEventListener("resize", setTooltipPlacement);
     return () => {
-      window.removeEventListener('resize', setTooltipPlacement);
+      window.removeEventListener("resize", setTooltipPlacement);
     };
   });
   return placement;
 }
-//# sourceMappingURL=tooltip.js.map
+export {
+  SimpleTooltip as default
+};
+//# sourceMappingURL=tooltip.js.map

package/build-module/range-control/tooltip.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["clsx","useCallback","useEffect","useState","Tooltip","jsx","_jsx","SimpleTooltip","props","className","inputRef","tooltipPlacement","show","style","value","renderTooltipContent","v","zIndex","restProps","placement","useTooltipPlacement","classes","styles","role","children","setPlacement","setTooltipPlacement","current","window","addEventListener","removeEventListener"],"sources":["@wordpress/components/src/range-control/tooltip.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Tooltip } from './styles/range-control-styles';\n\nimport type { TooltipProps } from './types';\nimport type { WordPressComponentProps } from '../context';\n\nexport default function SimpleTooltip(\n\tprops: WordPressComponentProps< TooltipProps, 'span' >\n) {\n\tconst {\n\t\tclassName,\n\t\tinputRef,\n\t\ttooltipPlacement,\n\t\tshow = false,\n\t\tstyle = {},\n\t\tvalue = 0,\n\t\trenderTooltipContent = ( v ) => v,\n\t\tzIndex = 100,\n\t\t...restProps\n\t} = props;\n\tconst placement = useTooltipPlacement( { inputRef, tooltipPlacement } );\n\tconst classes = clsx( 'components-simple-tooltip', className );\n\tconst styles = {\n\t\t...style,\n\t\tzIndex,\n\t};\n\n\treturn (\n\t\t<Tooltip\n\t\t\t{ ...restProps }\n\t\t\taria-hidden=\"false\"\n\t\t\tclassName={ classes }\n\t\t\tplacement={ placement }\n\t\t\tshow={ show }\n\t\t\trole=\"tooltip\"\n\t\t\tstyle={ styles }\n\t\t>\n\t\t\t{ renderTooltipContent( value ) }\n\t\t</Tooltip>\n\t);\n}\n\nfunction useTooltipPlacement( { inputRef, tooltipPlacement }: TooltipProps ) {\n\tconst [ placement, setPlacement ] = useState< string >();\n\n\tconst setTooltipPlacement = useCallback( () => {\n\t\tif ( inputRef && inputRef.current ) {\n\t\t\tsetPlacement( tooltipPlacement );\n\t\t}\n\t}, [ tooltipPlacement, inputRef ] );\n\n\tuseEffect( () => {\n\t\tsetTooltipPlacement();\n\t}, [ setTooltipPlacement ] );\n\n\tuseEffect( () => {\n\t\twindow.addEventListener( 'resize', setTooltipPlacement );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( 'resize', setTooltipPlacement );\n\t\t};\n\t} );\n\n\treturn placement;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,oBAAoB;;AAErE;AACA;AACA;AACA,SAASC,OAAO,QAAQ,+BAA+B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAKxD,eAAe,SAASC,aAAaA,CACpCC,KAAsD,EACrD;EACD,MAAM;IACLC,SAAS;IACTC,QAAQ;IACRC,gBAAgB;IAChBC,IAAI,GAAG,KAAK;IACZC,KAAK,GAAG,CAAC,CAAC;IACVC,KAAK,GAAG,CAAC;IACTC,oBAAoB,GAAKC,CAAC,IAAMA,CAAC;IACjCC,MAAM,GAAG,GAAG;IACZ,GAAGC;EACJ,CAAC,GAAGV,KAAK;EACT,MAAMW,SAAS,GAAGC,mBAAmB,CAAE;IAAEV,QAAQ;IAAEC;EAAiB,CAAE,CAAC;EACvE,MAAMU,OAAO,GAAGrB,IAAI,CAAE,2BAA2B,EAAES,SAAU,CAAC;EAC9D,MAAMa,MAAM,GAAG;IACd,GAAGT,KAAK;IACRI;EACD,CAAC;EAED,oBACCX,IAAA,CAACF,OAAO;IAAA,GACFc,SAAS;IACd,eAAY,OAAO;IACnBT,SAAS,EAAGY,OAAS;IACrBF,SAAS,EAAGA,SAAW;IACvBP,IAAI,EAAGA,IAAM;IACbW,IAAI,EAAC,SAAS;IACdV,KAAK,EAAGS,MAAQ;IAAAE,QAAA,EAEdT,oBAAoB,CAAED,KAAM;EAAC,CACvB,CAAC;AAEZ;AAEA,SAASM,mBAAmBA,CAAE;EAAEV,QAAQ;EAAEC;AAA+B,CAAC,EAAG;EAC5E,MAAM,CAAEQ,SAAS,EAAEM,YAAY,CAAE,GAAGtB,QAAQ,CAAW,CAAC;EAExD,MAAMuB,mBAAmB,GAAGzB,WAAW,CAAE,MAAM;IAC9C,IAAKS,QAAQ,IAAIA,QAAQ,CAACiB,OAAO,EAAG;MACnCF,YAAY,CAAEd,gBAAiB,CAAC;IACjC;EACD,CAAC,EAAE,CAAEA,gBAAgB,EAAED,QAAQ,CAAG,CAAC;EAEnCR,SAAS,CAAE,MAAM;IAChBwB,mBAAmB,CAAC,CAAC;EACtB,CAAC,EAAE,CAAEA,mBAAmB,CAAG,CAAC;EAE5BxB,SAAS,CAAE,MAAM;IAChB0B,MAAM,CAACC,gBAAgB,CAAE,QAAQ,EAAEH,mBAAoB,CAAC;IAExD,OAAO,MAAM;MACZE,MAAM,CAACE,mBAAmB,CAAE,QAAQ,EAAEJ,mBAAoB,CAAC;IAC5D,CAAC;EACF,CAAE,CAAC;EAEH,OAAOP,SAAS;AACjB","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/range-control/tooltip.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Tooltip } from './styles/range-control-styles';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function SimpleTooltip(props) {\n  const {\n    className,\n    inputRef,\n    tooltipPlacement,\n    show = false,\n    style = {},\n    value = 0,\n    renderTooltipContent = v => v,\n    zIndex = 100,\n    ...restProps\n  } = props;\n  const placement = useTooltipPlacement({\n    inputRef,\n    tooltipPlacement\n  });\n  const classes = clsx('components-simple-tooltip', className);\n  const styles = {\n    ...style,\n    zIndex\n  };\n  return /*#__PURE__*/_jsx(Tooltip, {\n    ...restProps,\n    \"aria-hidden\": \"false\",\n    className: classes,\n    placement: placement,\n    show: show,\n    role: \"tooltip\",\n    style: styles,\n    children: renderTooltipContent(value)\n  });\n}\nfunction useTooltipPlacement({\n  inputRef,\n  tooltipPlacement\n}) {\n  const [placement, setPlacement] = useState();\n  const setTooltipPlacement = useCallback(() => {\n    if (inputRef && inputRef.current) {\n      setPlacement(tooltipPlacement);\n    }\n  }, [tooltipPlacement, inputRef]);\n  useEffect(() => {\n    setTooltipPlacement();\n  }, [setTooltipPlacement]);\n  useEffect(() => {\n    window.addEventListener('resize', setTooltipPlacement);\n    return () => {\n      window.removeEventListener('resize', setTooltipPlacement);\n    };\n  });\n  return placement;\n}"],
+  "mappings": "AAGA,OAAO,UAAU;AAKjB,SAAS,aAAa,WAAW,gBAAgB;AAKjD,SAAS,eAAe;AACxB,SAAS,OAAO,YAAY;AACb,SAAR,cAA+B,OAAO;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,QAAQ,CAAC;AAAA,IACT,QAAQ;AAAA,IACR,uBAAuB,OAAK;AAAA,IAC5B,SAAS;AAAA,IACT,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,YAAY,oBAAoB;AAAA,IACpC;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,UAAU,KAAK,6BAA6B,SAAS;AAC3D,QAAM,SAAS;AAAA,IACb,GAAG;AAAA,IACH;AAAA,EACF;AACA,SAAoB,qBAAK,SAAS;AAAA,IAChC,GAAG;AAAA,IACH,eAAe;AAAA,IACf,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,OAAO;AAAA,IACP,UAAU,qBAAqB,KAAK;AAAA,EACtC,CAAC;AACH;AACA,SAAS,oBAAoB;AAAA,EAC3B;AAAA,EACA;AACF,GAAG;AACD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS;AAC3C,QAAM,sBAAsB,YAAY,MAAM;AAC5C,QAAI,YAAY,SAAS,SAAS;AAChC,mBAAa,gBAAgB;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,kBAAkB,QAAQ,CAAC;AAC/B,YAAU,MAAM;AACd,wBAAoB;AAAA,EACtB,GAAG,CAAC,mBAAmB,CAAC;AACxB,YAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,mBAAmB;AACrD,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,mBAAmB;AAAA,IAC1D;AAAA,EACF,CAAC;AACD,SAAO;AACT;",
+  "names": []
+}

package/build-module/range-control/types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=types.js.map
+//# sourceMappingURL=types.js.map

package/build-module/range-control/types.js.map

@@ -1 +1,7 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/range-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tCSSProperties,\n\tFocusEventHandler,\n\tMouseEventHandler,\n\tMutableRefObject,\n} from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { BaseControlProps } from '../base-control/types';\nimport type { IconType } from '../icon';\n\nexport type NumericProps = {\n\t/**\n\t * The minimum `value` allowed.\n\t *\n\t * @default 0\n\t */\n\tmin?: number;\n\t/**\n\t * The maximum `value` allowed.\n\t *\n\t * @default 100\n\t */\n\tmax?: number;\n\t/**\n\t * The current value of the range slider.\n\t */\n\tvalue?: number;\n};\n\nexport type RangeMark = { value: number; label?: string };\n// An expanded definition of this type is used in MarkProps to improve Storybook\n// generated docs.\nexport type RangeMarks = boolean | RangeMark[];\n\nexport type MarksProps = NumericProps & {\n\t/**\n\t * Disables the `input`, preventing new values from being applied.\n\t *\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Renders a visual representation of `step` ticks. Custom mark indicators\n\t * can be provided by an `Array`.\n\t *\n\t * @default false\n\t */\n\tmarks?: boolean | { value: number; label?: string }[];\n\t/**\n\t * The minimum amount by which `value` changes. It is also a factor in\n\t * validation as `value` must be a multiple of `step` (offset by `min`) to\n\t * be valid. Accepts the special string value `any` that voids the\n\t * validation constraint and overrides both `withInputField` and\n\t * `showTooltip` props to `false`.\n\t *\n\t * @default 1\n\t */\n\tstep?: number | 'any';\n};\n\nexport type RangeMarkProps = {\n\tisFilled?: boolean;\n\tlabel?: string;\n\tdisabled?: boolean;\n\tkey?: string;\n\tstyle?: CSSProperties;\n};\n\nexport type ControlledRangeValue = number | '' | null;\n\nexport type RangeControlProps = Pick<\n\tBaseControlProps,\n\t'hideLabelFromVision' | 'help' | '__nextHasNoMarginBottom'\n> &\n\tMarksProps & {\n\t\t/**\n\t\t * If this property is added, an Icon component will be rendered\n\t\t * after the slider with the icon equal to afterIcon.\n\t\t *\n\t\t * For more information on `IconType` see the Icon component:\n\t\t * /packages/components/src/icon/index.tsx\n\t\t */\n\t\tafterIcon?: IconType;\n\t\t/**\n\t\t * If this property is true, a button to reset the slider is\n\t\t * rendered.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tallowReset?: boolean;\n\t\t/**\n\t\t * If this property is added, an Icon component will be rendered\n\t\t * before the slider with the icon equal to beforeIcon.\n\t\t *\n\t\t * For more information on `IconType` see the Icon component:\n\t\t * /packages/components/src/icon/index.tsx\n\t\t */\n\t\tbeforeIcon?: IconType;\n\t\t/**\n\t\t * CSS color string for the `RangeControl` wrapper.\n\t\t *\n\t\t * @default COLORS.theme.accent\n\t\t * @see /packages/components/src/utils/colors-values.js\n\t\t */\n\t\tcolor?: CSSProperties[ 'color' ];\n\t\t/**\n\t\t * The current input to use as a fallback if `value` is currently\n\t\t * `undefined`.\n\t\t */\n\t\tcurrentInput?: number;\n\t\t/**\n\t\t * An icon to be shown above the slider next to its container title.\n\t\t */\n\t\ticon?: string;\n\t\t/**\n\t\t * The slider starting position, used when no `value` is passed.\n\t\t * The `initialPosition` will be clamped between the provided `min`\n\t\t * and `max` prop values.\n\t\t */\n\t\tinitialPosition?: number;\n\t\t/**\n\t\t * Passed as a prop to the `NumberControl` component and is only\n\t\t * applicable if `withInputField` is true. If true, while the number\n\t\t * input has focus, pressing `UP` or `DOWN` along with the `SHIFT` key\n\t\t * will change the value by the `shiftStep` value.\n\t\t *\n\t\t * @default true\n\t\t */\n\t\tisShiftStepEnabled?: boolean;\n\t\t/**\n\t\t * If this property is added, a label will be generated using label\n\t\t * property as the content.\n\t\t */\n\t\tlabel?: string;\n\t\t/**\n\t\t * Callback for when `RangeControl` input loses focus.\n\t\t *\n\t\t * @default () => void\n\t\t */\n\t\tonBlur?: FocusEventHandler< HTMLInputElement >;\n\t\t/**\n\t\t * A function that receives the new value. The value will be less than\n\t\t * `max` and more than `min` unless a reset (enabled by `allowReset`)\n\t\t * has occurred. In which case the value will be either that of\n\t\t * `resetFallbackValue` if it has been specified or otherwise\n\t\t * `undefined`.\n\t\t *\n\t\t * @default () => void\n\t\t */\n\t\tonChange?: ( value?: number ) => void;\n\t\t/**\n\t\t * Callback for when `RangeControl` input gains focus.\n\t\t *\n\t\t * @default () => void\n\t\t */\n\t\tonFocus?: FocusEventHandler< HTMLInputElement >;\n\t\t/**\n\t\t * Callback for when mouse exits the `RangeControl`.\n\t\t *\n\t\t * @default () => void\n\t\t */\n\t\tonMouseLeave?: MouseEventHandler< HTMLInputElement >;\n\t\t/**\n\t\t * Callback for when mouse moves within the `RangeControl`.\n\t\t *\n\t\t * @default () => void\n\t\t */\n\t\tonMouseMove?: MouseEventHandler< HTMLInputElement >;\n\t\t/**\n\t\t * CSS color string to customize the rail element's background.\n\t\t */\n\t\trailColor?: CSSProperties[ 'color' ];\n\t\t/**\n\t\t * A way to customize the rendered UI of the value.\n\t\t *\n\t\t * @default ( value ) => value\n\t\t */\n\t\trenderTooltipContent?: (\n\t\t\tvalue?: ControlledRangeValue\n\t\t) => string | number | null | undefined;\n\t\t/**\n\t\t * The value to revert to if the Reset button is clicked (enabled by\n\t\t * `allowReset`)\n\t\t */\n\t\tresetFallbackValue?: number;\n\t\t/**\n\t\t * Define if separator line under/above control row should be disabled\n\t\t * or full width. By default it is placed below excluding underline the\n\t\t * control icon.\n\t\t */\n\t\tseparatorType?: 'none' | 'fullWidth' | 'topFullWidth';\n\t\t/**\n\t\t * Passed as a prop to the `NumberControl` component and is only\n\t\t * applicable if `withInputField` and `isShiftStepEnabled` are both true\n\t\t * and while the number input has focus. Acts as a multiplier of `step`.\n\t\t *\n\t\t * @default 10\n\t\t */\n\t\tshiftStep?: number;\n\t\t/**\n\t\t * Start opting into the larger default height that will become the default size in a future version.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\t__next40pxDefaultSize?: boolean;\n\t\t/**\n\t\t * Forcing the Tooltip UI to show or hide. This is overridden to `false`\n\t\t * when `step` is set to the special string value `any`.\n\t\t */\n\t\tshowTooltip?: boolean;\n\t\t/**\n\t\t * CSS color string to customize the track element's background.\n\t\t */\n\t\ttrackColor?: CSSProperties[ 'color' ];\n\t\t/**\n\t\t * Define if the value selection should present a stepper control or a\n\t\t * slider control in the bottom sheet on mobile. To use the stepper set\n\t\t * the type value as `stepper`. Defaults to slider if no option is\n\t\t * provided.\n\t\t */\n\t\ttype?: 'stepper';\n\t\t/**\n\t\t * Determines if the `input` number field will render next to the\n\t\t * RangeControl. This is overridden to `false` when `step` is set to the\n\t\t * special string value `any`.\n\t\t *\n\t\t * @default true\n\t\t */\n\t\twithInputField?: boolean;\n\t\t/**\n\t\t * Do not throw a warning for the deprecated 36px default size.\n\t\t * For internal components of other components that already throw the warning.\n\t\t *\n\t\t * @ignore\n\t\t */\n\t\t__shouldNotWarnDeprecated36pxSize?: boolean;\n\t};\n\nexport type RailProps = MarksProps & {\n\trailColor?: CSSProperties[ 'color' ];\n};\n\nexport type InputRangeProps = {\n\tdescribedBy?: string;\n\tlabel?: string;\n\tonMouseLeave?: MouseEventHandler< HTMLInputElement >;\n\tonMouseMove?: MouseEventHandler< HTMLInputElement >;\n\tvalue?: number | '';\n};\n\nexport type WrapperProps = Pick<\n\tBaseControlProps,\n\t'__nextHasNoMarginBottom'\n> & {\n\tcolor?: CSSProperties[ 'color' ];\n\tmarks?: RangeMarks;\n};\n\nexport type ThumbProps = {\n\tisFocused?: boolean;\n\tdisabled?: boolean;\n};\n\nexport type TooltipProps = {\n\tshow?: boolean;\n\tplacement?: string;\n\tinputRef?: MutableRefObject< HTMLElement | undefined >;\n\ttooltipPlacement?: string;\n\tvalue?: ControlledRangeValue;\n\trenderTooltipContent?: (\n\t\tvalue?: ControlledRangeValue\n\t) => string | number | null | undefined;\n\tzIndex?: number;\n};\n\nexport type TrackProps = {\n\tdisabled: boolean;\n\ttrackColor: CSSProperties[ 'color' ];\n};\n\nexport type UseControlledRangeValueArgs = {\n\t/**\n\t * The initial value.\n\t */\n\tinitial?: number;\n\t/**\n\t * The maximum value.\n\t */\n\tmax: number;\n\t/**\n\t * The minimum value.\n\t */\n\tmin: number;\n\t/**\n\t * The current value.\n\t */\n\tvalue: number | null;\n};\n\nexport type UseMarksArgs = NumericProps & {\n\tmarks: RangeMarks;\n\tstep: number;\n};\n"],"mappings":"","ignoreList":[]}
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/range-control/utils.js

@@ -1,36 +1,13 @@
-/**
- * WordPress dependencies
- */
-import { useCallback } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { useControlledState } from '../utils/hooks';
-import { clamp } from '../utils/math';
-/**
- * A float supported clamp function for a specific value.
- *
- * @param value The value to clamp.
- * @param min   The minimum value.
- * @param max   The maximum value.
- *
- * @return A (float) number
- */
-export function floatClamp(value, min, max) {
-  if (typeof value !== 'number') {
+import { useCallback } from "@wordpress/element";
+import { useControlledState } from "../utils/hooks";
+import { clamp } from "../utils/math";
+function floatClamp(value, min, max) {
+  if (typeof value !== "number") {
     return null;
   }
   return parseFloat(`${clamp(value, min, max)}`);
 }
-
-/**
- * Hook to store a clamped value, derived from props.
- *
- * @param settings
- * @return The controlled value and the value setter.
- */
-export function useControlledRangeValue(settings) {
+function useControlledRangeValue(settings) {
   const {
     min,
     max,
@@ -41,16 +18,17 @@ export function useControlledRangeValue(settings) {
     initial: floatClamp(initial !== null && initial !== void 0 ? initial : null, min, max),
     fallback: null
   });
-  const setState = useCallback(nextValue => {
+  const setState = useCallback((nextValue) => {
     if (nextValue === null) {
       setInternalState(null);
     } else {
       setInternalState(floatClamp(nextValue, min, max));
     }
   }, [min, max, setInternalState]);
-
-  // `state` can't be an empty string because we specified a fallback value of
-  // `null` in `useControlledState`
   return [state, setState];
 }
-//# sourceMappingURL=utils.js.map
+export {
+  floatClamp,
+  useControlledRangeValue
+};
+//# sourceMappingURL=utils.js.map

package/build-module/range-control/utils.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["useCallback","useControlledState","clamp","floatClamp","value","min","max","parseFloat","useControlledRangeValue","settings","valueProp","initial","state","setInternalState","fallback","setState","nextValue"],"sources":["@wordpress/components/src/range-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useControlledState } from '../utils/hooks';\nimport { clamp } from '../utils/math';\n\nimport type { UseControlledRangeValueArgs } from './types';\n\n/**\n * A float supported clamp function for a specific value.\n *\n * @param value The value to clamp.\n * @param min   The minimum value.\n * @param max   The maximum value.\n *\n * @return A (float) number\n */\nexport function floatClamp( value: number | null, min: number, max: number ) {\n\tif ( typeof value !== 'number' ) {\n\t\treturn null;\n\t}\n\n\treturn parseFloat( `${ clamp( value, min, max ) }` );\n}\n\n/**\n * Hook to store a clamped value, derived from props.\n *\n * @param settings\n * @return The controlled value and the value setter.\n */\nexport function useControlledRangeValue(\n\tsettings: UseControlledRangeValueArgs\n) {\n\tconst { min, max, value: valueProp, initial } = settings;\n\tconst [ state, setInternalState ] = useControlledState(\n\t\tfloatClamp( valueProp, min, max ),\n\t\t{\n\t\t\tinitial: floatClamp( initial ?? null, min, max ),\n\t\t\tfallback: null,\n\t\t}\n\t);\n\n\tconst setState = useCallback(\n\t\t( nextValue: number | null ) => {\n\t\t\tif ( nextValue === null ) {\n\t\t\t\tsetInternalState( null );\n\t\t\t} else {\n\t\t\t\tsetInternalState( floatClamp( nextValue, min, max ) );\n\t\t\t}\n\t\t},\n\t\t[ min, max, setInternalState ]\n\t);\n\n\t// `state` can't be an empty string because we specified a fallback value of\n\t// `null` in `useControlledState`\n\treturn [ state as Exclude< typeof state, '' >, setState ] as const;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAW,QAAQ,oBAAoB;;AAEhD;AACA;AACA;AACA,SAASC,kBAAkB,QAAQ,gBAAgB;AACnD,SAASC,KAAK,QAAQ,eAAe;AAIrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,UAAUA,CAAEC,KAAoB,EAAEC,GAAW,EAAEC,GAAW,EAAG;EAC5E,IAAK,OAAOF,KAAK,KAAK,QAAQ,EAAG;IAChC,OAAO,IAAI;EACZ;EAEA,OAAOG,UAAU,CAAE,GAAIL,KAAK,CAAEE,KAAK,EAAEC,GAAG,EAAEC,GAAI,CAAC,EAAI,CAAC;AACrD;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASE,uBAAuBA,CACtCC,QAAqC,EACpC;EACD,MAAM;IAAEJ,GAAG;IAAEC,GAAG;IAAEF,KAAK,EAAEM,SAAS;IAAEC;EAAQ,CAAC,GAAGF,QAAQ;EACxD,MAAM,CAAEG,KAAK,EAAEC,gBAAgB,CAAE,GAAGZ,kBAAkB,CACrDE,UAAU,CAAEO,SAAS,EAAEL,GAAG,EAAEC,GAAI,CAAC,EACjC;IACCK,OAAO,EAAER,UAAU,CAAEQ,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAI,IAAI,EAAEN,GAAG,EAAEC,GAAI,CAAC;IAChDQ,QAAQ,EAAE;EACX,CACD,CAAC;EAED,MAAMC,QAAQ,GAAGf,WAAW,CACzBgB,SAAwB,IAAM;IAC/B,IAAKA,SAAS,KAAK,IAAI,EAAG;MACzBH,gBAAgB,CAAE,IAAK,CAAC;IACzB,CAAC,MAAM;MACNA,gBAAgB,CAAEV,UAAU,CAAEa,SAAS,EAAEX,GAAG,EAAEC,GAAI,CAAE,CAAC;IACtD;EACD,CAAC,EACD,CAAED,GAAG,EAAEC,GAAG,EAAEO,gBAAgB,CAC7B,CAAC;;EAED;EACA;EACA,OAAO,CAAED,KAAK,EAAiCG,QAAQ,CAAE;AAC1D","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/range-control/utils.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useControlledState } from '../utils/hooks';\nimport { clamp } from '../utils/math';\n/**\n * A float supported clamp function for a specific value.\n *\n * @param value The value to clamp.\n * @param min   The minimum value.\n * @param max   The maximum value.\n *\n * @return A (float) number\n */\nexport function floatClamp(value, min, max) {\n  if (typeof value !== 'number') {\n    return null;\n  }\n  return parseFloat(`${clamp(value, min, max)}`);\n}\n\n/**\n * Hook to store a clamped value, derived from props.\n *\n * @param settings\n * @return The controlled value and the value setter.\n */\nexport function useControlledRangeValue(settings) {\n  const {\n    min,\n    max,\n    value: valueProp,\n    initial\n  } = settings;\n  const [state, setInternalState] = useControlledState(floatClamp(valueProp, min, max), {\n    initial: floatClamp(initial !== null && initial !== void 0 ? initial : null, min, max),\n    fallback: null\n  });\n  const setState = useCallback(nextValue => {\n    if (nextValue === null) {\n      setInternalState(null);\n    } else {\n      setInternalState(floatClamp(nextValue, min, max));\n    }\n  }, [min, max, setInternalState]);\n\n  // `state` can't be an empty string because we specified a fallback value of\n  // `null` in `useControlledState`\n  return [state, setState];\n}"],
+  "mappings": "AAGA,SAAS,mBAAmB;AAK5B,SAAS,0BAA0B;AACnC,SAAS,aAAa;AAUf,SAAS,WAAW,OAAO,KAAK,KAAK;AAC1C,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,EACT;AACA,SAAO,WAAW,GAAG,MAAM,OAAO,KAAK,GAAG,CAAC,EAAE;AAC/C;AAQO,SAAS,wBAAwB,UAAU;AAChD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,EACF,IAAI;AACJ,QAAM,CAAC,OAAO,gBAAgB,IAAI,mBAAmB,WAAW,WAAW,KAAK,GAAG,GAAG;AAAA,IACpF,SAAS,WAAW,YAAY,QAAQ,YAAY,SAAS,UAAU,MAAM,KAAK,GAAG;AAAA,IACrF,UAAU;AAAA,EACZ,CAAC;AACD,QAAM,WAAW,YAAY,eAAa;AACxC,QAAI,cAAc,MAAM;AACtB,uBAAiB,IAAI;AAAA,IACvB,OAAO;AACL,uBAAiB,WAAW,WAAW,KAAK,GAAG,CAAC;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,KAAK,KAAK,gBAAgB,CAAC;AAI/B,SAAO,CAAC,OAAO,QAAQ;AACzB;",
+  "names": []
+}

package/build-module/resizable-box/index.js

@@ -1,40 +1,28 @@
-/**
- * WordPress dependencies
- */
-import { forwardRef } from '@wordpress/element';
-
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-import { Resizable } from 're-resizable';
-/**
- * Internal dependencies
- */
-import ResizeTooltip from './resize-tooltip';
+import { forwardRef } from "@wordpress/element";
+import clsx from "clsx";
+import { Resizable } from "re-resizable";
+import ResizeTooltip from "./resize-tooltip";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const HANDLE_CLASS_NAME = 'components-resizable-box__handle';
-const SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';
-const CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';
+const HANDLE_CLASS_NAME = "components-resizable-box__handle";
+const SIDE_HANDLE_CLASS_NAME = "components-resizable-box__side-handle";
+const CORNER_HANDLE_CLASS_NAME = "components-resizable-box__corner-handle";
 const HANDLE_CLASSES = {
-  top: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top'),
-  right: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-right'),
-  bottom: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom'),
-  left: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-left'),
-  topLeft: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top', 'components-resizable-box__handle-left'),
-  topRight: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top', 'components-resizable-box__handle-right'),
-  bottomRight: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom', 'components-resizable-box__handle-right'),
-  bottomLeft: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom', 'components-resizable-box__handle-left')
+  top: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, "components-resizable-box__handle-top"),
+  right: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, "components-resizable-box__handle-right"),
+  bottom: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, "components-resizable-box__handle-bottom"),
+  left: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, "components-resizable-box__handle-left"),
+  topLeft: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, "components-resizable-box__handle-top", "components-resizable-box__handle-left"),
+  topRight: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, "components-resizable-box__handle-top", "components-resizable-box__handle-right"),
+  bottomRight: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, "components-resizable-box__handle-bottom", "components-resizable-box__handle-right"),
+  bottomLeft: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, "components-resizable-box__handle-bottom", "components-resizable-box__handle-left")
 };
-
-// Removes the inline styles in the drag handles.
 const HANDLE_STYLES_OVERRIDES = {
-  width: undefined,
-  height: undefined,
-  top: undefined,
-  right: undefined,
-  bottom: undefined,
-  left: undefined
+  width: void 0,
+  height: void 0,
+  top: void 0,
+  right: void 0,
+  bottom: void 0,
+  left: void 0
 };
 const HANDLE_STYLES = {
   top: HANDLE_STYLES_OVERRIDES,
@@ -54,25 +42,24 @@ function UnforwardedResizableBox({
   __experimentalTooltipProps: tooltipProps = {},
   ...props
 }, ref) {
-  return /*#__PURE__*/_jsxs(Resizable, {
-    className: clsx('components-resizable-box__container', showHandle && 'has-show-handle', className)
-    // Add a focusable element within the drag handle. Unfortunately,
-    // `re-resizable` does not make them properly focusable by default,
-    // causing focus to move the the block wrapper which triggers block
-    // drag.
-    ,
-    handleComponent: Object.fromEntries(Object.keys(HANDLE_CLASSES).map(key => [key, /*#__PURE__*/_jsx("div", {
+  return /* @__PURE__ */ _jsxs(Resizable, {
+    className: clsx("components-resizable-box__container", showHandle && "has-show-handle", className),
+    handleComponent: Object.fromEntries(Object.keys(HANDLE_CLASSES).map((key) => [key, /* @__PURE__ */ _jsx("div", {
       tabIndex: -1
     }, key)])),
     handleClasses: HANDLE_CLASSES,
     handleStyles: HANDLE_STYLES,
-    ref: ref,
+    ref,
     ...props,
-    children: [children, showTooltip && /*#__PURE__*/_jsx(ResizeTooltip, {
+    children: [children, showTooltip && /* @__PURE__ */ _jsx(ResizeTooltip, {
       ...tooltipProps
     })]
   });
 }
-export const ResizableBox = forwardRef(UnforwardedResizableBox);
-export default ResizableBox;
-//# sourceMappingURL=index.js.map
+const ResizableBox = forwardRef(UnforwardedResizableBox);
+var resizable_box_default = ResizableBox;
+export {
+  ResizableBox,
+  resizable_box_default as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/resizable-box/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["forwardRef","clsx","Resizable","ResizeTooltip","jsx","_jsx","jsxs","_jsxs","HANDLE_CLASS_NAME","SIDE_HANDLE_CLASS_NAME","CORNER_HANDLE_CLASS_NAME","HANDLE_CLASSES","top","right","bottom","left","topLeft","topRight","bottomRight","bottomLeft","HANDLE_STYLES_OVERRIDES","width","undefined","height","HANDLE_STYLES","UnforwardedResizableBox","className","children","showHandle","__experimentalShowTooltip","showTooltip","__experimentalTooltipProps","tooltipProps","props","ref","handleComponent","Object","fromEntries","keys","map","key","tabIndex","handleClasses","handleStyles","ResizableBox"],"sources":["@wordpress/components/src/resizable-box/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { Resizable } from 're-resizable';\nimport type { ResizableProps } from 're-resizable';\nimport type { ReactNode, ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ResizeTooltip from './resize-tooltip';\n\nconst HANDLE_CLASS_NAME = 'components-resizable-box__handle';\nconst SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';\nconst CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';\n\nconst HANDLE_CLASSES = {\n\ttop: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top'\n\t),\n\tright: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottom: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom'\n\t),\n\tleft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopLeft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopRight: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomRight: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomLeft: clsx(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-left'\n\t),\n};\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDES = {\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\nconst HANDLE_STYLES = {\n\ttop: HANDLE_STYLES_OVERRIDES,\n\tright: HANDLE_STYLES_OVERRIDES,\n\tbottom: HANDLE_STYLES_OVERRIDES,\n\tleft: HANDLE_STYLES_OVERRIDES,\n\ttopLeft: HANDLE_STYLES_OVERRIDES,\n\ttopRight: HANDLE_STYLES_OVERRIDES,\n\tbottomRight: HANDLE_STYLES_OVERRIDES,\n\tbottomLeft: HANDLE_STYLES_OVERRIDES,\n};\n\ntype ResizableBoxProps = ResizableProps & {\n\tchildren: ReactNode;\n\tshowHandle?: boolean;\n\t__experimentalShowTooltip?: boolean;\n\t__experimentalTooltipProps?: Parameters< typeof ResizeTooltip >[ 0 ];\n};\n\nfunction UnforwardedResizableBox(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tshowHandle = true,\n\t\t__experimentalShowTooltip: showTooltip = false,\n\t\t__experimentalTooltipProps: tooltipProps = {},\n\t\t...props\n\t}: ResizableBoxProps,\n\tref: ForwardedRef< Resizable >\n): JSX.Element {\n\treturn (\n\t\t<Resizable\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-resizable-box__container',\n\t\t\t\tshowHandle && 'has-show-handle',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\t// Add a focusable element within the drag handle. Unfortunately,\n\t\t\t// `re-resizable` does not make them properly focusable by default,\n\t\t\t// causing focus to move the the block wrapper which triggers block\n\t\t\t// drag.\n\t\t\thandleComponent={ Object.fromEntries(\n\t\t\t\tObject.keys( HANDLE_CLASSES ).map( ( key ) => [\n\t\t\t\t\tkey,\n\t\t\t\t\t<div key={ key } tabIndex={ -1 } />,\n\t\t\t\t] )\n\t\t\t) }\n\t\t\thandleClasses={ HANDLE_CLASSES }\n\t\t\thandleStyles={ HANDLE_STYLES }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ showTooltip && <ResizeTooltip { ...tooltipProps } /> }\n\t\t</Resizable>\n\t);\n}\n\nexport const ResizableBox = forwardRef( UnforwardedResizableBox );\n\nexport default ResizableBox;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,IAAI,MAAM,MAAM;AACvB,SAASC,SAAS,QAAQ,cAAc;AAIxC;AACA;AACA;AACA,OAAOC,aAAa,MAAM,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE7C,MAAMC,iBAAiB,GAAG,kCAAkC;AAC5D,MAAMC,sBAAsB,GAAG,uCAAuC;AACtE,MAAMC,wBAAwB,GAAG,yCAAyC;AAE1E,MAAMC,cAAc,GAAG;EACtBC,GAAG,EAAEX,IAAI,CACRO,iBAAiB,EACjBC,sBAAsB,EACtB,sCACD,CAAC;EACDI,KAAK,EAAEZ,IAAI,CACVO,iBAAiB,EACjBC,sBAAsB,EACtB,wCACD,CAAC;EACDK,MAAM,EAAEb,IAAI,CACXO,iBAAiB,EACjBC,sBAAsB,EACtB,yCACD,CAAC;EACDM,IAAI,EAAEd,IAAI,CACTO,iBAAiB,EACjBC,sBAAsB,EACtB,uCACD,CAAC;EACDO,OAAO,EAAEf,IAAI,CACZO,iBAAiB,EACjBE,wBAAwB,EACxB,sCAAsC,EACtC,uCACD,CAAC;EACDO,QAAQ,EAAEhB,IAAI,CACbO,iBAAiB,EACjBE,wBAAwB,EACxB,sCAAsC,EACtC,wCACD,CAAC;EACDQ,WAAW,EAAEjB,IAAI,CAChBO,iBAAiB,EACjBE,wBAAwB,EACxB,yCAAyC,EACzC,wCACD,CAAC;EACDS,UAAU,EAAElB,IAAI,CACfO,iBAAiB,EACjBE,wBAAwB,EACxB,yCAAyC,EACzC,uCACD;AACD,CAAC;;AAED;AACA,MAAMU,uBAAuB,GAAG;EAC/BC,KAAK,EAAEC,SAAS;EAChBC,MAAM,EAAED,SAAS;EACjBV,GAAG,EAAEU,SAAS;EACdT,KAAK,EAAES,SAAS;EAChBR,MAAM,EAAEQ,SAAS;EACjBP,IAAI,EAAEO;AACP,CAAC;AACD,MAAME,aAAa,GAAG;EACrBZ,GAAG,EAAEQ,uBAAuB;EAC5BP,KAAK,EAAEO,uBAAuB;EAC9BN,MAAM,EAAEM,uBAAuB;EAC/BL,IAAI,EAAEK,uBAAuB;EAC7BJ,OAAO,EAAEI,uBAAuB;EAChCH,QAAQ,EAAEG,uBAAuB;EACjCF,WAAW,EAAEE,uBAAuB;EACpCD,UAAU,EAAEC;AACb,CAAC;AASD,SAASK,uBAAuBA,CAC/B;EACCC,SAAS;EACTC,QAAQ;EACRC,UAAU,GAAG,IAAI;EACjBC,yBAAyB,EAAEC,WAAW,GAAG,KAAK;EAC9CC,0BAA0B,EAAEC,YAAY,GAAG,CAAC,CAAC;EAC7C,GAAGC;AACe,CAAC,EACpBC,GAA8B,EAChB;EACd,oBACC3B,KAAA,CAACL,SAAS;IACTwB,SAAS,EAAGzB,IAAI,CACf,qCAAqC,EACrC2B,UAAU,IAAI,iBAAiB,EAC/BF,SACD;IACA;IACA;IACA;IACA;IAAA;IACAS,eAAe,EAAGC,MAAM,CAACC,WAAW,CACnCD,MAAM,CAACE,IAAI,CAAE3B,cAAe,CAAC,CAAC4B,GAAG,CAAIC,GAAG,IAAM,CAC7CA,GAAG,eACHnC,IAAA;MAAiBoC,QAAQ,EAAG,CAAC;IAAG,GAArBD,GAAuB,CAAC,CAClC,CACH,CAAG;IACHE,aAAa,EAAG/B,cAAgB;IAChCgC,YAAY,EAAGnB,aAAe;IAC9BU,GAAG,EAAGA,GAAK;IAAA,GACND,KAAK;IAAAN,QAAA,GAERA,QAAQ,EACRG,WAAW,iBAAIzB,IAAA,CAACF,aAAa;MAAA,GAAM6B;IAAY,CAAI,CAAC;EAAA,CAC5C,CAAC;AAEd;AAEA,OAAO,MAAMY,YAAY,GAAG5C,UAAU,CAAEyB,uBAAwB,CAAC;AAEjE,eAAemB,YAAY","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/resizable-box/index.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { Resizable } from 're-resizable';\n/**\n * Internal dependencies\n */\nimport ResizeTooltip from './resize-tooltip';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst HANDLE_CLASS_NAME = 'components-resizable-box__handle';\nconst SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';\nconst CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';\nconst HANDLE_CLASSES = {\n  top: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top'),\n  right: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-right'),\n  bottom: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom'),\n  left: clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-left'),\n  topLeft: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top', 'components-resizable-box__handle-left'),\n  topRight: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top', 'components-resizable-box__handle-right'),\n  bottomRight: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom', 'components-resizable-box__handle-right'),\n  bottomLeft: clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom', 'components-resizable-box__handle-left')\n};\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDES = {\n  width: undefined,\n  height: undefined,\n  top: undefined,\n  right: undefined,\n  bottom: undefined,\n  left: undefined\n};\nconst HANDLE_STYLES = {\n  top: HANDLE_STYLES_OVERRIDES,\n  right: HANDLE_STYLES_OVERRIDES,\n  bottom: HANDLE_STYLES_OVERRIDES,\n  left: HANDLE_STYLES_OVERRIDES,\n  topLeft: HANDLE_STYLES_OVERRIDES,\n  topRight: HANDLE_STYLES_OVERRIDES,\n  bottomRight: HANDLE_STYLES_OVERRIDES,\n  bottomLeft: HANDLE_STYLES_OVERRIDES\n};\nfunction UnforwardedResizableBox({\n  className,\n  children,\n  showHandle = true,\n  __experimentalShowTooltip: showTooltip = false,\n  __experimentalTooltipProps: tooltipProps = {},\n  ...props\n}, ref) {\n  return /*#__PURE__*/_jsxs(Resizable, {\n    className: clsx('components-resizable-box__container', showHandle && 'has-show-handle', className)\n    // Add a focusable element within the drag handle. Unfortunately,\n    // `re-resizable` does not make them properly focusable by default,\n    // causing focus to move the the block wrapper which triggers block\n    // drag.\n    ,\n    handleComponent: Object.fromEntries(Object.keys(HANDLE_CLASSES).map(key => [key, /*#__PURE__*/_jsx(\"div\", {\n      tabIndex: -1\n    }, key)])),\n    handleClasses: HANDLE_CLASSES,\n    handleStyles: HANDLE_STYLES,\n    ref: ref,\n    ...props,\n    children: [children, showTooltip && /*#__PURE__*/_jsx(ResizeTooltip, {\n      ...tooltipProps\n    })]\n  });\n}\nexport const ResizableBox = forwardRef(UnforwardedResizableBox);\nexport default ResizableBox;"],
+  "mappings": "AAGA,SAAS,kBAAkB;AAK3B,OAAO,UAAU;AACjB,SAAS,iBAAiB;AAI1B,OAAO,mBAAmB;AAC1B,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,MAAM,oBAAoB;AAC1B,MAAM,yBAAyB;AAC/B,MAAM,2BAA2B;AACjC,MAAM,iBAAiB;AAAA,EACrB,KAAK,KAAK,mBAAmB,wBAAwB,sCAAsC;AAAA,EAC3F,OAAO,KAAK,mBAAmB,wBAAwB,wCAAwC;AAAA,EAC/F,QAAQ,KAAK,mBAAmB,wBAAwB,yCAAyC;AAAA,EACjG,MAAM,KAAK,mBAAmB,wBAAwB,uCAAuC;AAAA,EAC7F,SAAS,KAAK,mBAAmB,0BAA0B,wCAAwC,uCAAuC;AAAA,EAC1I,UAAU,KAAK,mBAAmB,0BAA0B,wCAAwC,wCAAwC;AAAA,EAC5I,aAAa,KAAK,mBAAmB,0BAA0B,2CAA2C,wCAAwC;AAAA,EAClJ,YAAY,KAAK,mBAAmB,0BAA0B,2CAA2C,uCAAuC;AAClJ;AAGA,MAAM,0BAA0B;AAAA,EAC9B,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AACR;AACA,MAAM,gBAAgB;AAAA,EACpB,KAAK;AAAA,EACL,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU;AAAA,EACV,aAAa;AAAA,EACb,YAAY;AACd;AACA,SAAS,wBAAwB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,2BAA2B,cAAc;AAAA,EACzC,4BAA4B,eAAe,CAAC;AAAA,EAC5C,GAAG;AACL,GAAG,KAAK;AACN,SAAoB,sBAAM,WAAW;AAAA,IACnC,WAAW,KAAK,uCAAuC,cAAc,mBAAmB,SAAS;AAAA,IAMjG,iBAAiB,OAAO,YAAY,OAAO,KAAK,cAAc,EAAE,IAAI,SAAO,CAAC,KAAkB,qBAAK,OAAO;AAAA,MACxG,UAAU;AAAA,IACZ,GAAG,GAAG,CAAC,CAAC,CAAC;AAAA,IACT,eAAe;AAAA,IACf,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,IACH,UAAU,CAAC,UAAU,eAA4B,qBAAK,eAAe;AAAA,MACnE,GAAG;AAAA,IACL,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,MAAM,eAAe,WAAW,uBAAuB;AAC9D,IAAO,wBAAQ;",
+  "names": []
+}

package/build-module/resizable-box/resize-tooltip/index.js

@@ -1,20 +1,11 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-/**
- * WordPress dependencies
- */
-import { forwardRef } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import Label from './label';
-import { useResizeLabel, POSITIONS } from './utils';
-import { Root } from './styles/resize-tooltip.styles';
+import clsx from "clsx";
+import { forwardRef } from "@wordpress/element";
+import Label from "./label";
+import { useResizeLabel, POSITIONS } from "./utils";
+import { Root } from "./styles/resize-tooltip.styles";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const noop = () => {};
+const noop = () => {
+};
 function ResizeTooltip({
   axis,
   className,
@@ -24,7 +15,7 @@ function ResizeTooltip({
   onResize = noop,
   position = POSITIONS.bottom,
   showPx = true,
-  zIndex = 1000,
+  zIndex = 1e3,
   ...props
 }, ref) {
   const {
@@ -40,21 +31,24 @@ function ResizeTooltip({
   if (!isVisible) {
     return null;
   }
-  const classes = clsx('components-resize-tooltip', className);
-  return /*#__PURE__*/_jsxs(Root, {
+  const classes = clsx("components-resize-tooltip", className);
+  return /* @__PURE__ */ _jsxs(Root, {
     "aria-hidden": "true",
     className: classes,
-    ref: ref,
+    ref,
     ...props,
-    children: [resizeListener, /*#__PURE__*/_jsx(Label, {
-      "aria-hidden": props['aria-hidden'],
-      label: label,
-      position: position,
+    children: [resizeListener, /* @__PURE__ */ _jsx(Label, {
+      "aria-hidden": props["aria-hidden"],
+      label,
+      position,
       ref: labelRef,
-      zIndex: zIndex
+      zIndex
     })]
   });
 }
 const ForwardedComponent = forwardRef(ResizeTooltip);
-export default ForwardedComponent;
-//# sourceMappingURL=index.js.map
+var resize_tooltip_default = ForwardedComponent;
+export {
+  resize_tooltip_default as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/resizable-box/resize-tooltip/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["clsx","forwardRef","Label","useResizeLabel","POSITIONS","Root","jsx","_jsx","jsxs","_jsxs","noop","ResizeTooltip","axis","className","fadeTimeout","isVisible","labelRef","onResize","position","bottom","showPx","zIndex","props","ref","label","resizeListener","classes","children","ForwardedComponent"],"sources":["@wordpress/components/src/resizable-box/resize-tooltip/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { Ref, ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Label from './label';\nimport type { Axis, Position } from './utils';\nimport { useResizeLabel, POSITIONS } from './utils';\nimport { Root } from './styles/resize-tooltip.styles';\n\ntype ResizeTooltipProps = React.ComponentProps< typeof Root > & {\n\t'aria-hidden'?: boolean;\n\taxis?: Axis;\n\tclassName?: string;\n\tfadeTimeout?: number;\n\tisVisible?: boolean;\n\tlabelRef?: Ref< HTMLDivElement >;\n\tonResize?: Parameters< typeof useResizeLabel >[ 0 ][ 'onResize' ];\n\tposition?: Position;\n\tshowPx?: boolean;\n\tzIndex?: number;\n};\n\nconst noop = () => {};\n\nfunction ResizeTooltip(\n\t{\n\t\taxis,\n\t\tclassName,\n\t\tfadeTimeout = 180,\n\t\tisVisible = true,\n\t\tlabelRef,\n\t\tonResize = noop,\n\t\tposition = POSITIONS.bottom,\n\t\tshowPx = true,\n\t\tzIndex = 1000,\n\t\t...props\n\t}: ResizeTooltipProps,\n\tref: ForwardedRef< HTMLDivElement >\n): JSX.Element | null {\n\tconst { label, resizeListener } = useResizeLabel( {\n\t\taxis,\n\t\tfadeTimeout,\n\t\tonResize,\n\t\tshowPx,\n\t\tposition,\n\t} );\n\n\tif ( ! isVisible ) {\n\t\treturn null;\n\t}\n\n\tconst classes = clsx( 'components-resize-tooltip', className );\n\n\treturn (\n\t\t<Root aria-hidden=\"true\" className={ classes } ref={ ref } { ...props }>\n\t\t\t{ resizeListener }\n\t\t\t<Label\n\t\t\t\taria-hidden={ props[ 'aria-hidden' ] }\n\t\t\t\tlabel={ label }\n\t\t\t\tposition={ position }\n\t\t\t\tref={ labelRef }\n\t\t\t\tzIndex={ zIndex }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\nconst ForwardedComponent = forwardRef( ResizeTooltip );\n\nexport default ForwardedComponent;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AAGvB;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,KAAK,MAAM,SAAS;AAE3B,SAASC,cAAc,EAAEC,SAAS,QAAQ,SAAS;AACnD,SAASC,IAAI,QAAQ,gCAAgC;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAetD,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,aAAaA,CACrB;EACCC,IAAI;EACJC,SAAS;EACTC,WAAW,GAAG,GAAG;EACjBC,SAAS,GAAG,IAAI;EAChBC,QAAQ;EACRC,QAAQ,GAAGP,IAAI;EACfQ,QAAQ,GAAGd,SAAS,CAACe,MAAM;EAC3BC,MAAM,GAAG,IAAI;EACbC,MAAM,GAAG,IAAI;EACb,GAAGC;AACgB,CAAC,EACrBC,GAAmC,EACd;EACrB,MAAM;IAAEC,KAAK;IAAEC;EAAe,CAAC,GAAGtB,cAAc,CAAE;IACjDS,IAAI;IACJE,WAAW;IACXG,QAAQ;IACRG,MAAM;IACNF;EACD,CAAE,CAAC;EAEH,IAAK,CAAEH,SAAS,EAAG;IAClB,OAAO,IAAI;EACZ;EAEA,MAAMW,OAAO,GAAG1B,IAAI,CAAE,2BAA2B,EAAEa,SAAU,CAAC;EAE9D,oBACCJ,KAAA,CAACJ,IAAI;IAAC,eAAY,MAAM;IAACQ,SAAS,EAAGa,OAAS;IAACH,GAAG,EAAGA,GAAK;IAAA,GAAMD,KAAK;IAAAK,QAAA,GAClEF,cAAc,eAChBlB,IAAA,CAACL,KAAK;MACL,eAAcoB,KAAK,CAAE,aAAa,CAAI;MACtCE,KAAK,EAAGA,KAAO;MACfN,QAAQ,EAAGA,QAAU;MACrBK,GAAG,EAAGP,QAAU;MAChBK,MAAM,EAAGA;IAAQ,CACjB,CAAC;EAAA,CACG,CAAC;AAET;AAEA,MAAMO,kBAAkB,GAAG3B,UAAU,CAAEU,aAAc,CAAC;AAEtD,eAAeiB,kBAAkB","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/resizable-box/resize-tooltip/index.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Label from './label';\nimport { useResizeLabel, POSITIONS } from './utils';\nimport { Root } from './styles/resize-tooltip.styles';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst noop = () => {};\nfunction ResizeTooltip({\n  axis,\n  className,\n  fadeTimeout = 180,\n  isVisible = true,\n  labelRef,\n  onResize = noop,\n  position = POSITIONS.bottom,\n  showPx = true,\n  zIndex = 1000,\n  ...props\n}, ref) {\n  const {\n    label,\n    resizeListener\n  } = useResizeLabel({\n    axis,\n    fadeTimeout,\n    onResize,\n    showPx,\n    position\n  });\n  if (!isVisible) {\n    return null;\n  }\n  const classes = clsx('components-resize-tooltip', className);\n  return /*#__PURE__*/_jsxs(Root, {\n    \"aria-hidden\": \"true\",\n    className: classes,\n    ref: ref,\n    ...props,\n    children: [resizeListener, /*#__PURE__*/_jsx(Label, {\n      \"aria-hidden\": props['aria-hidden'],\n      label: label,\n      position: position,\n      ref: labelRef,\n      zIndex: zIndex\n    })]\n  });\n}\nconst ForwardedComponent = forwardRef(ResizeTooltip);\nexport default ForwardedComponent;"],
+  "mappings": "AAGA,OAAO,UAAU;AAIjB,SAAS,kBAAkB;AAK3B,OAAO,WAAW;AAClB,SAAS,gBAAgB,iBAAiB;AAC1C,SAAS,YAAY;AACrB,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,MAAM,OAAO,MAAM;AAAC;AACpB,SAAS,cAAc;AAAA,EACrB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,WAAW;AAAA,EACX,WAAW,UAAU;AAAA,EACrB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,GAAG;AACL,GAAG,KAAK;AACN,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF,IAAI,eAAe;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,MAAI,CAAC,WAAW;AACd,WAAO;AAAA,EACT;AACA,QAAM,UAAU,KAAK,6BAA6B,SAAS;AAC3D,SAAoB,sBAAM,MAAM;AAAA,IAC9B,eAAe;AAAA,IACf,WAAW;AAAA,IACX;AAAA,IACA,GAAG;AAAA,IACH,UAAU,CAAC,gBAA6B,qBAAK,OAAO;AAAA,MAClD,eAAe,MAAM,aAAa;AAAA,MAClC;AAAA,MACA;AAAA,MACA,KAAK;AAAA,MACL;AAAA,IACF,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACA,MAAM,qBAAqB,WAAW,aAAa;AACnD,IAAO,yBAAQ;",
+  "names": []
+}

package/build-module/resizable-box/resize-tooltip/label.js

@@ -1,26 +1,14 @@
-/**
- * External dependencies
- */
-
-/**
- * WordPress dependencies
- */
-import { forwardRef } from '@wordpress/element';
-import { isRTL } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-
-import { POSITIONS } from './utils';
-import { TooltipWrapper, Tooltip, LabelText } from './styles/resize-tooltip.styles';
+import { forwardRef } from "@wordpress/element";
+import { isRTL } from "@wordpress/i18n";
+import { POSITIONS } from "./utils";
+import { TooltipWrapper, Tooltip, LabelText } from "./styles/resize-tooltip.styles";
 import { jsx as _jsx } from "react/jsx-runtime";
 const CORNER_OFFSET = 4;
 const CURSOR_OFFSET_TOP = CORNER_OFFSET * 2.5;
 function Label({
   label,
   position = POSITIONS.corner,
-  zIndex = 1000,
+  zIndex = 1e3,
   ...props
 }, ref) {
   const showLabel = !!label;
@@ -30,17 +18,17 @@ function Label({
     return null;
   }
   let style = {
-    opacity: showLabel ? 1 : undefined,
+    opacity: showLabel ? 1 : void 0,
     zIndex
   };
   let labelStyle = {};
   if (isBottom) {
     style = {
       ...style,
-      position: 'absolute',
+      position: "absolute",
       bottom: CURSOR_OFFSET_TOP * -1,
-      left: '50%',
-      transform: 'translate(-50%, 0)'
+      left: "50%",
+      transform: "translate(-50%, 0)"
     };
     labelStyle = {
       transform: `translate(0, 100%)`
@@ -49,22 +37,22 @@ function Label({
   if (isCorner) {
     style = {
       ...style,
-      position: 'absolute',
+      position: "absolute",
       top: CORNER_OFFSET,
-      right: isRTL() ? undefined : CORNER_OFFSET,
-      left: isRTL() ? CORNER_OFFSET : undefined
+      right: isRTL() ? void 0 : CORNER_OFFSET,
+      left: isRTL() ? CORNER_OFFSET : void 0
     };
   }
-  return /*#__PURE__*/_jsx(TooltipWrapper, {
+  return /* @__PURE__ */ _jsx(TooltipWrapper, {
     "aria-hidden": "true",
     className: "components-resizable-tooltip__tooltip-wrapper",
-    ref: ref,
-    style: style,
+    ref,
+    style,
     ...props,
-    children: /*#__PURE__*/_jsx(Tooltip, {
+    children: /* @__PURE__ */ _jsx(Tooltip, {
       className: "components-resizable-tooltip__tooltip",
       style: labelStyle,
-      children: /*#__PURE__*/_jsx(LabelText, {
+      children: /* @__PURE__ */ _jsx(LabelText, {
         as: "span",
         children: label
       })
@@ -72,5 +60,8 @@ function Label({
   });
 }
 const ForwardedComponent = forwardRef(Label);
-export default ForwardedComponent;
-//# sourceMappingURL=label.js.map
+var label_default = ForwardedComponent;
+export {
+  label_default as default
+};
+//# sourceMappingURL=label.js.map

package/build-module/resizable-box/resize-tooltip/label.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["forwardRef","isRTL","POSITIONS","TooltipWrapper","Tooltip","LabelText","jsx","_jsx","CORNER_OFFSET","CURSOR_OFFSET_TOP","Label","label","position","corner","zIndex","props","ref","showLabel","isBottom","bottom","isCorner","style","opacity","undefined","labelStyle","left","transform","top","right","className","children","as","ForwardedComponent"],"sources":["@wordpress/components/src/resizable-box/resize-tooltip/label.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { Position } from './utils';\nimport { POSITIONS } from './utils';\nimport {\n\tTooltipWrapper,\n\tTooltip,\n\tLabelText,\n} from './styles/resize-tooltip.styles';\n\nconst CORNER_OFFSET = 4;\nconst CURSOR_OFFSET_TOP = CORNER_OFFSET * 2.5;\n\ntype LabelProps = React.DetailedHTMLProps<\n\tReact.HTMLAttributes< HTMLDivElement >,\n\tHTMLDivElement\n> & {\n\tlabel?: string;\n\tposition: Position;\n\tzIndex: number;\n};\n\nfunction Label(\n\t{ label, position = POSITIONS.corner, zIndex = 1000, ...props }: LabelProps,\n\tref: ForwardedRef< HTMLDivElement >\n): JSX.Element | null {\n\tconst showLabel = !! label;\n\n\tconst isBottom = position === POSITIONS.bottom;\n\tconst isCorner = position === POSITIONS.corner;\n\n\tif ( ! showLabel ) {\n\t\treturn null;\n\t}\n\n\tlet style: React.CSSProperties = {\n\t\topacity: showLabel ? 1 : undefined,\n\t\tzIndex,\n\t};\n\n\tlet labelStyle = {};\n\n\tif ( isBottom ) {\n\t\tstyle = {\n\t\t\t...style,\n\t\t\tposition: 'absolute',\n\t\t\tbottom: CURSOR_OFFSET_TOP * -1,\n\t\t\tleft: '50%',\n\t\t\ttransform: 'translate(-50%, 0)',\n\t\t};\n\n\t\tlabelStyle = {\n\t\t\ttransform: `translate(0, 100%)`,\n\t\t};\n\t}\n\n\tif ( isCorner ) {\n\t\tstyle = {\n\t\t\t...style,\n\t\t\tposition: 'absolute',\n\t\t\ttop: CORNER_OFFSET,\n\t\t\tright: isRTL() ? undefined : CORNER_OFFSET,\n\t\t\tleft: isRTL() ? CORNER_OFFSET : undefined,\n\t\t};\n\t}\n\n\treturn (\n\t\t<TooltipWrapper\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName=\"components-resizable-tooltip__tooltip-wrapper\"\n\t\t\tref={ ref }\n\t\t\tstyle={ style }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<Tooltip\n\t\t\t\tclassName=\"components-resizable-tooltip__tooltip\"\n\t\t\t\tstyle={ labelStyle }\n\t\t\t>\n\t\t\t\t<LabelText as=\"span\">{ label }</LabelText>\n\t\t\t</Tooltip>\n\t\t</TooltipWrapper>\n\t);\n}\n\nconst ForwardedComponent = forwardRef( Label );\n\nexport default ForwardedComponent;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;AAC/C,SAASC,KAAK,QAAQ,iBAAiB;;AAEvC;AACA;AACA;;AAEA,SAASC,SAAS,QAAQ,SAAS;AACnC,SACCC,cAAc,EACdC,OAAO,EACPC,SAAS,QACH,gCAAgC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAExC,MAAMC,aAAa,GAAG,CAAC;AACvB,MAAMC,iBAAiB,GAAGD,aAAa,GAAG,GAAG;AAW7C,SAASE,KAAKA,CACb;EAAEC,KAAK;EAAEC,QAAQ,GAAGV,SAAS,CAACW,MAAM;EAAEC,MAAM,GAAG,IAAI;EAAE,GAAGC;AAAkB,CAAC,EAC3EC,GAAmC,EACd;EACrB,MAAMC,SAAS,GAAG,CAAC,CAAEN,KAAK;EAE1B,MAAMO,QAAQ,GAAGN,QAAQ,KAAKV,SAAS,CAACiB,MAAM;EAC9C,MAAMC,QAAQ,GAAGR,QAAQ,KAAKV,SAAS,CAACW,MAAM;EAE9C,IAAK,CAAEI,SAAS,EAAG;IAClB,OAAO,IAAI;EACZ;EAEA,IAAII,KAA0B,GAAG;IAChCC,OAAO,EAAEL,SAAS,GAAG,CAAC,GAAGM,SAAS;IAClCT;EACD,CAAC;EAED,IAAIU,UAAU,GAAG,CAAC,CAAC;EAEnB,IAAKN,QAAQ,EAAG;IACfG,KAAK,GAAG;MACP,GAAGA,KAAK;MACRT,QAAQ,EAAE,UAAU;MACpBO,MAAM,EAAEV,iBAAiB,GAAG,CAAC,CAAC;MAC9BgB,IAAI,EAAE,KAAK;MACXC,SAAS,EAAE;IACZ,CAAC;IAEDF,UAAU,GAAG;MACZE,SAAS,EAAE;IACZ,CAAC;EACF;EAEA,IAAKN,QAAQ,EAAG;IACfC,KAAK,GAAG;MACP,GAAGA,KAAK;MACRT,QAAQ,EAAE,UAAU;MACpBe,GAAG,EAAEnB,aAAa;MAClBoB,KAAK,EAAE3B,KAAK,CAAC,CAAC,GAAGsB,SAAS,GAAGf,aAAa;MAC1CiB,IAAI,EAAExB,KAAK,CAAC,CAAC,GAAGO,aAAa,GAAGe;IACjC,CAAC;EACF;EAEA,oBACChB,IAAA,CAACJ,cAAc;IACd,eAAY,MAAM;IAClB0B,SAAS,EAAC,+CAA+C;IACzDb,GAAG,EAAGA,GAAK;IACXK,KAAK,EAAGA,KAAO;IAAA,GACVN,KAAK;IAAAe,QAAA,eAEVvB,IAAA,CAACH,OAAO;MACPyB,SAAS,EAAC,uCAAuC;MACjDR,KAAK,EAAGG,UAAY;MAAAM,QAAA,eAEpBvB,IAAA,CAACF,SAAS;QAAC0B,EAAE,EAAC,MAAM;QAAAD,QAAA,EAAGnB;MAAK,CAAa;IAAC,CAClC;EAAC,CACK,CAAC;AAEnB;AAEA,MAAMqB,kBAAkB,GAAGhC,UAAU,CAAEU,KAAM,CAAC;AAE9C,eAAesB,kBAAkB","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/resizable-box/resize-tooltip/label.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nimport { POSITIONS } from './utils';\nimport { TooltipWrapper, Tooltip, LabelText } from './styles/resize-tooltip.styles';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst CORNER_OFFSET = 4;\nconst CURSOR_OFFSET_TOP = CORNER_OFFSET * 2.5;\nfunction Label({\n  label,\n  position = POSITIONS.corner,\n  zIndex = 1000,\n  ...props\n}, ref) {\n  const showLabel = !!label;\n  const isBottom = position === POSITIONS.bottom;\n  const isCorner = position === POSITIONS.corner;\n  if (!showLabel) {\n    return null;\n  }\n  let style = {\n    opacity: showLabel ? 1 : undefined,\n    zIndex\n  };\n  let labelStyle = {};\n  if (isBottom) {\n    style = {\n      ...style,\n      position: 'absolute',\n      bottom: CURSOR_OFFSET_TOP * -1,\n      left: '50%',\n      transform: 'translate(-50%, 0)'\n    };\n    labelStyle = {\n      transform: `translate(0, 100%)`\n    };\n  }\n  if (isCorner) {\n    style = {\n      ...style,\n      position: 'absolute',\n      top: CORNER_OFFSET,\n      right: isRTL() ? undefined : CORNER_OFFSET,\n      left: isRTL() ? CORNER_OFFSET : undefined\n    };\n  }\n  return /*#__PURE__*/_jsx(TooltipWrapper, {\n    \"aria-hidden\": \"true\",\n    className: \"components-resizable-tooltip__tooltip-wrapper\",\n    ref: ref,\n    style: style,\n    ...props,\n    children: /*#__PURE__*/_jsx(Tooltip, {\n      className: \"components-resizable-tooltip__tooltip\",\n      style: labelStyle,\n      children: /*#__PURE__*/_jsx(LabelText, {\n        as: \"span\",\n        children: label\n      })\n    })\n  });\n}\nconst ForwardedComponent = forwardRef(Label);\nexport default ForwardedComponent;"],
+  "mappings": "AAOA,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AAMtB,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB,SAAS,iBAAiB;AACnD,SAAS,OAAO,YAAY;AAC5B,MAAM,gBAAgB;AACtB,MAAM,oBAAoB,gBAAgB;AAC1C,SAAS,MAAM;AAAA,EACb;AAAA,EACA,WAAW,UAAU;AAAA,EACrB,SAAS;AAAA,EACT,GAAG;AACL,GAAG,KAAK;AACN,QAAM,YAAY,CAAC,CAAC;AACpB,QAAM,WAAW,aAAa,UAAU;AACxC,QAAM,WAAW,aAAa,UAAU;AACxC,MAAI,CAAC,WAAW;AACd,WAAO;AAAA,EACT;AACA,MAAI,QAAQ;AAAA,IACV,SAAS,YAAY,IAAI;AAAA,IACzB;AAAA,EACF;AACA,MAAI,aAAa,CAAC;AAClB,MAAI,UAAU;AACZ,YAAQ;AAAA,MACN,GAAG;AAAA,MACH,UAAU;AAAA,MACV,QAAQ,oBAAoB;AAAA,MAC5B,MAAM;AAAA,MACN,WAAW;AAAA,IACb;AACA,iBAAa;AAAA,MACX,WAAW;AAAA,IACb;AAAA,EACF;AACA,MAAI,UAAU;AACZ,YAAQ;AAAA,MACN,GAAG;AAAA,MACH,UAAU;AAAA,MACV,KAAK;AAAA,MACL,OAAO,MAAM,IAAI,SAAY;AAAA,MAC7B,MAAM,MAAM,IAAI,gBAAgB;AAAA,IAClC;AAAA,EACF;AACA,SAAoB,qBAAK,gBAAgB;AAAA,IACvC,eAAe;AAAA,IACf,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,GAAG;AAAA,IACH,UAAuB,qBAAK,SAAS;AAAA,MACnC,WAAW;AAAA,MACX,OAAO;AAAA,MACP,UAAuB,qBAAK,WAAW;AAAA,QACrC,IAAI;AAAA,QACJ,UAAU;AAAA,MACZ,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;AACA,MAAM,qBAAqB,WAAW,KAAK;AAC3C,IAAO,gBAAQ;",
+  "names": []
+}