@wordpress/components 27.5.0 → 28.0.0

package/build-module/border-box-control/border-box-control-linked-button/component.js

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
@@ -13,6 +12,7 @@ import Tooltip from '../../tooltip';
 import { View } from '../../view';
 import { contextConnect } from '../../context';
 import { useBorderBoxControlLinkedButton } from './hook';
+import { jsx as _jsx } from "react/jsx-runtime";
 const BorderBoxControlLinkedButton = (props, forwardedRef) => {
   const {
     className,
@@ -20,18 +20,20 @@ const BorderBoxControlLinkedButton = (props, forwardedRef) => {
     ...buttonProps
   } = useBorderBoxControlLinkedButton(props);
   const label = isLinked ? __('Unlink sides') : __('Link sides');
-  return createElement(Tooltip, {
-    text: label
-  }, createElement(View, {
-    className: className
-  }, createElement(Button, {
-    ...buttonProps,
-    size: "small",
-    icon: isLinked ? link : linkOff,
-    iconSize: 24,
-    "aria-label": label,
-    ref: forwardedRef
-  })));
+  return /*#__PURE__*/_jsx(Tooltip, {
+    text: label,
+    children: /*#__PURE__*/_jsx(View, {
+      className: className,
+      children: /*#__PURE__*/_jsx(Button, {
+        ...buttonProps,
+        size: "small",
+        icon: isLinked ? link : linkOff,
+        iconSize: 24,
+        "aria-label": label,
+        ref: forwardedRef
+      })
+    })
+  });
 };
 const ConnectedBorderBoxControlLinkedButton = contextConnect(BorderBoxControlLinkedButton, 'BorderBoxControlLinkedButton');
 export default ConnectedBorderBoxControlLinkedButton;

package/build-module/border-box-control/border-box-control-linked-button/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["link","linkOff","__","Button","Tooltip","View","contextConnect","useBorderBoxControlLinkedButton","BorderBoxControlLinkedButton","props","forwardedRef","className","isLinked","buttonProps","label","createElement","text","size","icon","iconSize","ref","ConnectedBorderBoxControlLinkedButton"],"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport Tooltip from '../../tooltip';\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlLinkedButton } from './hook';\n\nimport type { LinkedButtonProps } from '../types';\n\nconst BorderBoxControlLinkedButton = (\n\tprops: WordPressComponentProps< LinkedButtonProps, 'button' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { className, isLinked, ...buttonProps } =\n\t\tuseBorderBoxControlLinkedButton( props );\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<View className={ className }>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</Tooltip>\n\t);\n};\n\nconst ConnectedBorderBoxControlLinkedButton = contextConnect(\n\tBorderBoxControlLinkedButton,\n\t'BorderBoxControlLinkedButton'\n);\nexport default ConnectedBorderBoxControlLinkedButton;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,OAAO,MAAM,eAAe;AACnC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,+BAA+B,QAAQ,QAAQ;AAIxD,MAAMC,4BAA4B,GAAGA,CACpCC,KAA6D,EAC7DC,YAAuC,KACnC;EACJ,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAE,GAAGC;EAAY,CAAC,GAC5CN,+BAA+B,CAAEE,KAAM,CAAC;EACzC,MAAMK,KAAK,GAAGF,QAAQ,GAAGV,EAAE,CAAE,cAAe,CAAC,GAAGA,EAAE,CAAE,YAAa,CAAC;EAElE,OACCa,aAAA,CAACX,OAAO;IAACY,IAAI,EAAGF;EAAO,GACtBC,aAAA,CAACV,IAAI;IAACM,SAAS,EAAGA;EAAW,GAC5BI,aAAA,CAACZ,MAAM;IAAA,GACDU,WAAW;IAChBI,IAAI,EAAC,OAAO;IACZC,IAAI,EAAGN,QAAQ,GAAGZ,IAAI,GAAGC,OAAS;IAClCkB,QAAQ,EAAG,EAAI;IACf,cAAaL,KAAO;IACpBM,GAAG,EAAGV;EAAc,CACpB,CACI,CACE,CAAC;AAEZ,CAAC;AAED,MAAMW,qCAAqC,GAAGf,cAAc,CAC3DE,4BAA4B,EAC5B,8BACD,CAAC;AACD,eAAea,qCAAqC","ignoreList":[]}
+{"version":3,"names":["link","linkOff","__","Button","Tooltip","View","contextConnect","useBorderBoxControlLinkedButton","jsx","_jsx","BorderBoxControlLinkedButton","props","forwardedRef","className","isLinked","buttonProps","label","text","children","size","icon","iconSize","ref","ConnectedBorderBoxControlLinkedButton"],"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport Tooltip from '../../tooltip';\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlLinkedButton } from './hook';\n\nimport type { LinkedButtonProps } from '../types';\n\nconst BorderBoxControlLinkedButton = (\n\tprops: WordPressComponentProps< LinkedButtonProps, 'button' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { className, isLinked, ...buttonProps } =\n\t\tuseBorderBoxControlLinkedButton( props );\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<View className={ className }>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</Tooltip>\n\t);\n};\n\nconst ConnectedBorderBoxControlLinkedButton = contextConnect(\n\tBorderBoxControlLinkedButton,\n\t'BorderBoxControlLinkedButton'\n);\nexport default ConnectedBorderBoxControlLinkedButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,OAAO,MAAM,eAAe;AACnC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,+BAA+B,QAAQ,QAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIzD,MAAMC,4BAA4B,GAAGA,CACpCC,KAA6D,EAC7DC,YAAuC,KACnC;EACJ,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAE,GAAGC;EAAY,CAAC,GAC5CR,+BAA+B,CAAEI,KAAM,CAAC;EACzC,MAAMK,KAAK,GAAGF,QAAQ,GAAGZ,EAAE,CAAE,cAAe,CAAC,GAAGA,EAAE,CAAE,YAAa,CAAC;EAElE,oBACCO,IAAA,CAACL,OAAO;IAACa,IAAI,EAAGD,KAAO;IAAAE,QAAA,eACtBT,IAAA,CAACJ,IAAI;MAACQ,SAAS,EAAGA,SAAW;MAAAK,QAAA,eAC5BT,IAAA,CAACN,MAAM;QAAA,GACDY,WAAW;QAChBI,IAAI,EAAC,OAAO;QACZC,IAAI,EAAGN,QAAQ,GAAGd,IAAI,GAAGC,OAAS;QAClCoB,QAAQ,EAAG,EAAI;QACf,cAAaL,KAAO;QACpBM,GAAG,EAAGV;MAAc,CACpB;IAAC,CACG;EAAC,CACC,CAAC;AAEZ,CAAC;AAED,MAAMW,qCAAqC,GAAGjB,cAAc,CAC3DI,4BAA4B,EAC5B,8BACD,CAAC;AACD,eAAea,qCAAqC","ignoreList":[]}

package/build-module/border-box-control/border-box-control-split-controls/component.js

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
@@ -14,6 +13,8 @@ import { BorderControl } from '../../border-control';
 import { Grid } from '../../grid';
 import { contextConnect } from '../../context';
 import { useBorderBoxControlSplitControls } from './hook';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const BorderBoxControlSplitControls = (props, forwardedRef) => {
   const {
     centeredClassName,
@@ -52,45 +53,46 @@ const BorderBoxControlSplitControls = (props, forwardedRef) => {
     size
   };
   const mergedRef = useMergeRefs([setPopoverAnchor, forwardedRef]);
-  return createElement(Grid, {
+  return /*#__PURE__*/_jsxs(Grid, {
     ...otherProps,
     ref: mergedRef,
-    gap: 4
-  }, createElement(BorderBoxControlVisualizer, {
-    value: value,
-    size: size
-  }), createElement(BorderControl, {
-    className: centeredClassName,
-    hideLabelFromVision: true,
-    label: __('Top border'),
-    onChange: newBorder => onChange(newBorder, 'top'),
-    __unstablePopoverProps: popoverProps,
-    value: value?.top,
-    ...sharedBorderControlProps
-  }), createElement(BorderControl, {
-    hideLabelFromVision: true,
-    label: __('Left border'),
-    onChange: newBorder => onChange(newBorder, 'left'),
-    __unstablePopoverProps: popoverProps,
-    value: value?.left,
-    ...sharedBorderControlProps
-  }), createElement(BorderControl, {
-    className: rightAlignedClassName,
-    hideLabelFromVision: true,
-    label: __('Right border'),
-    onChange: newBorder => onChange(newBorder, 'right'),
-    __unstablePopoverProps: popoverProps,
-    value: value?.right,
-    ...sharedBorderControlProps
-  }), createElement(BorderControl, {
-    className: centeredClassName,
-    hideLabelFromVision: true,
-    label: __('Bottom border'),
-    onChange: newBorder => onChange(newBorder, 'bottom'),
-    __unstablePopoverProps: popoverProps,
-    value: value?.bottom,
-    ...sharedBorderControlProps
-  }));
+    gap: 4,
+    children: [/*#__PURE__*/_jsx(BorderBoxControlVisualizer, {
+      value: value,
+      size: size
+    }), /*#__PURE__*/_jsx(BorderControl, {
+      className: centeredClassName,
+      hideLabelFromVision: true,
+      label: __('Top border'),
+      onChange: newBorder => onChange(newBorder, 'top'),
+      __unstablePopoverProps: popoverProps,
+      value: value?.top,
+      ...sharedBorderControlProps
+    }), /*#__PURE__*/_jsx(BorderControl, {
+      hideLabelFromVision: true,
+      label: __('Left border'),
+      onChange: newBorder => onChange(newBorder, 'left'),
+      __unstablePopoverProps: popoverProps,
+      value: value?.left,
+      ...sharedBorderControlProps
+    }), /*#__PURE__*/_jsx(BorderControl, {
+      className: rightAlignedClassName,
+      hideLabelFromVision: true,
+      label: __('Right border'),
+      onChange: newBorder => onChange(newBorder, 'right'),
+      __unstablePopoverProps: popoverProps,
+      value: value?.right,
+      ...sharedBorderControlProps
+    }), /*#__PURE__*/_jsx(BorderControl, {
+      className: centeredClassName,
+      hideLabelFromVision: true,
+      label: __('Bottom border'),
+      onChange: newBorder => onChange(newBorder, 'bottom'),
+      __unstablePopoverProps: popoverProps,
+      value: value?.bottom,
+      ...sharedBorderControlProps
+    })]
+  });
 };
 const ConnectedBorderBoxControlSplitControls = contextConnect(BorderBoxControlSplitControls, 'BorderBoxControlSplitControls');
 export default ConnectedBorderBoxControlSplitControls;

package/build-module/border-box-control/border-box-control-split-controls/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","useMemo","useState","useMergeRefs","BorderBoxControlVisualizer","BorderControl","Grid","contextConnect","useBorderBoxControlSplitControls","BorderBoxControlSplitControls","props","forwardedRef","centeredClassName","colors","disableCustomColors","enableAlpha","enableStyle","onChange","popoverPlacement","popoverOffset","rightAlignedClassName","size","value","__experimentalIsRenderedInSidebar","otherProps","popoverAnchor","setPopoverAnchor","popoverProps","placement","offset","anchor","shift","undefined","sharedBorderControlProps","isCompact","mergedRef","createElement","ref","gap","className","hideLabelFromVision","label","newBorder","__unstablePopoverProps","top","left","right","bottom","ConnectedBorderBoxControlSplitControls"],"sources":["@wordpress/components/src/border-box-control/border-box-control-split-controls/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BorderBoxControlVisualizer from '../border-box-control-visualizer';\nimport { BorderControl } from '../../border-control';\nimport { Grid } from '../../grid';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlSplitControls } from './hook';\n\nimport type { BorderControlProps } from '../../border-control/types';\nimport type { SplitControlsProps } from '../types';\n\nconst BorderBoxControlSplitControls = (\n\tprops: WordPressComponentProps< SplitControlsProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tcenteredClassName,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tonChange,\n\t\tpopoverPlacement,\n\t\tpopoverOffset,\n\t\trightAlignedClassName,\n\t\tsize = 'default',\n\t\tvalue,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderBoxControlSplitControls( props );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState< Element | null >(\n\t\tnull\n\t);\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps: BorderControlProps[ '__unstablePopoverProps' ] =\n\t\tuseMemo(\n\t\t\t() =>\n\t\t\t\tpopoverPlacement\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tplacement: popoverPlacement,\n\t\t\t\t\t\t\toffset: popoverOffset,\n\t\t\t\t\t\t\tanchor: popoverAnchor,\n\t\t\t\t\t\t\tshift: true,\n\t\t\t\t\t  }\n\t\t\t\t\t: undefined,\n\t\t\t[ popoverPlacement, popoverOffset, popoverAnchor ]\n\t\t);\n\n\tconst sharedBorderControlProps = {\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tisCompact: true,\n\t\t__experimentalIsRenderedInSidebar,\n\t\tsize,\n\t};\n\n\tconst mergedRef = useMergeRefs( [ setPopoverAnchor, forwardedRef ] );\n\n\treturn (\n\t\t<Grid { ...otherProps } ref={ mergedRef } gap={ 4 }>\n\t\t\t<BorderBoxControlVisualizer value={ value } size={ size } />\n\t\t\t<BorderControl\n\t\t\t\tclassName={ centeredClassName }\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Top border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'top' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.top }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t\t<BorderControl\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Left border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'left' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.left }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t\t<BorderControl\n\t\t\t\tclassName={ rightAlignedClassName }\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Right border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'right' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.right }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t\t<BorderControl\n\t\t\t\tclassName={ centeredClassName }\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Bottom border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'bottom' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.bottom }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t</Grid>\n\t);\n};\n\nconst ConnectedBorderBoxControlSplitControls = contextConnect(\n\tBorderBoxControlSplitControls,\n\t'BorderBoxControlSplitControls'\n);\nexport default ConnectedBorderBoxControlSplitControls;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__","useMemo","useState","useMergeRefs","BorderBoxControlVisualizer","BorderControl","Grid","contextConnect","useBorderBoxControlSplitControls","jsx","_jsx","jsxs","_jsxs","BorderBoxControlSplitControls","props","forwardedRef","centeredClassName","colors","disableCustomColors","enableAlpha","enableStyle","onChange","popoverPlacement","popoverOffset","rightAlignedClassName","size","value","__experimentalIsRenderedInSidebar","otherProps","popoverAnchor","setPopoverAnchor","popoverProps","placement","offset","anchor","shift","undefined","sharedBorderControlProps","isCompact","mergedRef","ref","gap","children","className","hideLabelFromVision","label","newBorder","__unstablePopoverProps","top","left","right","bottom","ConnectedBorderBoxControlSplitControls"],"sources":["@wordpress/components/src/border-box-control/border-box-control-split-controls/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BorderBoxControlVisualizer from '../border-box-control-visualizer';\nimport { BorderControl } from '../../border-control';\nimport { Grid } from '../../grid';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlSplitControls } from './hook';\n\nimport type { BorderControlProps } from '../../border-control/types';\nimport type { SplitControlsProps } from '../types';\n\nconst BorderBoxControlSplitControls = (\n\tprops: WordPressComponentProps< SplitControlsProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tcenteredClassName,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tonChange,\n\t\tpopoverPlacement,\n\t\tpopoverOffset,\n\t\trightAlignedClassName,\n\t\tsize = 'default',\n\t\tvalue,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderBoxControlSplitControls( props );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState< Element | null >(\n\t\tnull\n\t);\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps: BorderControlProps[ '__unstablePopoverProps' ] =\n\t\tuseMemo(\n\t\t\t() =>\n\t\t\t\tpopoverPlacement\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tplacement: popoverPlacement,\n\t\t\t\t\t\t\toffset: popoverOffset,\n\t\t\t\t\t\t\tanchor: popoverAnchor,\n\t\t\t\t\t\t\tshift: true,\n\t\t\t\t\t  }\n\t\t\t\t\t: undefined,\n\t\t\t[ popoverPlacement, popoverOffset, popoverAnchor ]\n\t\t);\n\n\tconst sharedBorderControlProps = {\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tisCompact: true,\n\t\t__experimentalIsRenderedInSidebar,\n\t\tsize,\n\t};\n\n\tconst mergedRef = useMergeRefs( [ setPopoverAnchor, forwardedRef ] );\n\n\treturn (\n\t\t<Grid { ...otherProps } ref={ mergedRef } gap={ 4 }>\n\t\t\t<BorderBoxControlVisualizer value={ value } size={ size } />\n\t\t\t<BorderControl\n\t\t\t\tclassName={ centeredClassName }\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Top border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'top' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.top }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t\t<BorderControl\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Left border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'left' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.left }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t\t<BorderControl\n\t\t\t\tclassName={ rightAlignedClassName }\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Right border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'right' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.right }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t\t<BorderControl\n\t\t\t\tclassName={ centeredClassName }\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Bottom border' ) }\n\t\t\t\tonChange={ ( newBorder ) => onChange( newBorder, 'bottom' ) }\n\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\tvalue={ value?.bottom }\n\t\t\t\t{ ...sharedBorderControlProps }\n\t\t\t/>\n\t\t</Grid>\n\t);\n};\n\nconst ConnectedBorderBoxControlSplitControls = contextConnect(\n\tBorderBoxControlSplitControls,\n\t'BorderBoxControlSplitControls'\n);\nexport default ConnectedBorderBoxControlSplitControls;\n"],"mappings":"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","ignoreList":[]}

package/build-module/border-box-control/border-box-control-visualizer/component.js

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
@@ -9,12 +8,13 @@ import { createElement } from "react";
 import { View } from '../../view';
 import { contextConnect } from '../../context';
 import { useBorderBoxControlVisualizer } from './hook';
+import { jsx as _jsx } from "react/jsx-runtime";
 const BorderBoxControlVisualizer = (props, forwardedRef) => {
   const {
     value,
     ...otherProps
   } = useBorderBoxControlVisualizer(props);
-  return createElement(View, {
+  return /*#__PURE__*/_jsx(View, {
     ...otherProps,
     ref: forwardedRef
   });

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

@@ -1 +1 @@
-{"version":3,"names":["View","contextConnect","useBorderBoxControlVisualizer","BorderBoxControlVisualizer","props","forwardedRef","value","otherProps","createElement","ref","ConnectedBorderBoxControlVisualizer"],"sources":["@wordpress/components/src/border-box-control/border-box-control-visualizer/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlVisualizer } from './hook';\n\nimport type { VisualizerProps } from '../types';\n\nconst BorderBoxControlVisualizer = (\n\tprops: WordPressComponentProps< VisualizerProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { value, ...otherProps } = useBorderBoxControlVisualizer( props );\n\n\treturn <View { ...otherProps } ref={ forwardedRef } />;\n};\n\nconst ConnectedBorderBoxControlVisualizer = contextConnect(\n\tBorderBoxControlVisualizer,\n\t'BorderBoxControlVisualizer'\n);\nexport default ConnectedBorderBoxControlVisualizer;\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,6BAA6B,QAAQ,QAAQ;AAItD,MAAMC,0BAA0B,GAAGA,CAClCC,KAAwD,EACxDC,YAAuC,KACnC;EACJ,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAW,CAAC,GAAGL,6BAA6B,CAAEE,KAAM,CAAC;EAEvE,OAAOI,aAAA,CAACR,IAAI;IAAA,GAAMO,UAAU;IAAGE,GAAG,EAAGJ;EAAc,CAAE,CAAC;AACvD,CAAC;AAED,MAAMK,mCAAmC,GAAGT,cAAc,CACzDE,0BAA0B,EAC1B,4BACD,CAAC;AACD,eAAeO,mCAAmC","ignoreList":[]}
+{"version":3,"names":["View","contextConnect","useBorderBoxControlVisualizer","jsx","_jsx","BorderBoxControlVisualizer","props","forwardedRef","value","otherProps","ref","ConnectedBorderBoxControlVisualizer"],"sources":["@wordpress/components/src/border-box-control/border-box-control-visualizer/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlVisualizer } from './hook';\n\nimport type { VisualizerProps } from '../types';\n\nconst BorderBoxControlVisualizer = (\n\tprops: WordPressComponentProps< VisualizerProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { value, ...otherProps } = useBorderBoxControlVisualizer( props );\n\n\treturn <View { ...otherProps } ref={ forwardedRef } />;\n};\n\nconst ConnectedBorderBoxControlVisualizer = contextConnect(\n\tBorderBoxControlVisualizer,\n\t'BorderBoxControlVisualizer'\n);\nexport default ConnectedBorderBoxControlVisualizer;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,6BAA6B,QAAQ,QAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIvD,MAAMC,0BAA0B,GAAGA,CAClCC,KAAwD,EACxDC,YAAuC,KACnC;EACJ,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAW,CAAC,GAAGP,6BAA6B,CAAEI,KAAM,CAAC;EAEvE,oBAAOF,IAAA,CAACJ,IAAI;IAAA,GAAMS,UAAU;IAAGC,GAAG,EAAGH;EAAc,CAAE,CAAC;AACvD,CAAC;AAED,MAAMI,mCAAmC,GAAGV,cAAc,CACzDI,0BAA0B,EAC1B,4BACD,CAAC;AACD,eAAeM,mCAAmC","ignoreList":[]}

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

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * WordPress dependencies
  */
@@ -16,6 +15,8 @@ import { View } from '../../view';
 import { VisuallyHidden } from '../../visually-hidden';
 import { contextConnect } from '../../context';
 import { useBorderControl } from './hook';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const BorderLabel = props => {
   const {
     label,
@@ -24,11 +25,13 @@ const BorderLabel = props => {
   if (!label) {
     return null;
   }
-  return hideLabelFromVision ? createElement(VisuallyHidden, {
-    as: "legend"
-  }, label) : createElement(StyledLabel, {
-    as: "legend"
-  }, label);
+  return hideLabelFromVision ? /*#__PURE__*/_jsx(VisuallyHidden, {
+    as: "legend",
+    children: label
+  }) : /*#__PURE__*/_jsx(StyledLabel, {
+    as: "legend",
+    children: label
+  });
 };
 const UnconnectedBorderControl = (props, forwardedRef) => {
   const {
@@ -59,54 +62,56 @@ const UnconnectedBorderControl = (props, forwardedRef) => {
     __experimentalIsRenderedInSidebar,
     ...otherProps
   } = useBorderControl(props);
-  return createElement(View, {
+  return /*#__PURE__*/_jsxs(View, {
     as: "fieldset",
     ...otherProps,
-    ref: forwardedRef
-  }, createElement(BorderLabel, {
-    label: label,
-    hideLabelFromVision: hideLabelFromVision
-  }), createElement(HStack, {
-    spacing: 4,
-    className: innerWrapperClassName
-  }, createElement(UnitControl, {
-    prefix: createElement(BorderControlDropdown, {
-      border: border,
-      colors: colors,
-      __unstablePopoverProps: __unstablePopoverProps,
-      disableCustomColors: disableCustomColors,
-      enableAlpha: enableAlpha,
-      enableStyle: enableStyle,
-      isStyleSettable: isStyleSettable,
-      onChange: onBorderChange,
-      previousStyleSelection: previousStyleSelection,
-      showDropdownHeader: showDropdownHeader,
-      __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
-      size: size
-    }),
-    label: __('Border width'),
-    hideLabelFromVision: true,
-    min: 0,
-    onChange: onWidthChange,
-    value: border?.width || '',
-    placeholder: placeholder,
-    disableUnits: disableUnits,
-    __unstableInputWidth: inputWidth,
-    size: size
-  }), withSlider && createElement(RangeControl, {
-    __nextHasNoMarginBottom: true,
-    label: __('Border width'),
-    hideLabelFromVision: true,
-    className: sliderClassName,
-    initialPosition: 0,
-    max: 100,
-    min: 0,
-    onChange: onSliderChange,
-    step: ['px', '%'].includes(widthUnit) ? 1 : 0.1,
-    value: widthValue || undefined,
-    withInputField: false,
-    __next40pxDefaultSize: __next40pxDefaultSize
-  })));
+    ref: forwardedRef,
+    children: [/*#__PURE__*/_jsx(BorderLabel, {
+      label: label,
+      hideLabelFromVision: hideLabelFromVision
+    }), /*#__PURE__*/_jsxs(HStack, {
+      spacing: 4,
+      className: innerWrapperClassName,
+      children: [/*#__PURE__*/_jsx(UnitControl, {
+        prefix: /*#__PURE__*/_jsx(BorderControlDropdown, {
+          border: border,
+          colors: colors,
+          __unstablePopoverProps: __unstablePopoverProps,
+          disableCustomColors: disableCustomColors,
+          enableAlpha: enableAlpha,
+          enableStyle: enableStyle,
+          isStyleSettable: isStyleSettable,
+          onChange: onBorderChange,
+          previousStyleSelection: previousStyleSelection,
+          showDropdownHeader: showDropdownHeader,
+          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
+          size: size
+        }),
+        label: __('Border width'),
+        hideLabelFromVision: true,
+        min: 0,
+        onChange: onWidthChange,
+        value: border?.width || '',
+        placeholder: placeholder,
+        disableUnits: disableUnits,
+        __unstableInputWidth: inputWidth,
+        size: size
+      }), withSlider && /*#__PURE__*/_jsx(RangeControl, {
+        __nextHasNoMarginBottom: true,
+        label: __('Border width'),
+        hideLabelFromVision: true,
+        className: sliderClassName,
+        initialPosition: 0,
+        max: 100,
+        min: 0,
+        onChange: onSliderChange,
+        step: ['px', '%'].includes(widthUnit) ? 1 : 0.1,
+        value: widthValue || undefined,
+        withInputField: false,
+        __next40pxDefaultSize: __next40pxDefaultSize
+      })]
+    })]
+  });
 };
 
 /**

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: {