@wordpress/components 28.9.0 → 28.10.0

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

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useMemo","useState","styles","parseQuantityAndUnitFromRawValue","useContextSystem","useCx","isValidBorder","border","hasWidth","width","undefined","hasColor","color","useBorderControl","props","className","colors","isCompact","onChange","enableAlpha","enableStyle","shouldSanitizeBorder","size","value","__experimentalIsRenderedInSidebar","__next40pxDefaultSize","otherProps","computedSize","widthValue","originalWidthUnit","widthUnit","hadPreviousZeroWidth","colorSelection","setColorSelection","styleSelection","setStyleSelection","isStyleSettable","onBorderChange","newBorder","onWidthChange","newWidth","newWidthValue","parsedValue","hasZeroWidth","updatedBorder","style","onSliderChange","cx","classes","borderControl","wrapperWidth","innerWrapperClassName","widthStyle","heightStyle","wrapperHeight","innerWrapper","sliderClassName","borderSlider","inputWidth","previousStyleSelection"],"sources":["@wordpress/components/src/border-control/border-control/hook.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo, useState } 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 { Border, BorderControlProps } from '../types';\n\n// If either width or color are defined, the border is considered valid\n// and a border style can be set as well.\nconst isValidBorder = ( border?: Border ) => {\n\tconst hasWidth = border?.width !== undefined && border.width !== '';\n\tconst hasColor = border?.color !== undefined;\n\treturn hasWidth || hasColor;\n};\n\nexport function useBorderControl(\n\tprops: WordPressComponentProps< BorderControlProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tcolors = [],\n\t\tisCompact,\n\t\tonChange,\n\t\tenableAlpha = true,\n\t\tenableStyle = true,\n\t\tshouldSanitizeBorder = true,\n\t\tsize = 'default',\n\t\tvalue: border,\n\t\twidth,\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\t__next40pxDefaultSize,\n\t\t...otherProps\n\t} = useContextSystem( props, 'BorderControl' );\n\n\tconst computedSize =\n\t\tsize === 'default' && __next40pxDefaultSize ? '__unstable-large' : size;\n\n\tconst [ widthValue, originalWidthUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tborder?.width\n\t);\n\tconst widthUnit = originalWidthUnit || 'px';\n\tconst hadPreviousZeroWidth = widthValue === 0;\n\n\tconst [ colorSelection, setColorSelection ] = useState< string >();\n\tconst [ styleSelection, setStyleSelection ] = useState< string >();\n\n\tconst isStyleSettable = shouldSanitizeBorder\n\t\t? isValidBorder( border )\n\t\t: true;\n\n\tconst onBorderChange = useCallback(\n\t\t( newBorder?: Border ) => {\n\t\t\tif ( shouldSanitizeBorder && ! isValidBorder( newBorder ) ) {\n\t\t\t\tonChange( undefined );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonChange( newBorder );\n\t\t},\n\t\t[ onChange, shouldSanitizeBorder ]\n\t);\n\n\tconst onWidthChange = useCallback(\n\t\t( newWidth?: string ) => {\n\t\t\tconst newWidthValue = newWidth === '' ? undefined : newWidth;\n\t\t\tconst [ parsedValue ] =\n\t\t\t\tparseQuantityAndUnitFromRawValue( newWidth );\n\t\t\tconst hasZeroWidth = parsedValue === 0;\n\t\t\tconst updatedBorder = { ...border, width: newWidthValue };\n\n\t\t\t// Setting the border width explicitly to zero will also set the\n\t\t\t// border style to `none` and clear the border color.\n\t\t\tif ( hasZeroWidth && ! hadPreviousZeroWidth ) {\n\t\t\t\t// Before clearing the color and style selections, keep track of\n\t\t\t\t// the current selections so they can be restored when the width\n\t\t\t\t// changes to a non-zero value.\n\t\t\t\tsetColorSelection( border?.color );\n\t\t\t\tsetStyleSelection( border?.style );\n\n\t\t\t\t// Clear the color and style border properties.\n\t\t\t\tupdatedBorder.color = undefined;\n\t\t\t\tupdatedBorder.style = 'none';\n\t\t\t}\n\n\t\t\t// Selection has changed from zero border width to non-zero width.\n\t\t\tif ( ! hasZeroWidth && hadPreviousZeroWidth ) {\n\t\t\t\t// Restore previous border color and style selections if width\n\t\t\t\t// is now not zero.\n\t\t\t\tif ( updatedBorder.color === undefined ) {\n\t\t\t\t\tupdatedBorder.color = colorSelection;\n\t\t\t\t}\n\t\t\t\tif ( updatedBorder.style === 'none' ) {\n\t\t\t\t\tupdatedBorder.style = styleSelection;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tonBorderChange( updatedBorder );\n\t\t},\n\t\t[\n\t\t\tborder,\n\t\t\thadPreviousZeroWidth,\n\t\t\tcolorSelection,\n\t\t\tstyleSelection,\n\t\t\tonBorderChange,\n\t\t]\n\t);\n\n\tconst onSliderChange = useCallback(\n\t\t( value?: number ) => {\n\t\t\tonWidthChange( `${ value }${ widthUnit }` );\n\t\t},\n\t\t[ onWidthChange, widthUnit ]\n\t);\n\n\t// Generate class names.\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.borderControl, className );\n\t}, [ className, cx ] );\n\n\tlet wrapperWidth = width;\n\tif ( isCompact ) {\n\t\t// Widths below represent the minimum usable width for compact controls.\n\t\t// Taller controls contain greater internal padding, thus greater width.\n\t\twrapperWidth = size === '__unstable-large' ? '116px' : '90px';\n\t}\n\tconst innerWrapperClassName = useMemo( () => {\n\t\tconst widthStyle = !! wrapperWidth && styles.wrapperWidth;\n\t\tconst heightStyle = styles.wrapperHeight( computedSize );\n\n\t\treturn cx( styles.innerWrapper(), widthStyle, heightStyle );\n\t}, [ wrapperWidth, cx, computedSize ] );\n\n\tconst sliderClassName = useMemo( () => {\n\t\treturn cx( styles.borderSlider() );\n\t}, [ cx ] );\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tcolors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tinnerWrapperClassName,\n\t\tinputWidth: wrapperWidth,\n\t\tisStyleSettable,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tpreviousStyleSelection: styleSelection,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\tsize: computedSize,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next40pxDefaultSize,\n\t};\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useCallback","useMemo","useState","styles","parseQuantityAndUnitFromRawValue","useContextSystem","useCx","isValidBorder","border","hasWidth","width","undefined","hasColor","color","useBorderControl","props","className","colors","isCompact","onChange","enableAlpha","enableStyle","shouldSanitizeBorder","size","value","__experimentalIsRenderedInSidebar","__next40pxDefaultSize","otherProps","computedSize","widthValue","originalWidthUnit","widthUnit","hadPreviousZeroWidth","colorSelection","setColorSelection","styleSelection","setStyleSelection","isStyleSettable","onBorderChange","newBorder","onWidthChange","newWidth","newWidthValue","parsedValue","hasZeroWidth","updatedBorder","style","onSliderChange","cx","classes","borderControl","wrapperWidth","innerWrapperClassName","widthStyle","heightStyle","wrapperHeight","innerWrapper","sliderClassName","borderSlider","inputWidth","previousStyleSelection"],"sources":["@wordpress/components/src/border-control/border-control/hook.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo, useState } 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 { Border, BorderControlProps } from '../types';\n\n// If either width or color are defined, the border is considered valid\n// and a border style can be set as well.\nconst isValidBorder = ( border?: Border ) => {\n\tconst hasWidth = border?.width !== undefined && border.width !== '';\n\tconst hasColor = border?.color !== undefined;\n\treturn hasWidth || hasColor;\n};\n\nexport function useBorderControl(\n\tprops: WordPressComponentProps< BorderControlProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\tcolors = [],\n\t\tisCompact,\n\t\tonChange,\n\t\tenableAlpha = true,\n\t\tenableStyle = true,\n\t\tshouldSanitizeBorder = true,\n\t\tsize = 'default',\n\t\tvalue: border,\n\t\twidth,\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\t__next40pxDefaultSize,\n\t\t...otherProps\n\t} = useContextSystem( props, 'BorderControl' );\n\n\tconst computedSize =\n\t\tsize === 'default' && __next40pxDefaultSize ? '__unstable-large' : size;\n\n\tconst [ widthValue, originalWidthUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tborder?.width\n\t);\n\tconst widthUnit = originalWidthUnit || 'px';\n\tconst hadPreviousZeroWidth = widthValue === 0;\n\n\tconst [ colorSelection, setColorSelection ] = useState< string >();\n\tconst [ styleSelection, setStyleSelection ] = useState< string >();\n\n\tconst isStyleSettable = shouldSanitizeBorder\n\t\t? isValidBorder( border )\n\t\t: true;\n\n\tconst onBorderChange = useCallback(\n\t\t( newBorder?: Border ) => {\n\t\t\tif ( shouldSanitizeBorder && ! isValidBorder( newBorder ) ) {\n\t\t\t\tonChange( undefined );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonChange( newBorder );\n\t\t},\n\t\t[ onChange, shouldSanitizeBorder ]\n\t);\n\n\tconst onWidthChange = useCallback(\n\t\t( newWidth?: string ) => {\n\t\t\tconst newWidthValue = newWidth === '' ? undefined : newWidth;\n\t\t\tconst [ parsedValue ] =\n\t\t\t\tparseQuantityAndUnitFromRawValue( newWidth );\n\t\t\tconst hasZeroWidth = parsedValue === 0;\n\t\t\tconst updatedBorder = { ...border, width: newWidthValue };\n\n\t\t\t// Setting the border width explicitly to zero will also set the\n\t\t\t// border style to `none` and clear the border color.\n\t\t\tif ( hasZeroWidth && ! hadPreviousZeroWidth ) {\n\t\t\t\t// Before clearing the color and style selections, keep track of\n\t\t\t\t// the current selections so they can be restored when the width\n\t\t\t\t// changes to a non-zero value.\n\t\t\t\tsetColorSelection( border?.color );\n\t\t\t\tsetStyleSelection( border?.style );\n\n\t\t\t\t// Clear the color and style border properties.\n\t\t\t\tupdatedBorder.color = undefined;\n\t\t\t\tupdatedBorder.style = 'none';\n\t\t\t}\n\n\t\t\t// Selection has changed from zero border width to non-zero width.\n\t\t\tif ( ! hasZeroWidth && hadPreviousZeroWidth ) {\n\t\t\t\t// Restore previous border color and style selections if width\n\t\t\t\t// is now not zero.\n\t\t\t\tif ( updatedBorder.color === undefined ) {\n\t\t\t\t\tupdatedBorder.color = colorSelection;\n\t\t\t\t}\n\t\t\t\tif ( updatedBorder.style === 'none' ) {\n\t\t\t\t\tupdatedBorder.style = styleSelection;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tonBorderChange( updatedBorder );\n\t\t},\n\t\t[\n\t\t\tborder,\n\t\t\thadPreviousZeroWidth,\n\t\t\tcolorSelection,\n\t\t\tstyleSelection,\n\t\t\tonBorderChange,\n\t\t]\n\t);\n\n\tconst onSliderChange = useCallback(\n\t\t( value?: number ) => {\n\t\t\tonWidthChange( `${ value }${ widthUnit }` );\n\t\t},\n\t\t[ onWidthChange, widthUnit ]\n\t);\n\n\t// Generate class names.\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.borderControl, className );\n\t}, [ className, cx ] );\n\n\tlet wrapperWidth = width;\n\tif ( isCompact ) {\n\t\t// Widths below represent the minimum usable width for compact controls.\n\t\t// Taller controls contain greater internal padding, thus greater width.\n\t\twrapperWidth = size === '__unstable-large' ? '116px' : '90px';\n\t}\n\tconst innerWrapperClassName = useMemo( () => {\n\t\tconst widthStyle = !! wrapperWidth && styles.wrapperWidth;\n\t\tconst heightStyle = styles.wrapperHeight( computedSize );\n\n\t\treturn cx( styles.innerWrapper(), widthStyle, heightStyle );\n\t}, [ wrapperWidth, cx, computedSize ] );\n\n\tconst sliderClassName = useMemo( () => {\n\t\treturn cx( styles.borderSlider() );\n\t}, [ cx ] );\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tcolors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tinnerWrapperClassName,\n\t\tinputWidth: wrapperWidth,\n\t\tisStyleSettable,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tpreviousStyleSelection: styleSelection,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\tsize: computedSize,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next40pxDefaultSize,\n\t};\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -20,9 +20,7 @@ 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 } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
+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');

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

@@ -1 +1 @@
-{"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","resetButtonClassName","size","__unstablePopoverProps","otherProps","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","children","className","renderContent","onClose","paddingSize","spacing","value","onChange","clearable","popoverProps","ref","ConnectedBorderControlDropdown"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\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$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorValue );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tgetAriaLabelColorValue( colorObject.color )\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tgetAriaLabelColorValue( colorValue )\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tisStyleSettable,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tsize,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip\n\t\t\t__next40pxDefaultSize={ size === '__unstable-large' ? true : false }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && isStyleSettable && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\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</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__","sprintf","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","resetButtonClassName","size","__unstablePopoverProps","otherProps","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","children","className","renderContent","onClose","paddingSize","spacing","value","onChange","clearable","popoverProps","ref","ConnectedBorderControlDropdown"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\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$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorValue );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t  )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t  );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tgetAriaLabelColorValue( colorObject.color )\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tgetAriaLabelColorValue( colorValue )\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tisStyleSettable,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tsize,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip\n\t\t\t__next40pxDefaultSize={ size === '__unstable-large' ? true : false }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && isStyleSettable && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\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</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"],"mappings":"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","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"names":["css","COLORS","CONFIG","boxSizingReset","rtl","space","StyledLabel","ValueInput","UnitControlWrapper","UnitSelect","focusBoxShadow","controlBoxShadowFocus","process","env","NODE_ENV","borderControl","innerWrapper","wrapperWidth","wrapperHeight","size","borderControlDropdown","borderRadius","borderWidth","ui","border","borderFocus","colorIndicatorBorder","color","style","fallbackColor","gray","undefined","colorIndicatorWrapper","radiusFull","swatchSize","swatchGap","borderControlPopoverControls","borderControlPopoverContent","borderColorIndicator","resetButton","borderSlider","marginRight"],"sources":["@wordpress/components/src/border-control/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG, boxSizingReset, rtl } from '../utils';\nimport { space } from '../utils/space';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\nimport {\n\tValueInput as UnitControlWrapper,\n\tUnitSelect,\n} from '../unit-control/styles/unit-control-styles';\n\nimport type { Border } from './types';\n\nconst focusBoxShadow = css`\n\tbox-shadow: inset ${ CONFIG.controlBoxShadowFocus };\n`;\n\nexport const borderControl = css`\n\tborder: 0;\n\tpadding: 0;\n\tmargin: 0;\n\t${ boxSizingReset }\n`;\n\nexport const innerWrapper = () => css`\n\t${ UnitControlWrapper } {\n\t\tflex: 1 1 40%;\n\t}\n\t&& ${ UnitSelect } {\n\t\t/* Prevent unit select forcing min height larger than its UnitControl */\n\t\tmin-height: 0;\n\t}\n`;\n\n/*\n * This style is only applied to the UnitControl wrapper when the border width\n * field should be a set width. Omitting this allows the UnitControl &\n * RangeControl to share the available width in a 40/60 split respectively.\n */\nexport const wrapperWidth = css`\n\t${ UnitControlWrapper } {\n\t\t/* Force the UnitControl's set width. */\n\t\tflex: 0 0 auto;\n\t}\n`;\n\nexport const wrapperHeight = ( size?: 'default' | '__unstable-large' ) => {\n\treturn css`\n\t\theight: ${ size === '__unstable-large' ? '40px' : '30px' };\n\t`;\n};\n\nexport const borderControlDropdown = css`\n\tbackground: #fff;\n\n\t&& > button {\n\t\taspect-ratio: 1;\n\t\tpadding: 0;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\t${ rtl(\n\t\t\t{ borderRadius: `2px 0 0 2px` },\n\t\t\t{ borderRadius: `0 2px 2px 0` }\n\t\t)() }\n\t\tborder: ${ CONFIG.borderWidth } solid ${ COLORS.ui.border };\n\n\t\t&:focus,\n\t\t&:hover:not( :disabled ) {\n\t\t\t${ focusBoxShadow }\n\t\t\tborder-color: ${ COLORS.ui.borderFocus };\n\t\t\tz-index: 1;\n\t\t\tposition: relative;\n\t\t}\n\t}\n`;\n\nexport const colorIndicatorBorder = ( border?: Border ) => {\n\tconst { color, style } = border || {};\n\n\tconst fallbackColor =\n\t\t!! style && style !== 'none' ? COLORS.gray[ 300 ] : undefined;\n\n\treturn css`\n\t\tborder-style: ${ style === 'none' ? 'solid' : style };\n\t\tborder-color: ${ color || fallbackColor };\n\t`;\n};\n\nexport const colorIndicatorWrapper = (\n\tborder?: Border,\n\tsize?: 'default' | '__unstable-large'\n) => {\n\tconst { style } = border || {};\n\n\treturn css`\n\t\tborder-radius: ${ CONFIG.radiusFull };\n\t\tborder: 2px solid transparent;\n\t\t${ style ? colorIndicatorBorder( border ) : undefined }\n\t\twidth: ${ size === '__unstable-large' ? '24px' : '22px' };\n\t\theight: ${ size === '__unstable-large' ? '24px' : '22px' };\n\t\tpadding: ${ size === '__unstable-large' ? '2px' : '1px' };\n\n\t\t/*\n\t\t * ColorIndicator\n\t\t *\n\t\t * The transparent colors used here ensure visibility of the indicator\n\t\t * over the active state of the border control dropdown's toggle button.\n\t\t */\n\t\t& > span {\n\t\t\theight: ${ space( 4 ) };\n\t\t\twidth: ${ space( 4 ) };\n\t\t\tbackground: linear-gradient(\n\t\t\t\t-45deg,\n\t\t\t\ttransparent 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 52%,\n\t\t\t\ttransparent 52%\n\t\t\t);\n\t\t}\n\t`;\n};\n\n// Must equal $color-palette-circle-size from:\n// @wordpress/components/src/circular-option-picker/style.scss\nconst swatchSize = 28;\nconst swatchGap = 12;\n\nexport const borderControlPopoverControls = css`\n\twidth: ${ swatchSize * 6 + swatchGap * 5 }px;\n\n\t> div:first-of-type > ${ StyledLabel } {\n\t\tmargin-bottom: 0;\n\t}\n\n\t&& ${ StyledLabel } + button:not( .has-text ) {\n\t\tmin-width: 24px;\n\t\tpadding: 0;\n\t}\n`;\n\nexport const borderControlPopoverContent = css``;\nexport const borderColorIndicator = css``;\n\nexport const resetButton = css`\n\tjustify-content: center;\n\twidth: 100%;\n\n\t/* Override button component styling */\n\t&& {\n\t\tborder-top: ${ CONFIG.borderWidth } solid ${ COLORS.gray[ 400 ] };\n\t\tborder-top-left-radius: 0;\n\t\tborder-top-right-radius: 0;\n\t}\n`;\n\nexport const borderSlider = () => css`\n\tflex: 1 1 60%;\n\t${ rtl( { marginRight: space( 3 ) } )() }\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["css","COLORS","CONFIG","boxSizingReset","rtl","space","StyledLabel","ValueInput","UnitControlWrapper","UnitSelect","focusBoxShadow","controlBoxShadowFocus","process","env","NODE_ENV","borderControl","innerWrapper","wrapperWidth","wrapperHeight","size","borderControlDropdown","borderRadius","borderWidth","ui","border","borderFocus","colorIndicatorBorder","color","style","fallbackColor","gray","undefined","colorIndicatorWrapper","radiusFull","swatchSize","swatchGap","borderControlPopoverControls","borderControlPopoverContent","borderColorIndicator","resetButton","borderSlider","marginRight"],"sources":["@wordpress/components/src/border-control/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG, boxSizingReset, rtl } from '../utils';\nimport { space } from '../utils/space';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\nimport {\n\tValueInput as UnitControlWrapper,\n\tUnitSelect,\n} from '../unit-control/styles/unit-control-styles';\n\nimport type { Border } from './types';\n\nconst focusBoxShadow = css`\n\tbox-shadow: inset ${ CONFIG.controlBoxShadowFocus };\n`;\n\nexport const borderControl = css`\n\tborder: 0;\n\tpadding: 0;\n\tmargin: 0;\n\t${ boxSizingReset }\n`;\n\nexport const innerWrapper = () => css`\n\t${ UnitControlWrapper } {\n\t\tflex: 1 1 40%;\n\t}\n\t&& ${ UnitSelect } {\n\t\t/* Prevent unit select forcing min height larger than its UnitControl */\n\t\tmin-height: 0;\n\t}\n`;\n\n/*\n * This style is only applied to the UnitControl wrapper when the border width\n * field should be a set width. Omitting this allows the UnitControl &\n * RangeControl to share the available width in a 40/60 split respectively.\n */\nexport const wrapperWidth = css`\n\t${ UnitControlWrapper } {\n\t\t/* Force the UnitControl's set width. */\n\t\tflex: 0 0 auto;\n\t}\n`;\n\nexport const wrapperHeight = ( size?: 'default' | '__unstable-large' ) => {\n\treturn css`\n\t\theight: ${ size === '__unstable-large' ? '40px' : '30px' };\n\t`;\n};\n\nexport const borderControlDropdown = css`\n\tbackground: #fff;\n\n\t&& > button {\n\t\taspect-ratio: 1;\n\t\tpadding: 0;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\t${ rtl(\n\t\t\t{ borderRadius: `2px 0 0 2px` },\n\t\t\t{ borderRadius: `0 2px 2px 0` }\n\t\t)() }\n\t\tborder: ${ CONFIG.borderWidth } solid ${ COLORS.ui.border };\n\n\t\t&:focus,\n\t\t&:hover:not( :disabled ) {\n\t\t\t${ focusBoxShadow }\n\t\t\tborder-color: ${ COLORS.ui.borderFocus };\n\t\t\tz-index: 1;\n\t\t\tposition: relative;\n\t\t}\n\t}\n`;\n\nexport const colorIndicatorBorder = ( border?: Border ) => {\n\tconst { color, style } = border || {};\n\n\tconst fallbackColor =\n\t\t!! style && style !== 'none' ? COLORS.gray[ 300 ] : undefined;\n\n\treturn css`\n\t\tborder-style: ${ style === 'none' ? 'solid' : style };\n\t\tborder-color: ${ color || fallbackColor };\n\t`;\n};\n\nexport const colorIndicatorWrapper = (\n\tborder?: Border,\n\tsize?: 'default' | '__unstable-large'\n) => {\n\tconst { style } = border || {};\n\n\treturn css`\n\t\tborder-radius: ${ CONFIG.radiusFull };\n\t\tborder: 2px solid transparent;\n\t\t${ style ? colorIndicatorBorder( border ) : undefined }\n\t\twidth: ${ size === '__unstable-large' ? '24px' : '22px' };\n\t\theight: ${ size === '__unstable-large' ? '24px' : '22px' };\n\t\tpadding: ${ size === '__unstable-large' ? '2px' : '1px' };\n\n\t\t/*\n\t\t * ColorIndicator\n\t\t *\n\t\t * The transparent colors used here ensure visibility of the indicator\n\t\t * over the active state of the border control dropdown's toggle button.\n\t\t */\n\t\t& > span {\n\t\t\theight: ${ space( 4 ) };\n\t\t\twidth: ${ space( 4 ) };\n\t\t\tbackground: linear-gradient(\n\t\t\t\t-45deg,\n\t\t\t\ttransparent 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 52%,\n\t\t\t\ttransparent 52%\n\t\t\t);\n\t\t}\n\t`;\n};\n\n// Must equal $color-palette-circle-size from:\n// @wordpress/components/src/circular-option-picker/style.scss\nconst swatchSize = 28;\nconst swatchGap = 12;\n\nexport const borderControlPopoverControls = css`\n\twidth: ${ swatchSize * 6 + swatchGap * 5 }px;\n\n\t> div:first-of-type > ${ StyledLabel } {\n\t\tmargin-bottom: 0;\n\t}\n\n\t&& ${ StyledLabel } + button:not( .has-text ) {\n\t\tmin-width: 24px;\n\t\tpadding: 0;\n\t}\n`;\n\nexport const borderControlPopoverContent = css``;\nexport const borderColorIndicator = css``;\n\nexport const resetButton = css`\n\tjustify-content: center;\n\twidth: 100%;\n\n\t/* Override button component styling */\n\t&& {\n\t\tborder-top: ${ CONFIG.borderWidth } solid ${ COLORS.gray[ 400 ] };\n\t\tborder-top-left-radius: 0;\n\t\tborder-top-right-radius: 0;\n\t}\n`;\n\nexport const borderSlider = () => css`\n\tflex: 1 1 60%;\n\t${ rtl( { marginRight: space( 3 ) } )() }\n`;\n"],"mappings":"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","ignoreList":[]}

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

@@ -9,9 +9,7 @@ import { useInstanceId } from '@wordpress/compose';
 import { FlexedRangeControl, StyledUnitControl } from './styles/box-control-styles';
 import { parseQuantityAndUnitFromRawValue } from '../unit-control';
 import { LABELS, applyValueToSides, getAllValue, isValuesMixed, isValuesDefined, CUSTOM_VALUE_SETTINGS } from './utils';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const noop = () => {};
 export default function AllInputControl({
   __next40pxDefaultSize,

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

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

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

@@ -9,10 +9,8 @@ import { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';
 import Tooltip from '../tooltip';
 import { CUSTOM_VALUE_SETTINGS, LABELS } from './utils';
 import { FlexedBoxControlIcon, FlexedRangeControl, InputWrapper, StyledUnitControl } from './styles/box-control-styles';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 const groupedSides = ['vertical', 'horizontal'];
 export default function AxialInputControls({
   __next40pxDefaultSize,

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

@@ -1 +1 @@
-{"version":3,"names":["useInstanceId","parseQuantityAndUnitFromRawValue","Tooltip","CUSTOM_VALUE_SETTINGS","LABELS","FlexedBoxControlIcon","FlexedRangeControl","InputWrapper","StyledUnitControl","jsx","_jsx","createElement","_createElement","jsxs","_jsxs","Fragment","_Fragment","groupedSides","AxialInputControls","__next40pxDefaultSize","onChange","onFocus","values","selectedUnits","setSelectedUnits","sides","props","generatedId","createHandleOnFocus","side","event","handleOnValueChange","next","nextValues","isNumeric","undefined","isNaN","parseFloat","nextValue","top","bottom","left","right","createHandleOnUnitChange","newUnits","filteredSides","length","filter","includes","children","map","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","parsedQuantity","parsedUnit","selectedUnit","inputId","join","placement","text","className","id","isPressEnterToChange","value","newValue","onUnitChange","label","hideLabelFromVision","key","__nextHasNoMarginBottom","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/axial-input-controls.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport Tooltip from '../tooltip';\nimport { CUSTOM_VALUE_SETTINGS, LABELS } from './utils';\nimport {\n\tFlexedBoxControlIcon,\n\tFlexedRangeControl,\n\tInputWrapper,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport type { BoxControlInputControlProps } from './types';\n\nconst groupedSides = [ 'vertical', 'horizontal' ] as const;\ntype GroupedSide = ( typeof groupedSides )[ number ];\n\nexport default function AxialInputControls( {\n\t__next40pxDefaultSize,\n\tonChange,\n\tonFocus,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst generatedId = useInstanceId(\n\t\tAxialInputControls,\n\t\t`box-control-input`\n\t);\n\n\tconst createHandleOnFocus =\n\t\t( side: GroupedSide ) =>\n\t\t( event: React.FocusEvent< HTMLInputElement > ) => {\n\t\t\tif ( ! onFocus ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonFocus( event, { side } );\n\t\t};\n\n\tconst handleOnValueChange = ( side: GroupedSide, next?: string ) => {\n\t\tif ( ! onChange ) {\n\t\t\treturn;\n\t\t}\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tif ( side === 'vertical' ) {\n\t\t\tnextValues.top = nextValue;\n\t\t\tnextValues.bottom = nextValue;\n\t\t}\n\n\t\tif ( side === 'horizontal' ) {\n\t\t\tnextValues.left = nextValue;\n\t\t\tnextValues.right = nextValue;\n\t\t}\n\n\t\tonChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange =\n\t\t( side: GroupedSide ) => ( next?: string ) => {\n\t\t\tconst newUnits = { ...selectedUnits };\n\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewUnits.top = next;\n\t\t\t\tnewUnits.bottom = next;\n\t\t\t}\n\n\t\t\tif ( side === 'horizontal' ) {\n\t\t\t\tnewUnits.left = next;\n\t\t\t\tnewUnits.right = next;\n\t\t\t}\n\n\t\t\tsetSelectedUnits( newUnits );\n\t\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? groupedSides.filter( ( side ) => sides.includes( side ) )\n\t\t: groupedSides;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredSides.map( ( side ) => {\n\t\t\t\tconst [ parsedQuantity, parsedUnit ] =\n\t\t\t\t\tparseQuantityAndUnitFromRawValue(\n\t\t\t\t\t\tside === 'vertical' ? values.top : values.left\n\t\t\t\t\t);\n\t\t\t\tconst selectedUnit =\n\t\t\t\t\tside === 'vertical'\n\t\t\t\t\t\t? selectedUnits.top\n\t\t\t\t\t\t: selectedUnits.left;\n\n\t\t\t\tconst inputId = [ generatedId, side ].join( '-' );\n\n\t\t\t\treturn (\n\t\t\t\t\t<InputWrapper key={ side }>\n\t\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t\t<Tooltip placement=\"top-end\" text={ LABELS[ side ] }>\n\t\t\t\t\t\t\t<StyledUnitControl\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\t\t\t\tid={ inputId }\n\t\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\t\tvalue={ [\n\t\t\t\t\t\t\t\t\tparsedQuantity,\n\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t].join( '' ) }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\t\thandleOnValueChange( side, newValue )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange(\n\t\t\t\t\t\t\t\t\tside\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tkey={ side }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t<FlexedRangeControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\taria-controls={ inputId }\n\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\tnewValue !== undefined\n\t\t\t\t\t\t\t\t\t\t? [\n\t\t\t\t\t\t\t\t\t\t\t\tnewValue,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t\t\t  ].join( '' )\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.max ?? 10\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputWrapper>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useInstanceId","parseQuantityAndUnitFromRawValue","Tooltip","CUSTOM_VALUE_SETTINGS","LABELS","FlexedBoxControlIcon","FlexedRangeControl","InputWrapper","StyledUnitControl","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","createElement","_createElement","groupedSides","AxialInputControls","__next40pxDefaultSize","onChange","onFocus","values","selectedUnits","setSelectedUnits","sides","props","generatedId","createHandleOnFocus","side","event","handleOnValueChange","next","nextValues","isNumeric","undefined","isNaN","parseFloat","nextValue","top","bottom","left","right","createHandleOnUnitChange","newUnits","filteredSides","length","filter","includes","children","map","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","parsedQuantity","parsedUnit","selectedUnit","inputId","join","placement","text","className","id","isPressEnterToChange","value","newValue","onUnitChange","label","hideLabelFromVision","key","__nextHasNoMarginBottom","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/axial-input-controls.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport Tooltip from '../tooltip';\nimport { CUSTOM_VALUE_SETTINGS, LABELS } from './utils';\nimport {\n\tFlexedBoxControlIcon,\n\tFlexedRangeControl,\n\tInputWrapper,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport type { BoxControlInputControlProps } from './types';\n\nconst groupedSides = [ 'vertical', 'horizontal' ] as const;\ntype GroupedSide = ( typeof groupedSides )[ number ];\n\nexport default function AxialInputControls( {\n\t__next40pxDefaultSize,\n\tonChange,\n\tonFocus,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst generatedId = useInstanceId(\n\t\tAxialInputControls,\n\t\t`box-control-input`\n\t);\n\n\tconst createHandleOnFocus =\n\t\t( side: GroupedSide ) =>\n\t\t( event: React.FocusEvent< HTMLInputElement > ) => {\n\t\t\tif ( ! onFocus ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonFocus( event, { side } );\n\t\t};\n\n\tconst handleOnValueChange = ( side: GroupedSide, next?: string ) => {\n\t\tif ( ! onChange ) {\n\t\t\treturn;\n\t\t}\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tif ( side === 'vertical' ) {\n\t\t\tnextValues.top = nextValue;\n\t\t\tnextValues.bottom = nextValue;\n\t\t}\n\n\t\tif ( side === 'horizontal' ) {\n\t\t\tnextValues.left = nextValue;\n\t\t\tnextValues.right = nextValue;\n\t\t}\n\n\t\tonChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange =\n\t\t( side: GroupedSide ) => ( next?: string ) => {\n\t\t\tconst newUnits = { ...selectedUnits };\n\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewUnits.top = next;\n\t\t\t\tnewUnits.bottom = next;\n\t\t\t}\n\n\t\t\tif ( side === 'horizontal' ) {\n\t\t\t\tnewUnits.left = next;\n\t\t\t\tnewUnits.right = next;\n\t\t\t}\n\n\t\t\tsetSelectedUnits( newUnits );\n\t\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? groupedSides.filter( ( side ) => sides.includes( side ) )\n\t\t: groupedSides;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredSides.map( ( side ) => {\n\t\t\t\tconst [ parsedQuantity, parsedUnit ] =\n\t\t\t\t\tparseQuantityAndUnitFromRawValue(\n\t\t\t\t\t\tside === 'vertical' ? values.top : values.left\n\t\t\t\t\t);\n\t\t\t\tconst selectedUnit =\n\t\t\t\t\tside === 'vertical'\n\t\t\t\t\t\t? selectedUnits.top\n\t\t\t\t\t\t: selectedUnits.left;\n\n\t\t\t\tconst inputId = [ generatedId, side ].join( '-' );\n\n\t\t\t\treturn (\n\t\t\t\t\t<InputWrapper key={ side }>\n\t\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t\t<Tooltip placement=\"top-end\" text={ LABELS[ side ] }>\n\t\t\t\t\t\t\t<StyledUnitControl\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\t\t\t\tid={ inputId }\n\t\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\t\tvalue={ [\n\t\t\t\t\t\t\t\t\tparsedQuantity,\n\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t].join( '' ) }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\t\thandleOnValueChange( side, newValue )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange(\n\t\t\t\t\t\t\t\t\tside\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\tkey={ side }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t<FlexedRangeControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\taria-controls={ inputId }\n\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\tnewValue !== undefined\n\t\t\t\t\t\t\t\t\t\t? [\n\t\t\t\t\t\t\t\t\t\t\t\tnewValue,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedUnit ?? parsedUnit,\n\t\t\t\t\t\t\t\t\t\t  ].join( '' )\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.max ?? 10\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputWrapper>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/box-control/icon.js

@@ -3,8 +3,7 @@
  */
 
 import { Root, Viewbox, TopStroke, RightStroke, BottomStroke, LeftStroke } from './styles/box-control-icon-styles';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const BASE_ICON_SIZE = 24;
 export default function BoxControlIcon({
   size = 24,

package/build-module/box-control/icon.js.map

@@ -1 +1 @@
-{"version":3,"names":["Root","Viewbox","TopStroke","RightStroke","BottomStroke","LeftStroke","jsx","_jsx","jsxs","_jsxs","BASE_ICON_SIZE","BoxControlIcon","size","side","sides","props","isSideDisabled","value","length","includes","hasSide","top","right","bottom","left","scale","style","transform","children","isFocused"],"sources":["@wordpress/components/src/box-control/icon.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport {\n\tRoot,\n\tViewbox,\n\tTopStroke,\n\tRightStroke,\n\tBottomStroke,\n\tLeftStroke,\n} from './styles/box-control-icon-styles';\nimport type { BoxControlIconProps, BoxControlProps } from './types';\n\nconst BASE_ICON_SIZE = 24;\n\nexport default function BoxControlIcon( {\n\tsize = 24,\n\tside = 'all',\n\tsides,\n\t...props\n}: WordPressComponentProps< BoxControlIconProps, 'span' > ) {\n\tconst isSideDisabled = (\n\t\tvalue: NonNullable< BoxControlProps[ 'sides' ] >[ number ]\n\t) => sides?.length && ! sides.includes( value );\n\n\tconst hasSide = (\n\t\tvalue: NonNullable< BoxControlProps[ 'sides' ] >[ number ]\n\t) => {\n\t\tif ( isSideDisabled( value ) ) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn side === 'all' || side === value;\n\t};\n\n\tconst top = hasSide( 'top' ) || hasSide( 'vertical' );\n\tconst right = hasSide( 'right' ) || hasSide( 'horizontal' );\n\tconst bottom = hasSide( 'bottom' ) || hasSide( 'vertical' );\n\tconst left = hasSide( 'left' ) || hasSide( 'horizontal' );\n\n\t// Simulates SVG Icon scaling.\n\tconst scale = size / BASE_ICON_SIZE;\n\n\treturn (\n\t\t<Root style={ { transform: `scale(${ scale })` } } { ...props }>\n\t\t\t<Viewbox>\n\t\t\t\t<TopStroke isFocused={ top } />\n\t\t\t\t<RightStroke isFocused={ right } />\n\t\t\t\t<BottomStroke isFocused={ bottom } />\n\t\t\t\t<LeftStroke isFocused={ left } />\n\t\t\t</Viewbox>\n\t\t</Root>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SACCA,IAAI,EACJC,OAAO,EACPC,SAAS,EACTC,WAAW,EACXC,YAAY,EACZC,UAAU,QACJ,kCAAkC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAG1C,MAAMC,cAAc,GAAG,EAAE;AAEzB,eAAe,SAASC,cAAcA,CAAE;EACvCC,IAAI,GAAG,EAAE;EACTC,IAAI,GAAG,KAAK;EACZC,KAAK;EACL,GAAGC;AACoD,CAAC,EAAG;EAC3D,MAAMC,cAAc,GACnBC,KAA0D,IACtDH,KAAK,EAAEI,MAAM,IAAI,CAAEJ,KAAK,CAACK,QAAQ,CAAEF,KAAM,CAAC;EAE/C,MAAMG,OAAO,GACZH,KAA0D,IACtD;IACJ,IAAKD,cAAc,CAAEC,KAAM,CAAC,EAAG;MAC9B,OAAO,KAAK;IACb;IAEA,OAAOJ,IAAI,KAAK,KAAK,IAAIA,IAAI,KAAKI,KAAK;EACxC,CAAC;EAED,MAAMI,GAAG,GAAGD,OAAO,CAAE,KAAM,CAAC,IAAIA,OAAO,CAAE,UAAW,CAAC;EACrD,MAAME,KAAK,GAAGF,OAAO,CAAE,OAAQ,CAAC,IAAIA,OAAO,CAAE,YAAa,CAAC;EAC3D,MAAMG,MAAM,GAAGH,OAAO,CAAE,QAAS,CAAC,IAAIA,OAAO,CAAE,UAAW,CAAC;EAC3D,MAAMI,IAAI,GAAGJ,OAAO,CAAE,MAAO,CAAC,IAAIA,OAAO,CAAE,YAAa,CAAC;;EAEzD;EACA,MAAMK,KAAK,GAAGb,IAAI,GAAGF,cAAc;EAEnC,oBACCH,IAAA,CAACP,IAAI;IAAC0B,KAAK,EAAG;MAAEC,SAAS,EAAG,SAASF,KAAO;IAAG,CAAG;IAAA,GAAMV,KAAK;IAAAa,QAAA,eAC5DnB,KAAA,CAACR,OAAO;MAAA2B,QAAA,gBACPrB,IAAA,CAACL,SAAS;QAAC2B,SAAS,EAAGR;MAAK,CAAE,CAAC,eAC/Bd,IAAA,CAACJ,WAAW;QAAC0B,SAAS,EAAGP;MAAO,CAAE,CAAC,eACnCf,IAAA,CAACH,YAAY;QAACyB,SAAS,EAAGN;MAAQ,CAAE,CAAC,eACrChB,IAAA,CAACF,UAAU;QAACwB,SAAS,EAAGL;MAAM,CAAE,CAAC;IAAA,CACzB;EAAC,CACL,CAAC;AAET","ignoreList":[]}
+{"version":3,"names":["Root","Viewbox","TopStroke","RightStroke","BottomStroke","LeftStroke","jsx","_jsx","jsxs","_jsxs","BASE_ICON_SIZE","BoxControlIcon","size","side","sides","props","isSideDisabled","value","length","includes","hasSide","top","right","bottom","left","scale","style","transform","children","isFocused"],"sources":["@wordpress/components/src/box-control/icon.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport {\n\tRoot,\n\tViewbox,\n\tTopStroke,\n\tRightStroke,\n\tBottomStroke,\n\tLeftStroke,\n} from './styles/box-control-icon-styles';\nimport type { BoxControlIconProps, BoxControlProps } from './types';\n\nconst BASE_ICON_SIZE = 24;\n\nexport default function BoxControlIcon( {\n\tsize = 24,\n\tside = 'all',\n\tsides,\n\t...props\n}: WordPressComponentProps< BoxControlIconProps, 'span' > ) {\n\tconst isSideDisabled = (\n\t\tvalue: NonNullable< BoxControlProps[ 'sides' ] >[ number ]\n\t) => sides?.length && ! sides.includes( value );\n\n\tconst hasSide = (\n\t\tvalue: NonNullable< BoxControlProps[ 'sides' ] >[ number ]\n\t) => {\n\t\tif ( isSideDisabled( value ) ) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn side === 'all' || side === value;\n\t};\n\n\tconst top = hasSide( 'top' ) || hasSide( 'vertical' );\n\tconst right = hasSide( 'right' ) || hasSide( 'horizontal' );\n\tconst bottom = hasSide( 'bottom' ) || hasSide( 'vertical' );\n\tconst left = hasSide( 'left' ) || hasSide( 'horizontal' );\n\n\t// Simulates SVG Icon scaling.\n\tconst scale = size / BASE_ICON_SIZE;\n\n\treturn (\n\t\t<Root style={ { transform: `scale(${ scale })` } } { ...props }>\n\t\t\t<Viewbox>\n\t\t\t\t<TopStroke isFocused={ top } />\n\t\t\t\t<RightStroke isFocused={ right } />\n\t\t\t\t<BottomStroke isFocused={ bottom } />\n\t\t\t\t<LeftStroke isFocused={ left } />\n\t\t\t</Viewbox>\n\t\t</Root>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SACCA,IAAI,EACJC,OAAO,EACPC,SAAS,EACTC,WAAW,EACXC,YAAY,EACZC,UAAU,QACJ,kCAAkC;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAG1C,MAAMC,cAAc,GAAG,EAAE;AAEzB,eAAe,SAASC,cAAcA,CAAE;EACvCC,IAAI,GAAG,EAAE;EACTC,IAAI,GAAG,KAAK;EACZC,KAAK;EACL,GAAGC;AACoD,CAAC,EAAG;EAC3D,MAAMC,cAAc,GACnBC,KAA0D,IACtDH,KAAK,EAAEI,MAAM,IAAI,CAAEJ,KAAK,CAACK,QAAQ,CAAEF,KAAM,CAAC;EAE/C,MAAMG,OAAO,GACZH,KAA0D,IACtD;IACJ,IAAKD,cAAc,CAAEC,KAAM,CAAC,EAAG;MAC9B,OAAO,KAAK;IACb;IAEA,OAAOJ,IAAI,KAAK,KAAK,IAAIA,IAAI,KAAKI,KAAK;EACxC,CAAC;EAED,MAAMI,GAAG,GAAGD,OAAO,CAAE,KAAM,CAAC,IAAIA,OAAO,CAAE,UAAW,CAAC;EACrD,MAAME,KAAK,GAAGF,OAAO,CAAE,OAAQ,CAAC,IAAIA,OAAO,CAAE,YAAa,CAAC;EAC3D,MAAMG,MAAM,GAAGH,OAAO,CAAE,QAAS,CAAC,IAAIA,OAAO,CAAE,UAAW,CAAC;EAC3D,MAAMI,IAAI,GAAGJ,OAAO,CAAE,MAAO,CAAC,IAAIA,OAAO,CAAE,YAAa,CAAC;;EAEzD;EACA,MAAMK,KAAK,GAAGb,IAAI,GAAGF,cAAc;EAEnC,oBACCH,IAAA,CAACP,IAAI;IAAC0B,KAAK,EAAG;MAAEC,SAAS,EAAE,SAAUF,KAAK;IAAK,CAAG;IAAA,GAAMV,KAAK;IAAAa,QAAA,eAC5DnB,KAAA,CAACR,OAAO;MAAA2B,QAAA,gBACPrB,IAAA,CAACL,SAAS;QAAC2B,SAAS,EAAGR;MAAK,CAAE,CAAC,eAC/Bd,IAAA,CAACJ,WAAW;QAAC0B,SAAS,EAAGP;MAAO,CAAE,CAAC,eACnCf,IAAA,CAACH,YAAY;QAACyB,SAAS,EAAGN;MAAQ,CAAE,CAAC,eACrChB,IAAA,CAACF,UAAU;QAACwB,SAAS,EAAGL;MAAM,CAAE,CAAC;IAAA,CACzB;EAAC,CACL,CAAC;AAET","ignoreList":[]}

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

@@ -18,8 +18,7 @@ import { FlexedBoxControlIcon, InputWrapper, ResetButton, LinkedButtonWrapper }
 import { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';
 import { DEFAULT_VALUES, getInitialSide, isValuesMixed, isValuesDefined } from './utils';
 import { useControlledState } from '../utils/hooks';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const defaultInputProps = {
   min: 0
 };

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

@@ -1 +1 @@
-{"version":3,"names":["useInstanceId","useState","__","BaseControl","AllInputControl","InputControls","AxialInputControls","LinkedButton","Grid","FlexedBoxControlIcon","InputWrapper","ResetButton","LinkedButtonWrapper","parseQuantityAndUnitFromRawValue","DEFAULT_VALUES","getInitialSide","isValuesMixed","isValuesDefined","useControlledState","jsx","_jsx","jsxs","_jsxs","defaultInputProps","min","noop","useUniqueId","idProp","instanceId","BoxControl","__next40pxDefaultSize","id","inputProps","onChange","label","values","valuesProp","units","sides","splitOnAxis","allowReset","resetValues","onMouseOver","onMouseOut","setValues","fallback","inputValues","hasInitialValue","hasOneSide","length","isDirty","setIsDirty","isLinked","setIsLinked","side","setSide","selectedUnits","setSelectedUnits","top","right","bottom","left","headingId","toggleLinked","handleOnFocus","_event","nextSide","handleOnChange","nextValues","handleOnReset","inputControlProps","onFocus","columns","templateColumns","role","children","VisualLabel","onClick","className","variant","size","disabled","applyValueToSides"],"sources":["@wordpress/components/src/box-control/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { BaseControl } from '../base-control';\nimport AllInputControl from './all-input-control';\nimport InputControls from './input-controls';\nimport AxialInputControls from './axial-input-controls';\nimport LinkedButton from './linked-button';\nimport { Grid } from '../grid';\nimport {\n\tFlexedBoxControlIcon,\n\tInputWrapper,\n\tResetButton,\n\tLinkedButtonWrapper,\n} from './styles/box-control-styles';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport {\n\tDEFAULT_VALUES,\n\tgetInitialSide,\n\tisValuesMixed,\n\tisValuesDefined,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type {\n\tBoxControlIconProps,\n\tBoxControlProps,\n\tBoxControlValue,\n} from './types';\n\nconst defaultInputProps = {\n\tmin: 0,\n};\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( BoxControl, 'inspector-box-control' );\n\n\treturn idProp || instanceId;\n}\n\n/**\n * A control that lets users set values for top, right, bottom, and left. Can be\n * used as an input control for values like `padding` or `margin`.\n *\n * ```jsx\n * import { BoxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * function Example() {\n * \tconst [ values, setValues ] = useState( {\n * \t\ttop: '50px',\n * \t\tleft: '10%',\n * \t\tright: '10%',\n * \t\tbottom: '50px',\n * \t} );\n *\n * \treturn (\n * \t\t<BoxControl\n * \t\t\tvalues={ values }\n * \t\t\tonChange={ ( nextValues ) => setValues( nextValues ) }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nfunction BoxControl( {\n\t__next40pxDefaultSize = false,\n\tid: idProp,\n\tinputProps = defaultInputProps,\n\tonChange = noop,\n\tlabel = __( 'Box Control' ),\n\tvalues: valuesProp,\n\tunits,\n\tsides,\n\tsplitOnAxis = false,\n\tallowReset = true,\n\tresetValues = DEFAULT_VALUES,\n\tonMouseOver,\n\tonMouseOut,\n}: BoxControlProps ) {\n\tconst [ values, setValues ] = useControlledState( valuesProp, {\n\t\tfallback: DEFAULT_VALUES,\n\t} );\n\tconst inputValues = values || DEFAULT_VALUES;\n\tconst hasInitialValue = isValuesDefined( valuesProp );\n\tconst hasOneSide = sides?.length === 1;\n\n\tconst [ isDirty, setIsDirty ] = useState( hasInitialValue );\n\tconst [ isLinked, setIsLinked ] = useState(\n\t\t! hasInitialValue || ! isValuesMixed( inputValues ) || hasOneSide\n\t);\n\n\tconst [ side, setSide ] = useState< BoxControlIconProps[ 'side' ] >(\n\t\tgetInitialSide( isLinked, splitOnAxis )\n\t);\n\n\t// Tracking selected units via internal state allows filtering of CSS unit\n\t// only values from being saved while maintaining preexisting unit selection\n\t// behaviour. Filtering CSS only values prevents invalid style values.\n\tconst [ selectedUnits, setSelectedUnits ] = useState< BoxControlValue >( {\n\t\ttop: parseQuantityAndUnitFromRawValue( valuesProp?.top )[ 1 ],\n\t\tright: parseQuantityAndUnitFromRawValue( valuesProp?.right )[ 1 ],\n\t\tbottom: parseQuantityAndUnitFromRawValue( valuesProp?.bottom )[ 1 ],\n\t\tleft: parseQuantityAndUnitFromRawValue( valuesProp?.left )[ 1 ],\n\t} );\n\n\tconst id = useUniqueId( idProp );\n\tconst headingId = `${ id }-heading`;\n\n\tconst toggleLinked = () => {\n\t\tsetIsLinked( ! isLinked );\n\t\tsetSide( getInitialSide( ! isLinked, splitOnAxis ) );\n\t};\n\n\tconst handleOnFocus = (\n\t\t_event: React.FocusEvent< HTMLInputElement >,\n\t\t{ side: nextSide }: { side: typeof side }\n\t) => {\n\t\tsetSide( nextSide );\n\t};\n\n\tconst handleOnChange = ( nextValues: BoxControlValue ) => {\n\t\tonChange( nextValues );\n\t\tsetValues( nextValues );\n\t\tsetIsDirty( true );\n\t};\n\n\tconst handleOnReset = () => {\n\t\tonChange( resetValues );\n\t\tsetValues( resetValues );\n\t\tsetSelectedUnits( resetValues );\n\t\tsetIsDirty( false );\n\t};\n\n\tconst inputControlProps = {\n\t\t...inputProps,\n\t\tonChange: handleOnChange,\n\t\tonFocus: handleOnFocus,\n\t\tisLinked,\n\t\tunits,\n\t\tselectedUnits,\n\t\tsetSelectedUnits,\n\t\tsides,\n\t\tvalues: inputValues,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\t__next40pxDefaultSize,\n\t};\n\n\treturn (\n\t\t<Grid\n\t\t\tid={ id }\n\t\t\tcolumns={ 3 }\n\t\t\ttemplateColumns=\"1fr min-content min-content\"\n\t\t\trole=\"group\"\n\t\t\taria-labelledby={ headingId }\n\t\t>\n\t\t\t<BaseControl.VisualLabel id={ headingId }>\n\t\t\t\t{ label }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t{ isLinked && (\n\t\t\t\t<InputWrapper>\n\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t<AllInputControl { ...inputControlProps } />\n\t\t\t\t</InputWrapper>\n\t\t\t) }\n\t\t\t{ ! hasOneSide && (\n\t\t\t\t<LinkedButtonWrapper>\n\t\t\t\t\t<LinkedButton\n\t\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t/>\n\t\t\t\t</LinkedButtonWrapper>\n\t\t\t) }\n\n\t\t\t{ ! isLinked && splitOnAxis && (\n\t\t\t\t<AxialInputControls { ...inputControlProps } />\n\t\t\t) }\n\t\t\t{ ! isLinked && ! splitOnAxis && (\n\t\t\t\t<InputControls { ...inputControlProps } />\n\t\t\t) }\n\t\t\t{ allowReset && (\n\t\t\t\t<ResetButton\n\t\t\t\t\tclassName=\"component-box-control__reset-button\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t</ResetButton>\n\t\t\t) }\n\t\t</Grid>\n\t);\n}\n\nexport { applyValueToSides } from './utils';\nexport default BoxControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useInstanceId","useState","__","BaseControl","AllInputControl","InputControls","AxialInputControls","LinkedButton","Grid","FlexedBoxControlIcon","InputWrapper","ResetButton","LinkedButtonWrapper","parseQuantityAndUnitFromRawValue","DEFAULT_VALUES","getInitialSide","isValuesMixed","isValuesDefined","useControlledState","jsx","_jsx","jsxs","_jsxs","defaultInputProps","min","noop","useUniqueId","idProp","instanceId","BoxControl","__next40pxDefaultSize","id","inputProps","onChange","label","values","valuesProp","units","sides","splitOnAxis","allowReset","resetValues","onMouseOver","onMouseOut","setValues","fallback","inputValues","hasInitialValue","hasOneSide","length","isDirty","setIsDirty","isLinked","setIsLinked","side","setSide","selectedUnits","setSelectedUnits","top","right","bottom","left","headingId","toggleLinked","handleOnFocus","_event","nextSide","handleOnChange","nextValues","handleOnReset","inputControlProps","onFocus","columns","templateColumns","role","children","VisualLabel","onClick","className","variant","size","disabled","applyValueToSides"],"sources":["@wordpress/components/src/box-control/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { BaseControl } from '../base-control';\nimport AllInputControl from './all-input-control';\nimport InputControls from './input-controls';\nimport AxialInputControls from './axial-input-controls';\nimport LinkedButton from './linked-button';\nimport { Grid } from '../grid';\nimport {\n\tFlexedBoxControlIcon,\n\tInputWrapper,\n\tResetButton,\n\tLinkedButtonWrapper,\n} from './styles/box-control-styles';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport {\n\tDEFAULT_VALUES,\n\tgetInitialSide,\n\tisValuesMixed,\n\tisValuesDefined,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type {\n\tBoxControlIconProps,\n\tBoxControlProps,\n\tBoxControlValue,\n} from './types';\n\nconst defaultInputProps = {\n\tmin: 0,\n};\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( BoxControl, 'inspector-box-control' );\n\n\treturn idProp || instanceId;\n}\n\n/**\n * A control that lets users set values for top, right, bottom, and left. Can be\n * used as an input control for values like `padding` or `margin`.\n *\n * ```jsx\n * import { BoxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * function Example() {\n * \tconst [ values, setValues ] = useState( {\n * \t\ttop: '50px',\n * \t\tleft: '10%',\n * \t\tright: '10%',\n * \t\tbottom: '50px',\n * \t} );\n *\n * \treturn (\n * \t\t<BoxControl\n * \t\t\tvalues={ values }\n * \t\t\tonChange={ ( nextValues ) => setValues( nextValues ) }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nfunction BoxControl( {\n\t__next40pxDefaultSize = false,\n\tid: idProp,\n\tinputProps = defaultInputProps,\n\tonChange = noop,\n\tlabel = __( 'Box Control' ),\n\tvalues: valuesProp,\n\tunits,\n\tsides,\n\tsplitOnAxis = false,\n\tallowReset = true,\n\tresetValues = DEFAULT_VALUES,\n\tonMouseOver,\n\tonMouseOut,\n}: BoxControlProps ) {\n\tconst [ values, setValues ] = useControlledState( valuesProp, {\n\t\tfallback: DEFAULT_VALUES,\n\t} );\n\tconst inputValues = values || DEFAULT_VALUES;\n\tconst hasInitialValue = isValuesDefined( valuesProp );\n\tconst hasOneSide = sides?.length === 1;\n\n\tconst [ isDirty, setIsDirty ] = useState( hasInitialValue );\n\tconst [ isLinked, setIsLinked ] = useState(\n\t\t! hasInitialValue || ! isValuesMixed( inputValues ) || hasOneSide\n\t);\n\n\tconst [ side, setSide ] = useState< BoxControlIconProps[ 'side' ] >(\n\t\tgetInitialSide( isLinked, splitOnAxis )\n\t);\n\n\t// Tracking selected units via internal state allows filtering of CSS unit\n\t// only values from being saved while maintaining preexisting unit selection\n\t// behaviour. Filtering CSS only values prevents invalid style values.\n\tconst [ selectedUnits, setSelectedUnits ] = useState< BoxControlValue >( {\n\t\ttop: parseQuantityAndUnitFromRawValue( valuesProp?.top )[ 1 ],\n\t\tright: parseQuantityAndUnitFromRawValue( valuesProp?.right )[ 1 ],\n\t\tbottom: parseQuantityAndUnitFromRawValue( valuesProp?.bottom )[ 1 ],\n\t\tleft: parseQuantityAndUnitFromRawValue( valuesProp?.left )[ 1 ],\n\t} );\n\n\tconst id = useUniqueId( idProp );\n\tconst headingId = `${ id }-heading`;\n\n\tconst toggleLinked = () => {\n\t\tsetIsLinked( ! isLinked );\n\t\tsetSide( getInitialSide( ! isLinked, splitOnAxis ) );\n\t};\n\n\tconst handleOnFocus = (\n\t\t_event: React.FocusEvent< HTMLInputElement >,\n\t\t{ side: nextSide }: { side: typeof side }\n\t) => {\n\t\tsetSide( nextSide );\n\t};\n\n\tconst handleOnChange = ( nextValues: BoxControlValue ) => {\n\t\tonChange( nextValues );\n\t\tsetValues( nextValues );\n\t\tsetIsDirty( true );\n\t};\n\n\tconst handleOnReset = () => {\n\t\tonChange( resetValues );\n\t\tsetValues( resetValues );\n\t\tsetSelectedUnits( resetValues );\n\t\tsetIsDirty( false );\n\t};\n\n\tconst inputControlProps = {\n\t\t...inputProps,\n\t\tonChange: handleOnChange,\n\t\tonFocus: handleOnFocus,\n\t\tisLinked,\n\t\tunits,\n\t\tselectedUnits,\n\t\tsetSelectedUnits,\n\t\tsides,\n\t\tvalues: inputValues,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\t__next40pxDefaultSize,\n\t};\n\n\treturn (\n\t\t<Grid\n\t\t\tid={ id }\n\t\t\tcolumns={ 3 }\n\t\t\ttemplateColumns=\"1fr min-content min-content\"\n\t\t\trole=\"group\"\n\t\t\taria-labelledby={ headingId }\n\t\t>\n\t\t\t<BaseControl.VisualLabel id={ headingId }>\n\t\t\t\t{ label }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t{ isLinked && (\n\t\t\t\t<InputWrapper>\n\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t<AllInputControl { ...inputControlProps } />\n\t\t\t\t</InputWrapper>\n\t\t\t) }\n\t\t\t{ ! hasOneSide && (\n\t\t\t\t<LinkedButtonWrapper>\n\t\t\t\t\t<LinkedButton\n\t\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t/>\n\t\t\t\t</LinkedButtonWrapper>\n\t\t\t) }\n\n\t\t\t{ ! isLinked && splitOnAxis && (\n\t\t\t\t<AxialInputControls { ...inputControlProps } />\n\t\t\t) }\n\t\t\t{ ! isLinked && ! splitOnAxis && (\n\t\t\t\t<InputControls { ...inputControlProps } />\n\t\t\t) }\n\t\t\t{ allowReset && (\n\t\t\t\t<ResetButton\n\t\t\t\t\tclassName=\"component-box-control__reset-button\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t</ResetButton>\n\t\t\t) }\n\t\t</Grid>\n\t);\n}\n\nexport { applyValueToSides } from './utils';\nexport default BoxControl;\n"],"mappings":"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","ignoreList":[]}

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

@@ -9,9 +9,7 @@ import Tooltip from '../tooltip';
 import { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';
 import { ALL_SIDES, CUSTOM_VALUE_SETTINGS, LABELS } from './utils';
 import { FlexedBoxControlIcon, FlexedRangeControl, InputWrapper, StyledUnitControl } from './styles/box-control-styles';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const noop = () => {};
 export default function BoxInputControls({
   __next40pxDefaultSize,

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

@@ -1 +1 @@
-{"version":3,"names":["useInstanceId","Tooltip","parseQuantityAndUnitFromRawValue","ALL_SIDES","CUSTOM_VALUE_SETTINGS","LABELS","FlexedBoxControlIcon","FlexedRangeControl","InputWrapper","StyledUnitControl","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","noop","BoxInputControls","__next40pxDefaultSize","onChange","onFocus","values","selectedUnits","setSelectedUnits","sides","props","generatedId","createHandleOnFocus","side","event","handleOnChange","nextValues","handleOnValueChange","next","extra","isNumeric","undefined","isNaN","parseFloat","nextValue","altKey","bottom","top","right","left","createHandleOnUnitChange","newUnits","filteredSides","length","filter","includes","children","map","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","parsedQuantity","parsedUnit","computedUnit","inputId","join","expanded","placement","text","className","id","isPressEnterToChange","value","onUnitChange","label","hideLabelFromVision","__nextHasNoMarginBottom","newValue","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/input-controls.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport { ALL_SIDES, CUSTOM_VALUE_SETTINGS, LABELS } from './utils';\nimport {\n\tFlexedBoxControlIcon,\n\tFlexedRangeControl,\n\tInputWrapper,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport type { BoxControlInputControlProps, BoxControlValue } from './types';\n\nconst noop = () => {};\n\nexport default function BoxInputControls( {\n\t__next40pxDefaultSize,\n\tonChange = noop,\n\tonFocus = noop,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst generatedId = useInstanceId( BoxInputControls, 'box-control-input' );\n\n\tconst createHandleOnFocus =\n\t\t( side: keyof BoxControlValue ) =>\n\t\t( event: React.FocusEvent< HTMLInputElement > ) => {\n\t\t\tonFocus( event, { side } );\n\t\t};\n\n\tconst handleOnChange = ( nextValues: BoxControlValue ) => {\n\t\tonChange( nextValues );\n\t};\n\n\tconst handleOnValueChange = (\n\t\tside: keyof BoxControlValue,\n\t\tnext?: string,\n\t\textra?: { event: React.SyntheticEvent< Element, Event > }\n\t) => {\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tnextValues[ side ] = nextValue;\n\n\t\t/**\n\t\t * Supports changing pair sides. For example, holding the ALT key\n\t\t * when changing the TOP will also update BOTTOM.\n\t\t */\n\t\t// @ts-expect-error - TODO: event.altKey is only present when the change event was\n\t\t// triggered by a keyboard event. Should this feature be implemented differently so\n\t\t// it also works with drag events?\n\t\tif ( extra?.event.altKey ) {\n\t\t\tswitch ( side ) {\n\t\t\t\tcase 'top':\n\t\t\t\t\tnextValues.bottom = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'bottom':\n\t\t\t\t\tnextValues.top = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'left':\n\t\t\t\t\tnextValues.right = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'right':\n\t\t\t\t\tnextValues.left = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\thandleOnChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange =\n\t\t( side: keyof BoxControlValue ) => ( next?: string ) => {\n\t\t\tconst newUnits = { ...selectedUnits };\n\t\t\tnewUnits[ side ] = next;\n\t\t\tsetSelectedUnits( newUnits );\n\t\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? ALL_SIDES.filter( ( side ) => sides.includes( side ) )\n\t\t: ALL_SIDES;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredSides.map( ( side ) => {\n\t\t\t\tconst [ parsedQuantity, parsedUnit ] =\n\t\t\t\t\tparseQuantityAndUnitFromRawValue( values[ side ] );\n\n\t\t\t\tconst computedUnit = values[ side ]\n\t\t\t\t\t? parsedUnit\n\t\t\t\t\t: selectedUnits[ side ];\n\n\t\t\t\tconst inputId = [ generatedId, side ].join( '-' );\n\n\t\t\t\treturn (\n\t\t\t\t\t<InputWrapper key={ `box-control-${ side }` } expanded>\n\t\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t\t<Tooltip placement=\"top-end\" text={ LABELS[ side ] }>\n\t\t\t\t\t\t\t<StyledUnitControl\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\t\t\t\tid={ inputId }\n\t\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\t\tvalue={ [ parsedQuantity, computedUnit ].join(\n\t\t\t\t\t\t\t\t\t''\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ ( nextValue, extra ) =>\n\t\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\t\tnextValue,\n\t\t\t\t\t\t\t\t\t\textra\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange(\n\t\t\t\t\t\t\t\t\tside\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\n\t\t\t\t\t\t<FlexedRangeControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\taria-controls={ inputId }\n\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\tnewValue !== undefined\n\t\t\t\t\t\t\t\t\t\t? [ newValue, computedUnit ].join( '' )\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ computedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.max ?? 10\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ computedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputWrapper>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useInstanceId","Tooltip","parseQuantityAndUnitFromRawValue","ALL_SIDES","CUSTOM_VALUE_SETTINGS","LABELS","FlexedBoxControlIcon","FlexedRangeControl","InputWrapper","StyledUnitControl","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","noop","BoxInputControls","__next40pxDefaultSize","onChange","onFocus","values","selectedUnits","setSelectedUnits","sides","props","generatedId","createHandleOnFocus","side","event","handleOnChange","nextValues","handleOnValueChange","next","extra","isNumeric","undefined","isNaN","parseFloat","nextValue","altKey","bottom","top","right","left","createHandleOnUnitChange","newUnits","filteredSides","length","filter","includes","children","map","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","parsedQuantity","parsedUnit","computedUnit","inputId","join","expanded","placement","text","className","id","isPressEnterToChange","value","onUnitChange","label","hideLabelFromVision","__nextHasNoMarginBottom","newValue","min","max","step","withInputField"],"sources":["@wordpress/components/src/box-control/input-controls.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport { ALL_SIDES, CUSTOM_VALUE_SETTINGS, LABELS } from './utils';\nimport {\n\tFlexedBoxControlIcon,\n\tFlexedRangeControl,\n\tInputWrapper,\n\tStyledUnitControl,\n} from './styles/box-control-styles';\nimport type { BoxControlInputControlProps, BoxControlValue } from './types';\n\nconst noop = () => {};\n\nexport default function BoxInputControls( {\n\t__next40pxDefaultSize,\n\tonChange = noop,\n\tonFocus = noop,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n}: BoxControlInputControlProps ) {\n\tconst generatedId = useInstanceId( BoxInputControls, 'box-control-input' );\n\n\tconst createHandleOnFocus =\n\t\t( side: keyof BoxControlValue ) =>\n\t\t( event: React.FocusEvent< HTMLInputElement > ) => {\n\t\t\tonFocus( event, { side } );\n\t\t};\n\n\tconst handleOnChange = ( nextValues: BoxControlValue ) => {\n\t\tonChange( nextValues );\n\t};\n\n\tconst handleOnValueChange = (\n\t\tside: keyof BoxControlValue,\n\t\tnext?: string,\n\t\textra?: { event: React.SyntheticEvent< Element, Event > }\n\t) => {\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = next !== undefined && ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tnextValues[ side ] = nextValue;\n\n\t\t/**\n\t\t * Supports changing pair sides. For example, holding the ALT key\n\t\t * when changing the TOP will also update BOTTOM.\n\t\t */\n\t\t// @ts-expect-error - TODO: event.altKey is only present when the change event was\n\t\t// triggered by a keyboard event. Should this feature be implemented differently so\n\t\t// it also works with drag events?\n\t\tif ( extra?.event.altKey ) {\n\t\t\tswitch ( side ) {\n\t\t\t\tcase 'top':\n\t\t\t\t\tnextValues.bottom = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'bottom':\n\t\t\t\t\tnextValues.top = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'left':\n\t\t\t\t\tnextValues.right = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'right':\n\t\t\t\t\tnextValues.left = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\thandleOnChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange =\n\t\t( side: keyof BoxControlValue ) => ( next?: string ) => {\n\t\t\tconst newUnits = { ...selectedUnits };\n\t\t\tnewUnits[ side ] = next;\n\t\t\tsetSelectedUnits( newUnits );\n\t\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? ALL_SIDES.filter( ( side ) => sides.includes( side ) )\n\t\t: ALL_SIDES;\n\n\treturn (\n\t\t<>\n\t\t\t{ filteredSides.map( ( side ) => {\n\t\t\t\tconst [ parsedQuantity, parsedUnit ] =\n\t\t\t\t\tparseQuantityAndUnitFromRawValue( values[ side ] );\n\n\t\t\t\tconst computedUnit = values[ side ]\n\t\t\t\t\t? parsedUnit\n\t\t\t\t\t: selectedUnits[ side ];\n\n\t\t\t\tconst inputId = [ generatedId, side ].join( '-' );\n\n\t\t\t\treturn (\n\t\t\t\t\t<InputWrapper key={ `box-control-${ side }` } expanded>\n\t\t\t\t\t\t<FlexedBoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t\t\t<Tooltip placement=\"top-end\" text={ LABELS[ side ] }>\n\t\t\t\t\t\t\t<StyledUnitControl\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\t\t\t\tid={ inputId }\n\t\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\t\tvalue={ [ parsedQuantity, computedUnit ].join(\n\t\t\t\t\t\t\t\t\t''\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ ( nextValue, extra ) =>\n\t\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\t\tnextValue,\n\t\t\t\t\t\t\t\t\t\textra\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange(\n\t\t\t\t\t\t\t\t\tside\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\n\t\t\t\t\t\t<FlexedRangeControl\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t\t\taria-controls={ inputId }\n\t\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\t\thandleOnValueChange(\n\t\t\t\t\t\t\t\t\tside,\n\t\t\t\t\t\t\t\t\tnewValue !== undefined\n\t\t\t\t\t\t\t\t\t\t? [ newValue, computedUnit ].join( '' )\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ computedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.max ?? 10\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ computedUnit ?? 'px' ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ parsedQuantity ?? 0 }\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputWrapper>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/button/index.js

@@ -16,9 +16,7 @@ import Tooltip from '../tooltip';
 import Icon from '../icon';
 import { VisuallyHidden } from '../visually-hidden';
 import { positionToPlacement } from '../popover/utils';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const disabledEventsOnDisabledButton = ['onMouseDown', 'onClick'];
 function useDeprecatedProps({
   __experimentalIsFocusable,

package/build-module/button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","deprecated","forwardRef","useInstanceId","Tooltip","Icon","VisuallyHidden","positionToPlacement","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","disabledEventsOnDisabledButton","useDeprecatedProps","__experimentalIsFocusable","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","describedBy","otherProps","computedSize","computedVariant","newProps","accessibleWhenDisabled","description","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","since","alternative","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disableEventProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","element","tooltipProps","placement","id"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\t__experimentalIsFocusable,\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\tdescribedBy,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps = {\n\t\taccessibleWhenDisabled: __experimentalIsFocusable,\n\t\t// @todo Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t\tdescription: describedBy,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'wp.components.Button `isDefault` prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps & DeprecatedButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\taccessibleWhenDisabled,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\tdescription,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = clsx( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! accessibleWhenDisabled;\n\tconst Tag = href !== undefined && ! disabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t  }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tconst disableEventProps: {\n\t\t[ key: string ]: ( event: MouseEvent ) => void;\n\t} = {};\n\tif ( disabled && accessibleWhenDisabled ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tdisableEventProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && !! label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\t!! shortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = description ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ children }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// In order to avoid some React reconciliation issues, we are always rendering\n\t// the `Tooltip` component even when `shouldShowTooltip` is `false`.\n\t// In order to make sure that the tooltip doesn't show when it shouldn't,\n\t// we don't pass the props to the `Tooltip` component.\n\tconst tooltipProps = shouldShowTooltip\n\t\t? {\n\t\t\t\ttext:\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescription\n\t\t\t\t\t\t? description\n\t\t\t\t\t\t: label,\n\t\t\t\tshortcut,\n\t\t\t\tplacement:\n\t\t\t\t\ttooltipPosition &&\n\t\t\t\t\t// Convert legacy `position` values to be used with the new `placement` prop\n\t\t\t\t\tpositionToPlacement( tooltipPosition ),\n\t\t  }\n\t\t: {};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip { ...tooltipProps }>{ element }</Tooltip>\n\t\t\t{ description && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ description }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n *   <Button\n *     variant=\"primary\"\n *     onClick={ handleClick }\n *   >\n *     Click here\n *   </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","deprecated","forwardRef","useInstanceId","Tooltip","Icon","VisuallyHidden","positionToPlacement","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","disabledEventsOnDisabledButton","useDeprecatedProps","__experimentalIsFocusable","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","describedBy","otherProps","computedSize","computedVariant","newProps","accessibleWhenDisabled","description","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","since","alternative","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disableEventProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","element","tooltipProps","placement","id"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\t__experimentalIsFocusable,\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\tdescribedBy,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps = {\n\t\taccessibleWhenDisabled: __experimentalIsFocusable,\n\t\t// @todo Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t\tdescription: describedBy,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'wp.components.Button `isDefault` prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps & DeprecatedButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\taccessibleWhenDisabled,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\tdescription,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = clsx( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! accessibleWhenDisabled;\n\tconst Tag = href !== undefined && ! disabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t  }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tconst disableEventProps: {\n\t\t[ key: string ]: ( event: MouseEvent ) => void;\n\t} = {};\n\tif ( disabled && accessibleWhenDisabled ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tdisableEventProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && !! label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\t!! shortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = description ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ children }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...disableEventProps }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// In order to avoid some React reconciliation issues, we are always rendering\n\t// the `Tooltip` component even when `shouldShowTooltip` is `false`.\n\t// In order to make sure that the tooltip doesn't show when it shouldn't,\n\t// we don't pass the props to the `Tooltip` component.\n\tconst tooltipProps = shouldShowTooltip\n\t\t? {\n\t\t\t\ttext:\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescription\n\t\t\t\t\t\t? description\n\t\t\t\t\t\t: label,\n\t\t\t\tshortcut,\n\t\t\t\tplacement:\n\t\t\t\t\ttooltipPosition &&\n\t\t\t\t\t// Convert legacy `position` values to be used with the new `placement` prop\n\t\t\t\t\tpositionToPlacement( tooltipPosition ),\n\t\t  }\n\t\t: {};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip { ...tooltipProps }>{ element }</Tooltip>\n\t\t\t{ description && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ description }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n *   <Button\n *     variant=\"primary\"\n *     onClick={ handleClick }\n *   >\n *     Click here\n *   </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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","ignoreList":[]}

package/build-module/button/index.native.js

@@ -16,8 +16,7 @@ import { usePreferredColorScheme, usePreferredColorSchemeStyle } from '@wordpres
 import Tooltip from '../tooltip';
 import Icon from '../icon';
 import style from './style.scss';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const isAndroid = Platform.OS === 'android';
 const marginBottom = isAndroid ? -0.5 : 0;
 const marginLeft = -3;
@@ -132,7 +131,7 @@ export function Button(props) {
   !children || Array.isArray(children) && !children.length) &&
   // The tooltip is not explicitly disabled.
   false !== showTooltip);
-  const newIcon = icon ? cloneElement( /*#__PURE__*/_jsx(Icon, {
+  const newIcon = icon ? cloneElement(/*#__PURE__*/_jsx(Icon, {
     icon: icon,
     size: iconSize
   }), {