@wordpress/components 27.6.0 → 28.0.0

package/build-module/border-control/border-control/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","BorderControlDropdown","UnitControl","RangeControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderControl","BorderLabel","props","label","hideLabelFromVision","createElement","as","UnconnectedBorderControl","forwardedRef","__next40pxDefaultSize","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","innerWrapperClassName","inputWidth","isStyleSettable","onBorderChange","onSliderChange","onWidthChange","placeholder","__unstablePopoverProps","previousStyleSelection","showDropdownHeader","size","sliderClassName","value","border","widthUnit","widthValue","withSlider","__experimentalIsRenderedInSidebar","otherProps","ref","spacing","className","prefix","onChange","min","width","__unstableInputWidth","__nextHasNoMarginBottom","initialPosition","max","step","includes","undefined","withInputField","BorderControl"],"sources":["@wordpress/components/src/border-control/border-control/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlDropdown from '../border-control-dropdown';\nimport UnitControl from '../../unit-control';\nimport RangeControl from '../../range-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControl } from './hook';\n\nimport type { BorderControlProps, LabelProps } from '../types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"legend\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel as=\"legend\">{ label }</StyledLabel>\n\t);\n};\n\nconst UnconnectedBorderControl = (\n\tprops: WordPressComponentProps< BorderControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thideLabelFromVision,\n\t\tinnerWrapperClassName,\n\t\tinputWidth,\n\t\tisStyleSettable,\n\t\tlabel,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tplaceholder,\n\t\t__unstablePopoverProps,\n\t\tpreviousStyleSelection,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\twithSlider,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderControl( props );\n\n\treturn (\n\t\t<View as=\"fieldset\" { ...otherProps } ref={ forwardedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack spacing={ 4 } className={ innerWrapperClassName }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tprefix={\n\t\t\t\t\t\t<BorderControlDropdown\n\t\t\t\t\t\t\tborder={ border }\n\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t__unstablePopoverProps={ __unstablePopoverProps }\n\t\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\t\tisStyleSettable={ isStyleSettable }\n\t\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\t\tpreviousStyleSelection={ previousStyleSelection }\n\t\t\t\t\t\t\tshowDropdownHeader={ showDropdownHeader }\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ onWidthChange }\n\t\t\t\t\tvalue={ border?.width || '' }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t__unstableInputWidth={ inputWidth }\n\t\t\t\t\tsize={ size }\n\t\t\t\t/>\n\t\t\t\t{ withSlider && (\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tclassName={ sliderClassName }\n\t\t\t\t\t\tinitialPosition={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ onSliderChange }\n\t\t\t\t\t\tstep={ [ 'px', '%' ].includes( widthUnit ) ? 1 : 0.1 }\n\t\t\t\t\t\tvalue={ widthValue || undefined }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderControl` brings together internal sub-components which allow users to\n * set the various properties of a border. The first sub-component, a\n * `BorderDropdown` contains options representing border color and style. The\n * border width is controlled via a `UnitControl` and an optional `RangeControl`.\n *\n * Border radius is not covered by this control as it may be desired separate to\n * color, style, and width. For example, the border radius may be absorbed under\n * a \"shape\" abstraction.\n *\n * ```jsx\n * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderControl = () => {\n * \tconst [ border, setBorder ] = useState();\n * \tconst onChange = ( newBorder ) => setBorder( newBorder );\n *\n * \treturn (\n * \t\t<BorderControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Border' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ border }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderControl = contextConnect(\n\tUnconnectedBorderControl,\n\t'BorderControl'\n);\n\nexport default BorderControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__","BorderControlDropdown","UnitControl","RangeControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderControl","jsx","_jsx","jsxs","_jsxs","BorderLabel","props","label","hideLabelFromVision","as","children","UnconnectedBorderControl","forwardedRef","__next40pxDefaultSize","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","innerWrapperClassName","inputWidth","isStyleSettable","onBorderChange","onSliderChange","onWidthChange","placeholder","__unstablePopoverProps","previousStyleSelection","showDropdownHeader","size","sliderClassName","value","border","widthUnit","widthValue","withSlider","__experimentalIsRenderedInSidebar","otherProps","ref","spacing","className","prefix","onChange","min","width","__unstableInputWidth","__nextHasNoMarginBottom","initialPosition","max","step","includes","undefined","withInputField","BorderControl"],"sources":["@wordpress/components/src/border-control/border-control/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlDropdown from '../border-control-dropdown';\nimport UnitControl from '../../unit-control';\nimport RangeControl from '../../range-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControl } from './hook';\n\nimport type { BorderControlProps, LabelProps } from '../types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"legend\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel as=\"legend\">{ label }</StyledLabel>\n\t);\n};\n\nconst UnconnectedBorderControl = (\n\tprops: WordPressComponentProps< BorderControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thideLabelFromVision,\n\t\tinnerWrapperClassName,\n\t\tinputWidth,\n\t\tisStyleSettable,\n\t\tlabel,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tplaceholder,\n\t\t__unstablePopoverProps,\n\t\tpreviousStyleSelection,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\twithSlider,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderControl( props );\n\n\treturn (\n\t\t<View as=\"fieldset\" { ...otherProps } ref={ forwardedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack spacing={ 4 } className={ innerWrapperClassName }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tprefix={\n\t\t\t\t\t\t<BorderControlDropdown\n\t\t\t\t\t\t\tborder={ border }\n\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t__unstablePopoverProps={ __unstablePopoverProps }\n\t\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\t\tisStyleSettable={ isStyleSettable }\n\t\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\t\tpreviousStyleSelection={ previousStyleSelection }\n\t\t\t\t\t\t\tshowDropdownHeader={ showDropdownHeader }\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ onWidthChange }\n\t\t\t\t\tvalue={ border?.width || '' }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t__unstableInputWidth={ inputWidth }\n\t\t\t\t\tsize={ size }\n\t\t\t\t/>\n\t\t\t\t{ withSlider && (\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tclassName={ sliderClassName }\n\t\t\t\t\t\tinitialPosition={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ onSliderChange }\n\t\t\t\t\t\tstep={ [ 'px', '%' ].includes( widthUnit ) ? 1 : 0.1 }\n\t\t\t\t\t\tvalue={ widthValue || undefined }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderControl` brings together internal sub-components which allow users to\n * set the various properties of a border. The first sub-component, a\n * `BorderDropdown` contains options representing border color and style. The\n * border width is controlled via a `UnitControl` and an optional `RangeControl`.\n *\n * Border radius is not covered by this control as it may be desired separate to\n * color, style, and width. For example, the border radius may be absorbed under\n * a \"shape\" abstraction.\n *\n * ```jsx\n * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderControl = () => {\n * \tconst [ border, setBorder ] = useState();\n * \tconst onChange = ( newBorder ) => setBorder( newBorder );\n *\n * \treturn (\n * \t\t<BorderControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Border' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ border }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderControl = contextConnect(\n\tUnconnectedBorderControl,\n\t'BorderControl'\n);\n\nexport default BorderControl;\n"],"mappings":"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","ignoreList":[]}

package/build-module/border-control/border-control-dropdown/component.js

@@ -1,4 +1,3 @@
-import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */
@@ -24,6 +23,9 @@ import { useBorderControlDropdown } from './hook';
 import { StyledLabel } from '../../base-control/styles/base-control-styles';
 import DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';
 import { isMultiplePaletteArray } from '../../color-palette/utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 const getAriaLabelColorValue = colorValue => {
   // Leave hex values as-is. Remove the `var()` wrapper from CSS vars.
   return colorValue.replace(/^var\((.+)\)$/, '$1');
@@ -112,56 +114,68 @@ const BorderControlDropdown = (props, forwardedRef) => {
   const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined;
   const renderToggle = ({
     onToggle
-  }) => createElement(Button, {
+  }) => /*#__PURE__*/_jsx(Button, {
     onClick: onToggle,
     variant: "tertiary",
     "aria-label": toggleAriaLabel,
     tooltipPosition: dropdownPosition,
     label: __('Border color and style picker'),
     showTooltip: true,
-    __next40pxDefaultSize: size === '__unstable-large' ? true : false
-  }, createElement("span", {
-    className: indicatorWrapperClassName
-  }, createElement(ColorIndicator, {
-    className: indicatorClassName,
-    colorValue: color
-  })));
+    __next40pxDefaultSize: size === '__unstable-large' ? true : false,
+    children: /*#__PURE__*/_jsx("span", {
+      className: indicatorWrapperClassName,
+      children: /*#__PURE__*/_jsx(ColorIndicator, {
+        className: indicatorClassName,
+        colorValue: color
+      })
+    })
+  });
   const renderContent = ({
     onClose
-  }) => createElement(Fragment, null, createElement(DropdownContentWrapper, {
-    paddingSize: "medium"
-  }, createElement(VStack, {
-    className: popoverControlsClassName,
-    spacing: 6
-  }, showDropdownHeader ? createElement(HStack, null, createElement(StyledLabel, null, __('Border color')), createElement(Button, {
-    size: "small",
-    label: __('Close border color'),
-    icon: closeSmall,
-    onClick: onClose
-  })) : undefined, createElement(ColorPalette, {
-    className: popoverContentClassName,
-    value: color,
-    onChange: onColorChange,
-    colors,
-    disableCustomColors,
-    __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
-    clearable: false,
-    enableAlpha: enableAlpha
-  }), enableStyle && isStyleSettable && createElement(BorderControlStylePicker, {
-    label: __('Style'),
-    value: style,
-    onChange: onStyleChange
-  }))), showResetButton && createElement(DropdownContentWrapper, {
-    paddingSize: "none"
-  }, createElement(Button, {
-    className: resetButtonClassName,
-    variant: "tertiary",
-    onClick: () => {
-      onReset();
-      onClose();
-    }
-  }, __('Reset'))));
-  return createElement(Dropdown, {
+  }) => /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(DropdownContentWrapper, {
+      paddingSize: "medium",
+      children: /*#__PURE__*/_jsxs(VStack, {
+        className: popoverControlsClassName,
+        spacing: 6,
+        children: [showDropdownHeader ? /*#__PURE__*/_jsxs(HStack, {
+          children: [/*#__PURE__*/_jsx(StyledLabel, {
+            children: __('Border color')
+          }), /*#__PURE__*/_jsx(Button, {
+            size: "small",
+            label: __('Close border color'),
+            icon: closeSmall,
+            onClick: onClose
+          })]
+        }) : undefined, /*#__PURE__*/_jsx(ColorPalette, {
+          className: popoverContentClassName,
+          value: color,
+          onChange: onColorChange,
+          colors,
+          disableCustomColors,
+          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
+          clearable: false,
+          enableAlpha: enableAlpha
+        }), enableStyle && isStyleSettable && /*#__PURE__*/_jsx(BorderControlStylePicker, {
+          label: __('Style'),
+          value: style,
+          onChange: onStyleChange
+        })]
+      })
+    }), showResetButton && /*#__PURE__*/_jsx(DropdownContentWrapper, {
+      paddingSize: "none",
+      children: /*#__PURE__*/_jsx(Button, {
+        className: resetButtonClassName,
+        variant: "tertiary",
+        onClick: () => {
+          onReset();
+          onClose();
+        },
+        children: __('Reset')
+      })
+    })]
+  });
+  return /*#__PURE__*/_jsx(Dropdown, {
     renderToggle: renderToggle,
     renderContent: renderContent,
     popoverProps: {

package/build-module/border-control/border-control-dropdown/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","sprintf","closeSmall","BorderControlStylePicker","Button","ColorIndicator","ColorPalette","Dropdown","HStack","VStack","contextConnect","useBorderControlDropdown","StyledLabel","DropdownContentWrapper","isMultiplePaletteArray","getAriaLabelColorValue","colorValue","replace","getColorObject","colors","matchedColor","some","origin","color","find","getToggleAriaLabel","colorObject","style","isStyleEnabled","ariaLabelValue","name","BorderControlDropdown","props","forwardedRef","__experimentalIsRenderedInSidebar","border","disableCustomColors","enableAlpha","enableStyle","indicatorClassName","indicatorWrapperClassName","isStyleSettable","onReset","onColorChange","onStyleChange","popoverContentClassName","popoverControlsClassName","resetButtonClassName","showDropdownHeader","size","__unstablePopoverProps","otherProps","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","createElement","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","className","renderContent","onClose","Fragment","paddingSize","spacing","icon","value","onChange","clearable","popoverProps","ref","ConnectedBorderControlDropdown"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { HStack } from '../../h-stack';\nimport { VStack } from '../../v-stack';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nimport type { ColorObject } from '../../color-palette/types';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';\nimport type { ColorProps, DropdownProps } from '../types';\n\nconst getAriaLabelColorValue = ( colorValue: string ) => {\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\treturn colorValue.replace( /^var\\((.+)\\)$/, '$1' );\n};\n\nconst getColorObject = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolors: ColorProps[ 'colors' ] | undefined\n) => {\n\tif ( ! colorValue || ! colors ) {\n\t\treturn;\n\t}\n\n\tif ( isMultiplePaletteArray( colors ) ) {\n\t\t// Multiple origins\n\t\tlet matchedColor;\n\n\t\tcolors.some( ( origin ) =>\n\t\t\torigin.colors.some( ( color ) => {\n\t\t\t\tif ( color.color === colorValue ) {\n\t\t\t\t\tmatchedColor = color;\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\treturn false;\n\t\t\t} )\n\t\t);\n\n\t\treturn matchedColor;\n\t}\n\n\t// Single origin\n\treturn colors.find( ( color ) => color.color === colorValue );\n};\n\nconst getToggleAriaLabel = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolorObject: ColorObject | undefined,\n\tstyle: CSSProperties[ 'borderStyle' ],\n\tisStyleEnabled: boolean\n) => {\n\tif ( isStyleEnabled ) {\n\t\tif ( colorObject ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorObject.color );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorValue );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tgetAriaLabelColorValue( colorObject.color )\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tgetAriaLabelColorValue( colorValue )\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tisStyleSettable,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip\n\t\t\t__next40pxDefaultSize={ size === '__unstable-large' ? true : false }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t{ showDropdownHeader ? (\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<StyledLabel>{ __( 'Border color' ) }</StyledLabel>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Close border color' ) }\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t) : undefined }\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && isStyleSettable && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__","sprintf","closeSmall","BorderControlStylePicker","Button","ColorIndicator","ColorPalette","Dropdown","HStack","VStack","contextConnect","useBorderControlDropdown","StyledLabel","DropdownContentWrapper","isMultiplePaletteArray","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","getAriaLabelColorValue","colorValue","replace","getColorObject","colors","matchedColor","some","origin","color","find","getToggleAriaLabel","colorObject","style","isStyleEnabled","ariaLabelValue","name","BorderControlDropdown","props","forwardedRef","__experimentalIsRenderedInSidebar","border","disableCustomColors","enableAlpha","enableStyle","indicatorClassName","indicatorWrapperClassName","isStyleSettable","onReset","onColorChange","onStyleChange","popoverContentClassName","popoverControlsClassName","resetButtonClassName","showDropdownHeader","size","__unstablePopoverProps","otherProps","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","children","className","renderContent","onClose","paddingSize","spacing","icon","value","onChange","clearable","popoverProps","ref","ConnectedBorderControlDropdown"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { HStack } from '../../h-stack';\nimport { VStack } from '../../v-stack';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nimport type { ColorObject } from '../../color-palette/types';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';\nimport type { ColorProps, DropdownProps } from '../types';\n\nconst getAriaLabelColorValue = ( colorValue: string ) => {\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\treturn colorValue.replace( /^var\\((.+)\\)$/, '$1' );\n};\n\nconst getColorObject = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolors: ColorProps[ 'colors' ] | undefined\n) => {\n\tif ( ! colorValue || ! colors ) {\n\t\treturn;\n\t}\n\n\tif ( isMultiplePaletteArray( colors ) ) {\n\t\t// Multiple origins\n\t\tlet matchedColor;\n\n\t\tcolors.some( ( origin ) =>\n\t\t\torigin.colors.some( ( color ) => {\n\t\t\t\tif ( color.color === colorValue ) {\n\t\t\t\t\tmatchedColor = color;\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\treturn false;\n\t\t\t} )\n\t\t);\n\n\t\treturn matchedColor;\n\t}\n\n\t// Single origin\n\treturn colors.find( ( color ) => color.color === colorValue );\n};\n\nconst getToggleAriaLabel = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolorObject: ColorObject | undefined,\n\tstyle: CSSProperties[ 'borderStyle' ],\n\tisStyleEnabled: boolean\n) => {\n\tif ( isStyleEnabled ) {\n\t\tif ( colorObject ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorObject.color );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorValue );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tgetAriaLabelColorValue( colorObject.color )\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tgetAriaLabelColorValue( colorValue )\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tisStyleSettable,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip\n\t\t\t__next40pxDefaultSize={ size === '__unstable-large' ? true : false }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t{ showDropdownHeader ? (\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<StyledLabel>{ __( 'Border color' ) }</StyledLabel>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Close border color' ) }\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t) : undefined }\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && isStyleSettable && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"],"mappings":"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","ignoreList":[]}

package/build-module/border-control/border-control-style-picker/component.js

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
@@ -10,6 +9,7 @@ import { __ } from '@wordpress/i18n';
  */
 import { contextConnect } from '../../context';
 import { ToggleGroupControl, ToggleGroupControlOptionIcon } from '../../toggle-group-control';
+import { jsx as _jsx } from "react/jsx-runtime";
 const BORDER_STYLES = [{
   label: __('Solid'),
   icon: lineSolid,
@@ -27,7 +27,7 @@ function UnconnectedBorderControlStylePicker({
   onChange,
   ...restProps
 }, forwardedRef) {
-  return createElement(ToggleGroupControl, {
+  return /*#__PURE__*/_jsx(ToggleGroupControl, {
     __nextHasNoMarginBottom: true,
     __next40pxDefaultSize: true,
     ref: forwardedRef,
@@ -35,13 +35,13 @@ function UnconnectedBorderControlStylePicker({
     onChange: value => {
       onChange?.(value);
     },
-    ...restProps
-  }, BORDER_STYLES.map(borderStyle => createElement(ToggleGroupControlOptionIcon, {
-    key: borderStyle.value,
-    value: borderStyle.value,
-    icon: borderStyle.icon,
-    label: borderStyle.label
-  })));
+    ...restProps,
+    children: BORDER_STYLES.map(borderStyle => /*#__PURE__*/_jsx(ToggleGroupControlOptionIcon, {
+      value: borderStyle.value,
+      icon: borderStyle.icon,
+      label: borderStyle.label
+    }, borderStyle.value))
+  });
 }
 const BorderControlStylePicker = contextConnect(UnconnectedBorderControlStylePicker, 'BorderControlStylePicker');
 export default BorderControlStylePicker;

package/build-module/border-control/border-control-style-picker/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["lineDashed","lineDotted","lineSolid","__","contextConnect","ToggleGroupControl","ToggleGroupControlOptionIcon","BORDER_STYLES","label","icon","value","UnconnectedBorderControlStylePicker","onChange","restProps","forwardedRef","createElement","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","isDeselectable","map","borderStyle","key","BorderControlStylePicker"],"sources":["@wordpress/components/src/border-control/border-control-style-picker/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { lineDashed, lineDotted, lineSolid } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect } from '../../context';\nimport type { StylePickerProps } from '../types';\nimport {\n\tToggleGroupControl,\n\tToggleGroupControlOptionIcon,\n} from '../../toggle-group-control';\n\nconst BORDER_STYLES = [\n\t{ label: __( 'Solid' ), icon: lineSolid, value: 'solid' },\n\t{ label: __( 'Dashed' ), icon: lineDashed, value: 'dashed' },\n\t{ label: __( 'Dotted' ), icon: lineDotted, value: 'dotted' },\n];\n\nfunction UnconnectedBorderControlStylePicker(\n\t{ onChange, ...restProps }: StylePickerProps,\n\tforwardedRef: React.ForwardedRef< any >\n) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tref={ forwardedRef }\n\t\t\tisDeselectable\n\t\t\tonChange={ ( value ) => {\n\t\t\t\tonChange?.( value as string | undefined );\n\t\t\t} }\n\t\t\t{ ...restProps }\n\t\t>\n\t\t\t{ BORDER_STYLES.map( ( borderStyle ) => (\n\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\tkey={ borderStyle.value }\n\t\t\t\t\tvalue={ borderStyle.value }\n\t\t\t\t\ticon={ borderStyle.icon }\n\t\t\t\t\tlabel={ borderStyle.label }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nconst BorderControlStylePicker = contextConnect(\n\tUnconnectedBorderControlStylePicker,\n\t'BorderControlStylePicker'\n);\n\nexport default BorderControlStylePicker;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,EAAEC,SAAS,QAAQ,kBAAkB;AACpE,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,cAAc,QAAQ,eAAe;AAE9C,SACCC,kBAAkB,EAClBC,4BAA4B,QACtB,4BAA4B;AAEnC,MAAMC,aAAa,GAAG,CACrB;EAAEC,KAAK,EAAEL,EAAE,CAAE,OAAQ,CAAC;EAAEM,IAAI,EAAEP,SAAS;EAAEQ,KAAK,EAAE;AAAQ,CAAC,EACzD;EAAEF,KAAK,EAAEL,EAAE,CAAE,QAAS,CAAC;EAAEM,IAAI,EAAET,UAAU;EAAEU,KAAK,EAAE;AAAS,CAAC,EAC5D;EAAEF,KAAK,EAAEL,EAAE,CAAE,QAAS,CAAC;EAAEM,IAAI,EAAER,UAAU;EAAES,KAAK,EAAE;AAAS,CAAC,CAC5D;AAED,SAASC,mCAAmCA,CAC3C;EAAEC,QAAQ;EAAE,GAAGC;AAA4B,CAAC,EAC5CC,YAAuC,EACtC;EACD,OACCC,aAAA,CAACV,kBAAkB;IAClBW,uBAAuB;IACvBC,qBAAqB;IACrBC,GAAG,EAAGJ,YAAc;IACpBK,cAAc;IACdP,QAAQ,EAAKF,KAAK,IAAM;MACvBE,QAAQ,GAAIF,KAA4B,CAAC;IAC1C,CAAG;IAAA,GACEG;EAAS,GAEZN,aAAa,CAACa,GAAG,CAAIC,WAAW,IACjCN,aAAA,CAACT,4BAA4B;IAC5BgB,GAAG,EAAGD,WAAW,CAACX,KAAO;IACzBA,KAAK,EAAGW,WAAW,CAACX,KAAO;IAC3BD,IAAI,EAAGY,WAAW,CAACZ,IAAM;IACzBD,KAAK,EAAGa,WAAW,CAACb;EAAO,CAC3B,CACA,CACiB,CAAC;AAEvB;AAEA,MAAMe,wBAAwB,GAAGnB,cAAc,CAC9CO,mCAAmC,EACnC,0BACD,CAAC;AAED,eAAeY,wBAAwB","ignoreList":[]}
+{"version":3,"names":["lineDashed","lineDotted","lineSolid","__","contextConnect","ToggleGroupControl","ToggleGroupControlOptionIcon","jsx","_jsx","BORDER_STYLES","label","icon","value","UnconnectedBorderControlStylePicker","onChange","restProps","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","isDeselectable","children","map","borderStyle","BorderControlStylePicker"],"sources":["@wordpress/components/src/border-control/border-control-style-picker/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { lineDashed, lineDotted, lineSolid } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect } from '../../context';\nimport type { StylePickerProps } from '../types';\nimport {\n\tToggleGroupControl,\n\tToggleGroupControlOptionIcon,\n} from '../../toggle-group-control';\n\nconst BORDER_STYLES = [\n\t{ label: __( 'Solid' ), icon: lineSolid, value: 'solid' },\n\t{ label: __( 'Dashed' ), icon: lineDashed, value: 'dashed' },\n\t{ label: __( 'Dotted' ), icon: lineDotted, value: 'dotted' },\n];\n\nfunction UnconnectedBorderControlStylePicker(\n\t{ onChange, ...restProps }: StylePickerProps,\n\tforwardedRef: React.ForwardedRef< any >\n) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tref={ forwardedRef }\n\t\t\tisDeselectable\n\t\t\tonChange={ ( value ) => {\n\t\t\t\tonChange?.( value as string | undefined );\n\t\t\t} }\n\t\t\t{ ...restProps }\n\t\t>\n\t\t\t{ BORDER_STYLES.map( ( borderStyle ) => (\n\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\tkey={ borderStyle.value }\n\t\t\t\t\tvalue={ borderStyle.value }\n\t\t\t\t\ticon={ borderStyle.icon }\n\t\t\t\t\tlabel={ borderStyle.label }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nconst BorderControlStylePicker = contextConnect(\n\tUnconnectedBorderControlStylePicker,\n\t'BorderControlStylePicker'\n);\n\nexport default BorderControlStylePicker;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,EAAEC,SAAS,QAAQ,kBAAkB;AACpE,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,cAAc,QAAQ,eAAe;AAE9C,SACCC,kBAAkB,EAClBC,4BAA4B,QACtB,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEpC,MAAMC,aAAa,GAAG,CACrB;EAAEC,KAAK,EAAEP,EAAE,CAAE,OAAQ,CAAC;EAAEQ,IAAI,EAAET,SAAS;EAAEU,KAAK,EAAE;AAAQ,CAAC,EACzD;EAAEF,KAAK,EAAEP,EAAE,CAAE,QAAS,CAAC;EAAEQ,IAAI,EAAEX,UAAU;EAAEY,KAAK,EAAE;AAAS,CAAC,EAC5D;EAAEF,KAAK,EAAEP,EAAE,CAAE,QAAS,CAAC;EAAEQ,IAAI,EAAEV,UAAU;EAAEW,KAAK,EAAE;AAAS,CAAC,CAC5D;AAED,SAASC,mCAAmCA,CAC3C;EAAEC,QAAQ;EAAE,GAAGC;AAA4B,CAAC,EAC5CC,YAAuC,EACtC;EACD,oBACCR,IAAA,CAACH,kBAAkB;IAClBY,uBAAuB;IACvBC,qBAAqB;IACrBC,GAAG,EAAGH,YAAc;IACpBI,cAAc;IACdN,QAAQ,EAAKF,KAAK,IAAM;MACvBE,QAAQ,GAAIF,KAA4B,CAAC;IAC1C,CAAG;IAAA,GACEG,SAAS;IAAAM,QAAA,EAEZZ,aAAa,CAACa,GAAG,CAAIC,WAAW,iBACjCf,IAAA,CAACF,4BAA4B;MAE5BM,KAAK,EAAGW,WAAW,CAACX,KAAO;MAC3BD,IAAI,EAAGY,WAAW,CAACZ,IAAM;MACzBD,KAAK,EAAGa,WAAW,CAACb;IAAO,GAHrBa,WAAW,CAACX,KAIlB,CACA;EAAC,CACgB,CAAC;AAEvB;AAEA,MAAMY,wBAAwB,GAAGpB,cAAc,CAC9CS,mCAAmC,EACnC,0BACD,CAAC;AAED,eAAeW,wBAAwB","ignoreList":[]}

package/build-module/box-control/all-input-control.js

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
@@ -11,6 +10,8 @@ import { FlexedRangeControl, StyledUnitControl } from './styles/box-control-styl
 import { HStack } from '../h-stack';
 import { parseQuantityAndUnitFromRawValue } from '../unit-control';
 import { LABELS, applyValueToSides, getAllValue, isValuesMixed, isValuesDefined, CUSTOM_VALUE_SETTINGS } from './utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const noop = () => {};
 export default function AllInputControl({
   __next40pxDefaultSize,
@@ -50,32 +51,34 @@ export default function AllInputControl({
     const newUnits = applyValueToSides(selectedUnits, unit, sides);
     setSelectedUnits(newUnits);
   };
-  return createElement(HStack, null, createElement(StyledUnitControl, {
-    ...props,
-    __next40pxDefaultSize: __next40pxDefaultSize,
-    className: "component-box-control__unit-control",
-    disableUnits: isMixed,
-    id: inputId,
-    isPressEnterToChange: true,
-    value: allValue,
-    onChange: onValueChange,
-    onUnitChange: handleOnUnitChange,
-    onFocus: handleOnFocus,
-    placeholder: allPlaceholder,
-    label: LABELS.all,
-    hideLabelFromVision: true
-  }), createElement(FlexedRangeControl, {
-    __nextHasNoMarginBottom: true,
-    __next40pxDefaultSize: __next40pxDefaultSize,
-    "aria-controls": inputId,
-    label: LABELS.all,
-    hideLabelFromVision: true,
-    onChange: sliderOnChange,
-    min: 0,
-    max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
-    step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
-    value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
-    withInputField: false
-  }));
+  return /*#__PURE__*/_jsxs(HStack, {
+    children: [/*#__PURE__*/_jsx(StyledUnitControl, {
+      ...props,
+      __next40pxDefaultSize: __next40pxDefaultSize,
+      className: "component-box-control__unit-control",
+      disableUnits: isMixed,
+      id: inputId,
+      isPressEnterToChange: true,
+      value: allValue,
+      onChange: onValueChange,
+      onUnitChange: handleOnUnitChange,
+      onFocus: handleOnFocus,
+      placeholder: allPlaceholder,
+      label: LABELS.all,
+      hideLabelFromVision: true
+    }), /*#__PURE__*/_jsx(FlexedRangeControl, {
+      __nextHasNoMarginBottom: true,
+      __next40pxDefaultSize: __next40pxDefaultSize,
+      "aria-controls": inputId,
+      label: LABELS.all,
+      hideLabelFromVision: true,
+      onChange: sliderOnChange,
+      min: 0,
+      max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
+      step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
+      value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
+      withInputField: false
+    })]
+  });
 }
 //# sourceMappingURL=all-input-control.js.map

package/build-module/box-control/all-input-control.js.map

@@ -1 +1 @@
-{"version":3,"names":["useInstanceId","FlexedRangeControl","StyledUnitControl","HStack","parseQuantityAndUnitFromRawValue","LABELS","applyValueToSides","getAllValue","isValuesMixed","isValuesDefined","CUSTOM_VALUE_SETTINGS","noop","AllInputControl","__next40pxDefaultSize","onChange","onFocus","values","sides","selectedUnits","setSelectedUnits","props","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","inputId","allValue","hasValues","isMixed","allPlaceholder","mixed","undefined","parsedQuantity","parsedUnit","handleOnFocus","event","side","onValueChange","next","isNumeric","isNaN","parseFloat","nextValue","nextValues","sliderOnChange","join","handleOnUnitChange","unit","newUnits","createElement","className","disableUnits","id","isPressEnterToChange","value","onUnitChange","placeholder","label","all","hideLabelFromVision","__nextHasNoMarginBottom","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/all-input-control.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport type { UnitControlProps } from '../unit-control/types';\nimport {\n\tFlexedRangeControl,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport { HStack } from '../h-stack';\nimport type { BoxControlInputControlProps } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\nimport {\n\tLABELS,\n\tapplyValueToSides,\n\tgetAllValue,\n\tisValuesMixed,\n\tisValuesDefined,\n\tCUSTOM_VALUE_SETTINGS,\n} from './utils';\n\nconst noop = () => {};\n\nexport default function AllInputControl( {\n\t__next40pxDefaultSize,\n\tonChange = noop,\n\tonFocus = noop,\n\tvalues,\n\tsides,\n\tselectedUnits,\n\tsetSelectedUnits,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst inputId = useInstanceId( AllInputControl, 'box-control-input-all' );\n\n\tconst allValue = getAllValue( values, selectedUnits, sides );\n\tconst hasValues = isValuesDefined( values );\n\tconst isMixed = hasValues && isValuesMixed( values, selectedUnits, sides );\n\tconst allPlaceholder = isMixed ? LABELS.mixed : undefined;\n\n\tconst [ parsedQuantity, parsedUnit ] =\n\t\tparseQuantityAndUnitFromRawValue( allValue );\n\n\tconst handleOnFocus: React.FocusEventHandler< HTMLInputElement > = (\n\t\tevent\n\t) => {\n\t\tonFocus( event, { side: 'all' } );\n\t};\n\n\tconst onValueChange = ( next?: string ) => {\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\t\tconst nextValues = applyValueToSides( values, nextValue, sides );\n\n\t\tonChange( nextValues );\n\t};\n\n\tconst sliderOnChange = ( next?: number ) => {\n\t\tonValueChange(\n\t\t\tnext !== undefined ? [ next, parsedUnit ].join( '' ) : undefined\n\t\t);\n\t};\n\n\t// Set selected unit so it can be used as fallback by unlinked controls\n\t// when individual sides do not have a value containing a unit.\n\tconst handleOnUnitChange: UnitControlProps[ 'onUnitChange' ] = ( unit ) => {\n\t\tconst newUnits = applyValueToSides( selectedUnits, unit, sides );\n\t\tsetSelectedUnits( newUnits );\n\t};\n\n\treturn (\n\t\t<HStack>\n\t\t\t<StyledUnitControl\n\t\t\t\t{ ...props }\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\tdisableUnits={ isMixed }\n\t\t\t\tid={ inputId }\n\t\t\t\tisPressEnterToChange\n\t\t\t\tvalue={ allValue }\n\t\t\t\tonChange={ onValueChange }\n\t\t\t\tonUnitChange={ handleOnUnitChange }\n\t\t\t\tonFocus={ handleOnFocus }\n\t\t\t\tplaceholder={ allPlaceholder }\n\t\t\t\tlabel={ LABELS.all }\n\t\t\t\thideLabelFromVision\n\t\t\t/>\n\n\t\t\t<FlexedRangeControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\taria-controls={ inputId }\n\t\t\t\tlabel={ LABELS.all }\n\t\t\t\thideLabelFromVision\n\t\t\t\tonChange={ sliderOnChange }\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ CUSTOM_VALUE_SETTINGS[ parsedUnit ?? 'px' ]?.max ?? 10 }\n\t\t\t\tstep={\n\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ parsedUnit ?? 'px' ]?.step ?? 0.1\n\t\t\t\t}\n\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\twithInputField={ false }\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useInstanceId","FlexedRangeControl","StyledUnitControl","HStack","parseQuantityAndUnitFromRawValue","LABELS","applyValueToSides","getAllValue","isValuesMixed","isValuesDefined","CUSTOM_VALUE_SETTINGS","jsx","_jsx","jsxs","_jsxs","noop","AllInputControl","__next40pxDefaultSize","onChange","onFocus","values","sides","selectedUnits","setSelectedUnits","props","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","inputId","allValue","hasValues","isMixed","allPlaceholder","mixed","undefined","parsedQuantity","parsedUnit","handleOnFocus","event","side","onValueChange","next","isNumeric","isNaN","parseFloat","nextValue","nextValues","sliderOnChange","join","handleOnUnitChange","unit","newUnits","children","className","disableUnits","id","isPressEnterToChange","value","onUnitChange","placeholder","label","all","hideLabelFromVision","__nextHasNoMarginBottom","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/all-input-control.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport type { UnitControlProps } from '../unit-control/types';\nimport {\n\tFlexedRangeControl,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport { HStack } from '../h-stack';\nimport type { BoxControlInputControlProps } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\nimport {\n\tLABELS,\n\tapplyValueToSides,\n\tgetAllValue,\n\tisValuesMixed,\n\tisValuesDefined,\n\tCUSTOM_VALUE_SETTINGS,\n} from './utils';\n\nconst noop = () => {};\n\nexport default function AllInputControl( {\n\t__next40pxDefaultSize,\n\tonChange = noop,\n\tonFocus = noop,\n\tvalues,\n\tsides,\n\tselectedUnits,\n\tsetSelectedUnits,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst inputId = useInstanceId( AllInputControl, 'box-control-input-all' );\n\n\tconst allValue = getAllValue( values, selectedUnits, sides );\n\tconst hasValues = isValuesDefined( values );\n\tconst isMixed = hasValues && isValuesMixed( values, selectedUnits, sides );\n\tconst allPlaceholder = isMixed ? LABELS.mixed : undefined;\n\n\tconst [ parsedQuantity, parsedUnit ] =\n\t\tparseQuantityAndUnitFromRawValue( allValue );\n\n\tconst handleOnFocus: React.FocusEventHandler< HTMLInputElement > = (\n\t\tevent\n\t) => {\n\t\tonFocus( event, { side: 'all' } );\n\t};\n\n\tconst onValueChange = ( next?: string ) => {\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\t\tconst nextValues = applyValueToSides( values, nextValue, sides );\n\n\t\tonChange( nextValues );\n\t};\n\n\tconst sliderOnChange = ( next?: number ) => {\n\t\tonValueChange(\n\t\t\tnext !== undefined ? [ next, parsedUnit ].join( '' ) : undefined\n\t\t);\n\t};\n\n\t// Set selected unit so it can be used as fallback by unlinked controls\n\t// when individual sides do not have a value containing a unit.\n\tconst handleOnUnitChange: UnitControlProps[ 'onUnitChange' ] = ( unit ) => {\n\t\tconst newUnits = applyValueToSides( selectedUnits, unit, sides );\n\t\tsetSelectedUnits( newUnits );\n\t};\n\n\treturn (\n\t\t<HStack>\n\t\t\t<StyledUnitControl\n\t\t\t\t{ ...props }\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\tdisableUnits={ isMixed }\n\t\t\t\tid={ inputId }\n\t\t\t\tisPressEnterToChange\n\t\t\t\tvalue={ allValue }\n\t\t\t\tonChange={ onValueChange }\n\t\t\t\tonUnitChange={ handleOnUnitChange }\n\t\t\t\tonFocus={ handleOnFocus }\n\t\t\t\tplaceholder={ allPlaceholder }\n\t\t\t\tlabel={ LABELS.all }\n\t\t\t\thideLabelFromVision\n\t\t\t/>\n\n\t\t\t<FlexedRangeControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\taria-controls={ inputId }\n\t\t\t\tlabel={ LABELS.all }\n\t\t\t\thideLabelFromVision\n\t\t\t\tonChange={ sliderOnChange }\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ CUSTOM_VALUE_SETTINGS[ parsedUnit ?? 'px' ]?.max ?? 10 }\n\t\t\t\tstep={\n\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ parsedUnit ?? 'px' ]?.step ?? 0.1\n\t\t\t\t}\n\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\twithInputField={ false }\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/box-control/axial-input-controls.js

@@ -1,4 +1,3 @@
-import { createElement, Fragment } from "react";
 /**
  * WordPress dependencies
  */
@@ -10,6 +9,10 @@ import { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';
 import Tooltip from '../tooltip';
 import { CUSTOM_VALUE_SETTINGS, LABELS } from './utils';
 import { FlexedBoxControlIcon, FlexedRangeControl, InputWrapper, StyledUnitControl } from './styles/box-control-styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 const groupedSides = ['vertical', 'horizontal'];
 export default function AxialInputControls({
   __next40pxDefaultSize,
@@ -66,45 +69,48 @@ export default function AxialInputControls({
 
   // Filter sides if custom configuration provided, maintaining default order.
   const filteredSides = sides?.length ? groupedSides.filter(side => sides.includes(side)) : groupedSides;
-  return createElement(Fragment, null, filteredSides.map(side => {
-    var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2;
-    const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(side === 'vertical' ? values.top : values.left);
-    const selectedUnit = side === 'vertical' ? selectedUnits.top : selectedUnits.left;
-    const inputId = [generatedId, side].join('-');
-    return createElement(InputWrapper, {
-      key: side
-    }, createElement(FlexedBoxControlIcon, {
-      side: side,
-      sides: sides
-    }), createElement(Tooltip, {
-      placement: "top-end",
-      text: LABELS[side]
-    }, createElement(StyledUnitControl, {
-      ...props,
-      __next40pxDefaultSize: __next40pxDefaultSize,
-      className: "component-box-control__unit-control",
-      id: inputId,
-      isPressEnterToChange: true,
-      value: [parsedQuantity, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join(''),
-      onChange: newValue => handleOnValueChange(side, newValue),
-      onUnitChange: createHandleOnUnitChange(side),
-      onFocus: createHandleOnFocus(side),
-      label: LABELS[side],
-      hideLabelFromVision: true,
-      key: side
-    })), createElement(FlexedRangeControl, {
-      __nextHasNoMarginBottom: true,
-      __next40pxDefaultSize: __next40pxDefaultSize,
-      "aria-controls": inputId,
-      label: LABELS[side],
-      hideLabelFromVision: true,
-      onChange: newValue => handleOnValueChange(side, newValue !== undefined ? [newValue, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join('') : undefined),
-      min: 0,
-      max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
-      step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
-      value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
-      withInputField: false
-    }));
-  }));
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: filteredSides.map(side => {
+      var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2;
+      const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(side === 'vertical' ? values.top : values.left);
+      const selectedUnit = side === 'vertical' ? selectedUnits.top : selectedUnits.left;
+      const inputId = [generatedId, side].join('-');
+      return /*#__PURE__*/_jsxs(InputWrapper, {
+        children: [/*#__PURE__*/_jsx(FlexedBoxControlIcon, {
+          side: side,
+          sides: sides
+        }), /*#__PURE__*/_jsx(Tooltip, {
+          placement: "top-end",
+          text: LABELS[side],
+          children: /*#__PURE__*/_createElement(StyledUnitControl, {
+            ...props,
+            __next40pxDefaultSize: __next40pxDefaultSize,
+            className: "component-box-control__unit-control",
+            id: inputId,
+            isPressEnterToChange: true,
+            value: [parsedQuantity, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join(''),
+            onChange: newValue => handleOnValueChange(side, newValue),
+            onUnitChange: createHandleOnUnitChange(side),
+            onFocus: createHandleOnFocus(side),
+            label: LABELS[side],
+            hideLabelFromVision: true,
+            key: side
+          })
+        }), /*#__PURE__*/_jsx(FlexedRangeControl, {
+          __nextHasNoMarginBottom: true,
+          __next40pxDefaultSize: __next40pxDefaultSize,
+          "aria-controls": inputId,
+          label: LABELS[side],
+          hideLabelFromVision: true,
+          onChange: newValue => handleOnValueChange(side, newValue !== undefined ? [newValue, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join('') : undefined),
+          min: 0,
+          max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
+          step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
+          value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
+          withInputField: false
+        })]
+      }, side);
+    })
+  });
 }
 //# sourceMappingURL=axial-input-controls.js.map

package/build-module/box-control/axial-input-controls.js.map

@@ -1 +1 @@
-{"version":3,"names":["useInstanceId","parseQuantityAndUnitFromRawValue","Tooltip","CUSTOM_VALUE_SETTINGS","LABELS","FlexedBoxControlIcon","FlexedRangeControl","InputWrapper","StyledUnitControl","groupedSides","AxialInputControls","__next40pxDefaultSize","onChange","onFocus","values","selectedUnits","setSelectedUnits","sides","props","generatedId","createHandleOnFocus","side","event","handleOnValueChange","next","nextValues","isNumeric","undefined","isNaN","parseFloat","nextValue","top","bottom","left","right","createHandleOnUnitChange","newUnits","filteredSides","length","filter","includes","createElement","Fragment","map","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","parsedQuantity","parsedUnit","selectedUnit","inputId","join","key","placement","text","className","id","isPressEnterToChange","value","newValue","onUnitChange","label","hideLabelFromVision","__nextHasNoMarginBottom","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/axial-input-controls.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport Tooltip from '../tooltip';\nimport { CUSTOM_VALUE_SETTINGS, LABELS } from './utils';\nimport {\n\tFlexedBoxControlIcon,\n\tFlexedRangeControl,\n\tInputWrapper,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport type { BoxControlInputControlProps } from './types';\n\nconst groupedSides = [ 'vertical', 'horizontal' ] as const;\ntype GroupedSide = ( typeof groupedSides )[ number ];\n\nexport default function AxialInputControls( {\n\t__next40pxDefaultSize,\n\tonChange,\n\tonFocus,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst generatedId = useInstanceId(\n\t\tAxialInputControls,\n\t\t`box-control-input`\n\t);\n\n\tconst createHandleOnFocus =\n\t\t( side: GroupedSide ) =>\n\t\t( event: React.FocusEvent< HTMLInputElement > ) => {\n\t\t\tif ( ! onFocus ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonFocus( event, { side } );\n\t\t};\n\n\tconst handleOnValueChange = ( side: GroupedSide, next?: string ) => {\n\t\tif ( ! onChange ) {\n\t\t\treturn;\n\t\t}\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tif ( side === 'vertical' ) {\n\t\t\tnextValues.top = nextValue;\n\t\t\tnextValues.bottom = nextValue;\n\t\t}\n\n\t\tif ( side === 'horizontal' ) {\n\t\t\tnextValues.left = nextValue;\n\t\t\tnextValues.right = nextValue;\n\t\t}\n\n\t\tonChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange =\n\t\t( side: GroupedSide ) => ( next?: string ) => {\n\t\t\tconst newUnits = { ...selectedUnits };\n\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewUnits.top = next;\n\t\t\t\tnewUnits.bottom = next;\n\t\t\t}\n\n\t\t\tif ( side === 'horizontal' ) {\n\t\t\t\tnewUnits.left = next;\n\t\t\t\tnewUnits.right = next;\n\t\t\t}\n\n\t\t\tsetSelectedUnits( newUnits );\n\t\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? groupedSides.filter( ( side ) => sides.includes( side ) )\n\t\t: groupedSides;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredSides.map( ( side ) => {\n\t\t\t\tconst [ parsedQuantity, parsedUnit ] =\n\t\t\t\t\tparseQuantityAndUnitFromRawValue(\n\t\t\t\t\t\tside === 'vertical' ? values.top : values.left\n\t\t\t\t\t);\n\t\t\t\tconst selectedUnit =\n\t\t\t\t\tside === 'vertical'\n\t\t\t\t\t\t? selectedUnits.top\n\t\t\t\t\t\t: selectedUnits.left;\n\n\t\t\t\tconst inputId = [ generatedId, side ].join( '-' );\n\n\t\t\t\treturn (\n\t\t\t\t\t<InputWrapper key={ side }>\n\t\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t\t<Tooltip placement=\"top-end\" text={ LABELS[ side ] }>\n\t\t\t\t\t\t\t<StyledUnitControl\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\t\t\t\tid={ inputId }\n\t\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\t\tvalue={ [\n\t\t\t\t\t\t\t\t\tparsedQuantity,\n\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t].join( '' ) }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\t\thandleOnValueChange( side, newValue )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange(\n\t\t\t\t\t\t\t\t\tside\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tkey={ side }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t<FlexedRangeControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\taria-controls={ inputId }\n\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\tnewValue !== undefined\n\t\t\t\t\t\t\t\t\t\t? [\n\t\t\t\t\t\t\t\t\t\t\t\tnewValue,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t\t\t  ].join( '' )\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.max ?? 10\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputWrapper>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,oBAAoB;AAClD;AACA;AACA;AACA,SAASC,gCAAgC,QAAQ,uBAAuB;AACxE,OAAOC,OAAO,MAAM,YAAY;AAChC,SAASC,qBAAqB,EAAEC,MAAM,QAAQ,SAAS;AACvD,SACCC,oBAAoB,EACpBC,kBAAkB,EAClBC,YAAY,EACZC,iBAAiB,QACX,6BAA6B;AAGpC,MAAMC,YAAY,GAAG,CAAE,UAAU,EAAE,YAAY,CAAW;AAG1D,eAAe,SAASC,kBAAkBA,CAAE;EAC3CC,qBAAqB;EACrBC,QAAQ;EACRC,OAAO;EACPC,MAAM;EACNC,aAAa;EACbC,gBAAgB;EAChBC,KAAK;EACL,GAAGC;AACyB,CAAC,EAAG;EAChC,MAAMC,WAAW,GAAGnB,aAAa,CAChCU,kBAAkB,EACjB,mBACF,CAAC;EAED,MAAMU,mBAAmB,GACtBC,IAAiB,IACjBC,KAA2C,IAAM;IAClD,IAAK,CAAET,OAAO,EAAG;MAChB;IACD;IACAA,OAAO,CAAES,KAAK,EAAE;MAAED;IAAK,CAAE,CAAC;EAC3B,CAAC;EAEF,MAAME,mBAAmB,GAAGA,CAAEF,IAAiB,EAAEG,IAAa,KAAM;IACnE,IAAK,CAAEZ,QAAQ,EAAG;MACjB;IACD;IACA,MAAMa,UAAU,GAAG;MAAE,GAAGX;IAAO,CAAC;IAChC,MAAMY,SAAS,GAAGF,IAAI,KAAKG,SAAS,IAAI,CAAEC,KAAK,CAAEC,UAAU,CAAEL,IAAK,CAAE,CAAC;IACrE,MAAMM,SAAS,GAAGJ,SAAS,GAAGF,IAAI,GAAGG,SAAS;IAE9C,IAAKN,IAAI,KAAK,UAAU,EAAG;MAC1BI,UAAU,CAACM,GAAG,GAAGD,SAAS;MAC1BL,UAAU,CAACO,MAAM,GAAGF,SAAS;IAC9B;IAEA,IAAKT,IAAI,KAAK,YAAY,EAAG;MAC5BI,UAAU,CAACQ,IAAI,GAAGH,SAAS;MAC3BL,UAAU,CAACS,KAAK,GAAGJ,SAAS;IAC7B;IAEAlB,QAAQ,CAAEa,UAAW,CAAC;EACvB,CAAC;EAED,MAAMU,wBAAwB,GAC3Bd,IAAiB,IAAQG,IAAa,IAAM;IAC7C,MAAMY,QAAQ,GAAG;MAAE,GAAGrB;IAAc,CAAC;IAErC,IAAKM,IAAI,KAAK,UAAU,EAAG;MAC1Be,QAAQ,CAACL,GAAG,GAAGP,IAAI;MACnBY,QAAQ,CAACJ,MAAM,GAAGR,IAAI;IACvB;IAEA,IAAKH,IAAI,KAAK,YAAY,EAAG;MAC5Be,QAAQ,CAACH,IAAI,GAAGT,IAAI;MACpBY,QAAQ,CAACF,KAAK,GAAGV,IAAI;IACtB;IAEAR,gBAAgB,CAAEoB,QAAS,CAAC;EAC7B,CAAC;;EAEF;EACA,MAAMC,aAAa,GAAGpB,KAAK,EAAEqB,MAAM,GAChC7B,YAAY,CAAC8B,MAAM,CAAIlB,IAAI,IAAMJ,KAAK,CAACuB,QAAQ,CAAEnB,IAAK,CAAE,CAAC,GACzDZ,YAAY;EAEf,OACCgC,aAAA,CAAAC,QAAA,QACGL,aAAa,CAACM,GAAG,CAAItB,IAAI,IAAM;IAAA,IAAAuB,qBAAA,EAAAC,sBAAA;IAChC,MAAM,CAAEC,cAAc,EAAEC,UAAU,CAAE,GACnC9C,gCAAgC,CAC/BoB,IAAI,KAAK,UAAU,GAAGP,MAAM,CAACiB,GAAG,GAAGjB,MAAM,CAACmB,IAC3C,CAAC;IACF,MAAMe,YAAY,GACjB3B,IAAI,KAAK,UAAU,GAChBN,aAAa,CAACgB,GAAG,GACjBhB,aAAa,CAACkB,IAAI;IAEtB,MAAMgB,OAAO,GAAG,CAAE9B,WAAW,EAAEE,IAAI,CAAE,CAAC6B,IAAI,CAAE,GAAI,CAAC;IAEjD,OACCT,aAAA,CAAClC,YAAY;MAAC4C,GAAG,EAAG9B;IAAM,GACzBoB,aAAA,CAACpC,oBAAoB;MAACgB,IAAI,EAAGA,IAAM;MAACJ,KAAK,EAAGA;IAAO,CAAE,CAAC,EACtDwB,aAAA,CAACvC,OAAO;MAACkD,SAAS,EAAC,SAAS;MAACC,IAAI,EAAGjD,MAAM,CAAEiB,IAAI;IAAI,GACnDoB,aAAA,CAACjC,iBAAiB;MAAA,GACZU,KAAK;MACVP,qBAAqB,EAAGA,qBAAuB;MAC/C2C,SAAS,EAAC,qCAAqC;MAC/CC,EAAE,EAAGN,OAAS;MACdO,oBAAoB;MACpBC,KAAK,EAAG,CACPX,cAAc,EACdE,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAID,UAAU,CAC1B,CAACG,IAAI,CAAE,EAAG,CAAG;MACdtC,QAAQ,EAAK8C,QAAQ,IACpBnC,mBAAmB,CAAEF,IAAI,EAAEqC,QAAS,CACpC;MACDC,YAAY,EAAGxB,wBAAwB,CACtCd,IACD,CAAG;MACHR,OAAO,EAAGO,mBAAmB,CAAEC,IAAK,CAAG;MACvCuC,KAAK,EAAGxD,MAAM,CAAEiB,IAAI,CAAI;MACxBwC,mBAAmB;MACnBV,GAAG,EAAG9B;IAAM,CACZ,CACO,CAAC,EACVoB,aAAA,CAACnC,kBAAkB;MAClBwD,uBAAuB;MACvBnD,qBAAqB,EAAGA,qBAAuB;MAC/C,iBAAgBsC,OAAS;MACzBW,KAAK,EAAGxD,MAAM,CAAEiB,IAAI,CAAI;MACxBwC,mBAAmB;MACnBjD,QAAQ,EAAK8C,QAAQ,IACpBnC,mBAAmB,CAClBF,IAAI,EACJqC,QAAQ,KAAK/B,SAAS,GACnB,CACA+B,QAAQ,EACRV,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAID,UAAU,CACzB,CAACG,IAAI,CAAE,EAAG,CAAC,GACZvB,SACJ,CACA;MACDoC,GAAG,EAAG,CAAG;MACTC,GAAG,GAAApB,qBAAA,GACFzC,qBAAqB,CAAE6C,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI,IAAI,CAAE,EAC1CgB,GAAG,cAAApB,qBAAA,cAAAA,qBAAA,GAAI,EACV;MACDqB,IAAI,GAAApB,sBAAA,GACH1C,qBAAqB,CAAE6C,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI,IAAI,CAAE,EAC1CiB,IAAI,cAAApB,sBAAA,cAAAA,sBAAA,GAAI,GACX;MACDY,KAAK,EAAGX,cAAc,aAAdA,cAAc,cAAdA,cAAc,GAAI,CAAG;MAC7BoB,cAAc,EAAG;IAAO,CACxB,CACY,CAAC;EAEjB,CAAE,CACD,CAAC;AAEL","ignoreList":[]}
+{"version":3,"names":["useInstanceId","parseQuantityAndUnitFromRawValue","Tooltip","CUSTOM_VALUE_SETTINGS","LABELS","FlexedBoxControlIcon","FlexedRangeControl","InputWrapper","StyledUnitControl","jsx","_jsx","createElement","_createElement","jsxs","_jsxs","Fragment","_Fragment","groupedSides","AxialInputControls","__next40pxDefaultSize","onChange","onFocus","values","selectedUnits","setSelectedUnits","sides","props","generatedId","createHandleOnFocus","side","event","handleOnValueChange","next","nextValues","isNumeric","undefined","isNaN","parseFloat","nextValue","top","bottom","left","right","createHandleOnUnitChange","newUnits","filteredSides","length","filter","includes","children","map","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","parsedQuantity","parsedUnit","selectedUnit","inputId","join","placement","text","className","id","isPressEnterToChange","value","newValue","onUnitChange","label","hideLabelFromVision","key","__nextHasNoMarginBottom","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/axial-input-controls.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport Tooltip from '../tooltip';\nimport { CUSTOM_VALUE_SETTINGS, LABELS } from './utils';\nimport {\n\tFlexedBoxControlIcon,\n\tFlexedRangeControl,\n\tInputWrapper,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport type { BoxControlInputControlProps } from './types';\n\nconst groupedSides = [ 'vertical', 'horizontal' ] as const;\ntype GroupedSide = ( typeof groupedSides )[ number ];\n\nexport default function AxialInputControls( {\n\t__next40pxDefaultSize,\n\tonChange,\n\tonFocus,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst generatedId = useInstanceId(\n\t\tAxialInputControls,\n\t\t`box-control-input`\n\t);\n\n\tconst createHandleOnFocus =\n\t\t( side: GroupedSide ) =>\n\t\t( event: React.FocusEvent< HTMLInputElement > ) => {\n\t\t\tif ( ! onFocus ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonFocus( event, { side } );\n\t\t};\n\n\tconst handleOnValueChange = ( side: GroupedSide, next?: string ) => {\n\t\tif ( ! onChange ) {\n\t\t\treturn;\n\t\t}\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tif ( side === 'vertical' ) {\n\t\t\tnextValues.top = nextValue;\n\t\t\tnextValues.bottom = nextValue;\n\t\t}\n\n\t\tif ( side === 'horizontal' ) {\n\t\t\tnextValues.left = nextValue;\n\t\t\tnextValues.right = nextValue;\n\t\t}\n\n\t\tonChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange =\n\t\t( side: GroupedSide ) => ( next?: string ) => {\n\t\t\tconst newUnits = { ...selectedUnits };\n\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewUnits.top = next;\n\t\t\t\tnewUnits.bottom = next;\n\t\t\t}\n\n\t\t\tif ( side === 'horizontal' ) {\n\t\t\t\tnewUnits.left = next;\n\t\t\t\tnewUnits.right = next;\n\t\t\t}\n\n\t\t\tsetSelectedUnits( newUnits );\n\t\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? groupedSides.filter( ( side ) => sides.includes( side ) )\n\t\t: groupedSides;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredSides.map( ( side ) => {\n\t\t\t\tconst [ parsedQuantity, parsedUnit ] =\n\t\t\t\t\tparseQuantityAndUnitFromRawValue(\n\t\t\t\t\t\tside === 'vertical' ? values.top : values.left\n\t\t\t\t\t);\n\t\t\t\tconst selectedUnit =\n\t\t\t\t\tside === 'vertical'\n\t\t\t\t\t\t? selectedUnits.top\n\t\t\t\t\t\t: selectedUnits.left;\n\n\t\t\t\tconst inputId = [ generatedId, side ].join( '-' );\n\n\t\t\t\treturn (\n\t\t\t\t\t<InputWrapper key={ side }>\n\t\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t\t<Tooltip placement=\"top-end\" text={ LABELS[ side ] }>\n\t\t\t\t\t\t\t<StyledUnitControl\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\t\t\t\tid={ inputId }\n\t\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\t\tvalue={ [\n\t\t\t\t\t\t\t\t\tparsedQuantity,\n\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t].join( '' ) }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\t\thandleOnValueChange( side, newValue )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange(\n\t\t\t\t\t\t\t\t\tside\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tkey={ side }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t<FlexedRangeControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\taria-controls={ inputId }\n\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\tnewValue !== undefined\n\t\t\t\t\t\t\t\t\t\t? [\n\t\t\t\t\t\t\t\t\t\t\t\tnewValue,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t\t\t  ].join( '' )\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.max ?? 10\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputWrapper>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}