@wordpress/components 30.5.1-next.f56bd8138.0 → 30.6.0

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

@@ -1,38 +1,25 @@
-/**
- * External dependencies
- */
-
-/**
- * WordPress dependencies
- */
-import { __, sprintf } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import BorderControlStylePicker from '../border-control-style-picker';
-import Button from '../../button';
-import ColorIndicator from '../../color-indicator';
-import ColorPalette from '../../color-palette';
-import Dropdown from '../../dropdown';
-import { VStack } from '../../v-stack';
-import { contextConnect } from '../../context';
-import { useBorderControlDropdown } from './hook';
-import DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';
-import { isMultiplePaletteArray } from '../../color-palette/utils';
+import { __, sprintf } from "@wordpress/i18n";
+import BorderControlStylePicker from "../border-control-style-picker";
+import Button from "../../button";
+import ColorIndicator from "../../color-indicator";
+import ColorPalette from "../../color-palette";
+import Dropdown from "../../dropdown";
+import { VStack } from "../../v-stack";
+import { contextConnect } from "../../context";
+import { useBorderControlDropdown } from "./hook";
+import DropdownContentWrapper from "../../dropdown/dropdown-content-wrapper";
+import { isMultiplePaletteArray } from "../../color-palette/utils";
 import { jsx as _jsx, jsxs as _jsxs, 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');
+const getAriaLabelColorValue = (colorValue) => {
+  return colorValue.replace(/^var\((.+)\)$/, "$1");
 };
 const getColorObject = (colorValue, colors) => {
   if (!colorValue || !colors) {
     return;
   }
   if (isMultiplePaletteArray(colors)) {
-    // Multiple origins
     let matchedColor;
-    colors.some(origin => origin.colors.some(color => {
+    colors.some((origin) => origin.colors.some((color) => {
       if (color.color === colorValue) {
         matchedColor = color;
         return true;
@@ -41,41 +28,56 @@ const getColorObject = (colorValue, colors) => {
     }));
     return matchedColor;
   }
-
-  // Single origin
-  return colors.find(color => color.color === colorValue);
+  return colors.find((color) => color.color === colorValue);
 };
 const getToggleAriaLabel = (colorValue, colorObject, style, isStyleEnabled) => {
   if (isStyleEnabled) {
     if (colorObject) {
       const ariaLabelValue = getAriaLabelColorValue(colorObject.color);
       return style ? sprintf(
-      // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:". 3: The current border style selection e.g. "solid".
-      __('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".'), colorObject.name, ariaLabelValue, style) : sprintf(
-      // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:".
-      __('Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), colorObject.name, ariaLabelValue);
+        // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:". 3: The current border style selection e.g. "solid".
+        __('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".'),
+        colorObject.name,
+        ariaLabelValue,
+        style
+      ) : sprintf(
+        // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:".
+        __('Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s".'),
+        colorObject.name,
+        ariaLabelValue
+      );
     }
     if (colorValue) {
       const ariaLabelValue = getAriaLabelColorValue(colorValue);
       return style ? sprintf(
-      // translators: 1: The color's hex code e.g.: "#f00:". 2: The current border style selection e.g. "solid".
-      __('Border color and style picker. The currently selected color has a value of "%1$s". The currently selected style is "%2$s".'), ariaLabelValue, style) : sprintf(
-      // translators: %s: The color's hex code e.g: "#f00".
-      __('Border color and style picker. The currently selected color has a value of "%s".'), ariaLabelValue);
+        // translators: 1: The color's hex code e.g.: "#f00:". 2: The current border style selection e.g. "solid".
+        __('Border color and style picker. The currently selected color has a value of "%1$s". The currently selected style is "%2$s".'),
+        ariaLabelValue,
+        style
+      ) : sprintf(
+        // translators: %s: The color's hex code e.g: "#f00".
+        __('Border color and style picker. The currently selected color has a value of "%s".'),
+        ariaLabelValue
+      );
     }
-    return __('Border color and style picker.');
+    return __("Border color and style picker.");
   }
   if (colorObject) {
     return sprintf(
-    // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g: "#f00".
-    __('Border color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), colorObject.name, getAriaLabelColorValue(colorObject.color));
+      // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g: "#f00".
+      __('Border color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'),
+      colorObject.name,
+      getAriaLabelColorValue(colorObject.color)
+    );
   }
   if (colorValue) {
     return sprintf(
-    // translators: %s: The color's hex code e.g: "#f00".
-    __('Border color picker. The currently selected color has a value of "%s".'), getAriaLabelColorValue(colorValue));
+      // translators: %s: The color's hex code e.g: "#f00".
+      __('Border color picker. The currently selected color has a value of "%s".'),
+      getAriaLabelColorValue(colorValue)
+    );
   }
-  return __('Border color picker.');
+  return __("Border color picker.");
 };
 const BorderControlDropdown = (props, forwardedRef) => {
   const {
@@ -104,49 +106,49 @@ const BorderControlDropdown = (props, forwardedRef) => {
   } = border || {};
   const colorObject = getColorObject(color, colors);
   const toggleAriaLabel = getToggleAriaLabel(color, colorObject, style, enableStyle);
-  const enableResetButton = color || style && style !== 'none';
-  const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined;
+  const enableResetButton = color || style && style !== "none";
+  const dropdownPosition = __experimentalIsRenderedInSidebar ? "bottom left" : void 0;
   const renderToggle = ({
     onToggle
-  }) => /*#__PURE__*/_jsx(Button, {
+  }) => /* @__PURE__ */ _jsx(Button, {
     onClick: onToggle,
     variant: "tertiary",
     "aria-label": toggleAriaLabel,
     tooltipPosition: dropdownPosition,
-    label: __('Border color and style picker'),
+    label: __("Border color and style picker"),
     showTooltip: true,
-    __next40pxDefaultSize: size === '__unstable-large',
-    children: /*#__PURE__*/_jsx("span", {
+    __next40pxDefaultSize: size === "__unstable-large",
+    children: /* @__PURE__ */ _jsx("span", {
       className: indicatorWrapperClassName,
-      children: /*#__PURE__*/_jsx(ColorIndicator, {
+      children: /* @__PURE__ */ _jsx(ColorIndicator, {
         className: indicatorClassName,
         colorValue: color
       })
     })
   });
-  const renderContent = () => /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsxs(DropdownContentWrapper, {
+  const renderContent = () => /* @__PURE__ */ _jsx(_Fragment, {
+    children: /* @__PURE__ */ _jsxs(DropdownContentWrapper, {
       paddingSize: "medium",
-      children: [/*#__PURE__*/_jsxs(VStack, {
+      children: [/* @__PURE__ */ _jsxs(VStack, {
         className: popoverControlsClassName,
         spacing: 6,
-        children: [/*#__PURE__*/_jsx(ColorPalette, {
+        children: [/* @__PURE__ */ _jsx(ColorPalette, {
           className: popoverContentClassName,
           value: color,
           onChange: onColorChange,
           colors,
           disableCustomColors,
-          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
+          __experimentalIsRenderedInSidebar,
           clearable: false,
-          enableAlpha: enableAlpha
-        }), enableStyle && isStyleSettable && /*#__PURE__*/_jsx(BorderControlStylePicker, {
-          label: __('Style'),
+          enableAlpha
+        }), enableStyle && isStyleSettable && /* @__PURE__ */ _jsx(BorderControlStylePicker, {
+          label: __("Style"),
           value: style,
           onChange: onStyleChange
         })]
-      }), /*#__PURE__*/_jsx("div", {
+      }), /* @__PURE__ */ _jsx("div", {
         className: resetButtonWrapperClassName,
-        children: /*#__PURE__*/_jsx(Button, {
+        children: /* @__PURE__ */ _jsx(Button, {
           variant: "tertiary",
           onClick: () => {
             onReset();
@@ -154,14 +156,14 @@ const BorderControlDropdown = (props, forwardedRef) => {
           disabled: !enableResetButton,
           accessibleWhenDisabled: true,
           __next40pxDefaultSize: true,
-          children: __('Reset')
+          children: __("Reset")
         })
       })]
     })
   });
-  return /*#__PURE__*/_jsx(Dropdown, {
-    renderToggle: renderToggle,
-    renderContent: renderContent,
+  return /* @__PURE__ */ _jsx(Dropdown, {
+    renderToggle,
+    renderContent,
     popoverProps: {
       ...__unstablePopoverProps
     },
@@ -169,6 +171,9 @@ const BorderControlDropdown = (props, forwardedRef) => {
     ref: forwardedRef
   });
 };
-const ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, 'BorderControlDropdown');
-export default ConnectedBorderControlDropdown;
-//# sourceMappingURL=component.js.map
+const ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, "BorderControlDropdown");
+var component_default = ConnectedBorderControlDropdown;
+export {
+  component_default as default
+};
+//# sourceMappingURL=component.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["__","sprintf","BorderControlStylePicker","Button","ColorIndicator","ColorPalette","Dropdown","VStack","contextConnect","useBorderControlDropdown","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","resetButtonWrapperClassName","size","__unstablePopoverProps","otherProps","toggleAriaLabel","enableResetButton","dropdownPosition","undefined","renderToggle","onToggle","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","children","className","renderContent","paddingSize","spacing","value","onChange","clearable","disabled","accessibleWhenDisabled","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';\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 { VStack } from '../../v-stack';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\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: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\". 3: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t__(\n\t\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\t),\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: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t__(\n\t\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\t),\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: The color's hex code e.g.: \"#f00:\". 2: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t__(\n\t\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\t),\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: %s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%s\".'\n\t\t\t\t\t\t),\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: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g: \"#f00\".\n\t\t\t__(\n\t\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t),\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: %s: The color's hex code e.g: \"#f00\".\n\t\t\t__(\n\t\t\t\t'Border color picker. The currently selected color has a value of \"%s\".'\n\t\t\t),\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\tresetButtonWrapperClassName,\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 enableResetButton = 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' }\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\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\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\t<div className={ resetButtonWrapperClassName }>\n\t\t\t\t\t<Button\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} }\n\t\t\t\t\t\tdisabled={ ! enableResetButton }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t__next40pxDefaultSize\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</div>\n\t\t\t</DropdownContentWrapper>\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,
+  "sources": ["../../../src/border-control/border-control-dropdown/component.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\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 { VStack } from '../../v-stack';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nconst getAriaLabelColorValue = colorValue => {\n  // Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n  return colorValue.replace(/^var\\((.+)\\)$/, '$1');\n};\nconst getColorObject = (colorValue, colors) => {\n  if (!colorValue || !colors) {\n    return;\n  }\n  if (isMultiplePaletteArray(colors)) {\n    // Multiple origins\n    let matchedColor;\n    colors.some(origin => origin.colors.some(color => {\n      if (color.color === colorValue) {\n        matchedColor = color;\n        return true;\n      }\n      return false;\n    }));\n    return matchedColor;\n  }\n\n  // Single origin\n  return colors.find(color => color.color === colorValue);\n};\nconst getToggleAriaLabel = (colorValue, colorObject, style, isStyleEnabled) => {\n  if (isStyleEnabled) {\n    if (colorObject) {\n      const ariaLabelValue = getAriaLabelColorValue(colorObject.color);\n      return style ? sprintf(\n      // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\". 3: The current border style selection e.g. \"solid\".\n      __('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\".'), colorObject.name, ariaLabelValue, style) : sprintf(\n      // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\".\n      __('Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'), colorObject.name, ariaLabelValue);\n    }\n    if (colorValue) {\n      const ariaLabelValue = getAriaLabelColorValue(colorValue);\n      return style ? sprintf(\n      // translators: 1: The color's hex code e.g.: \"#f00:\". 2: The current border style selection e.g. \"solid\".\n      __('Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".'), ariaLabelValue, style) : sprintf(\n      // translators: %s: The color's hex code e.g: \"#f00\".\n      __('Border color and style picker. The currently selected color has a value of \"%s\".'), ariaLabelValue);\n    }\n    return __('Border color and style picker.');\n  }\n  if (colorObject) {\n    return sprintf(\n    // translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g: \"#f00\".\n    __('Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'), colorObject.name, getAriaLabelColorValue(colorObject.color));\n  }\n  if (colorValue) {\n    return sprintf(\n    // translators: %s: The color's hex code e.g: \"#f00\".\n    __('Border color picker. The currently selected color has a value of \"%s\".'), getAriaLabelColorValue(colorValue));\n  }\n  return __('Border color picker.');\n};\nconst BorderControlDropdown = (props, forwardedRef) => {\n  const {\n    __experimentalIsRenderedInSidebar,\n    border,\n    colors,\n    disableCustomColors,\n    enableAlpha,\n    enableStyle,\n    indicatorClassName,\n    indicatorWrapperClassName,\n    isStyleSettable,\n    onReset,\n    onColorChange,\n    onStyleChange,\n    popoverContentClassName,\n    popoverControlsClassName,\n    resetButtonWrapperClassName,\n    size,\n    __unstablePopoverProps,\n    ...otherProps\n  } = useBorderControlDropdown(props);\n  const {\n    color,\n    style\n  } = border || {};\n  const colorObject = getColorObject(color, colors);\n  const toggleAriaLabel = getToggleAriaLabel(color, colorObject, style, enableStyle);\n  const enableResetButton = color || style && style !== 'none';\n  const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined;\n  const renderToggle = ({\n    onToggle\n  }) => /*#__PURE__*/_jsx(Button, {\n    onClick: onToggle,\n    variant: \"tertiary\",\n    \"aria-label\": toggleAriaLabel,\n    tooltipPosition: dropdownPosition,\n    label: __('Border color and style picker'),\n    showTooltip: true,\n    __next40pxDefaultSize: size === '__unstable-large',\n    children: /*#__PURE__*/_jsx(\"span\", {\n      className: indicatorWrapperClassName,\n      children: /*#__PURE__*/_jsx(ColorIndicator, {\n        className: indicatorClassName,\n        colorValue: color\n      })\n    })\n  });\n  const renderContent = () => /*#__PURE__*/_jsx(_Fragment, {\n    children: /*#__PURE__*/_jsxs(DropdownContentWrapper, {\n      paddingSize: \"medium\",\n      children: [/*#__PURE__*/_jsxs(VStack, {\n        className: popoverControlsClassName,\n        spacing: 6,\n        children: [/*#__PURE__*/_jsx(ColorPalette, {\n          className: popoverContentClassName,\n          value: color,\n          onChange: onColorChange,\n          colors,\n          disableCustomColors,\n          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,\n          clearable: false,\n          enableAlpha: enableAlpha\n        }), enableStyle && isStyleSettable && /*#__PURE__*/_jsx(BorderControlStylePicker, {\n          label: __('Style'),\n          value: style,\n          onChange: onStyleChange\n        })]\n      }), /*#__PURE__*/_jsx(\"div\", {\n        className: resetButtonWrapperClassName,\n        children: /*#__PURE__*/_jsx(Button, {\n          variant: \"tertiary\",\n          onClick: () => {\n            onReset();\n          },\n          disabled: !enableResetButton,\n          accessibleWhenDisabled: true,\n          __next40pxDefaultSize: true,\n          children: __('Reset')\n        })\n      })]\n    })\n  });\n  return /*#__PURE__*/_jsx(Dropdown, {\n    renderToggle: renderToggle,\n    renderContent: renderContent,\n    popoverProps: {\n      ...__unstablePopoverProps\n    },\n    ...otherProps,\n    ref: forwardedRef\n  });\n};\nconst ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, 'BorderControlDropdown');\nexport default ConnectedBorderControlDropdown;"],
+  "mappings": "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",
+  "names": []
+}

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

@@ -1,16 +1,9 @@
-/**
- * WordPress dependencies
- */
-import { useMemo } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import * as styles from '../styles';
-import { parseQuantityAndUnitFromRawValue } from '../../unit-control/utils';
-import { useContextSystem } from '../../context';
-import { useCx } from '../../utils/hooks/use-cx';
-export function useBorderControlDropdown(props) {
+import { useMemo } from "@wordpress/element";
+import * as styles from "../styles";
+import { parseQuantityAndUnitFromRawValue } from "../../unit-control/utils";
+import { useContextSystem } from "../../context";
+import { useCx } from "../../utils/hooks/use-cx";
+function useBorderControlDropdown(props) {
   const {
     border,
     className,
@@ -19,23 +12,23 @@ export function useBorderControlDropdown(props) {
     enableStyle = true,
     onChange,
     previousStyleSelection,
-    size = 'default',
+    size = "default",
     __experimentalIsRenderedInSidebar = false,
     ...otherProps
-  } = useContextSystem(props, 'BorderControlDropdown');
+  } = useContextSystem(props, "BorderControlDropdown");
   const [widthValue] = parseQuantityAndUnitFromRawValue(border?.width);
   const hasZeroWidth = widthValue === 0;
-  const onColorChange = color => {
-    const style = border?.style === 'none' ? previousStyleSelection : border?.style;
-    const width = hasZeroWidth && !!color ? '1px' : border?.width;
+  const onColorChange = (color) => {
+    const style = border?.style === "none" ? previousStyleSelection : border?.style;
+    const width = hasZeroWidth && !!color ? "1px" : border?.width;
     onChange({
       color,
       style,
       width
     });
   };
-  const onStyleChange = style => {
-    const width = hasZeroWidth && !!style ? '1px' : border?.width;
+  const onStyleChange = (style) => {
+    const width = hasZeroWidth && !!style ? "1px" : border?.width;
     onChange({
       ...border,
       style,
@@ -45,12 +38,10 @@ export function useBorderControlDropdown(props) {
   const onReset = () => {
     onChange({
       ...border,
-      color: undefined,
-      style: undefined
+      color: void 0,
+      style: void 0
     });
   };
-
-  // Generate class names.
   const cx = useCx();
   const classes = useMemo(() => {
     return cx(styles.borderControlDropdown, className);
@@ -89,4 +80,7 @@ export function useBorderControlDropdown(props) {
     __experimentalIsRenderedInSidebar
   };
 }
-//# sourceMappingURL=hook.js.map
+export {
+  useBorderControlDropdown
+};
+//# sourceMappingURL=hook.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["useMemo","styles","parseQuantityAndUnitFromRawValue","useContextSystem","useCx","useBorderControlDropdown","props","border","className","colors","enableAlpha","enableStyle","onChange","previousStyleSelection","size","__experimentalIsRenderedInSidebar","otherProps","widthValue","width","hasZeroWidth","onColorChange","color","style","onStyleChange","onReset","undefined","cx","classes","borderControlDropdown","indicatorClassName","borderColorIndicator","indicatorWrapperClassName","colorIndicatorWrapper","popoverControlsClassName","borderControlPopoverControls","popoverContentClassName","borderControlPopoverContent","resetButtonWrapperClassName","resetButtonWrapper"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/hook.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { parseQuantityAndUnitFromRawValue } from '../../unit-control/utils';\nimport type { WordPressComponentProps } from '../../context';\nimport { useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nimport type { DropdownProps } from '../types';\n\nexport function useBorderControlDropdown(\n\tprops: WordPressComponentProps< DropdownProps, 'div' >\n) {\n\tconst {\n\t\tborder,\n\t\tclassName,\n\t\tcolors = [],\n\t\tenableAlpha = false,\n\t\tenableStyle = true,\n\t\tonChange,\n\t\tpreviousStyleSelection,\n\t\tsize = 'default',\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\t...otherProps\n\t} = useContextSystem( props, 'BorderControlDropdown' );\n\n\tconst [ widthValue ] = parseQuantityAndUnitFromRawValue( border?.width );\n\tconst hasZeroWidth = widthValue === 0;\n\n\tconst onColorChange = ( color?: string ) => {\n\t\tconst style =\n\t\t\tborder?.style === 'none' ? previousStyleSelection : border?.style;\n\t\tconst width = hasZeroWidth && !! color ? '1px' : border?.width;\n\n\t\tonChange( { color, style, width } );\n\t};\n\n\tconst onStyleChange = ( style?: string ) => {\n\t\tconst width = hasZeroWidth && !! style ? '1px' : border?.width;\n\t\tonChange( { ...border, style, width } );\n\t};\n\n\tconst onReset = () => {\n\t\tonChange( {\n\t\t\t...border,\n\t\t\tcolor: undefined,\n\t\t\tstyle: undefined,\n\t\t} );\n\t};\n\n\t// Generate class names.\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.borderControlDropdown, className );\n\t}, [ className, cx ] );\n\n\tconst indicatorClassName = useMemo( () => {\n\t\treturn cx( styles.borderColorIndicator );\n\t}, [ cx ] );\n\n\tconst indicatorWrapperClassName = useMemo( () => {\n\t\treturn cx( styles.colorIndicatorWrapper( border, size ) );\n\t}, [ border, cx, size ] );\n\n\tconst popoverControlsClassName = useMemo( () => {\n\t\treturn cx( styles.borderControlPopoverControls );\n\t}, [ cx ] );\n\n\tconst popoverContentClassName = useMemo( () => {\n\t\treturn cx( styles.borderControlPopoverContent );\n\t}, [ cx ] );\n\n\tconst resetButtonWrapperClassName = useMemo( () => {\n\t\treturn cx( styles.resetButtonWrapper );\n\t}, [ cx ] );\n\n\treturn {\n\t\t...otherProps,\n\t\tborder,\n\t\tclassName: classes,\n\t\tcolors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tonReset,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonWrapperClassName,\n\t\tsize,\n\t\t__experimentalIsRenderedInSidebar,\n\t};\n}\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/border-control/border-control-dropdown/hook.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { parseQuantityAndUnitFromRawValue } from '../../unit-control/utils';\nimport { useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\nexport function useBorderControlDropdown(props) {\n  const {\n    border,\n    className,\n    colors = [],\n    enableAlpha = false,\n    enableStyle = true,\n    onChange,\n    previousStyleSelection,\n    size = 'default',\n    __experimentalIsRenderedInSidebar = false,\n    ...otherProps\n  } = useContextSystem(props, 'BorderControlDropdown');\n  const [widthValue] = parseQuantityAndUnitFromRawValue(border?.width);\n  const hasZeroWidth = widthValue === 0;\n  const onColorChange = color => {\n    const style = border?.style === 'none' ? previousStyleSelection : border?.style;\n    const width = hasZeroWidth && !!color ? '1px' : border?.width;\n    onChange({\n      color,\n      style,\n      width\n    });\n  };\n  const onStyleChange = style => {\n    const width = hasZeroWidth && !!style ? '1px' : border?.width;\n    onChange({\n      ...border,\n      style,\n      width\n    });\n  };\n  const onReset = () => {\n    onChange({\n      ...border,\n      color: undefined,\n      style: undefined\n    });\n  };\n\n  // Generate class names.\n  const cx = useCx();\n  const classes = useMemo(() => {\n    return cx(styles.borderControlDropdown, className);\n  }, [className, cx]);\n  const indicatorClassName = useMemo(() => {\n    return cx(styles.borderColorIndicator);\n  }, [cx]);\n  const indicatorWrapperClassName = useMemo(() => {\n    return cx(styles.colorIndicatorWrapper(border, size));\n  }, [border, cx, size]);\n  const popoverControlsClassName = useMemo(() => {\n    return cx(styles.borderControlPopoverControls);\n  }, [cx]);\n  const popoverContentClassName = useMemo(() => {\n    return cx(styles.borderControlPopoverContent);\n  }, [cx]);\n  const resetButtonWrapperClassName = useMemo(() => {\n    return cx(styles.resetButtonWrapper);\n  }, [cx]);\n  return {\n    ...otherProps,\n    border,\n    className: classes,\n    colors,\n    enableAlpha,\n    enableStyle,\n    indicatorClassName,\n    indicatorWrapperClassName,\n    onColorChange,\n    onStyleChange,\n    onReset,\n    popoverContentClassName,\n    popoverControlsClassName,\n    resetButtonWrapperClassName,\n    size,\n    __experimentalIsRenderedInSidebar\n  };\n}"],
+  "mappings": "AAGA,SAAS,eAAe;AAKxB,YAAY,YAAY;AACxB,SAAS,wCAAwC;AACjD,SAAS,wBAAwB;AACjC,SAAS,aAAa;AACf,SAAS,yBAAyB,OAAO;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS,CAAC;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,oCAAoC;AAAA,IACpC,GAAG;AAAA,EACL,IAAI,iBAAiB,OAAO,uBAAuB;AACnD,QAAM,CAAC,UAAU,IAAI,iCAAiC,QAAQ,KAAK;AACnE,QAAM,eAAe,eAAe;AACpC,QAAM,gBAAgB,WAAS;AAC7B,UAAM,QAAQ,QAAQ,UAAU,SAAS,yBAAyB,QAAQ;AAC1E,UAAM,QAAQ,gBAAgB,CAAC,CAAC,QAAQ,QAAQ,QAAQ;AACxD,aAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AACA,QAAM,gBAAgB,WAAS;AAC7B,UAAM,QAAQ,gBAAgB,CAAC,CAAC,QAAQ,QAAQ,QAAQ;AACxD,aAAS;AAAA,MACP,GAAG;AAAA,MACH;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AACA,QAAM,UAAU,MAAM;AACpB,aAAS;AAAA,MACP,GAAG;AAAA,MACH,OAAO;AAAA,MACP,OAAO;AAAA,IACT,CAAC;AAAA,EACH;AAGA,QAAM,KAAK,MAAM;AACjB,QAAM,UAAU,QAAQ,MAAM;AAC5B,WAAO,GAAG,OAAO,uBAAuB,SAAS;AAAA,EACnD,GAAG,CAAC,WAAW,EAAE,CAAC;AAClB,QAAM,qBAAqB,QAAQ,MAAM;AACvC,WAAO,GAAG,OAAO,oBAAoB;AAAA,EACvC,GAAG,CAAC,EAAE,CAAC;AACP,QAAM,4BAA4B,QAAQ,MAAM;AAC9C,WAAO,GAAG,OAAO,sBAAsB,QAAQ,IAAI,CAAC;AAAA,EACtD,GAAG,CAAC,QAAQ,IAAI,IAAI,CAAC;AACrB,QAAM,2BAA2B,QAAQ,MAAM;AAC7C,WAAO,GAAG,OAAO,4BAA4B;AAAA,EAC/C,GAAG,CAAC,EAAE,CAAC;AACP,QAAM,0BAA0B,QAAQ,MAAM;AAC5C,WAAO,GAAG,OAAO,2BAA2B;AAAA,EAC9C,GAAG,CAAC,EAAE,CAAC;AACP,QAAM,8BAA8B,QAAQ,MAAM;AAChD,WAAO,GAAG,OAAO,kBAAkB;AAAA,EACrC,GAAG,CAAC,EAAE,CAAC;AACP,SAAO;AAAA,IACL,GAAG;AAAA,IACH;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": []
+}

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

@@ -1,2 +1,5 @@
-export { default } from './component';
-//# sourceMappingURL=index.js.map
+import { default as default2 } from "./component";
+export {
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["default"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/index.ts"],"sourcesContent":["export { default } from './component';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,aAAa","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/border-control/border-control-dropdown/index.ts"],
+  "sourcesContent": ["export { default } from './component';"],
+  "mappings": "AAAA,SAAS,WAAAA,gBAAe;",
+  "names": ["default"]
+}

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

@@ -1,48 +1,44 @@
-/**
- * WordPress dependencies
- */
-import { lineDashed, lineDotted, lineSolid } from '@wordpress/icons';
-import { __ } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import { contextConnect } from '../../context';
-import { ToggleGroupControl, ToggleGroupControlOptionIcon } from '../../toggle-group-control';
+import { lineDashed, lineDotted, lineSolid } from "@wordpress/icons";
+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'),
+  label: __("Solid"),
   icon: lineSolid,
-  value: 'solid'
+  value: "solid"
 }, {
-  label: __('Dashed'),
+  label: __("Dashed"),
   icon: lineDashed,
-  value: 'dashed'
+  value: "dashed"
 }, {
-  label: __('Dotted'),
+  label: __("Dotted"),
   icon: lineDotted,
-  value: 'dotted'
+  value: "dotted"
 }];
 function UnconnectedBorderControlStylePicker({
   onChange,
   ...restProps
 }, forwardedRef) {
-  return /*#__PURE__*/_jsx(ToggleGroupControl, {
+  return /* @__PURE__ */ _jsx(ToggleGroupControl, {
     __nextHasNoMarginBottom: true,
     __next40pxDefaultSize: true,
     ref: forwardedRef,
     isDeselectable: true,
-    onChange: value => {
+    onChange: (value) => {
       onChange?.(value);
     },
     ...restProps,
-    children: BORDER_STYLES.map(borderStyle => /*#__PURE__*/_jsx(ToggleGroupControlOptionIcon, {
+    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;
-//# sourceMappingURL=component.js.map
+const BorderControlStylePicker = contextConnect(UnconnectedBorderControlStylePicker, "BorderControlStylePicker");
+var component_default = BorderControlStylePicker;
+export {
+  component_default as default
+};
+//# sourceMappingURL=component.js.map

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

@@ -1 +1,7 @@
-{"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":[]}
+{
+  "version": 3,
+  "sources": ["../../../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 { ToggleGroupControl, ToggleGroupControlOptionIcon } from '../../toggle-group-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst BORDER_STYLES = [{\n  label: __('Solid'),\n  icon: lineSolid,\n  value: 'solid'\n}, {\n  label: __('Dashed'),\n  icon: lineDashed,\n  value: 'dashed'\n}, {\n  label: __('Dotted'),\n  icon: lineDotted,\n  value: 'dotted'\n}];\nfunction UnconnectedBorderControlStylePicker({\n  onChange,\n  ...restProps\n}, forwardedRef) {\n  return /*#__PURE__*/_jsx(ToggleGroupControl, {\n    __nextHasNoMarginBottom: true,\n    __next40pxDefaultSize: true,\n    ref: forwardedRef,\n    isDeselectable: true,\n    onChange: value => {\n      onChange?.(value);\n    },\n    ...restProps,\n    children: BORDER_STYLES.map(borderStyle => /*#__PURE__*/_jsx(ToggleGroupControlOptionIcon, {\n      value: borderStyle.value,\n      icon: borderStyle.icon,\n      label: borderStyle.label\n    }, borderStyle.value))\n  });\n}\nconst BorderControlStylePicker = contextConnect(UnconnectedBorderControlStylePicker, 'BorderControlStylePicker');\nexport default BorderControlStylePicker;"],
+  "mappings": "AAGA,SAAS,YAAY,YAAY,iBAAiB;AAClD,SAAS,UAAU;AAKnB,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB,oCAAoC;AACjE,SAAS,OAAO,YAAY;AAC5B,MAAM,gBAAgB,CAAC;AAAA,EACrB,OAAO,GAAG,OAAO;AAAA,EACjB,MAAM;AAAA,EACN,OAAO;AACT,GAAG;AAAA,EACD,OAAO,GAAG,QAAQ;AAAA,EAClB,MAAM;AAAA,EACN,OAAO;AACT,GAAG;AAAA,EACD,OAAO,GAAG,QAAQ;AAAA,EAClB,MAAM;AAAA,EACN,OAAO;AACT,CAAC;AACD,SAAS,oCAAoC;AAAA,EAC3C;AAAA,EACA,GAAG;AACL,GAAG,cAAc;AACf,SAAoB,qBAAK,oBAAoB;AAAA,IAC3C,yBAAyB;AAAA,IACzB,uBAAuB;AAAA,IACvB,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,UAAU,WAAS;AACjB,iBAAW,KAAK;AAAA,IAClB;AAAA,IACA,GAAG;AAAA,IACH,UAAU,cAAc,IAAI,iBAA4B,qBAAK,8BAA8B;AAAA,MACzF,OAAO,YAAY;AAAA,MACnB,MAAM,YAAY;AAAA,MAClB,OAAO,YAAY;AAAA,IACrB,GAAG,YAAY,KAAK,CAAC;AAAA,EACvB,CAAC;AACH;AACA,MAAM,2BAA2B,eAAe,qCAAqC,0BAA0B;AAC/G,IAAO,oBAAQ;",
+  "names": []
+}

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

@@ -1,2 +1,5 @@
-export { default } from './component';
-//# sourceMappingURL=index.js.map
+import { default as default2 } from "./component";
+export {
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["default"],"sources":["@wordpress/components/src/border-control/border-control-style-picker/index.ts"],"sourcesContent":["export { default } from './component';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,aAAa","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/border-control/border-control-style-picker/index.ts"],
+  "sourcesContent": ["export { default } from './component';"],
+  "mappings": "AAAA,SAAS,WAAAA,gBAAe;",
+  "names": ["default"]
+}

package/build-module/border-control/index.js

@@ -1,3 +1,7 @@
-export { default as BorderControl } from './border-control/component';
-export { useBorderControl } from './border-control/hook';
-//# sourceMappingURL=index.js.map
+import { default as default2 } from "./border-control/component";
+import { useBorderControl } from "./border-control/hook";
+export {
+  default2 as BorderControl,
+  useBorderControl
+};
+//# sourceMappingURL=index.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["default","BorderControl","useBorderControl"],"sources":["@wordpress/components/src/border-control/index.ts"],"sourcesContent":["export { default as BorderControl } from './border-control/component';\nexport { useBorderControl } from './border-control/hook';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,aAAa,QAAQ,4BAA4B;AACrE,SAASC,gBAAgB,QAAQ,uBAAuB","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/border-control/index.ts"],
+  "sourcesContent": ["export { default as BorderControl } from './border-control/component';\nexport { useBorderControl } from './border-control/hook';"],
+  "mappings": "AAAA,SAAoB,WAAXA,gBAAgC;AACzC,SAAS,wBAAwB;",
+  "names": ["default"]
+}