@wordpress/block-editor 9.7.0 → 9.8.1-next.957ca95e4c.0

package/build/components/spacing-sizes-control/linked-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/linked-button.js"],"names":["LinkedButton","isLinked","onClick","label","link","linkOff"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;AAKe,SAASA,YAAT,OAA+C;AAAA,MAAxB;AAAEC,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,GAAwB;AAC7D,QAAMC,KAAK,GAAGF,QAAQ,GAAG,cAAI,cAAJ,CAAH,GAA0B,cAAI,YAAJ,CAAhD;AAEA,SACC,4BAAC,mBAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAGF,QAAQ,GAAG,SAAH,GAAe,WADlC;AAEC,IAAA,OAAO,MAFR;AAGC,IAAA,IAAI,EAAGA,QAAQ,GAAGG,WAAH,GAAUC,cAH1B;AAIC,IAAA,QAAQ,EAAG,EAJZ;AAKC,kBAAaF,KALd;AAMC,IAAA,OAAO,EAAGD;AANX,IADD,CADD,CADD;AAcA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { Button, Tooltip } from '@wordpress/components';\n\nexport default function LinkedButton( { isLinked, onClick } ) {\n\tconst label = isLinked ? __( 'Unlink Sides' ) : __( 'Link Sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<span className=\"component-spacing-sizes-control__linked-button\">\n\t\t\t\t<Button\n\t\t\t\t\tvariant={ isLinked ? 'primary' : 'secondary' }\n\t\t\t\t\tisSmall\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 16 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Tooltip>\n\t);\n}\n"]}

package/build/components/spacing-sizes-control/spacing-input-control.js

@@ -0,0 +1,213 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = SpacingInputControl;
+
+var _element = require("@wordpress/element");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _data = require("@wordpress/data");
+
+var _components = require("@wordpress/components");
+
+var _i18n = require("@wordpress/i18n");
+
+var _icons = require("@wordpress/icons");
+
+var _useSetting = _interopRequireDefault(require("../use-setting"));
+
+var _store = require("../../store");
+
+var _utils = require("./utils");
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+function SpacingInputControl(_ref) {
+  var _spacingSizes$current;
+
+  let {
+    spacingSizes,
+    value,
+    side,
+    onChange,
+    isMixed = false,
+    type,
+    minimumCustomValue
+  } = _ref;
+  // Treat value as a preset value if the passed in value matches the value of one of the spacingSizes.
+  value = (0, _utils.getPresetValueFromCustomValue)(value, spacingSizes);
+  let selectListSizes = spacingSizes;
+  const showRangeControl = spacingSizes.length <= 8;
+  const disableCustomSpacingSizes = (0, _data.useSelect)(select => {
+    const editorSettings = select(_store.store).getSettings();
+    return editorSettings === null || editorSettings === void 0 ? void 0 : editorSettings.disableCustomSpacingSizes;
+  });
+  const [showCustomValueControl, setShowCustomValueControl] = (0, _element.useState)(!disableCustomSpacingSizes && value !== undefined && !(0, _utils.isValueSpacingPreset)(value));
+  const units = (0, _components.__experimentalUseCustomUnits)({
+    availableUnits: (0, _useSetting.default)('spacing.units') || ['px', 'em', 'rem']
+  });
+  let currentValue = null;
+  const showCustomValueInSelectList = !showRangeControl && !showCustomValueControl && value !== undefined && (!(0, _utils.isValueSpacingPreset)(value) || (0, _utils.isValueSpacingPreset)(value) && isMixed);
+
+  if (showCustomValueInSelectList) {
+    selectListSizes = [...spacingSizes, {
+      name: !isMixed ? // translators: A custom measurement, eg. a number followed by a unit like 12px.
+      (0, _i18n.sprintf)((0, _i18n.__)('Custom (%s)'), value) : (0, _i18n.__)('Mixed'),
+      slug: 'custom',
+      size: value
+    }];
+    currentValue = selectListSizes.length - 1;
+  } else if (!isMixed) {
+    currentValue = !showCustomValueControl ? (0, _utils.getSliderValueFromPreset)(value, spacingSizes) : (0, _utils.getCustomValueFromPreset)(value, spacingSizes);
+  }
+
+  const selectedUnit = (0, _element.useMemo)(() => (0, _components.__experimentalParseQuantityAndUnitFromRawValue)(currentValue), [currentValue])[1] || units[0].value;
+
+  const setInitialValue = () => {
+    if (value === undefined) {
+      onChange('0');
+    }
+  };
+
+  const customTooltipContent = newValue => {
+    var _spacingSizes$newValu;
+
+    return value === undefined ? undefined : (_spacingSizes$newValu = spacingSizes[newValue]) === null || _spacingSizes$newValu === void 0 ? void 0 : _spacingSizes$newValu.name;
+  };
+
+  const customRangeValue = parseInt(currentValue, 10);
+
+  const getNewCustomValue = newSize => {
+    const isNumeric = !isNaN(parseFloat(newSize));
+    const nextValue = isNumeric ? newSize : undefined;
+    return nextValue;
+  };
+
+  const getNewPresetValue = (newSize, controlType) => {
+    var _spacingSizes$newSize;
+
+    const size = parseInt(newSize, 10);
+
+    if (controlType === 'selectList') {
+      if (size === 0) {
+        return undefined;
+      }
+
+      if (size === 1) {
+        return '0';
+      }
+    } else if (size === 0) {
+      return '0';
+    }
+
+    return `var:preset|spacing|${(_spacingSizes$newSize = spacingSizes[newSize]) === null || _spacingSizes$newSize === void 0 ? void 0 : _spacingSizes$newSize.slug}`;
+  };
+
+  const handleCustomValueSliderChange = next => {
+    onChange([next, selectedUnit].join(''));
+  };
+
+  const allPlaceholder = isMixed ? (0, _i18n.__)('Mixed') : null;
+  const currentValueHint = !isMixed ? customTooltipContent(currentValue) : (0, _i18n.__)('Mixed');
+  const options = selectListSizes.map((size, index) => ({
+    key: index,
+    name: size.name
+  }));
+  const marks = spacingSizes.map((newValue, index) => ({
+    value: index,
+    label: undefined
+  }));
+  const ariaLabel = (0, _i18n.sprintf)( // translators: 1: The side of the block being modified (top, bottom, left, etc.). 2. Type of spacing being modified (Padding, margin, etc)
+  (0, _i18n.__)('%1$s %2$s'), _utils.LABELS[side], type === null || type === void 0 ? void 0 : type.toLowerCase());
+  const showHint = showRangeControl && !showCustomValueControl && currentValueHint !== undefined;
+  return (0, _element.createElement)(_element.Fragment, null, side !== 'all' && (0, _element.createElement)(_components.__experimentalHStack, {
+    className: "components-spacing-sizes-control__side-labels"
+  }, (0, _element.createElement)(_components.__experimentalText, {
+    className: "components-spacing-sizes-control__side-label"
+  }, _utils.LABELS[side]), showHint && (0, _element.createElement)(_components.__experimentalText, {
+    className: "components-spacing-sizes-control__hint-single"
+  }, currentValueHint)), side === 'all' && showHint && (0, _element.createElement)(_components.__experimentalText, {
+    className: "components-spacing-sizes-control__hint-all"
+  }, currentValueHint), !disableCustomSpacingSizes && (0, _element.createElement)(_components.Button, {
+    label: showCustomValueControl ? (0, _i18n.__)('Use size preset') : (0, _i18n.__)('Set custom size'),
+    icon: _icons.settings,
+    onClick: () => {
+      setShowCustomValueControl(!showCustomValueControl);
+    },
+    isPressed: showCustomValueControl,
+    isSmall: true,
+    className: (0, _classnames.default)({
+      'components-spacing-sizes-control__custom-toggle-all': side === 'all',
+      'components-spacing-sizes-control__custom-toggle-single': side !== 'all'
+    }),
+    iconSize: 24
+  }), showCustomValueControl && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.__experimentalUnitControl, {
+    onChange: newSize => onChange(getNewCustomValue(newSize)),
+    value: currentValue,
+    units: units,
+    min: minimumCustomValue,
+    placeholder: allPlaceholder,
+    disableUnits: isMixed,
+    label: ariaLabel,
+    hideLabelFromVision: true,
+    className: "components-spacing-sizes-control__custom-value-input",
+    style: {
+      gridColumn: '1'
+    }
+  }), (0, _element.createElement)(_components.RangeControl, {
+    value: customRangeValue,
+    min: 0,
+    max: 100,
+    withInputField: false,
+    onChange: handleCustomValueSliderChange,
+    className: "components-spacing-sizes-control__custom-value-range"
+  })), showRangeControl && !showCustomValueControl && (0, _element.createElement)(_components.RangeControl, {
+    className: "components-spacing-sizes-control__range-control",
+    value: currentValue,
+    onChange: newSize => onChange(getNewPresetValue(newSize)),
+    onMouseDown: event => {
+      var _event$nativeEvent;
+
+      // If mouse down is near start of range set initial value to 0, which
+      // prevents the user have to drag right then left to get 0 setting.
+      if ((event === null || event === void 0 ? void 0 : (_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : _event$nativeEvent.offsetX) < 35) {
+        setInitialValue();
+      }
+    },
+    withInputField: false,
+    "aria-valuenow": currentValue,
+    "aria-valuetext": (_spacingSizes$current = spacingSizes[currentValue]) === null || _spacingSizes$current === void 0 ? void 0 : _spacingSizes$current.name,
+    renderTooltipContent: customTooltipContent,
+    min: 0,
+    max: spacingSizes.length - 1,
+    marks: marks,
+    label: ariaLabel,
+    hideLabelFromVision: true
+  }), !showRangeControl && !showCustomValueControl && (0, _element.createElement)(_components.CustomSelectControl, {
+    className: "components-spacing-sizes-control__custom-select-control",
+    value: options.find(option => option.key === currentValue) || '' // passing undefined here causes a downshift controlled/uncontrolled warning
+    ,
+    onChange: selection => {
+      onChange(getNewPresetValue(selection.selectedItem.key, 'selectList'));
+    },
+    options: options,
+    label: ariaLabel,
+    hideLabelFromVision: true,
+    __nextUnconstrainedWidth: true
+  }));
+}
+//# sourceMappingURL=spacing-input-control.js.map

package/build/components/spacing-sizes-control/spacing-input-control.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/spacing-input-control.js"],"names":["SpacingInputControl","spacingSizes","value","side","onChange","isMixed","type","minimumCustomValue","selectListSizes","showRangeControl","length","disableCustomSpacingSizes","select","editorSettings","blockEditorStore","getSettings","showCustomValueControl","setShowCustomValueControl","undefined","units","availableUnits","currentValue","showCustomValueInSelectList","name","slug","size","selectedUnit","setInitialValue","customTooltipContent","newValue","customRangeValue","parseInt","getNewCustomValue","newSize","isNumeric","isNaN","parseFloat","nextValue","getNewPresetValue","controlType","handleCustomValueSliderChange","next","join","allPlaceholder","currentValueHint","options","map","index","key","marks","label","ariaLabel","LABELS","toLowerCase","showHint","settings","gridColumn","event","nativeEvent","offsetX","find","option","selection","selectedItem"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tButton,\n\tRangeControl,\n\tCustomSelectControl,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\nimport { store as blockEditorStore } from '../../store';\nimport {\n\tLABELS,\n\tgetSliderValueFromPreset,\n\tgetCustomValueFromPreset,\n\tgetPresetValueFromCustomValue,\n\tisValueSpacingPreset,\n} from './utils';\n\nexport default function SpacingInputControl( {\n\tspacingSizes,\n\tvalue,\n\tside,\n\tonChange,\n\tisMixed = false,\n\ttype,\n\tminimumCustomValue,\n} ) {\n\t// Treat value as a preset value if the passed in value matches the value of one of the spacingSizes.\n\tvalue = getPresetValueFromCustomValue( value, spacingSizes );\n\n\tlet selectListSizes = spacingSizes;\n\tconst showRangeControl = spacingSizes.length <= 8;\n\n\tconst disableCustomSpacingSizes = useSelect( ( select ) => {\n\t\tconst editorSettings = select( blockEditorStore ).getSettings();\n\t\treturn editorSettings?.disableCustomSpacingSizes;\n\t} );\n\n\tconst [ showCustomValueControl, setShowCustomValueControl ] = useState(\n\t\t! disableCustomSpacingSizes &&\n\t\t\tvalue !== undefined &&\n\t\t\t! isValueSpacingPreset( value )\n\t);\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [ 'px', 'em', 'rem' ],\n\t} );\n\n\tlet currentValue = null;\n\n\tconst showCustomValueInSelectList =\n\t\t! showRangeControl &&\n\t\t! showCustomValueControl &&\n\t\tvalue !== undefined &&\n\t\t( ! isValueSpacingPreset( value ) ||\n\t\t\t( isValueSpacingPreset( value ) && isMixed ) );\n\n\tif ( showCustomValueInSelectList ) {\n\t\tselectListSizes = [\n\t\t\t...spacingSizes,\n\t\t\t{\n\t\t\t\tname: ! isMixed\n\t\t\t\t\t? // translators: A custom measurement, eg. a number followed by a unit like 12px.\n\t\t\t\t\t  sprintf( __( 'Custom (%s)' ), value )\n\t\t\t\t\t: __( 'Mixed' ),\n\t\t\t\tslug: 'custom',\n\t\t\t\tsize: value,\n\t\t\t},\n\t\t];\n\t\tcurrentValue = selectListSizes.length - 1;\n\t} else if ( ! isMixed ) {\n\t\tcurrentValue = ! showCustomValueControl\n\t\t\t? getSliderValueFromPreset( value, spacingSizes )\n\t\t\t: getCustomValueFromPreset( value, spacingSizes );\n\t}\n\n\tconst selectedUnit =\n\t\tuseMemo(\n\t\t\t() => parseQuantityAndUnitFromRawValue( currentValue ),\n\t\t\t[ currentValue ]\n\t\t)[ 1 ] || units[ 0 ].value;\n\n\tconst setInitialValue = () => {\n\t\tif ( value === undefined ) {\n\t\t\tonChange( '0' );\n\t\t}\n\t};\n\n\tconst customTooltipContent = ( newValue ) =>\n\t\tvalue === undefined ? undefined : spacingSizes[ newValue ]?.name;\n\n\tconst customRangeValue = parseInt( currentValue, 10 );\n\n\tconst getNewCustomValue = ( newSize ) => {\n\t\tconst isNumeric = ! isNaN( parseFloat( newSize ) );\n\t\tconst nextValue = isNumeric ? newSize : undefined;\n\t\treturn nextValue;\n\t};\n\n\tconst getNewPresetValue = ( newSize, controlType ) => {\n\t\tconst size = parseInt( newSize, 10 );\n\n\t\tif ( controlType === 'selectList' ) {\n\t\t\tif ( size === 0 ) {\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tif ( size === 1 ) {\n\t\t\t\treturn '0';\n\t\t\t}\n\t\t} else if ( size === 0 ) {\n\t\t\treturn '0';\n\t\t}\n\t\treturn `var:preset|spacing|${ spacingSizes[ newSize ]?.slug }`;\n\t};\n\n\tconst handleCustomValueSliderChange = ( next ) => {\n\t\tonChange( [ next, selectedUnit ].join( '' ) );\n\t};\n\n\tconst allPlaceholder = isMixed ? __( 'Mixed' ) : null;\n\n\tconst currentValueHint = ! isMixed\n\t\t? customTooltipContent( currentValue )\n\t\t: __( 'Mixed' );\n\n\tconst options = selectListSizes.map( ( size, index ) => ( {\n\t\tkey: index,\n\t\tname: size.name,\n\t} ) );\n\n\tconst marks = spacingSizes.map( ( newValue, index ) => ( {\n\t\tvalue: index,\n\t\tlabel: undefined,\n\t} ) );\n\n\tconst ariaLabel = sprintf(\n\t\t// translators: 1: The side of the block being modified (top, bottom, left, etc.). 2. Type of spacing being modified (Padding, margin, etc)\n\t\t__( '%1$s %2$s' ),\n\t\tLABELS[ side ],\n\t\ttype?.toLowerCase()\n\t);\n\n\tconst showHint =\n\t\tshowRangeControl &&\n\t\t! showCustomValueControl &&\n\t\tcurrentValueHint !== undefined;\n\n\treturn (\n\t\t<>\n\t\t\t{ side !== 'all' && (\n\t\t\t\t<HStack className=\"components-spacing-sizes-control__side-labels\">\n\t\t\t\t\t<Text className=\"components-spacing-sizes-control__side-label\">\n\t\t\t\t\t\t{ LABELS[ side ] }\n\t\t\t\t\t</Text>\n\n\t\t\t\t\t{ showHint && (\n\t\t\t\t\t\t<Text className=\"components-spacing-sizes-control__hint-single\">\n\t\t\t\t\t\t\t{ currentValueHint }\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ side === 'all' && showHint && (\n\t\t\t\t<Text className=\"components-spacing-sizes-control__hint-all\">\n\t\t\t\t\t{ currentValueHint }\n\t\t\t\t</Text>\n\t\t\t) }\n\n\t\t\t{ ! disableCustomSpacingSizes && (\n\t\t\t\t<Button\n\t\t\t\t\tlabel={\n\t\t\t\t\t\tshowCustomValueControl\n\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t}\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetShowCustomValueControl( ! showCustomValueControl );\n\t\t\t\t\t} }\n\t\t\t\t\tisPressed={ showCustomValueControl }\n\t\t\t\t\tisSmall\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'components-spacing-sizes-control__custom-toggle-all':\n\t\t\t\t\t\t\tside === 'all',\n\t\t\t\t\t\t'components-spacing-sizes-control__custom-toggle-single':\n\t\t\t\t\t\t\tside !== 'all',\n\t\t\t\t\t} ) }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showCustomValueControl && (\n\t\t\t\t<>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tonChange={ ( newSize ) =>\n\t\t\t\t\t\t\tonChange( getNewCustomValue( newSize ) )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ currentValue }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tmin={ minimumCustomValue }\n\t\t\t\t\t\tplaceholder={ allPlaceholder }\n\t\t\t\t\t\tdisableUnits={ isMixed }\n\t\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-value-input\"\n\t\t\t\t\t\tstyle={ { gridColumn: '1' } }\n\t\t\t\t\t/>\n\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tonChange={ handleCustomValueSliderChange }\n\t\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-value-range\"\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ showRangeControl && ! showCustomValueControl && (\n\t\t\t\t<RangeControl\n\t\t\t\t\tclassName=\"components-spacing-sizes-control__range-control\"\n\t\t\t\t\tvalue={ currentValue }\n\t\t\t\t\tonChange={ ( newSize ) =>\n\t\t\t\t\t\tonChange( getNewPresetValue( newSize ) )\n\t\t\t\t\t}\n\t\t\t\t\tonMouseDown={ ( event ) => {\n\t\t\t\t\t\t// If mouse down is near start of range set initial value to 0, which\n\t\t\t\t\t\t// prevents the user have to drag right then left to get 0 setting.\n\t\t\t\t\t\tif ( event?.nativeEvent?.offsetX < 35 ) {\n\t\t\t\t\t\t\tsetInitialValue();\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\twithInputField={ false }\n\t\t\t\t\taria-valuenow={ currentValue }\n\t\t\t\t\taria-valuetext={ spacingSizes[ currentValue ]?.name }\n\t\t\t\t\trenderTooltipContent={ customTooltipContent }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tmax={ spacingSizes.length - 1 }\n\t\t\t\t\tmarks={ marks }\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! showRangeControl && ! showCustomValueControl && (\n\t\t\t\t<CustomSelectControl\n\t\t\t\t\tclassName=\"components-spacing-sizes-control__custom-select-control\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\toptions.find(\n\t\t\t\t\t\t\t( option ) => option.key === currentValue\n\t\t\t\t\t\t) || '' // passing undefined here causes a downshift controlled/uncontrolled warning\n\t\t\t\t\t}\n\t\t\t\t\tonChange={ ( selection ) => {\n\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\tgetNewPresetValue(\n\t\t\t\t\t\t\t\tselection.selectedItem.key,\n\t\t\t\t\t\t\t\t'selectList'\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t\toptions={ options }\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\t__nextUnconstrainedWidth={ true }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}

package/build/components/spacing-sizes-control/utils.js

@@ -0,0 +1,233 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LABELS = exports.DEFAULT_VALUES = exports.ALL_SIDES = void 0;
+exports.getAllRawValue = getAllRawValue;
+exports.getCustomValueFromPreset = getCustomValueFromPreset;
+exports.getPresetValueFromCustomValue = getPresetValueFromCustomValue;
+exports.getSliderValueFromPreset = getSliderValueFromPreset;
+exports.getSpacingPresetCssVar = getSpacingPresetCssVar;
+exports.getSpacingPresetSlug = getSpacingPresetSlug;
+exports.isValueSpacingPreset = isValueSpacingPreset;
+exports.isValuesDefined = isValuesDefined;
+exports.isValuesMixed = isValuesMixed;
+
+var _lodash = require("lodash");
+
+var _i18n = require("@wordpress/i18n");
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Checks is given value is a spacing preset.
+ *
+ * @param {string} value Value to check
+ *
+ * @return {boolean} Return true if value is string in format var:preset|spacing|.
+ */
+function isValueSpacingPreset(value) {
+  if (!(value !== null && value !== void 0 && value.includes)) {
+    return false;
+  }
+
+  return value === '0' || value.includes('var:preset|spacing|');
+}
+/**
+ * Converts a spacing preset into a custom value.
+ *
+ * @param {string} value        Value to convert
+ * @param {Array}  spacingSizes Array of the current spacing preset objects
+ *
+ * @return {string} Mapping of the spacing preset to its equivalent custom value.
+ */
+
+
+function getCustomValueFromPreset(value, spacingSizes) {
+  if (!isValueSpacingPreset(value)) {
+    return value;
+  }
+
+  const slug = getSpacingPresetSlug(value);
+  const spacingSize = spacingSizes.find(size => String(size.slug) === slug);
+  return spacingSize === null || spacingSize === void 0 ? void 0 : spacingSize.size;
+}
+/**
+ * Converts a custom value to preset value if one can be found.
+ *
+ * Returns value as-is if no match is found.
+ *
+ * @param {string} value        Value to convert
+ * @param {Array}  spacingSizes Array of the current spacing preset objects
+ *
+ * @return {string} The preset value if it can be found.
+ */
+
+
+function getPresetValueFromCustomValue(value, spacingSizes) {
+  // Return value as-is if it is already a preset;
+  if (isValueSpacingPreset(value)) {
+    return value;
+  }
+
+  const spacingMatch = spacingSizes.find(size => String(size.size) === String(value));
+
+  if (spacingMatch !== null && spacingMatch !== void 0 && spacingMatch.slug) {
+    return `var:preset|spacing|${spacingMatch.slug}`;
+  }
+
+  return value;
+}
+/**
+ * Converts a spacing preset into a custom value.
+ *
+ * @param {string} value Value to convert.
+ *
+ * @return {string} CSS var string for given spacing preset value.
+ */
+
+
+function getSpacingPresetCssVar(value) {
+  if (!value) {
+    return;
+  }
+
+  const slug = value.match(/var:preset\|spacing\|(.+)/);
+
+  if (!slug) {
+    return value;
+  }
+
+  return `var(--wp--preset--spacing--${slug[1]})`;
+}
+/**
+ * Returns the slug section of the given spacing preset string.
+ *
+ * @param {string} value Value to extract slug from.
+ *
+ * @return {number} The int value of the slug from given spacing preset.
+ */
+
+
+function getSpacingPresetSlug(value) {
+  if (!value) {
+    return;
+  }
+
+  if (value === '0' || value === 'default') {
+    return value;
+  }
+
+  const slug = value.match(/var:preset\|spacing\|(.+)/);
+  return slug ? slug[1] : undefined;
+}
+/**
+ * Converts spacing preset value into a Range component value .
+ *
+ * @param {string} presetValue  Value to convert to Range value.
+ * @param {Array}  spacingSizes Array of current spacing preset value objects.
+ *
+ * @return {number} The int value for use in Range control.
+ */
+
+
+function getSliderValueFromPreset(presetValue, spacingSizes) {
+  if (presetValue === undefined) {
+    return 0;
+  }
+
+  const slug = parseFloat(presetValue, 10) === 0 ? '0' : getSpacingPresetSlug(presetValue);
+  const sliderValue = spacingSizes.findIndex(spacingSize => {
+    return String(spacingSize.slug) === slug;
+  }); // Returning NaN rather than undefined as undefined makes range control thumb sit in center
+
+  return sliderValue !== -1 ? sliderValue : NaN;
+}
+
+const LABELS = {
+  all: (0, _i18n.__)('All sides'),
+  top: (0, _i18n.__)('Top'),
+  bottom: (0, _i18n.__)('Bottom'),
+  left: (0, _i18n.__)('Left'),
+  right: (0, _i18n.__)('Right'),
+  mixed: (0, _i18n.__)('Mixed'),
+  vertical: (0, _i18n.__)('Vertical'),
+  horizontal: (0, _i18n.__)('Horizontal')
+};
+exports.LABELS = LABELS;
+const DEFAULT_VALUES = {
+  top: undefined,
+  right: undefined,
+  bottom: undefined,
+  left: undefined
+};
+exports.DEFAULT_VALUES = DEFAULT_VALUES;
+const ALL_SIDES = ['top', 'right', 'bottom', 'left'];
+/**
+ * Gets an items with the most occurrence within an array
+ * https://stackoverflow.com/a/20762713
+ *
+ * @param {Array<any>} arr Array of items to check.
+ * @return {any} The item with the most occurrences.
+ */
+
+exports.ALL_SIDES = ALL_SIDES;
+
+function mode(arr) {
+  return arr.sort((a, b) => arr.filter(v => v === a).length - arr.filter(v => v === b).length).pop();
+}
+/**
+ * Gets the 'all' input value from values data.
+ *
+ * @param {Object} values Box spacing values
+ *
+ * @return {string} The most common value from all sides of box.
+ */
+
+
+function getAllRawValue() {
+  let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return mode(Object.values(values));
+}
+/**
+ * Checks to determine if values are mixed.
+ *
+ * @param {Object} values Box values.
+ * @param {Array}  sides  Sides that values relate to.
+ *
+ * @return {boolean} Whether values are mixed.
+ */
+
+
+function isValuesMixed() {
+  let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let sides = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ALL_SIDES;
+  return Object.values(values).length >= 1 && Object.values(values).length < sides.length || new Set(Object.values(values)).size > 1;
+}
+/**
+ * Checks to determine if values are defined.
+ *
+ * @param {Object} values Box values.
+ *
+ * @return {boolean} Whether values are defined.
+ */
+
+
+function isValuesDefined(values) {
+  if (values === undefined || values === null) {
+    return false;
+  }
+
+  return !(0, _lodash.isEmpty)(Object.values(values).filter( // Switching units when input is empty causes values only
+  // containing units. This gives false positive on mixed values
+  // unless filtered.
+  value => !!value && /\d/.test(value)));
+}
+//# sourceMappingURL=utils.js.map

package/build/components/spacing-sizes-control/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/utils.js"],"names":["isValueSpacingPreset","value","includes","getCustomValueFromPreset","spacingSizes","slug","getSpacingPresetSlug","spacingSize","find","size","String","getPresetValueFromCustomValue","spacingMatch","getSpacingPresetCssVar","match","undefined","getSliderValueFromPreset","presetValue","parseFloat","sliderValue","findIndex","NaN","LABELS","all","top","bottom","left","right","mixed","vertical","horizontal","DEFAULT_VALUES","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllRawValue","values","Object","isValuesMixed","sides","Set","isValuesDefined","test"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Checks is given value is a spacing preset.\n *\n * @param {string} value Value to check\n *\n * @return {boolean} Return true if value is string in format var:preset|spacing|.\n */\nexport function isValueSpacingPreset( value ) {\n\tif ( ! value?.includes ) {\n\t\treturn false;\n\t}\n\treturn value === '0' || value.includes( 'var:preset|spacing|' );\n}\n\n/**\n * Converts a spacing preset into a custom value.\n *\n * @param {string} value        Value to convert\n * @param {Array}  spacingSizes Array of the current spacing preset objects\n *\n * @return {string} Mapping of the spacing preset to its equivalent custom value.\n */\nexport function getCustomValueFromPreset( value, spacingSizes ) {\n\tif ( ! isValueSpacingPreset( value ) ) {\n\t\treturn value;\n\t}\n\n\tconst slug = getSpacingPresetSlug( value );\n\tconst spacingSize = spacingSizes.find(\n\t\t( size ) => String( size.slug ) === slug\n\t);\n\n\treturn spacingSize?.size;\n}\n\n/**\n * Converts a custom value to preset value if one can be found.\n *\n * Returns value as-is if no match is found.\n *\n * @param {string} value        Value to convert\n * @param {Array}  spacingSizes Array of the current spacing preset objects\n *\n * @return {string} The preset value if it can be found.\n */\nexport function getPresetValueFromCustomValue( value, spacingSizes ) {\n\t// Return value as-is if it is already a preset;\n\tif ( isValueSpacingPreset( value ) ) {\n\t\treturn value;\n\t}\n\n\tconst spacingMatch = spacingSizes.find(\n\t\t( size ) => String( size.size ) === String( value )\n\t);\n\n\tif ( spacingMatch?.slug ) {\n\t\treturn `var:preset|spacing|${ spacingMatch.slug }`;\n\t}\n\n\treturn value;\n}\n\n/**\n * Converts a spacing preset into a custom value.\n *\n * @param {string} value Value to convert.\n *\n * @return {string} CSS var string for given spacing preset value.\n */\nexport function getSpacingPresetCssVar( value ) {\n\tif ( ! value ) {\n\t\treturn;\n\t}\n\n\tconst slug = value.match( /var:preset\\|spacing\\|(.+)/ );\n\n\tif ( ! slug ) {\n\t\treturn value;\n\t}\n\n\treturn `var(--wp--preset--spacing--${ slug[ 1 ] })`;\n}\n\n/**\n * Returns the slug section of the given spacing preset string.\n *\n * @param {string} value Value to extract slug from.\n *\n * @return {number} The int value of the slug from given spacing preset.\n */\nexport function getSpacingPresetSlug( value ) {\n\tif ( ! value ) {\n\t\treturn;\n\t}\n\n\tif ( value === '0' || value === 'default' ) {\n\t\treturn value;\n\t}\n\n\tconst slug = value.match( /var:preset\\|spacing\\|(.+)/ );\n\n\treturn slug ? slug[ 1 ] : undefined;\n}\n\n/**\n * Converts spacing preset value into a Range component value .\n *\n * @param {string} presetValue  Value to convert to Range value.\n * @param {Array}  spacingSizes Array of current spacing preset value objects.\n *\n * @return {number} The int value for use in Range control.\n */\nexport function getSliderValueFromPreset( presetValue, spacingSizes ) {\n\tif ( presetValue === undefined ) {\n\t\treturn 0;\n\t}\n\tconst slug =\n\t\tparseFloat( presetValue, 10 ) === 0\n\t\t\t? '0'\n\t\t\t: getSpacingPresetSlug( presetValue );\n\tconst sliderValue = spacingSizes.findIndex( ( spacingSize ) => {\n\t\treturn String( spacingSize.slug ) === slug;\n\t} );\n\n\t// Returning NaN rather than undefined as undefined makes range control thumb sit in center\n\treturn sliderValue !== -1 ? sliderValue : NaN;\n}\n\nexport const LABELS = {\n\tall: __( 'All sides' ),\n\ttop: __( 'Top' ),\n\tbottom: __( 'Bottom' ),\n\tleft: __( 'Left' ),\n\tright: __( 'Right' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Vertical' ),\n\thorizontal: __( 'Horizontal' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param {Array<any>} arr Array of items to check.\n * @return {any} The item with the most occurrences.\n */\nfunction mode( arr ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value from values data.\n *\n * @param {Object} values Box spacing values\n *\n * @return {string} The most common value from all sides of box.\n */\nexport function getAllRawValue( values = {} ) {\n\treturn mode( Object.values( values ) );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param {Object} values Box values.\n * @param {Array}  sides  Sides that values relate to.\n *\n * @return {boolean} Whether values are mixed.\n */\nexport function isValuesMixed( values = {}, sides = ALL_SIDES ) {\n\treturn (\n\t\t( Object.values( values ).length >= 1 &&\n\t\t\tObject.values( values ).length < sides.length ) ||\n\t\tnew Set( Object.values( values ) ).size > 1\n\t);\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param {Object} values Box values.\n *\n * @return {boolean} Whether values are defined.\n */\nexport function isValuesDefined( values ) {\n\tif ( values === undefined || values === null ) {\n\t\treturn false;\n\t}\n\treturn ! isEmpty(\n\t\tObject.values( values ).filter(\n\t\t\t// Switching units when input is empty causes values only\n\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t// unless filtered.\n\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t)\n\t);\n}\n"]}

package/build/components/text-decoration-control/index.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -7,12 +9,20 @@ exports.default = TextDecorationControl;
 
 var _element = require("@wordpress/element");
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
 var _components = require("@wordpress/components");
 
 var _icons = require("@wordpress/icons");
 
 var _i18n = require("@wordpress/i18n");
 
+/**
+ * External dependencies
+ */
+
 /**
  * WordPress dependencies
  */
@@ -28,9 +38,10 @@ const TEXT_DECORATIONS = [{
 /**
  * Control to facilitate text decoration selections.
  *
- * @param {Object}   props          Component props.
- * @param {string}   props.value    Currently selected text decoration.
- * @param {Function} props.onChange Handles change in text decoration selection.
+ * @param {Object}   props             Component props.
+ * @param {string}   props.value       Currently selected text decoration.
+ * @param {Function} props.onChange    Handles change in text decoration selection.
+ * @param {string}   [props.className] Additional class name to apply.
  *
  * @return {WPElement} Text decoration control.
  */
@@ -38,23 +49,23 @@ const TEXT_DECORATIONS = [{
 function TextDecorationControl(_ref) {
   let {
     value,
-    onChange
+    onChange,
+    className,
+    ...props
   } = _ref;
-  return (0, _element.createElement)("fieldset", {
-    className: "block-editor-text-decoration-control"
-  }, (0, _element.createElement)(_components.BaseControl.VisualLabel, {
-    as: "legend"
-  }, (0, _i18n.__)('Decoration')), (0, _element.createElement)("div", {
-    className: "block-editor-text-decoration-control__buttons"
-  }, TEXT_DECORATIONS.map(textDecoration => {
-    return (0, _element.createElement)(_components.Button, {
+  return (0, _element.createElement)(_components.__experimentalToggleGroupControl, (0, _extends2.default)({}, props, {
+    className: (0, _classnames.default)('block-editor-text-decoration-control', className),
+    __experimentalIsIconGroup: true,
+    label: (0, _i18n.__)('Decoration'),
+    value: value,
+    onChange: onChange
+  }), TEXT_DECORATIONS.map(textDecoration => {
+    return (0, _element.createElement)(_components.__experimentalToggleGroupControlOptionIcon, {
       key: textDecoration.value,
+      value: textDecoration.value,
       icon: textDecoration.icon,
-      isSmall: true,
-      isPressed: textDecoration.value === value,
-      onClick: () => onChange(textDecoration.value === value ? undefined : textDecoration.value),
-      "aria-label": textDecoration.name
+      label: textDecoration.name
     });
-  })));
+  }));
 }
 //# sourceMappingURL=index.js.map

package/build/components/text-decoration-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/text-decoration-control/index.js"],"names":["TEXT_DECORATIONS","name","value","icon","formatUnderline","formatStrikethrough","TextDecorationControl","onChange","map","textDecoration","undefined"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;AAKA,MAAMA,gBAAgB,GAAG,CACxB;AACCC,EAAAA,IAAI,EAAE,cAAI,WAAJ,CADP;AAECC,EAAAA,KAAK,EAAE,WAFR;AAGCC,EAAAA,IAAI,EAAEC;AAHP,CADwB,EAMxB;AACCH,EAAAA,IAAI,EAAE,cAAI,eAAJ,CADP;AAECC,EAAAA,KAAK,EAAE,cAFR;AAGCC,EAAAA,IAAI,EAAEE;AAHP,CANwB,CAAzB;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACe,SAASC,qBAAT,OAAsD;AAAA,MAAtB;AAAEJ,IAAAA,KAAF;AAASK,IAAAA;AAAT,GAAsB;AACpE,SACC;AAAU,IAAA,SAAS,EAAC;AAApB,KACC,4BAAC,uBAAD,CAAa,WAAb;AAAyB,IAAA,EAAE,EAAC;AAA5B,KACG,cAAI,YAAJ,CADH,CADD,EAIC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGP,gBAAgB,CAACQ,GAAjB,CAAwBC,cAAF,IAAsB;AAC7C,WACC,4BAAC,kBAAD;AACC,MAAA,GAAG,EAAGA,cAAc,CAACP,KADtB;AAEC,MAAA,IAAI,EAAGO,cAAc,CAACN,IAFvB;AAGC,MAAA,OAAO,MAHR;AAIC,MAAA,SAAS,EAAGM,cAAc,CAACP,KAAf,KAAyBA,KAJtC;AAKC,MAAA,OAAO,EAAG,MACTK,QAAQ,CACPE,cAAc,CAACP,KAAf,KAAyBA,KAAzB,GACGQ,SADH,GAEGD,cAAc,CAACP,KAHX,CANV;AAYC,oBAAaO,cAAc,CAACR;AAZ7B,MADD;AAgBA,GAjBC,CADH,CAJD,CADD;AA2BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { BaseControl, Button } from '@wordpress/components';\nimport { formatStrikethrough, formatUnderline } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\nconst TEXT_DECORATIONS = [\n\t{\n\t\tname: __( 'Underline' ),\n\t\tvalue: 'underline',\n\t\ticon: formatUnderline,\n\t},\n\t{\n\t\tname: __( 'Strikethrough' ),\n\t\tvalue: 'line-through',\n\t\ticon: formatStrikethrough,\n\t},\n];\n\n/**\n * Control to facilitate text decoration selections.\n *\n * @param {Object}   props          Component props.\n * @param {string}   props.value    Currently selected text decoration.\n * @param {Function} props.onChange Handles change in text decoration selection.\n *\n * @return {WPElement} Text decoration control.\n */\nexport default function TextDecorationControl( { value, onChange } ) {\n\treturn (\n\t\t<fieldset className=\"block-editor-text-decoration-control\">\n\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t{ __( 'Decoration' ) }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<div className=\"block-editor-text-decoration-control__buttons\">\n\t\t\t\t{ TEXT_DECORATIONS.map( ( textDecoration ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ textDecoration.value }\n\t\t\t\t\t\t\ticon={ textDecoration.icon }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\tisPressed={ textDecoration.value === value }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\ttextDecoration.value === value\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: textDecoration.value\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-label={ textDecoration.name }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</div>\n\t\t</fieldset>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/text-decoration-control/index.js"],"names":["TEXT_DECORATIONS","name","value","icon","formatUnderline","formatStrikethrough","TextDecorationControl","onChange","className","props","map","textDecoration"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAIA;;AACA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;AAQA,MAAMA,gBAAgB,GAAG,CACxB;AACCC,EAAAA,IAAI,EAAE,cAAI,WAAJ,CADP;AAECC,EAAAA,KAAK,EAAE,WAFR;AAGCC,EAAAA,IAAI,EAAEC;AAHP,CADwB,EAMxB;AACCH,EAAAA,IAAI,EAAE,cAAI,eAAJ,CADP;AAECC,EAAAA,KAAK,EAAE,cAFR;AAGCC,EAAAA,IAAI,EAAEE;AAHP,CANwB,CAAzB;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACe,SAASC,qBAAT,OAKX;AAAA,MAL2C;AAC9CJ,IAAAA,KAD8C;AAE9CK,IAAAA,QAF8C;AAG9CC,IAAAA,SAH8C;AAI9C,OAAGC;AAJ2C,GAK3C;AACH,SACC,4BAAC,4CAAD,6BACMA,KADN;AAEC,IAAA,SAAS,EAAG,yBACX,sCADW,EAEXD,SAFW,CAFb;AAMC,IAAA,yBAAyB,MAN1B;AAOC,IAAA,KAAK,EAAG,cAAI,YAAJ,CAPT;AAQC,IAAA,KAAK,EAAGN,KART;AASC,IAAA,QAAQ,EAAGK;AATZ,MAWGP,gBAAgB,CAACU,GAAjB,CAAwBC,cAAF,IAAsB;AAC7C,WACC,4BAAC,sDAAD;AACC,MAAA,GAAG,EAAGA,cAAc,CAACT,KADtB;AAEC,MAAA,KAAK,EAAGS,cAAc,CAACT,KAFxB;AAGC,MAAA,IAAI,EAAGS,cAAc,CAACR,IAHvB;AAIC,MAAA,KAAK,EAAGQ,cAAc,CAACV;AAJxB,MADD;AAQA,GATC,CAXH,CADD;AAwBA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n} from '@wordpress/components';\nimport { formatStrikethrough, formatUnderline } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\nconst TEXT_DECORATIONS = [\n\t{\n\t\tname: __( 'Underline' ),\n\t\tvalue: 'underline',\n\t\ticon: formatUnderline,\n\t},\n\t{\n\t\tname: __( 'Strikethrough' ),\n\t\tvalue: 'line-through',\n\t\ticon: formatStrikethrough,\n\t},\n];\n\n/**\n * Control to facilitate text decoration selections.\n *\n * @param {Object}   props             Component props.\n * @param {string}   props.value       Currently selected text decoration.\n * @param {Function} props.onChange    Handles change in text decoration selection.\n * @param {string}   [props.className] Additional class name to apply.\n *\n * @return {WPElement} Text decoration control.\n */\nexport default function TextDecorationControl( {\n\tvalue,\n\tonChange,\n\tclassName,\n\t...props\n} ) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-text-decoration-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\t__experimentalIsIconGroup\n\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t>\n\t\t\t{ TEXT_DECORATIONS.map( ( textDecoration ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ textDecoration.value }\n\t\t\t\t\t\tvalue={ textDecoration.value }\n\t\t\t\t\t\ticon={ textDecoration.icon }\n\t\t\t\t\t\tlabel={ textDecoration.name }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n"]}