@wordpress/block-editor 13.4.0 → 14.1.0

package/build-module/components/multi-selection-inspector/index.js

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { sprintf, _n } from '@wordpress/i18n';
-import { withSelect } from '@wordpress/data';
+import { useSelect } from '@wordpress/data';
 import { serialize } from '@wordpress/blocks';
 import { count as wordCount } from '@wordpress/wordcount';
 import { copy } from '@wordpress/icons';
@@ -14,9 +14,17 @@ import BlockIcon from '../block-icon';
 import { store as blockEditorStore } from '../../store';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-function MultiSelectionInspector({
-  blocks
-}) {
+export default function MultiSelectionInspector() {
+  const {
+    blocks
+  } = useSelect(select => {
+    const {
+      getMultiSelectedBlocks
+    } = select(blockEditorStore);
+    return {
+      blocks: getMultiSelectedBlocks()
+    };
+  }, []);
   const words = wordCount(serialize(blocks), 'words');
   return /*#__PURE__*/_jsxs("div", {
     className: "block-editor-multi-selection-inspector__card",
@@ -37,12 +45,4 @@ function MultiSelectionInspector({
     })]
   });
 }
-export default withSelect(select => {
-  const {
-    getMultiSelectedBlocks
-  } = select(blockEditorStore);
-  return {
-    blocks: getMultiSelectedBlocks()
-  };
-})(MultiSelectionInspector);
 //# sourceMappingURL=index.js.map

package/build-module/components/multi-selection-inspector/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["sprintf","_n","withSelect","serialize","count","wordCount","copy","BlockIcon","store","blockEditorStore","jsx","_jsx","jsxs","_jsxs","MultiSelectionInspector","blocks","words","className","children","icon","showColors","length","select","getMultiSelectedBlocks"],"sources":["@wordpress/block-editor/src/components/multi-selection-inspector/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { sprintf, _n } from '@wordpress/i18n';\nimport { withSelect } from '@wordpress/data';\nimport { serialize } from '@wordpress/blocks';\nimport { count as wordCount } from '@wordpress/wordcount';\nimport { copy } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BlockIcon from '../block-icon';\nimport { store as blockEditorStore } from '../../store';\n\nfunction MultiSelectionInspector( { blocks } ) {\n\tconst words = wordCount( serialize( blocks ), 'words' );\n\n\treturn (\n\t\t<div className=\"block-editor-multi-selection-inspector__card\">\n\t\t\t<BlockIcon icon={ copy } showColors />\n\t\t\t<div className=\"block-editor-multi-selection-inspector__card-content\">\n\t\t\t\t<div className=\"block-editor-multi-selection-inspector__card-title\">\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t/* translators: %d: number of blocks */\n\t\t\t\t\t\t_n( '%d Block', '%d Blocks', blocks.length ),\n\t\t\t\t\t\tblocks.length\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-multi-selection-inspector__card-description\">\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t/* translators: %d: number of words */\n\t\t\t\t\t\t_n( '%d word selected.', '%d words selected.', words ),\n\t\t\t\t\t\twords\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nexport default withSelect( ( select ) => {\n\tconst { getMultiSelectedBlocks } = select( blockEditorStore );\n\treturn {\n\t\tblocks: getMultiSelectedBlocks(),\n\t};\n} )( MultiSelectionInspector );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,EAAEC,EAAE,QAAQ,iBAAiB;AAC7C,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,SAAS,QAAQ,mBAAmB;AAC7C,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;AACzD,SAASC,IAAI,QAAQ,kBAAkB;;AAEvC;AACA;AACA;AACA,OAAOC,SAAS,MAAM,eAAe;AACrC,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAExD,SAASC,uBAAuBA,CAAE;EAAEC;AAAO,CAAC,EAAG;EAC9C,MAAMC,KAAK,GAAGX,SAAS,CAAEF,SAAS,CAAEY,MAAO,CAAC,EAAE,OAAQ,CAAC;EAEvD,oBACCF,KAAA;IAAKI,SAAS,EAAC,8CAA8C;IAAAC,QAAA,gBAC5DP,IAAA,CAACJ,SAAS;MAACY,IAAI,EAAGb,IAAM;MAACc,UAAU;IAAA,CAAE,CAAC,eACtCP,KAAA;MAAKI,SAAS,EAAC,sDAAsD;MAAAC,QAAA,gBACpEP,IAAA;QAAKM,SAAS,EAAC,oDAAoD;QAAAC,QAAA,EAChElB,OAAO,EACR;QACAC,EAAE,CAAE,UAAU,EAAE,WAAW,EAAEc,MAAM,CAACM,MAAO,CAAC,EAC5CN,MAAM,CAACM,MACR;MAAC,CACG,CAAC,eACNV,IAAA;QAAKM,SAAS,EAAC,0DAA0D;QAAAC,QAAA,EACtElB,OAAO,EACR;QACAC,EAAE,CAAE,mBAAmB,EAAE,oBAAoB,EAAEe,KAAM,CAAC,EACtDA,KACD;MAAC,CACG,CAAC;IAAA,CACF,CAAC;EAAA,CACF,CAAC;AAER;AAEA,eAAed,UAAU,CAAIoB,MAAM,IAAM;EACxC,MAAM;IAAEC;EAAuB,CAAC,GAAGD,MAAM,CAAEb,gBAAiB,CAAC;EAC7D,OAAO;IACNM,MAAM,EAAEQ,sBAAsB,CAAC;EAChC,CAAC;AACF,CAAE,CAAC,CAAET,uBAAwB,CAAC","ignoreList":[]}
+{"version":3,"names":["sprintf","_n","useSelect","serialize","count","wordCount","copy","BlockIcon","store","blockEditorStore","jsx","_jsx","jsxs","_jsxs","MultiSelectionInspector","blocks","select","getMultiSelectedBlocks","words","className","children","icon","showColors","length"],"sources":["@wordpress/block-editor/src/components/multi-selection-inspector/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { sprintf, _n } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { serialize } from '@wordpress/blocks';\nimport { count as wordCount } from '@wordpress/wordcount';\nimport { copy } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BlockIcon from '../block-icon';\nimport { store as blockEditorStore } from '../../store';\n\nexport default function MultiSelectionInspector() {\n\tconst { blocks } = useSelect( ( select ) => {\n\t\tconst { getMultiSelectedBlocks } = select( blockEditorStore );\n\t\treturn {\n\t\t\tblocks: getMultiSelectedBlocks(),\n\t\t};\n\t}, [] );\n\tconst words = wordCount( serialize( blocks ), 'words' );\n\n\treturn (\n\t\t<div className=\"block-editor-multi-selection-inspector__card\">\n\t\t\t<BlockIcon icon={ copy } showColors />\n\t\t\t<div className=\"block-editor-multi-selection-inspector__card-content\">\n\t\t\t\t<div className=\"block-editor-multi-selection-inspector__card-title\">\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t/* translators: %d: number of blocks */\n\t\t\t\t\t\t_n( '%d Block', '%d Blocks', blocks.length ),\n\t\t\t\t\t\tblocks.length\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-multi-selection-inspector__card-description\">\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t/* translators: %d: number of words */\n\t\t\t\t\t\t_n( '%d word selected.', '%d words selected.', words ),\n\t\t\t\t\t\twords\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,EAAEC,EAAE,QAAQ,iBAAiB;AAC7C,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,SAAS,QAAQ,mBAAmB;AAC7C,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;AACzD,SAASC,IAAI,QAAQ,kBAAkB;;AAEvC;AACA;AACA;AACA,OAAOC,SAAS,MAAM,eAAe;AACrC,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAExD,eAAe,SAASC,uBAAuBA,CAAA,EAAG;EACjD,MAAM;IAAEC;EAAO,CAAC,GAAGb,SAAS,CAAIc,MAAM,IAAM;IAC3C,MAAM;MAAEC;IAAuB,CAAC,GAAGD,MAAM,CAAEP,gBAAiB,CAAC;IAC7D,OAAO;MACNM,MAAM,EAAEE,sBAAsB,CAAC;IAChC,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EACP,MAAMC,KAAK,GAAGb,SAAS,CAAEF,SAAS,CAAEY,MAAO,CAAC,EAAE,OAAQ,CAAC;EAEvD,oBACCF,KAAA;IAAKM,SAAS,EAAC,8CAA8C;IAAAC,QAAA,gBAC5DT,IAAA,CAACJ,SAAS;MAACc,IAAI,EAAGf,IAAM;MAACgB,UAAU;IAAA,CAAE,CAAC,eACtCT,KAAA;MAAKM,SAAS,EAAC,sDAAsD;MAAAC,QAAA,gBACpET,IAAA;QAAKQ,SAAS,EAAC,oDAAoD;QAAAC,QAAA,EAChEpB,OAAO,EACR;QACAC,EAAE,CAAE,UAAU,EAAE,WAAW,EAAEc,MAAM,CAACQ,MAAO,CAAC,EAC5CR,MAAM,CAACQ,MACR;MAAC,CACG,CAAC,eACNZ,IAAA;QAAKQ,SAAS,EAAC,0DAA0D;QAAAC,QAAA,EACtEpB,OAAO,EACR;QACAC,EAAE,CAAE,mBAAmB,EAAE,oBAAoB,EAAEiB,KAAM,CAAC,EACtDA,KACD;MAAC,CACG,CAAC;IAAA,CACF,CAAC;EAAA,CACF,CAAC;AAER","ignoreList":[]}

package/build-module/components/resolution-tool/index.js

@@ -33,6 +33,7 @@ export default function ResolutionTool({
     isShownByDefault: isShownByDefault,
     panelId: panelId,
     children: /*#__PURE__*/_jsx(SelectControl, {
+      __nextHasNoMarginBottom: true,
       label: __('Resolution'),
       value: displayValue,
       options: options,

package/build-module/components/resolution-tool/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["SelectControl","__experimentalToolsPanelItem","ToolsPanelItem","__","_x","jsx","_jsx","DEFAULT_SIZE_OPTIONS","label","value","ResolutionTool","panelId","onChange","options","defaultValue","isShownByDefault","displayValue","hasValue","onDeselect","children","help","size"],"sources":["@wordpress/block-editor/src/components/resolution-tool/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tSelectControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\n\nconst DEFAULT_SIZE_OPTIONS = [\n\t{\n\t\tlabel: _x( 'Thumbnail', 'Image size option for resolution control' ),\n\t\tvalue: 'thumbnail',\n\t},\n\t{\n\t\tlabel: _x( 'Medium', 'Image size option for resolution control' ),\n\t\tvalue: 'medium',\n\t},\n\t{\n\t\tlabel: _x( 'Large', 'Image size option for resolution control' ),\n\t\tvalue: 'large',\n\t},\n\t{\n\t\tlabel: _x( 'Full Size', 'Image size option for resolution control' ),\n\t\tvalue: 'full',\n\t},\n];\n\nexport default function ResolutionTool( {\n\tpanelId,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_SIZE_OPTIONS,\n\tdefaultValue = DEFAULT_SIZE_OPTIONS[ 0 ].value,\n\tisShownByDefault = true,\n} ) {\n\tconst displayValue = value ?? defaultValue;\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => displayValue !== defaultValue }\n\t\t\tlabel={ __( 'Resolution' ) }\n\t\t\tonDeselect={ () => onChange( defaultValue ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<SelectControl\n\t\t\t\tlabel={ __( 'Resolution' ) }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\toptions={ options }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thelp={ __( 'Select the size of the source image.' ) }\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t/>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SACCA,aAAa,EACbC,4BAA4B,IAAIC,cAAc,QACxC,uBAAuB;AAC9B,SAASC,EAAE,EAAEC,EAAE,QAAQ,iBAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEzC,MAAMC,oBAAoB,GAAG,CAC5B;EACCC,KAAK,EAAEJ,EAAE,CAAE,WAAW,EAAE,0CAA2C,CAAC;EACpEK,KAAK,EAAE;AACR,CAAC,EACD;EACCD,KAAK,EAAEJ,EAAE,CAAE,QAAQ,EAAE,0CAA2C,CAAC;EACjEK,KAAK,EAAE;AACR,CAAC,EACD;EACCD,KAAK,EAAEJ,EAAE,CAAE,OAAO,EAAE,0CAA2C,CAAC;EAChEK,KAAK,EAAE;AACR,CAAC,EACD;EACCD,KAAK,EAAEJ,EAAE,CAAE,WAAW,EAAE,0CAA2C,CAAC;EACpEK,KAAK,EAAE;AACR,CAAC,CACD;AAED,eAAe,SAASC,cAAcA,CAAE;EACvCC,OAAO;EACPF,KAAK;EACLG,QAAQ;EACRC,OAAO,GAAGN,oBAAoB;EAC9BO,YAAY,GAAGP,oBAAoB,CAAE,CAAC,CAAE,CAACE,KAAK;EAC9CM,gBAAgB,GAAG;AACpB,CAAC,EAAG;EACH,MAAMC,YAAY,GAAGP,KAAK,aAALA,KAAK,cAALA,KAAK,GAAIK,YAAY;EAC1C,oBACCR,IAAA,CAACJ,cAAc;IACde,QAAQ,EAAGA,CAAA,KAAMD,YAAY,KAAKF,YAAc;IAChDN,KAAK,EAAGL,EAAE,CAAE,YAAa,CAAG;IAC5Be,UAAU,EAAGA,CAAA,KAAMN,QAAQ,CAAEE,YAAa,CAAG;IAC7CC,gBAAgB,EAAGA,gBAAkB;IACrCJ,OAAO,EAAGA,OAAS;IAAAQ,QAAA,eAEnBb,IAAA,CAACN,aAAa;MACbQ,KAAK,EAAGL,EAAE,CAAE,YAAa,CAAG;MAC5BM,KAAK,EAAGO,YAAc;MACtBH,OAAO,EAAGA,OAAS;MACnBD,QAAQ,EAAGA,QAAU;MACrBQ,IAAI,EAAGjB,EAAE,CAAE,sCAAuC,CAAG;MACrDkB,IAAI,EAAC;IAAkB,CACvB;EAAC,CACa,CAAC;AAEnB","ignoreList":[]}
+{"version":3,"names":["SelectControl","__experimentalToolsPanelItem","ToolsPanelItem","__","_x","jsx","_jsx","DEFAULT_SIZE_OPTIONS","label","value","ResolutionTool","panelId","onChange","options","defaultValue","isShownByDefault","displayValue","hasValue","onDeselect","children","__nextHasNoMarginBottom","help","size"],"sources":["@wordpress/block-editor/src/components/resolution-tool/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tSelectControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\n\nconst DEFAULT_SIZE_OPTIONS = [\n\t{\n\t\tlabel: _x( 'Thumbnail', 'Image size option for resolution control' ),\n\t\tvalue: 'thumbnail',\n\t},\n\t{\n\t\tlabel: _x( 'Medium', 'Image size option for resolution control' ),\n\t\tvalue: 'medium',\n\t},\n\t{\n\t\tlabel: _x( 'Large', 'Image size option for resolution control' ),\n\t\tvalue: 'large',\n\t},\n\t{\n\t\tlabel: _x( 'Full Size', 'Image size option for resolution control' ),\n\t\tvalue: 'full',\n\t},\n];\n\nexport default function ResolutionTool( {\n\tpanelId,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_SIZE_OPTIONS,\n\tdefaultValue = DEFAULT_SIZE_OPTIONS[ 0 ].value,\n\tisShownByDefault = true,\n} ) {\n\tconst displayValue = value ?? defaultValue;\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => displayValue !== defaultValue }\n\t\t\tlabel={ __( 'Resolution' ) }\n\t\t\tonDeselect={ () => onChange( defaultValue ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<SelectControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tlabel={ __( 'Resolution' ) }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\toptions={ options }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thelp={ __( 'Select the size of the source image.' ) }\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t/>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SACCA,aAAa,EACbC,4BAA4B,IAAIC,cAAc,QACxC,uBAAuB;AAC9B,SAASC,EAAE,EAAEC,EAAE,QAAQ,iBAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEzC,MAAMC,oBAAoB,GAAG,CAC5B;EACCC,KAAK,EAAEJ,EAAE,CAAE,WAAW,EAAE,0CAA2C,CAAC;EACpEK,KAAK,EAAE;AACR,CAAC,EACD;EACCD,KAAK,EAAEJ,EAAE,CAAE,QAAQ,EAAE,0CAA2C,CAAC;EACjEK,KAAK,EAAE;AACR,CAAC,EACD;EACCD,KAAK,EAAEJ,EAAE,CAAE,OAAO,EAAE,0CAA2C,CAAC;EAChEK,KAAK,EAAE;AACR,CAAC,EACD;EACCD,KAAK,EAAEJ,EAAE,CAAE,WAAW,EAAE,0CAA2C,CAAC;EACpEK,KAAK,EAAE;AACR,CAAC,CACD;AAED,eAAe,SAASC,cAAcA,CAAE;EACvCC,OAAO;EACPF,KAAK;EACLG,QAAQ;EACRC,OAAO,GAAGN,oBAAoB;EAC9BO,YAAY,GAAGP,oBAAoB,CAAE,CAAC,CAAE,CAACE,KAAK;EAC9CM,gBAAgB,GAAG;AACpB,CAAC,EAAG;EACH,MAAMC,YAAY,GAAGP,KAAK,aAALA,KAAK,cAALA,KAAK,GAAIK,YAAY;EAC1C,oBACCR,IAAA,CAACJ,cAAc;IACde,QAAQ,EAAGA,CAAA,KAAMD,YAAY,KAAKF,YAAc;IAChDN,KAAK,EAAGL,EAAE,CAAE,YAAa,CAAG;IAC5Be,UAAU,EAAGA,CAAA,KAAMN,QAAQ,CAAEE,YAAa,CAAG;IAC7CC,gBAAgB,EAAGA,gBAAkB;IACrCJ,OAAO,EAAGA,OAAS;IAAAQ,QAAA,eAEnBb,IAAA,CAACN,aAAa;MACboB,uBAAuB;MACvBZ,KAAK,EAAGL,EAAE,CAAE,YAAa,CAAG;MAC5BM,KAAK,EAAGO,YAAc;MACtBH,OAAO,EAAGA,OAAS;MACnBD,QAAQ,EAAGA,QAAU;MACrBS,IAAI,EAAGlB,EAAE,CAAE,sCAAuC,CAAG;MACrDmB,IAAI,EAAC;IAAkB,CACvB;EAAC,CACa,CAAC;AAEnB","ignoreList":[]}

package/build-module/components/skip-to-selected-block/index.js

@@ -4,12 +4,13 @@
 import { useSelect } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { Button } from '@wordpress/components';
+import { useRef } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { store as blockEditorStore } from '../../store';
-import { __unstableUseBlockRef as useBlockRef } from '../block-list/use-block-props/use-block-refs';
+import { useBlockElementRef } from '../block-list/use-block-props/use-block-refs';
 
 /**
  * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/skip-to-selected-block/README.md
@@ -17,9 +18,10 @@ import { __unstableUseBlockRef as useBlockRef } from '../block-list/use-block-pr
 import { jsx as _jsx } from "react/jsx-runtime";
 export default function SkipToSelectedBlock() {
   const selectedBlockClientId = useSelect(select => select(blockEditorStore).getBlockSelectionStart(), []);
-  const ref = useBlockRef(selectedBlockClientId);
+  const ref = useRef();
+  useBlockElementRef(selectedBlockClientId, ref);
   const onClick = () => {
-    ref.current.focus();
+    ref.current?.focus();
   };
   return selectedBlockClientId ? /*#__PURE__*/_jsx(Button, {
     variant: "secondary",

package/build-module/components/skip-to-selected-block/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["useSelect","__","Button","store","blockEditorStore","__unstableUseBlockRef","useBlockRef","jsx","_jsx","SkipToSelectedBlock","selectedBlockClientId","select","getBlockSelectionStart","ref","onClick","current","focus","variant","className","children"],"sources":["@wordpress/block-editor/src/components/skip-to-selected-block/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { __unstableUseBlockRef as useBlockRef } from '../block-list/use-block-props/use-block-refs';\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/skip-to-selected-block/README.md\n */\nexport default function SkipToSelectedBlock() {\n\tconst selectedBlockClientId = useSelect(\n\t\t( select ) => select( blockEditorStore ).getBlockSelectionStart(),\n\t\t[]\n\t);\n\tconst ref = useBlockRef( selectedBlockClientId );\n\tconst onClick = () => {\n\t\tref.current.focus();\n\t};\n\n\treturn selectedBlockClientId ? (\n\t\t<Button\n\t\t\tvariant=\"secondary\"\n\t\t\tclassName=\"block-editor-skip-to-selected-block\"\n\t\t\tonClick={ onClick }\n\t\t>\n\t\t\t{ __( 'Skip to the selected block' ) }\n\t\t</Button>\n\t) : null;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,MAAM,QAAQ,uBAAuB;;AAE9C;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,SAASC,qBAAqB,IAAIC,WAAW,QAAQ,8CAA8C;;AAEnG;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAGA,eAAe,SAASC,mBAAmBA,CAAA,EAAG;EAC7C,MAAMC,qBAAqB,GAAGV,SAAS,CACpCW,MAAM,IAAMA,MAAM,CAAEP,gBAAiB,CAAC,CAACQ,sBAAsB,CAAC,CAAC,EACjE,EACD,CAAC;EACD,MAAMC,GAAG,GAAGP,WAAW,CAAEI,qBAAsB,CAAC;EAChD,MAAMI,OAAO,GAAGA,CAAA,KAAM;IACrBD,GAAG,CAACE,OAAO,CAACC,KAAK,CAAC,CAAC;EACpB,CAAC;EAED,OAAON,qBAAqB,gBAC3BF,IAAA,CAACN,MAAM;IACNe,OAAO,EAAC,WAAW;IACnBC,SAAS,EAAC,qCAAqC;IAC/CJ,OAAO,EAAGA,OAAS;IAAAK,QAAA,EAEjBlB,EAAE,CAAE,4BAA6B;EAAC,CAC7B,CAAC,GACN,IAAI;AACT","ignoreList":[]}
+{"version":3,"names":["useSelect","__","Button","useRef","store","blockEditorStore","useBlockElementRef","jsx","_jsx","SkipToSelectedBlock","selectedBlockClientId","select","getBlockSelectionStart","ref","onClick","current","focus","variant","className","children"],"sources":["@wordpress/block-editor/src/components/skip-to-selected-block/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { useBlockElementRef } from '../block-list/use-block-props/use-block-refs';\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/skip-to-selected-block/README.md\n */\nexport default function SkipToSelectedBlock() {\n\tconst selectedBlockClientId = useSelect(\n\t\t( select ) => select( blockEditorStore ).getBlockSelectionStart(),\n\t\t[]\n\t);\n\tconst ref = useRef();\n\tuseBlockElementRef( selectedBlockClientId, ref );\n\tconst onClick = () => {\n\t\tref.current?.focus();\n\t};\n\n\treturn selectedBlockClientId ? (\n\t\t<Button\n\t\t\tvariant=\"secondary\"\n\t\t\tclassName=\"block-editor-skip-to-selected-block\"\n\t\t\tonClick={ onClick }\n\t\t>\n\t\t\t{ __( 'Skip to the selected block' ) }\n\t\t</Button>\n\t) : null;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,SAASC,kBAAkB,QAAQ,8CAA8C;;AAEjF;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAGA,eAAe,SAASC,mBAAmBA,CAAA,EAAG;EAC7C,MAAMC,qBAAqB,GAAGV,SAAS,CACpCW,MAAM,IAAMA,MAAM,CAAEN,gBAAiB,CAAC,CAACO,sBAAsB,CAAC,CAAC,EACjE,EACD,CAAC;EACD,MAAMC,GAAG,GAAGV,MAAM,CAAC,CAAC;EACpBG,kBAAkB,CAAEI,qBAAqB,EAAEG,GAAI,CAAC;EAChD,MAAMC,OAAO,GAAGA,CAAA,KAAM;IACrBD,GAAG,CAACE,OAAO,EAAEC,KAAK,CAAC,CAAC;EACrB,CAAC;EAED,OAAON,qBAAqB,gBAC3BF,IAAA,CAACN,MAAM;IACNe,OAAO,EAAC,WAAW;IACnBC,SAAS,EAAC,qCAAqC;IAC/CJ,OAAO,EAAGA,OAAS;IAAAK,QAAA,EAEjBlB,EAAE,CAAE,4BAA6B;EAAC,CAC7B,CAAC,GACN,IAAI;AACT","ignoreList":[]}

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

@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { Button, Icon, RangeControl, __experimentalHStack as HStack, __experimentalUnitControl as UnitControl, __experimentalUseCustomUnits as useCustomUnits, __experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue, privateApis as componentsPrivateApis } from '@wordpress/components';
+import { Button, Icon, RangeControl, __experimentalHStack as HStack, __experimentalUnitControl as UnitControl, __experimentalUseCustomUnits as useCustomUnits, __experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue, CustomSelectControl } from '@wordpress/components';
 import { useSelect } from '@wordpress/data';
 import { useState, useMemo } from '@wordpress/element';
 import { usePrevious } from '@wordpress/compose';
@@ -14,13 +14,9 @@ import { settings } from '@wordpress/icons';
 import { useSettings } from '../../use-settings';
 import { store as blockEditorStore } from '../../../store';
 import { RANGE_CONTROL_MAX_SIZE, ALL_SIDES, LABELS, getSliderValueFromPreset, getCustomValueFromPreset, getPresetValueFromCustomValue, isValueSpacingPreset } from '../utils';
-import { unlock } from '../../../lock-unlock';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-const {
-  CustomSelectControlV2Legacy: CustomSelectControl
-} = unlock(componentsPrivateApis);
 const CUSTOM_VALUE_SETTINGS = {
   px: {
     max: 300,
@@ -216,8 +212,8 @@ export default function SpacingInputControl({
     key: index,
     name: size.name
   }));
-  const marks = spacingSizes.map((_newValue, index) => ({
-    value: index,
+  const marks = spacingSizes.slice(1, spacingSizes.length - 1).map((_newValue, index) => ({
+    value: index + 1,
     label: undefined
   }));
   const sideLabel = ALL_SIDES.includes(side) && showSideInLabel ? LABELS[side] : '';
@@ -261,6 +257,7 @@ export default function SpacingInputControl({
           setMinValue(minimumCustomValue);
         }
       }), /*#__PURE__*/_jsx(RangeControl, {
+        __next40pxDefaultSize: true,
         onMouseOver: onMouseOver,
         onMouseOut: onMouseOut,
         onFocus: onMouseOver,
@@ -272,9 +269,12 @@ export default function SpacingInputControl({
         withInputField: false,
         onChange: handleCustomValueSliderChange,
         className: "spacing-sizes-control__custom-value-range",
-        __nextHasNoMarginBottom: true
+        __nextHasNoMarginBottom: true,
+        label: ariaLabel,
+        hideLabelFromVision: true
       })]
     }), showRangeControl && !showCustomValueControl && /*#__PURE__*/_jsx(RangeControl, {
+      __next40pxDefaultSize: true,
       onMouseOver: onMouseOver,
       onMouseOut: onMouseOut,
       className: "spacing-sizes-control__range-control",

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

@@ -1 +1 @@
-{"version":3,"names":["Button","Icon","RangeControl","__experimentalHStack","HStack","__experimentalUnitControl","UnitControl","__experimentalUseCustomUnits","useCustomUnits","__experimentalParseQuantityAndUnitFromRawValue","parseQuantityAndUnitFromRawValue","privateApis","componentsPrivateApis","useSelect","useState","useMemo","usePrevious","__","sprintf","settings","useSettings","store","blockEditorStore","RANGE_CONTROL_MAX_SIZE","ALL_SIDES","LABELS","getSliderValueFromPreset","getCustomValueFromPreset","getPresetValueFromCustomValue","isValueSpacingPreset","unlock","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","CustomSelectControlV2Legacy","CustomSelectControl","CUSTOM_VALUE_SETTINGS","px","max","steps","vw","vh","em","rm","svw","lvw","dvw","svh","lvh","dvh","vi","svi","lvi","dvi","vb","svb","lvb","dvb","vmin","svmin","lvmin","dvmin","vmax","svmax","lvmax","dvmax","SpacingInputControl","icon","isMixed","minimumCustomValue","onChange","onMouseOut","onMouseOver","showSideInLabel","side","spacingSizes","type","value","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","selectListSizes","showRangeControl","length","disableCustomSpacingSizes","select","editorSettings","getSettings","showCustomValueControl","setShowCustomValueControl","undefined","minValue","setMinValue","previousValue","availableUnits","units","currentValue","showCustomValueInSelectList","name","slug","size","selectedUnit","setInitialValue","customTooltipContent","newValue","customRangeValue","parseFloat","getNewCustomValue","newSize","isNumeric","isNaN","nextValue","getNewPresetValue","controlType","parseInt","handleCustomValueSliderChange","next","join","allPlaceholder","options","map","index","key","marks","_newValue","label","sideLabel","includes","typeLabel","toLowerCase","ariaLabel","trim","className","children","onFocus","onBlur","min","placeholder","disableUnits","hideLabelFromVision","onDragStart","charAt","onDrag","onDragEnd","step","withInputField","__nextHasNoMarginBottom","onMouseDown","event","nativeEvent","offsetX","renderTooltipContent","find","option","selection","selectedItem","onClick","isPressed","iconSize"],"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/input-controls/spacing-input-control.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\tRangeControl,\n\t__experimentalHStack as HStack,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useMemo } from '@wordpress/element';\nimport { usePrevious } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../../use-settings';\nimport { store as blockEditorStore } from '../../../store';\nimport {\n\tRANGE_CONTROL_MAX_SIZE,\n\tALL_SIDES,\n\tLABELS,\n\tgetSliderValueFromPreset,\n\tgetCustomValueFromPreset,\n\tgetPresetValueFromCustomValue,\n\tisValueSpacingPreset,\n} from '../utils';\nimport { unlock } from '../../../lock-unlock';\n\nconst { CustomSelectControlV2Legacy: CustomSelectControl } = unlock(\n\tcomponentsPrivateApis\n);\n\nconst CUSTOM_VALUE_SETTINGS = {\n\tpx: { max: 300, steps: 1 },\n\t'%': { max: 100, steps: 1 },\n\tvw: { max: 100, steps: 1 },\n\tvh: { max: 100, steps: 1 },\n\tem: { max: 10, steps: 0.1 },\n\trm: { max: 10, steps: 0.1 },\n\tsvw: { max: 100, steps: 1 },\n\tlvw: { max: 100, steps: 1 },\n\tdvw: { max: 100, steps: 1 },\n\tsvh: { max: 100, steps: 1 },\n\tlvh: { max: 100, steps: 1 },\n\tdvh: { max: 100, steps: 1 },\n\tvi: { max: 100, steps: 1 },\n\tsvi: { max: 100, steps: 1 },\n\tlvi: { max: 100, steps: 1 },\n\tdvi: { max: 100, steps: 1 },\n\tvb: { max: 100, steps: 1 },\n\tsvb: { max: 100, steps: 1 },\n\tlvb: { max: 100, steps: 1 },\n\tdvb: { max: 100, steps: 1 },\n\tvmin: { max: 100, steps: 1 },\n\tsvmin: { max: 100, steps: 1 },\n\tlvmin: { max: 100, steps: 1 },\n\tdvmin: { max: 100, steps: 1 },\n\tvmax: { max: 100, steps: 1 },\n\tsvmax: { max: 100, steps: 1 },\n\tlvmax: { max: 100, steps: 1 },\n\tdvmax: { max: 100, steps: 1 },\n};\n\nexport default function SpacingInputControl( {\n\ticon,\n\tisMixed = false,\n\tminimumCustomValue,\n\tonChange,\n\tonMouseOut,\n\tonMouseOver,\n\tshowSideInLabel = true,\n\tside,\n\tspacingSizes,\n\ttype,\n\tvalue,\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 <= RANGE_CONTROL_MAX_SIZE;\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 [ minValue, setMinValue ] = useState( minimumCustomValue );\n\n\tconst previousValue = usePrevious( value );\n\tif (\n\t\t!! value &&\n\t\tpreviousValue !== value &&\n\t\t! isValueSpacingPreset( value ) &&\n\t\tshowCustomValueControl !== true\n\t) {\n\t\tsetShowCustomValueControl( true );\n\t}\n\n\tconst [ availableUnits ] = useSettings( 'spacing.units' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: availableUnits || [ '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 = parseFloat( 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 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 sideLabel =\n\t\tALL_SIDES.includes( side ) && showSideInLabel ? LABELS[ side ] : '';\n\tconst typeLabel = showSideInLabel ? type?.toLowerCase() : type;\n\n\tconst ariaLabel = sprintf(\n\t\t// translators: 1: The side of the block being modified (top, bottom, left, All sides etc.). 2. Type of spacing being modified (Padding, margin, etc)\n\t\t__( '%1$s %2$s' ),\n\t\tsideLabel,\n\t\ttypeLabel\n\t).trim();\n\n\treturn (\n\t\t<HStack className=\"spacing-sizes-control__wrapper\">\n\t\t\t{ icon && (\n\t\t\t\t<Icon\n\t\t\t\t\tclassName=\"spacing-sizes-control__icon\"\n\t\t\t\t\ticon={ icon }\n\t\t\t\t\tsize={ 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\tonMouseOver={ onMouseOver }\n\t\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\t\tonBlur={ onMouseOut }\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={ minValue }\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\n\t\t\t\t\t\tclassName=\"spacing-sizes-control__custom-value-input\"\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\tonDragStart={ () => {\n\t\t\t\t\t\t\tif ( value?.charAt( 0 ) === '-' ) {\n\t\t\t\t\t\t\t\tsetMinValue( 0 );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonDrag={ () => {\n\t\t\t\t\t\t\tif ( value?.charAt( 0 ) === '-' ) {\n\t\t\t\t\t\t\t\tsetMinValue( 0 );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonDragEnd={ () => {\n\t\t\t\t\t\t\tsetMinValue( minimumCustomValue );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\t\tonBlur={ onMouseOut }\n\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ CUSTOM_VALUE_SETTINGS[ selectedUnit ]?.max ?? 10 }\n\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ]?.steps ?? 0.1\n\t\t\t\t\t\t}\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tonChange={ handleCustomValueSliderChange }\n\t\t\t\t\t\tclassName=\"spacing-sizes-control__custom-value-range\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\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\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tclassName=\"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\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\tonBlur={ onMouseOut }\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=\"spacing-sizes-control__custom-select-control\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\t// passing empty string as a fallback to continue using the\n\t\t\t\t\t\t// component in controlled mode\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) || ''\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\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\tonBlur={ onMouseOut }\n\t\t\t\t/>\n\t\t\t) }\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\tsize=\"small\"\n\t\t\t\t\tclassName=\"spacing-sizes-control__custom-toggle\"\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</HStack>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Button","Icon","RangeControl","__experimentalHStack","HStack","__experimentalUnitControl","UnitControl","__experimentalUseCustomUnits","useCustomUnits","__experimentalParseQuantityAndUnitFromRawValue","parseQuantityAndUnitFromRawValue","CustomSelectControl","useSelect","useState","useMemo","usePrevious","__","sprintf","settings","useSettings","store","blockEditorStore","RANGE_CONTROL_MAX_SIZE","ALL_SIDES","LABELS","getSliderValueFromPreset","getCustomValueFromPreset","getPresetValueFromCustomValue","isValueSpacingPreset","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","CUSTOM_VALUE_SETTINGS","px","max","steps","vw","vh","em","rm","svw","lvw","dvw","svh","lvh","dvh","vi","svi","lvi","dvi","vb","svb","lvb","dvb","vmin","svmin","lvmin","dvmin","vmax","svmax","lvmax","dvmax","SpacingInputControl","icon","isMixed","minimumCustomValue","onChange","onMouseOut","onMouseOver","showSideInLabel","side","spacingSizes","type","value","_CUSTOM_VALUE_SETTING","_CUSTOM_VALUE_SETTING2","selectListSizes","showRangeControl","length","disableCustomSpacingSizes","select","editorSettings","getSettings","showCustomValueControl","setShowCustomValueControl","undefined","minValue","setMinValue","previousValue","availableUnits","units","currentValue","showCustomValueInSelectList","name","slug","size","selectedUnit","setInitialValue","customTooltipContent","newValue","customRangeValue","parseFloat","getNewCustomValue","newSize","isNumeric","isNaN","nextValue","getNewPresetValue","controlType","parseInt","handleCustomValueSliderChange","next","join","allPlaceholder","options","map","index","key","marks","slice","_newValue","label","sideLabel","includes","typeLabel","toLowerCase","ariaLabel","trim","className","children","onFocus","onBlur","min","placeholder","disableUnits","hideLabelFromVision","onDragStart","charAt","onDrag","onDragEnd","__next40pxDefaultSize","step","withInputField","__nextHasNoMarginBottom","onMouseDown","event","nativeEvent","offsetX","renderTooltipContent","find","option","selection","selectedItem","onClick","isPressed","iconSize"],"sources":["@wordpress/block-editor/src/components/spacing-sizes-control/input-controls/spacing-input-control.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\tRangeControl,\n\t__experimentalHStack as HStack,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n\tCustomSelectControl,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useMemo } from '@wordpress/element';\nimport { usePrevious } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../../use-settings';\nimport { store as blockEditorStore } from '../../../store';\nimport {\n\tRANGE_CONTROL_MAX_SIZE,\n\tALL_SIDES,\n\tLABELS,\n\tgetSliderValueFromPreset,\n\tgetCustomValueFromPreset,\n\tgetPresetValueFromCustomValue,\n\tisValueSpacingPreset,\n} from '../utils';\n\nconst CUSTOM_VALUE_SETTINGS = {\n\tpx: { max: 300, steps: 1 },\n\t'%': { max: 100, steps: 1 },\n\tvw: { max: 100, steps: 1 },\n\tvh: { max: 100, steps: 1 },\n\tem: { max: 10, steps: 0.1 },\n\trm: { max: 10, steps: 0.1 },\n\tsvw: { max: 100, steps: 1 },\n\tlvw: { max: 100, steps: 1 },\n\tdvw: { max: 100, steps: 1 },\n\tsvh: { max: 100, steps: 1 },\n\tlvh: { max: 100, steps: 1 },\n\tdvh: { max: 100, steps: 1 },\n\tvi: { max: 100, steps: 1 },\n\tsvi: { max: 100, steps: 1 },\n\tlvi: { max: 100, steps: 1 },\n\tdvi: { max: 100, steps: 1 },\n\tvb: { max: 100, steps: 1 },\n\tsvb: { max: 100, steps: 1 },\n\tlvb: { max: 100, steps: 1 },\n\tdvb: { max: 100, steps: 1 },\n\tvmin: { max: 100, steps: 1 },\n\tsvmin: { max: 100, steps: 1 },\n\tlvmin: { max: 100, steps: 1 },\n\tdvmin: { max: 100, steps: 1 },\n\tvmax: { max: 100, steps: 1 },\n\tsvmax: { max: 100, steps: 1 },\n\tlvmax: { max: 100, steps: 1 },\n\tdvmax: { max: 100, steps: 1 },\n};\n\nexport default function SpacingInputControl( {\n\ticon,\n\tisMixed = false,\n\tminimumCustomValue,\n\tonChange,\n\tonMouseOut,\n\tonMouseOver,\n\tshowSideInLabel = true,\n\tside,\n\tspacingSizes,\n\ttype,\n\tvalue,\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 <= RANGE_CONTROL_MAX_SIZE;\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 [ minValue, setMinValue ] = useState( minimumCustomValue );\n\n\tconst previousValue = usePrevious( value );\n\tif (\n\t\t!! value &&\n\t\tpreviousValue !== value &&\n\t\t! isValueSpacingPreset( value ) &&\n\t\tshowCustomValueControl !== true\n\t) {\n\t\tsetShowCustomValueControl( true );\n\t}\n\n\tconst [ availableUnits ] = useSettings( 'spacing.units' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: availableUnits || [ '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 = parseFloat( 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 options = selectListSizes.map( ( size, index ) => ( {\n\t\tkey: index,\n\t\tname: size.name,\n\t} ) );\n\n\tconst marks = spacingSizes\n\t\t.slice( 1, spacingSizes.length - 1 )\n\t\t.map( ( _newValue, index ) => ( {\n\t\t\tvalue: index + 1,\n\t\t\tlabel: undefined,\n\t\t} ) );\n\n\tconst sideLabel =\n\t\tALL_SIDES.includes( side ) && showSideInLabel ? LABELS[ side ] : '';\n\tconst typeLabel = showSideInLabel ? type?.toLowerCase() : type;\n\n\tconst ariaLabel = sprintf(\n\t\t// translators: 1: The side of the block being modified (top, bottom, left, All sides etc.). 2. Type of spacing being modified (Padding, margin, etc)\n\t\t__( '%1$s %2$s' ),\n\t\tsideLabel,\n\t\ttypeLabel\n\t).trim();\n\n\treturn (\n\t\t<HStack className=\"spacing-sizes-control__wrapper\">\n\t\t\t{ icon && (\n\t\t\t\t<Icon\n\t\t\t\t\tclassName=\"spacing-sizes-control__icon\"\n\t\t\t\t\ticon={ icon }\n\t\t\t\t\tsize={ 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\tonMouseOver={ onMouseOver }\n\t\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\t\tonBlur={ onMouseOut }\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={ minValue }\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\n\t\t\t\t\t\tclassName=\"spacing-sizes-control__custom-value-input\"\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\tonDragStart={ () => {\n\t\t\t\t\t\t\tif ( value?.charAt( 0 ) === '-' ) {\n\t\t\t\t\t\t\t\tsetMinValue( 0 );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonDrag={ () => {\n\t\t\t\t\t\t\tif ( value?.charAt( 0 ) === '-' ) {\n\t\t\t\t\t\t\t\tsetMinValue( 0 );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonDragEnd={ () => {\n\t\t\t\t\t\t\tsetMinValue( minimumCustomValue );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\t\tonBlur={ onMouseOut }\n\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ CUSTOM_VALUE_SETTINGS[ selectedUnit ]?.max ?? 10 }\n\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\tCUSTOM_VALUE_SETTINGS[ selectedUnit ]?.steps ?? 0.1\n\t\t\t\t\t\t}\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tonChange={ handleCustomValueSliderChange }\n\t\t\t\t\t\tclassName=\"spacing-sizes-control__custom-value-range\"\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\t\thideLabelFromVision\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\t__next40pxDefaultSize\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tclassName=\"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\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\tonBlur={ onMouseOut }\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=\"spacing-sizes-control__custom-select-control\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\t// passing empty string as a fallback to continue using the\n\t\t\t\t\t\t// component in controlled mode\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) || ''\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\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tonFocus={ onMouseOver }\n\t\t\t\t\tonBlur={ onMouseOut }\n\t\t\t\t/>\n\t\t\t) }\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\tsize=\"small\"\n\t\t\t\t\tclassName=\"spacing-sizes-control__custom-toggle\"\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</HStack>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/text-alignment-control/index.js

@@ -9,11 +9,7 @@ import clsx from 'clsx';
 import { __ } from '@wordpress/i18n';
 import { alignLeft, alignCenter, alignRight, alignJustify } from '@wordpress/icons';
 import { useMemo } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import SegmentedTextControl from '../segmented-text-control';
+import { __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon } from '@wordpress/components';
 import { jsx as _jsx } from "react/jsx-runtime";
 const TEXT_ALIGNMENT_OPTIONS = [{
   label: __('Align text left'),
@@ -55,14 +51,23 @@ export default function TextAlignmentControl({
   if (!validOptions.length) {
     return null;
   }
-  return /*#__PURE__*/_jsx(SegmentedTextControl, {
+  return /*#__PURE__*/_jsx(ToggleGroupControl, {
+    isDeselectable: true,
+    __nextHasNoMarginBottom: true,
+    __next40pxDefaultSize: true,
     label: __('Text alignment'),
-    options: validOptions,
     className: clsx('block-editor-text-alignment-control', className),
     value: value,
     onChange: newValue => {
       onChange(newValue === value ? undefined : newValue);
-    }
+    },
+    children: validOptions.map(option => {
+      return /*#__PURE__*/_jsx(ToggleGroupControlOptionIcon, {
+        value: option.value,
+        icon: option.icon,
+        label: option.label
+      }, option.value);
+    })
   });
 }
 //# sourceMappingURL=index.js.map

package/build-module/components/text-alignment-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","__","alignLeft","alignCenter","alignRight","alignJustify","useMemo","SegmentedTextControl","jsx","_jsx","TEXT_ALIGNMENT_OPTIONS","label","value","icon","DEFAULT_OPTIONS","TextAlignmentControl","className","onChange","options","validOptions","filter","option","includes","length","newValue","undefined"],"sources":["@wordpress/block-editor/src/components/text-alignment-control/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\talignLeft,\n\talignCenter,\n\talignRight,\n\talignJustify,\n} from '@wordpress/icons';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SegmentedTextControl from '../segmented-text-control';\n\nconst TEXT_ALIGNMENT_OPTIONS = [\n\t{\n\t\tlabel: __( 'Align text left' ),\n\t\tvalue: 'left',\n\t\ticon: alignLeft,\n\t},\n\t{\n\t\tlabel: __( 'Align text center' ),\n\t\tvalue: 'center',\n\t\ticon: alignCenter,\n\t},\n\t{\n\t\tlabel: __( 'Align text right' ),\n\t\tvalue: 'right',\n\t\ticon: alignRight,\n\t},\n\t{\n\t\tlabel: __( 'Justify text' ),\n\t\tvalue: 'justify',\n\t\ticon: alignJustify,\n\t},\n];\n\nconst DEFAULT_OPTIONS = [ 'left', 'center', 'right' ];\n\n/**\n * Control to facilitate text alignment selections.\n *\n * @param {Object}   props           Component props.\n * @param {string}   props.className Class name to add to the control.\n * @param {string}   props.value     Currently selected text alignment.\n * @param {Function} props.onChange  Handles change in text alignment selection.\n * @param {string[]} props.options   Array of text alignment options to display.\n *\n * @return {Element} Text alignment control.\n */\nexport default function TextAlignmentControl( {\n\tclassName,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_OPTIONS,\n} ) {\n\tconst validOptions = useMemo(\n\t\t() =>\n\t\t\tTEXT_ALIGNMENT_OPTIONS.filter( ( option ) =>\n\t\t\t\toptions.includes( option.value )\n\t\t\t),\n\t\t[ options ]\n\t);\n\n\tif ( ! validOptions.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SegmentedTextControl\n\t\t\tlabel={ __( 'Text alignment' ) }\n\t\t\toptions={ validOptions }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-text-alignment-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChange( newValue === value ? undefined : newValue );\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SACCC,SAAS,EACTC,WAAW,EACXC,UAAU,EACVC,YAAY,QACN,kBAAkB;AACzB,SAASC,OAAO,QAAQ,oBAAoB;;AAE5C;AACA;AACA;AACA,OAAOC,oBAAoB,MAAM,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE7D,MAAMC,sBAAsB,GAAG,CAC9B;EACCC,KAAK,EAAEV,EAAE,CAAE,iBAAkB,CAAC;EAC9BW,KAAK,EAAE,MAAM;EACbC,IAAI,EAAEX;AACP,CAAC,EACD;EACCS,KAAK,EAAEV,EAAE,CAAE,mBAAoB,CAAC;EAChCW,KAAK,EAAE,QAAQ;EACfC,IAAI,EAAEV;AACP,CAAC,EACD;EACCQ,KAAK,EAAEV,EAAE,CAAE,kBAAmB,CAAC;EAC/BW,KAAK,EAAE,OAAO;EACdC,IAAI,EAAET;AACP,CAAC,EACD;EACCO,KAAK,EAAEV,EAAE,CAAE,cAAe,CAAC;EAC3BW,KAAK,EAAE,SAAS;EAChBC,IAAI,EAAER;AACP,CAAC,CACD;AAED,MAAMS,eAAe,GAAG,CAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAE;;AAErD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,oBAAoBA,CAAE;EAC7CC,SAAS;EACTJ,KAAK;EACLK,QAAQ;EACRC,OAAO,GAAGJ;AACX,CAAC,EAAG;EACH,MAAMK,YAAY,GAAGb,OAAO,CAC3B,MACCI,sBAAsB,CAACU,MAAM,CAAIC,MAAM,IACtCH,OAAO,CAACI,QAAQ,CAAED,MAAM,CAACT,KAAM,CAChC,CAAC,EACF,CAAEM,OAAO,CACV,CAAC;EAED,IAAK,CAAEC,YAAY,CAACI,MAAM,EAAG;IAC5B,OAAO,IAAI;EACZ;EAEA,oBACCd,IAAA,CAACF,oBAAoB;IACpBI,KAAK,EAAGV,EAAE,CAAE,gBAAiB,CAAG;IAChCiB,OAAO,EAAGC,YAAc;IACxBH,SAAS,EAAGhB,IAAI,CACf,qCAAqC,EACrCgB,SACD,CAAG;IACHJ,KAAK,EAAGA,KAAO;IACfK,QAAQ,EAAKO,QAAQ,IAAM;MAC1BP,QAAQ,CAAEO,QAAQ,KAAKZ,KAAK,GAAGa,SAAS,GAAGD,QAAS,CAAC;IACtD;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}
+{"version":3,"names":["clsx","__","alignLeft","alignCenter","alignRight","alignJustify","useMemo","__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOptionIcon","ToggleGroupControlOptionIcon","jsx","_jsx","TEXT_ALIGNMENT_OPTIONS","label","value","icon","DEFAULT_OPTIONS","TextAlignmentControl","className","onChange","options","validOptions","filter","option","includes","length","isDeselectable","__nextHasNoMarginBottom","__next40pxDefaultSize","newValue","undefined","children","map"],"sources":["@wordpress/block-editor/src/components/text-alignment-control/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\talignLeft,\n\talignCenter,\n\talignRight,\n\talignJustify,\n} from '@wordpress/icons';\nimport { useMemo } from '@wordpress/element';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n} from '@wordpress/components';\n\nconst TEXT_ALIGNMENT_OPTIONS = [\n\t{\n\t\tlabel: __( 'Align text left' ),\n\t\tvalue: 'left',\n\t\ticon: alignLeft,\n\t},\n\t{\n\t\tlabel: __( 'Align text center' ),\n\t\tvalue: 'center',\n\t\ticon: alignCenter,\n\t},\n\t{\n\t\tlabel: __( 'Align text right' ),\n\t\tvalue: 'right',\n\t\ticon: alignRight,\n\t},\n\t{\n\t\tlabel: __( 'Justify text' ),\n\t\tvalue: 'justify',\n\t\ticon: alignJustify,\n\t},\n];\n\nconst DEFAULT_OPTIONS = [ 'left', 'center', 'right' ];\n\n/**\n * Control to facilitate text alignment selections.\n *\n * @param {Object}   props           Component props.\n * @param {string}   props.className Class name to add to the control.\n * @param {string}   props.value     Currently selected text alignment.\n * @param {Function} props.onChange  Handles change in text alignment selection.\n * @param {string[]} props.options   Array of text alignment options to display.\n *\n * @return {Element} Text alignment control.\n */\nexport default function TextAlignmentControl( {\n\tclassName,\n\tvalue,\n\tonChange,\n\toptions = DEFAULT_OPTIONS,\n} ) {\n\tconst validOptions = useMemo(\n\t\t() =>\n\t\t\tTEXT_ALIGNMENT_OPTIONS.filter( ( option ) =>\n\t\t\t\toptions.includes( option.value )\n\t\t\t),\n\t\t[ options ]\n\t);\n\n\tif ( ! validOptions.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tisDeselectable\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Text alignment' ) }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-text-alignment-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChange( newValue === value ? undefined : newValue );\n\t\t\t} }\n\t\t>\n\t\t\t{ validOptions.map( ( option ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ option.value }\n\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\ticon={ option.icon }\n\t\t\t\t\t\tlabel={ option.label }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SACCC,SAAS,EACTC,WAAW,EACXC,UAAU,EACVC,YAAY,QACN,kBAAkB;AACzB,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SACCC,gCAAgC,IAAIC,kBAAkB,EACtDC,0CAA0C,IAAIC,4BAA4B,QACpE,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/B,MAAMC,sBAAsB,GAAG,CAC9B;EACCC,KAAK,EAAEb,EAAE,CAAE,iBAAkB,CAAC;EAC9Bc,KAAK,EAAE,MAAM;EACbC,IAAI,EAAEd;AACP,CAAC,EACD;EACCY,KAAK,EAAEb,EAAE,CAAE,mBAAoB,CAAC;EAChCc,KAAK,EAAE,QAAQ;EACfC,IAAI,EAAEb;AACP,CAAC,EACD;EACCW,KAAK,EAAEb,EAAE,CAAE,kBAAmB,CAAC;EAC/Bc,KAAK,EAAE,OAAO;EACdC,IAAI,EAAEZ;AACP,CAAC,EACD;EACCU,KAAK,EAAEb,EAAE,CAAE,cAAe,CAAC;EAC3Bc,KAAK,EAAE,SAAS;EAChBC,IAAI,EAAEX;AACP,CAAC,CACD;AAED,MAAMY,eAAe,GAAG,CAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAE;;AAErD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,oBAAoBA,CAAE;EAC7CC,SAAS;EACTJ,KAAK;EACLK,QAAQ;EACRC,OAAO,GAAGJ;AACX,CAAC,EAAG;EACH,MAAMK,YAAY,GAAGhB,OAAO,CAC3B,MACCO,sBAAsB,CAACU,MAAM,CAAIC,MAAM,IACtCH,OAAO,CAACI,QAAQ,CAAED,MAAM,CAACT,KAAM,CAChC,CAAC,EACF,CAAEM,OAAO,CACV,CAAC;EAED,IAAK,CAAEC,YAAY,CAACI,MAAM,EAAG;IAC5B,OAAO,IAAI;EACZ;EAEA,oBACCd,IAAA,CAACJ,kBAAkB;IAClBmB,cAAc;IACdC,uBAAuB;IACvBC,qBAAqB;IACrBf,KAAK,EAAGb,EAAE,CAAE,gBAAiB,CAAG;IAChCkB,SAAS,EAAGnB,IAAI,CACf,qCAAqC,EACrCmB,SACD,CAAG;IACHJ,KAAK,EAAGA,KAAO;IACfK,QAAQ,EAAKU,QAAQ,IAAM;MAC1BV,QAAQ,CAAEU,QAAQ,KAAKf,KAAK,GAAGgB,SAAS,GAAGD,QAAS,CAAC;IACtD,CAAG;IAAAE,QAAA,EAEDV,YAAY,CAACW,GAAG,CAAIT,MAAM,IAAM;MACjC,oBACCZ,IAAA,CAACF,4BAA4B;QAE5BK,KAAK,EAAGS,MAAM,CAACT,KAAO;QACtBC,IAAI,EAAGQ,MAAM,CAACR,IAAM;QACpBF,KAAK,EAAGU,MAAM,CAACV;MAAO,GAHhBU,MAAM,CAACT,KAIb,CAAC;IAEJ,CAAE;EAAC,CACgB,CAAC;AAEvB","ignoreList":[]}

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

@@ -8,11 +8,7 @@ import clsx from 'clsx';
  */
 import { reset, formatStrikethrough, formatUnderline } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import SegmentedTextControl from '../segmented-text-control';
+import { __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon } from '@wordpress/components';
 import { jsx as _jsx } from "react/jsx-runtime";
 const TEXT_DECORATIONS = [{
   label: __('None'),
@@ -43,14 +39,23 @@ export default function TextDecorationControl({
   onChange,
   className
 }) {
-  return /*#__PURE__*/_jsx(SegmentedTextControl, {
+  return /*#__PURE__*/_jsx(ToggleGroupControl, {
+    isDeselectable: true,
+    __nextHasNoMarginBottom: true,
+    __next40pxDefaultSize: true,
     label: __('Decoration'),
-    options: TEXT_DECORATIONS,
     className: clsx('block-editor-text-decoration-control', className),
     value: value,
     onChange: newValue => {
       onChange(newValue === value ? undefined : newValue);
-    }
+    },
+    children: TEXT_DECORATIONS.map(option => {
+      return /*#__PURE__*/_jsx(ToggleGroupControlOptionIcon, {
+        value: option.value,
+        icon: option.icon,
+        label: option.label
+      }, option.value);
+    })
   });
 }
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["clsx","reset","formatStrikethrough","formatUnderline","__","SegmentedTextControl","jsx","_jsx","TEXT_DECORATIONS","label","value","icon","TextDecorationControl","onChange","className","options","newValue","undefined"],"sources":["@wordpress/block-editor/src/components/text-decoration-control/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { reset, formatStrikethrough, formatUnderline } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport SegmentedTextControl from '../segmented-text-control';\n\nconst TEXT_DECORATIONS = [\n\t{\n\t\tlabel: __( 'None' ),\n\t\tvalue: 'none',\n\t\ticon: reset,\n\t},\n\t{\n\t\tlabel: __( 'Underline' ),\n\t\tvalue: 'underline',\n\t\ticon: formatUnderline,\n\t},\n\t{\n\t\tlabel: __( '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 {Element} Text decoration control.\n */\nexport default function TextDecorationControl( {\n\tvalue,\n\tonChange,\n\tclassName,\n} ) {\n\treturn (\n\t\t<SegmentedTextControl\n\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\toptions={ TEXT_DECORATIONS }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-text-decoration-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChange( newValue === value ? undefined : newValue );\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,KAAK,EAAEC,mBAAmB,EAAEC,eAAe,QAAQ,kBAAkB;AAC9E,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,oBAAoB,MAAM,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE7D,MAAMC,gBAAgB,GAAG,CACxB;EACCC,KAAK,EAAEL,EAAE,CAAE,MAAO,CAAC;EACnBM,KAAK,EAAE,MAAM;EACbC,IAAI,EAAEV;AACP,CAAC,EACD;EACCQ,KAAK,EAAEL,EAAE,CAAE,WAAY,CAAC;EACxBM,KAAK,EAAE,WAAW;EAClBC,IAAI,EAAER;AACP,CAAC,EACD;EACCM,KAAK,EAAEL,EAAE,CAAE,eAAgB,CAAC;EAC5BM,KAAK,EAAE,cAAc;EACrBC,IAAI,EAAET;AACP,CAAC,CACD;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASU,qBAAqBA,CAAE;EAC9CF,KAAK;EACLG,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,oBACCP,IAAA,CAACF,oBAAoB;IACpBI,KAAK,EAAGL,EAAE,CAAE,YAAa,CAAG;IAC5BW,OAAO,EAAGP,gBAAkB;IAC5BM,SAAS,EAAGd,IAAI,CACf,sCAAsC,EACtCc,SACD,CAAG;IACHJ,KAAK,EAAGA,KAAO;IACfG,QAAQ,EAAKG,QAAQ,IAAM;MAC1BH,QAAQ,CAAEG,QAAQ,KAAKN,KAAK,GAAGO,SAAS,GAAGD,QAAS,CAAC;IACtD;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}
+{"version":3,"names":["clsx","reset","formatStrikethrough","formatUnderline","__","__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOptionIcon","ToggleGroupControlOptionIcon","jsx","_jsx","TEXT_DECORATIONS","label","value","icon","TextDecorationControl","onChange","className","isDeselectable","__nextHasNoMarginBottom","__next40pxDefaultSize","newValue","undefined","children","map","option"],"sources":["@wordpress/block-editor/src/components/text-decoration-control/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { reset, formatStrikethrough, formatUnderline } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n} from '@wordpress/components';\n\nconst TEXT_DECORATIONS = [\n\t{\n\t\tlabel: __( 'None' ),\n\t\tvalue: 'none',\n\t\ticon: reset,\n\t},\n\t{\n\t\tlabel: __( 'Underline' ),\n\t\tvalue: 'underline',\n\t\ticon: formatUnderline,\n\t},\n\t{\n\t\tlabel: __( '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 {Element} Text decoration control.\n */\nexport default function TextDecorationControl( {\n\tvalue,\n\tonChange,\n\tclassName,\n} ) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tisDeselectable\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-text-decoration-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChange( newValue === value ? undefined : newValue );\n\t\t\t} }\n\t\t>\n\t\t\t{ TEXT_DECORATIONS.map( ( option ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ option.value }\n\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\ticon={ option.icon }\n\t\t\t\t\t\tlabel={ option.label }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,KAAK,EAAEC,mBAAmB,EAAEC,eAAe,QAAQ,kBAAkB;AAC9E,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SACCC,gCAAgC,IAAIC,kBAAkB,EACtDC,0CAA0C,IAAIC,4BAA4B,QACpE,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/B,MAAMC,gBAAgB,GAAG,CACxB;EACCC,KAAK,EAAER,EAAE,CAAE,MAAO,CAAC;EACnBS,KAAK,EAAE,MAAM;EACbC,IAAI,EAAEb;AACP,CAAC,EACD;EACCW,KAAK,EAAER,EAAE,CAAE,WAAY,CAAC;EACxBS,KAAK,EAAE,WAAW;EAClBC,IAAI,EAAEX;AACP,CAAC,EACD;EACCS,KAAK,EAAER,EAAE,CAAE,eAAgB,CAAC;EAC5BS,KAAK,EAAE,cAAc;EACrBC,IAAI,EAAEZ;AACP,CAAC,CACD;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASa,qBAAqBA,CAAE;EAC9CF,KAAK;EACLG,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,oBACCP,IAAA,CAACJ,kBAAkB;IAClBY,cAAc;IACdC,uBAAuB;IACvBC,qBAAqB;IACrBR,KAAK,EAAGR,EAAE,CAAE,YAAa,CAAG;IAC5Ba,SAAS,EAAGjB,IAAI,CACf,sCAAsC,EACtCiB,SACD,CAAG;IACHJ,KAAK,EAAGA,KAAO;IACfG,QAAQ,EAAKK,QAAQ,IAAM;MAC1BL,QAAQ,CAAEK,QAAQ,KAAKR,KAAK,GAAGS,SAAS,GAAGD,QAAS,CAAC;IACtD,CAAG;IAAAE,QAAA,EAEDZ,gBAAgB,CAACa,GAAG,CAAIC,MAAM,IAAM;MACrC,oBACCf,IAAA,CAACF,4BAA4B;QAE5BK,KAAK,EAAGY,MAAM,CAACZ,KAAO;QACtBC,IAAI,EAAGW,MAAM,CAACX,IAAM;QACpBF,KAAK,EAAGa,MAAM,CAACb;MAAO,GAHhBa,MAAM,CAACZ,KAIb,CAAC;IAEJ,CAAE;EAAC,CACgB,CAAC;AAEvB","ignoreList":[]}

package/build-module/components/text-transform-control/index.js

@@ -8,11 +8,7 @@ import clsx from 'clsx';
  */
 import { __ } from '@wordpress/i18n';
 import { reset, formatCapitalize, formatLowercase, formatUppercase } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import SegmentedTextControl from '../segmented-text-control';
+import { __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon } from '@wordpress/components';
 import { jsx as _jsx } from "react/jsx-runtime";
 const TEXT_TRANSFORMS = [{
   label: __('None'),
@@ -47,14 +43,23 @@ export default function TextTransformControl({
   value,
   onChange
 }) {
-  return /*#__PURE__*/_jsx(SegmentedTextControl, {
+  return /*#__PURE__*/_jsx(ToggleGroupControl, {
+    isDeselectable: true,
+    __nextHasNoMarginBottom: true,
+    __next40pxDefaultSize: true,
     label: __('Letter case'),
-    options: TEXT_TRANSFORMS,
     className: clsx('block-editor-text-transform-control', className),
     value: value,
     onChange: newValue => {
       onChange(newValue === value ? undefined : newValue);
-    }
+    },
+    children: TEXT_TRANSFORMS.map(option => {
+      return /*#__PURE__*/_jsx(ToggleGroupControlOptionIcon, {
+        value: option.value,
+        icon: option.icon,
+        label: option.label
+      }, option.value);
+    })
   });
 }
 //# sourceMappingURL=index.js.map

package/build-module/components/text-transform-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","__","reset","formatCapitalize","formatLowercase","formatUppercase","SegmentedTextControl","jsx","_jsx","TEXT_TRANSFORMS","label","value","icon","TextTransformControl","className","onChange","options","newValue","undefined"],"sources":["@wordpress/block-editor/src/components/text-transform-control/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\treset,\n\tformatCapitalize,\n\tformatLowercase,\n\tformatUppercase,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport SegmentedTextControl from '../segmented-text-control';\n\nconst TEXT_TRANSFORMS = [\n\t{\n\t\tlabel: __( 'None' ),\n\t\tvalue: 'none',\n\t\ticon: reset,\n\t},\n\t{\n\t\tlabel: __( 'Uppercase' ),\n\t\tvalue: 'uppercase',\n\t\ticon: formatUppercase,\n\t},\n\t{\n\t\tlabel: __( 'Lowercase' ),\n\t\tvalue: 'lowercase',\n\t\ticon: formatLowercase,\n\t},\n\t{\n\t\tlabel: __( 'Capitalize' ),\n\t\tvalue: 'capitalize',\n\t\ticon: formatCapitalize,\n\t},\n];\n\n/**\n * Control to facilitate text transform selections.\n *\n * @param {Object}   props           Component props.\n * @param {string}   props.className Class name to add to the control.\n * @param {string}   props.value     Currently selected text transform.\n * @param {Function} props.onChange  Handles change in text transform selection.\n *\n * @return {Element} Text transform control.\n */\nexport default function TextTransformControl( { className, value, onChange } ) {\n\treturn (\n\t\t<SegmentedTextControl\n\t\t\tlabel={ __( 'Letter case' ) }\n\t\t\toptions={ TEXT_TRANSFORMS }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-text-transform-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChange( newValue === value ? undefined : newValue );\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SACCC,KAAK,EACLC,gBAAgB,EAChBC,eAAe,EACfC,eAAe,QACT,kBAAkB;;AAEzB;AACA;AACA;AACA,OAAOC,oBAAoB,MAAM,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE7D,MAAMC,eAAe,GAAG,CACvB;EACCC,KAAK,EAAET,EAAE,CAAE,MAAO,CAAC;EACnBU,KAAK,EAAE,MAAM;EACbC,IAAI,EAAEV;AACP,CAAC,EACD;EACCQ,KAAK,EAAET,EAAE,CAAE,WAAY,CAAC;EACxBU,KAAK,EAAE,WAAW;EAClBC,IAAI,EAAEP;AACP,CAAC,EACD;EACCK,KAAK,EAAET,EAAE,CAAE,WAAY,CAAC;EACxBU,KAAK,EAAE,WAAW;EAClBC,IAAI,EAAER;AACP,CAAC,EACD;EACCM,KAAK,EAAET,EAAE,CAAE,YAAa,CAAC;EACzBU,KAAK,EAAE,YAAY;EACnBC,IAAI,EAAET;AACP,CAAC,CACD;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASU,oBAAoBA,CAAE;EAAEC,SAAS;EAAEH,KAAK;EAAEI;AAAS,CAAC,EAAG;EAC9E,oBACCP,IAAA,CAACF,oBAAoB;IACpBI,KAAK,EAAGT,EAAE,CAAE,aAAc,CAAG;IAC7Be,OAAO,EAAGP,eAAiB;IAC3BK,SAAS,EAAGd,IAAI,CACf,qCAAqC,EACrCc,SACD,CAAG;IACHH,KAAK,EAAGA,KAAO;IACfI,QAAQ,EAAKE,QAAQ,IAAM;MAC1BF,QAAQ,CAAEE,QAAQ,KAAKN,KAAK,GAAGO,SAAS,GAAGD,QAAS,CAAC;IACtD;EAAG,CACH,CAAC;AAEJ","ignoreList":[]}
+{"version":3,"names":["clsx","__","reset","formatCapitalize","formatLowercase","formatUppercase","__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOptionIcon","ToggleGroupControlOptionIcon","jsx","_jsx","TEXT_TRANSFORMS","label","value","icon","TextTransformControl","className","onChange","isDeselectable","__nextHasNoMarginBottom","__next40pxDefaultSize","newValue","undefined","children","map","option"],"sources":["@wordpress/block-editor/src/components/text-transform-control/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\treset,\n\tformatCapitalize,\n\tformatLowercase,\n\tformatUppercase,\n} from '@wordpress/icons';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n} from '@wordpress/components';\n\nconst TEXT_TRANSFORMS = [\n\t{\n\t\tlabel: __( 'None' ),\n\t\tvalue: 'none',\n\t\ticon: reset,\n\t},\n\t{\n\t\tlabel: __( 'Uppercase' ),\n\t\tvalue: 'uppercase',\n\t\ticon: formatUppercase,\n\t},\n\t{\n\t\tlabel: __( 'Lowercase' ),\n\t\tvalue: 'lowercase',\n\t\ticon: formatLowercase,\n\t},\n\t{\n\t\tlabel: __( 'Capitalize' ),\n\t\tvalue: 'capitalize',\n\t\ticon: formatCapitalize,\n\t},\n];\n\n/**\n * Control to facilitate text transform selections.\n *\n * @param {Object}   props           Component props.\n * @param {string}   props.className Class name to add to the control.\n * @param {string}   props.value     Currently selected text transform.\n * @param {Function} props.onChange  Handles change in text transform selection.\n *\n * @return {Element} Text transform control.\n */\nexport default function TextTransformControl( { className, value, onChange } ) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tisDeselectable\n\t\t\t__nextHasNoMarginBottom\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Letter case' ) }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-text-transform-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChange( newValue === value ? undefined : newValue );\n\t\t\t} }\n\t\t>\n\t\t\t{ TEXT_TRANSFORMS.map( ( option ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ option.value }\n\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\ticon={ option.icon }\n\t\t\t\t\t\tlabel={ option.label }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SACCC,KAAK,EACLC,gBAAgB,EAChBC,eAAe,EACfC,eAAe,QACT,kBAAkB;AACzB,SACCC,gCAAgC,IAAIC,kBAAkB,EACtDC,0CAA0C,IAAIC,4BAA4B,QACpE,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/B,MAAMC,eAAe,GAAG,CACvB;EACCC,KAAK,EAAEZ,EAAE,CAAE,MAAO,CAAC;EACnBa,KAAK,EAAE,MAAM;EACbC,IAAI,EAAEb;AACP,CAAC,EACD;EACCW,KAAK,EAAEZ,EAAE,CAAE,WAAY,CAAC;EACxBa,KAAK,EAAE,WAAW;EAClBC,IAAI,EAAEV;AACP,CAAC,EACD;EACCQ,KAAK,EAAEZ,EAAE,CAAE,WAAY,CAAC;EACxBa,KAAK,EAAE,WAAW;EAClBC,IAAI,EAAEX;AACP,CAAC,EACD;EACCS,KAAK,EAAEZ,EAAE,CAAE,YAAa,CAAC;EACzBa,KAAK,EAAE,YAAY;EACnBC,IAAI,EAAEZ;AACP,CAAC,CACD;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASa,oBAAoBA,CAAE;EAAEC,SAAS;EAAEH,KAAK;EAAEI;AAAS,CAAC,EAAG;EAC9E,oBACCP,IAAA,CAACJ,kBAAkB;IAClBY,cAAc;IACdC,uBAAuB;IACvBC,qBAAqB;IACrBR,KAAK,EAAGZ,EAAE,CAAE,aAAc,CAAG;IAC7BgB,SAAS,EAAGjB,IAAI,CACf,qCAAqC,EACrCiB,SACD,CAAG;IACHH,KAAK,EAAGA,KAAO;IACfI,QAAQ,EAAKI,QAAQ,IAAM;MAC1BJ,QAAQ,CAAEI,QAAQ,KAAKR,KAAK,GAAGS,SAAS,GAAGD,QAAS,CAAC;IACtD,CAAG;IAAAE,QAAA,EAEDZ,eAAe,CAACa,GAAG,CAAIC,MAAM,IAAM;MACpC,oBACCf,IAAA,CAACF,4BAA4B;QAE5BK,KAAK,EAAGY,MAAM,CAACZ,KAAO;QACtBC,IAAI,EAAGW,MAAM,CAACX,IAAM;QACpBF,KAAK,EAAGa,MAAM,CAACb;MAAO,GAHhBa,MAAM,CAACZ,KAIb,CAAC;IAEJ,CAAE;EAAC,CACgB,CAAC;AAEvB","ignoreList":[]}

package/build-module/components/url-input/button.js

@@ -58,7 +58,6 @@ class URLInputButton extends Component {
             label: __('Close'),
             onClick: this.toggle
           }), /*#__PURE__*/_jsx(URLInput, {
-            __nextHasNoMarginBottom: true,
             value: url || '',
             onChange: onChange
           }), /*#__PURE__*/_jsx(Button, {

package/build-module/components/url-input/button.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","Component","Button","link","keyboardReturn","arrowLeft","URLInput","jsx","_jsx","jsxs","_jsxs","URLInputButton","constructor","arguments","toggle","bind","submitLink","state","expanded","setState","event","preventDefault","render","url","onChange","props","buttonLabel","className","children","icon","label","onClick","isPressed","onSubmit","__nextHasNoMarginBottom","value","type"],"sources":["@wordpress/block-editor/src/components/url-input/button.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Component } from '@wordpress/element';\nimport { Button } from '@wordpress/components';\nimport { link, keyboardReturn, arrowLeft } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport URLInput from './';\n\nclass URLInputButton extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\t\tthis.toggle = this.toggle.bind( this );\n\t\tthis.submitLink = this.submitLink.bind( this );\n\t\tthis.state = {\n\t\t\texpanded: false,\n\t\t};\n\t}\n\n\ttoggle() {\n\t\tthis.setState( { expanded: ! this.state.expanded } );\n\t}\n\n\tsubmitLink( event ) {\n\t\tevent.preventDefault();\n\t\tthis.toggle();\n\t}\n\n\trender() {\n\t\tconst { url, onChange } = this.props;\n\t\tconst { expanded } = this.state;\n\t\tconst buttonLabel = url ? __( 'Edit link' ) : __( 'Insert link' );\n\n\t\treturn (\n\t\t\t<div className=\"block-editor-url-input__button\">\n\t\t\t\t<Button\n\t\t\t\t\ticon={ link }\n\t\t\t\t\tlabel={ buttonLabel }\n\t\t\t\t\tonClick={ this.toggle }\n\t\t\t\t\tclassName=\"components-toolbar__control\"\n\t\t\t\t\tisPressed={ !! url }\n\t\t\t\t/>\n\t\t\t\t{ expanded && (\n\t\t\t\t\t<form\n\t\t\t\t\t\tclassName=\"block-editor-url-input__button-modal\"\n\t\t\t\t\t\tonSubmit={ this.submitLink }\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className=\"block-editor-url-input__button-modal-line\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"block-editor-url-input__back\"\n\t\t\t\t\t\t\t\ticon={ arrowLeft }\n\t\t\t\t\t\t\t\tlabel={ __( 'Close' ) }\n\t\t\t\t\t\t\t\tonClick={ this.toggle }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<URLInput\n\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\tvalue={ url || '' }\n\t\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\ticon={ keyboardReturn }\n\t\t\t\t\t\t\t\tlabel={ __( 'Submit' ) }\n\t\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</form>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-input/README.md\n */\nexport default URLInputButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,QAAQ,oBAAoB;AAC9C,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,IAAI,EAAEC,cAAc,EAAEC,SAAS,QAAQ,kBAAkB;;AAElE;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,IAAI;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE1B,MAAMC,cAAc,SAASV,SAAS,CAAC;EACtCW,WAAWA,CAAA,EAAG;IACb,KAAK,CAAE,GAAGC,SAAU,CAAC;IACrB,IAAI,CAACC,MAAM,GAAG,IAAI,CAACA,MAAM,CAACC,IAAI,CAAE,IAAK,CAAC;IACtC,IAAI,CAACC,UAAU,GAAG,IAAI,CAACA,UAAU,CAACD,IAAI,CAAE,IAAK,CAAC;IAC9C,IAAI,CAACE,KAAK,GAAG;MACZC,QAAQ,EAAE;IACX,CAAC;EACF;EAEAJ,MAAMA,CAAA,EAAG;IACR,IAAI,CAACK,QAAQ,CAAE;MAAED,QAAQ,EAAE,CAAE,IAAI,CAACD,KAAK,CAACC;IAAS,CAAE,CAAC;EACrD;EAEAF,UAAUA,CAAEI,KAAK,EAAG;IACnBA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtB,IAAI,CAACP,MAAM,CAAC,CAAC;EACd;EAEAQ,MAAMA,CAAA,EAAG;IACR,MAAM;MAAEC,GAAG;MAAEC;IAAS,CAAC,GAAG,IAAI,CAACC,KAAK;IACpC,MAAM;MAAEP;IAAS,CAAC,GAAG,IAAI,CAACD,KAAK;IAC/B,MAAMS,WAAW,GAAGH,GAAG,GAAGvB,EAAE,CAAE,WAAY,CAAC,GAAGA,EAAE,CAAE,aAAc,CAAC;IAEjE,oBACCU,KAAA;MAAKiB,SAAS,EAAC,gCAAgC;MAAAC,QAAA,gBAC9CpB,IAAA,CAACN,MAAM;QACN2B,IAAI,EAAG1B,IAAM;QACb2B,KAAK,EAAGJ,WAAa;QACrBK,OAAO,EAAG,IAAI,CAACjB,MAAQ;QACvBa,SAAS,EAAC,6BAA6B;QACvCK,SAAS,EAAG,CAAC,CAAET;MAAK,CACpB,CAAC,EACAL,QAAQ,iBACTV,IAAA;QACCmB,SAAS,EAAC,sCAAsC;QAChDM,QAAQ,EAAG,IAAI,CAACjB,UAAY;QAAAY,QAAA,eAE5BlB,KAAA;UAAKiB,SAAS,EAAC,2CAA2C;UAAAC,QAAA,gBACzDpB,IAAA,CAACN,MAAM;YACNyB,SAAS,EAAC,8BAA8B;YACxCE,IAAI,EAAGxB,SAAW;YAClByB,KAAK,EAAG9B,EAAE,CAAE,OAAQ,CAAG;YACvB+B,OAAO,EAAG,IAAI,CAACjB;UAAQ,CACvB,CAAC,eACFN,IAAA,CAACF,QAAQ;YACR4B,uBAAuB;YACvBC,KAAK,EAAGZ,GAAG,IAAI,EAAI;YACnBC,QAAQ,EAAGA;UAAU,CACrB,CAAC,eACFhB,IAAA,CAACN,MAAM;YACN2B,IAAI,EAAGzB,cAAgB;YACvB0B,KAAK,EAAG9B,EAAE,CAAE,QAAS,CAAG;YACxBoC,IAAI,EAAC;UAAQ,CACb,CAAC;QAAA,CACE;MAAC,CACD,CACN;IAAA,CACG,CAAC;EAER;AACD;;AAEA;AACA;AACA;AACA,eAAezB,cAAc","ignoreList":[]}
+{"version":3,"names":["__","Component","Button","link","keyboardReturn","arrowLeft","URLInput","jsx","_jsx","jsxs","_jsxs","URLInputButton","constructor","arguments","toggle","bind","submitLink","state","expanded","setState","event","preventDefault","render","url","onChange","props","buttonLabel","className","children","icon","label","onClick","isPressed","onSubmit","value","type"],"sources":["@wordpress/block-editor/src/components/url-input/button.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Component } from '@wordpress/element';\nimport { Button } from '@wordpress/components';\nimport { link, keyboardReturn, arrowLeft } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport URLInput from './';\n\nclass URLInputButton extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\t\tthis.toggle = this.toggle.bind( this );\n\t\tthis.submitLink = this.submitLink.bind( this );\n\t\tthis.state = {\n\t\t\texpanded: false,\n\t\t};\n\t}\n\n\ttoggle() {\n\t\tthis.setState( { expanded: ! this.state.expanded } );\n\t}\n\n\tsubmitLink( event ) {\n\t\tevent.preventDefault();\n\t\tthis.toggle();\n\t}\n\n\trender() {\n\t\tconst { url, onChange } = this.props;\n\t\tconst { expanded } = this.state;\n\t\tconst buttonLabel = url ? __( 'Edit link' ) : __( 'Insert link' );\n\n\t\treturn (\n\t\t\t<div className=\"block-editor-url-input__button\">\n\t\t\t\t<Button\n\t\t\t\t\ticon={ link }\n\t\t\t\t\tlabel={ buttonLabel }\n\t\t\t\t\tonClick={ this.toggle }\n\t\t\t\t\tclassName=\"components-toolbar__control\"\n\t\t\t\t\tisPressed={ !! url }\n\t\t\t\t/>\n\t\t\t\t{ expanded && (\n\t\t\t\t\t<form\n\t\t\t\t\t\tclassName=\"block-editor-url-input__button-modal\"\n\t\t\t\t\t\tonSubmit={ this.submitLink }\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className=\"block-editor-url-input__button-modal-line\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"block-editor-url-input__back\"\n\t\t\t\t\t\t\t\ticon={ arrowLeft }\n\t\t\t\t\t\t\t\tlabel={ __( 'Close' ) }\n\t\t\t\t\t\t\t\tonClick={ this.toggle }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<URLInput\n\t\t\t\t\t\t\t\tvalue={ url || '' }\n\t\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\ticon={ keyboardReturn }\n\t\t\t\t\t\t\t\tlabel={ __( 'Submit' ) }\n\t\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</form>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-input/README.md\n */\nexport default URLInputButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,QAAQ,oBAAoB;AAC9C,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,IAAI,EAAEC,cAAc,EAAEC,SAAS,QAAQ,kBAAkB;;AAElE;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,IAAI;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE1B,MAAMC,cAAc,SAASV,SAAS,CAAC;EACtCW,WAAWA,CAAA,EAAG;IACb,KAAK,CAAE,GAAGC,SAAU,CAAC;IACrB,IAAI,CAACC,MAAM,GAAG,IAAI,CAACA,MAAM,CAACC,IAAI,CAAE,IAAK,CAAC;IACtC,IAAI,CAACC,UAAU,GAAG,IAAI,CAACA,UAAU,CAACD,IAAI,CAAE,IAAK,CAAC;IAC9C,IAAI,CAACE,KAAK,GAAG;MACZC,QAAQ,EAAE;IACX,CAAC;EACF;EAEAJ,MAAMA,CAAA,EAAG;IACR,IAAI,CAACK,QAAQ,CAAE;MAAED,QAAQ,EAAE,CAAE,IAAI,CAACD,KAAK,CAACC;IAAS,CAAE,CAAC;EACrD;EAEAF,UAAUA,CAAEI,KAAK,EAAG;IACnBA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtB,IAAI,CAACP,MAAM,CAAC,CAAC;EACd;EAEAQ,MAAMA,CAAA,EAAG;IACR,MAAM;MAAEC,GAAG;MAAEC;IAAS,CAAC,GAAG,IAAI,CAACC,KAAK;IACpC,MAAM;MAAEP;IAAS,CAAC,GAAG,IAAI,CAACD,KAAK;IAC/B,MAAMS,WAAW,GAAGH,GAAG,GAAGvB,EAAE,CAAE,WAAY,CAAC,GAAGA,EAAE,CAAE,aAAc,CAAC;IAEjE,oBACCU,KAAA;MAAKiB,SAAS,EAAC,gCAAgC;MAAAC,QAAA,gBAC9CpB,IAAA,CAACN,MAAM;QACN2B,IAAI,EAAG1B,IAAM;QACb2B,KAAK,EAAGJ,WAAa;QACrBK,OAAO,EAAG,IAAI,CAACjB,MAAQ;QACvBa,SAAS,EAAC,6BAA6B;QACvCK,SAAS,EAAG,CAAC,CAAET;MAAK,CACpB,CAAC,EACAL,QAAQ,iBACTV,IAAA;QACCmB,SAAS,EAAC,sCAAsC;QAChDM,QAAQ,EAAG,IAAI,CAACjB,UAAY;QAAAY,QAAA,eAE5BlB,KAAA;UAAKiB,SAAS,EAAC,2CAA2C;UAAAC,QAAA,gBACzDpB,IAAA,CAACN,MAAM;YACNyB,SAAS,EAAC,8BAA8B;YACxCE,IAAI,EAAGxB,SAAW;YAClByB,KAAK,EAAG9B,EAAE,CAAE,OAAQ,CAAG;YACvB+B,OAAO,EAAG,IAAI,CAACjB;UAAQ,CACvB,CAAC,eACFN,IAAA,CAACF,QAAQ;YACR4B,KAAK,EAAGX,GAAG,IAAI,EAAI;YACnBC,QAAQ,EAAGA;UAAU,CACrB,CAAC,eACFhB,IAAA,CAACN,MAAM;YACN2B,IAAI,EAAGzB,cAAgB;YACvB0B,KAAK,EAAG9B,EAAE,CAAE,QAAS,CAAG;YACxBmC,IAAI,EAAC;UAAQ,CACb,CAAC;QAAA,CACE;MAAC,CACD,CACN;IAAA,CACG,CAAC;EAER;AACD;;AAEA;AACA;AACA;AACA,eAAexB,cAAc","ignoreList":[]}

package/build-module/components/url-input/index.js

@@ -6,7 +6,6 @@ import clsx from 'clsx';
 /**
  * WordPress dependencies
  */
-import deprecated from '@wordpress/deprecated';
 import { __, sprintf, _n } from '@wordpress/i18n';
 import { Component, createRef } from '@wordpress/element';
 import { UP, DOWN, ENTER, TAB } from '@wordpress/keycodes';
@@ -346,8 +345,6 @@ class URLInput extends Component {
   }
   renderControl() {
     const {
-      /** Start opting into the new margin-free styles that will become the default in a future version. */
-      __nextHasNoMarginBottom = false,
       label = null,
       className,
       isFullWidth,
@@ -396,15 +393,8 @@ class URLInput extends Component {
     if (renderControl) {
       return renderControl(controlProps, inputProps, loading);
     }
-    if (!__nextHasNoMarginBottom) {
-      deprecated('Bottom margin styles for wp.blockEditor.URLInput', {
-        since: '6.2',
-        version: '6.5',
-        hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version'
-      });
-    }
     return /*#__PURE__*/_jsxs(BaseControl, {
-      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
+      __nextHasNoMarginBottom: true,
       ...controlProps,
       children: [/*#__PURE__*/_jsx("input", {
         ...inputProps