@wordpress/block-editor 12.25.0 → 12.26.0

package/build-module/components/block-tools/zoom-out-mode-inserters.js

@@ -3,25 +3,56 @@ import { createElement } from "react";
  * WordPress dependencies
  */
 import { useSelect } from '@wordpress/data';
-import { useEffect, useState } from '@wordpress/element';
+import { useEffect, useRef, useState } from '@wordpress/element';
+import { Button } from '@wordpress/components';
+import { plus } from '@wordpress/icons';
+import { _x } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
  */
 import BlockPopoverInbetween from '../block-popover/inbetween';
 import { store as blockEditorStore } from '../../store';
-import Inserter from '../inserter';
 import { unlock } from '../../lock-unlock';
-function ZoomOutModeInserters({
-  __unstableContentRef
-}) {
+function ZoomOutModeInserters() {
   const [isReady, setIsReady] = useState(false);
-  const blockOrder = useSelect(select => {
+  const {
+    blockOrder,
+    sectionRootClientId,
+    insertionPoint,
+    setInserterIsOpened
+  } = useSelect(select => {
     const {
-      sectionRootClientId
-    } = unlock(select(blockEditorStore).getSettings());
-    return select(blockEditorStore).getBlockOrder(sectionRootClientId);
+      getSettings,
+      getBlockOrder
+    } = select(blockEditorStore);
+    const {
+      sectionRootClientId: root
+    } = unlock(getSettings());
+    // To do: move ZoomOutModeInserters to core/editor.
+    // Or we perhaps we should move the insertion point state to the
+    // block-editor store. I'm not sure what it was ever moved to the editor
+    // store, because all the inserter components all live in the
+    // block-editor package.
+    // eslint-disable-next-line @wordpress/data-no-store-string-literals
+    const editor = select('core/editor');
+    return {
+      blockOrder: getBlockOrder(root),
+      insertionPoint: unlock(editor).getInsertionPoint(),
+      sectionRootClientId: root,
+      setInserterIsOpened: getSettings().__experimentalSetIsInserterOpened
+    };
   }, []);
+  const isMounted = useRef(false);
+  useEffect(() => {
+    if (!isMounted.current) {
+      isMounted.current = true;
+      return;
+    }
+    // reset insertion point when the block order changes
+    setInserterIsOpened(true);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [blockOrder]);
 
   // Defer the initial rendering to avoid the jumps due to the animation.
   useEffect(() => {
@@ -35,22 +66,35 @@ function ZoomOutModeInserters({
   if (!isReady) {
     return null;
   }
-  return blockOrder.map((clientId, index) => {
-    if (index === blockOrder.length - 1) {
-      return null;
-    }
+  return [undefined, ...blockOrder].map((clientId, index) => {
     return createElement(BlockPopoverInbetween, {
-      key: clientId,
+      key: index,
       previousClientId: clientId,
-      nextClientId: blockOrder[index + 1],
-      __unstableContentRef: __unstableContentRef
-    }, createElement("div", {
-      className: "block-editor-block-list__insertion-point-inserter is-with-inserter"
-    }, createElement(Inserter, {
-      position: "bottom center",
-      clientId: blockOrder[index + 1],
-      __experimentalIsQuick: true
-    })));
+      nextClientId: blockOrder[index]
+    }, insertionPoint.insertionIndex === index && createElement("div", {
+      style: {
+        borderRadius: '0',
+        height: '12px',
+        opacity: 1,
+        transform: 'translateY(-50%)',
+        width: '100%'
+      },
+      className: "block-editor-block-list__insertion-point-indicator"
+    }), insertionPoint.insertionIndex !== index && createElement(Button, {
+      variant: "primary",
+      icon: plus,
+      size: "compact",
+      className: "block-editor-button-pattern-inserter__button",
+      onClick: () => {
+        setInserterIsOpened({
+          rootClientId: sectionRootClientId,
+          insertionIndex: index,
+          tab: 'patterns',
+          category: 'all'
+        });
+      },
+      label: _x('Add pattern', 'Generic label for pattern inserter button')
+    }));
   });
 }
 export default ZoomOutModeInserters;

package/build-module/components/block-tools/zoom-out-mode-inserters.js.map

@@ -1 +1 @@
-{"version":3,"names":["useSelect","useEffect","useState","BlockPopoverInbetween","store","blockEditorStore","Inserter","unlock","ZoomOutModeInserters","__unstableContentRef","isReady","setIsReady","blockOrder","select","sectionRootClientId","getSettings","getBlockOrder","timeout","setTimeout","clearTimeout","map","clientId","index","length","createElement","key","previousClientId","nextClientId","className","position","__experimentalIsQuick"],"sources":["@wordpress/block-editor/src/components/block-tools/zoom-out-mode-inserters.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockPopoverInbetween from '../block-popover/inbetween';\nimport { store as blockEditorStore } from '../../store';\nimport Inserter from '../inserter';\nimport { unlock } from '../../lock-unlock';\n\nfunction ZoomOutModeInserters( { __unstableContentRef } ) {\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst blockOrder = useSelect( ( select ) => {\n\t\tconst { sectionRootClientId } = unlock(\n\t\t\tselect( blockEditorStore ).getSettings()\n\t\t);\n\t\treturn select( blockEditorStore ).getBlockOrder( sectionRootClientId );\n\t}, [] );\n\n\t// Defer the initial rendering to avoid the jumps due to the animation.\n\tuseEffect( () => {\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetIsReady( true );\n\t\t}, 500 );\n\t\treturn () => {\n\t\t\tclearTimeout( timeout );\n\t\t};\n\t}, [] );\n\n\tif ( ! isReady ) {\n\t\treturn null;\n\t}\n\n\treturn blockOrder.map( ( clientId, index ) => {\n\t\tif ( index === blockOrder.length - 1 ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<BlockPopoverInbetween\n\t\t\t\tkey={ clientId }\n\t\t\t\tpreviousClientId={ clientId }\n\t\t\t\tnextClientId={ blockOrder[ index + 1 ] }\n\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t>\n\t\t\t\t<div className=\"block-editor-block-list__insertion-point-inserter is-with-inserter\">\n\t\t\t\t\t<Inserter\n\t\t\t\t\t\tposition=\"bottom center\"\n\t\t\t\t\t\tclientId={ blockOrder[ index + 1 ] }\n\t\t\t\t\t\t__experimentalIsQuick\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</BlockPopoverInbetween>\n\t\t);\n\t} );\n}\n\nexport default ZoomOutModeInserters;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,SAAS,EAAEC,QAAQ,QAAQ,oBAAoB;;AAExD;AACA;AACA;AACA,OAAOC,qBAAqB,MAAM,4BAA4B;AAC9D,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,OAAOC,QAAQ,MAAM,aAAa;AAClC,SAASC,MAAM,QAAQ,mBAAmB;AAE1C,SAASC,oBAAoBA,CAAE;EAAEC;AAAqB,CAAC,EAAG;EACzD,MAAM,CAAEC,OAAO,EAAEC,UAAU,CAAE,GAAGT,QAAQ,CAAE,KAAM,CAAC;EACjD,MAAMU,UAAU,GAAGZ,SAAS,CAAIa,MAAM,IAAM;IAC3C,MAAM;MAAEC;IAAoB,CAAC,GAAGP,MAAM,CACrCM,MAAM,CAAER,gBAAiB,CAAC,CAACU,WAAW,CAAC,CACxC,CAAC;IACD,OAAOF,MAAM,CAAER,gBAAiB,CAAC,CAACW,aAAa,CAAEF,mBAAoB,CAAC;EACvE,CAAC,EAAE,EAAG,CAAC;;EAEP;EACAb,SAAS,CAAE,MAAM;IAChB,MAAMgB,OAAO,GAAGC,UAAU,CAAE,MAAM;MACjCP,UAAU,CAAE,IAAK,CAAC;IACnB,CAAC,EAAE,GAAI,CAAC;IACR,OAAO,MAAM;MACZQ,YAAY,CAAEF,OAAQ,CAAC;IACxB,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,IAAK,CAAEP,OAAO,EAAG;IAChB,OAAO,IAAI;EACZ;EAEA,OAAOE,UAAU,CAACQ,GAAG,CAAE,CAAEC,QAAQ,EAAEC,KAAK,KAAM;IAC7C,IAAKA,KAAK,KAAKV,UAAU,CAACW,MAAM,GAAG,CAAC,EAAG;MACtC,OAAO,IAAI;IACZ;IACA,OACCC,aAAA,CAACrB,qBAAqB;MACrBsB,GAAG,EAAGJ,QAAU;MAChBK,gBAAgB,EAAGL,QAAU;MAC7BM,YAAY,EAAGf,UAAU,CAAEU,KAAK,GAAG,CAAC,CAAI;MACxCb,oBAAoB,EAAGA;IAAsB,GAE7Ce,aAAA;MAAKI,SAAS,EAAC;IAAoE,GAClFJ,aAAA,CAAClB,QAAQ;MACRuB,QAAQ,EAAC,eAAe;MACxBR,QAAQ,EAAGT,UAAU,CAAEU,KAAK,GAAG,CAAC,CAAI;MACpCQ,qBAAqB;IAAA,CACrB,CACG,CACiB,CAAC;EAE1B,CAAE,CAAC;AACJ;AAEA,eAAetB,oBAAoB","ignoreList":[]}
+{"version":3,"names":["useSelect","useEffect","useRef","useState","Button","plus","_x","BlockPopoverInbetween","store","blockEditorStore","unlock","ZoomOutModeInserters","isReady","setIsReady","blockOrder","sectionRootClientId","insertionPoint","setInserterIsOpened","select","getSettings","getBlockOrder","root","editor","getInsertionPoint","__experimentalSetIsInserterOpened","isMounted","current","timeout","setTimeout","clearTimeout","undefined","map","clientId","index","createElement","key","previousClientId","nextClientId","insertionIndex","style","borderRadius","height","opacity","transform","width","className","variant","icon","size","onClick","rootClientId","tab","category","label"],"sources":["@wordpress/block-editor/src/components/block-tools/zoom-out-mode-inserters.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { Button } from '@wordpress/components';\nimport { plus } from '@wordpress/icons';\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BlockPopoverInbetween from '../block-popover/inbetween';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nfunction ZoomOutModeInserters() {\n\tconst [ isReady, setIsReady ] = useState( false );\n\tconst {\n\t\tblockOrder,\n\t\tsectionRootClientId,\n\t\tinsertionPoint,\n\t\tsetInserterIsOpened,\n\t} = useSelect( ( select ) => {\n\t\tconst { getSettings, getBlockOrder } = select( blockEditorStore );\n\t\tconst { sectionRootClientId: root } = unlock( getSettings() );\n\t\t// To do: move ZoomOutModeInserters to core/editor.\n\t\t// Or we perhaps we should move the insertion point state to the\n\t\t// block-editor store. I'm not sure what it was ever moved to the editor\n\t\t// store, because all the inserter components all live in the\n\t\t// block-editor package.\n\t\t// eslint-disable-next-line @wordpress/data-no-store-string-literals\n\t\tconst editor = select( 'core/editor' );\n\t\treturn {\n\t\t\tblockOrder: getBlockOrder( root ),\n\t\t\tinsertionPoint: unlock( editor ).getInsertionPoint(),\n\t\t\tsectionRootClientId: root,\n\t\t\tsetInserterIsOpened:\n\t\t\t\tgetSettings().__experimentalSetIsInserterOpened,\n\t\t};\n\t}, [] );\n\n\tconst isMounted = useRef( false );\n\n\tuseEffect( () => {\n\t\tif ( ! isMounted.current ) {\n\t\t\tisMounted.current = true;\n\t\t\treturn;\n\t\t}\n\t\t// reset insertion point when the block order changes\n\t\tsetInserterIsOpened( true );\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ blockOrder ] );\n\n\t// Defer the initial rendering to avoid the jumps due to the animation.\n\tuseEffect( () => {\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetIsReady( true );\n\t\t}, 500 );\n\t\treturn () => {\n\t\t\tclearTimeout( timeout );\n\t\t};\n\t}, [] );\n\n\tif ( ! isReady ) {\n\t\treturn null;\n\t}\n\n\treturn [ undefined, ...blockOrder ].map( ( clientId, index ) => {\n\t\treturn (\n\t\t\t<BlockPopoverInbetween\n\t\t\t\tkey={ index }\n\t\t\t\tpreviousClientId={ clientId }\n\t\t\t\tnextClientId={ blockOrder[ index ] }\n\t\t\t>\n\t\t\t\t{ insertionPoint.insertionIndex === index && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tborderRadius: '0',\n\t\t\t\t\t\t\theight: '12px',\n\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\ttransform: 'translateY(-50%)',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tclassName=\"block-editor-block-list__insertion-point-indicator\"\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ insertionPoint.insertionIndex !== index && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tclassName=\"block-editor-button-pattern-inserter__button\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetInserterIsOpened( {\n\t\t\t\t\t\t\t\trootClientId: sectionRootClientId,\n\t\t\t\t\t\t\t\tinsertionIndex: index,\n\t\t\t\t\t\t\t\ttab: 'patterns',\n\t\t\t\t\t\t\t\tcategory: 'all',\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t'Add pattern',\n\t\t\t\t\t\t\t'Generic label for pattern inserter button'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</BlockPopoverInbetween>\n\t\t);\n\t} );\n}\n\nexport default ZoomOutModeInserters;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/block-variation-picker/index.js

@@ -2,7 +2,7 @@ import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -18,7 +18,7 @@ function BlockVariationPicker({
   onSelect,
   allowSkip
 }) {
-  const classes = classnames('block-editor-block-variation-picker', {
+  const classes = clsx('block-editor-block-variation-picker', {
     'has-many-variations': variations.length > 4
   });
   return createElement(Placeholder, {

package/build-module/components/block-variation-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","__","Button","Placeholder","layout","BlockVariationPicker","icon","label","instructions","variations","onSelect","allowSkip","classes","length","createElement","className","role","map","variation","key","name","__next40pxDefaultSize","variant","src","iconSize","onClick","description","title"],"sources":["@wordpress/block-editor/src/components/block-variation-picker/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Button, Placeholder } from '@wordpress/components';\nimport { layout } from '@wordpress/icons';\n\nfunction BlockVariationPicker( {\n\ticon = layout,\n\tlabel = __( 'Choose variation' ),\n\tinstructions = __( 'Select a variation to start with:' ),\n\tvariations,\n\tonSelect,\n\tallowSkip,\n} ) {\n\tconst classes = classnames( 'block-editor-block-variation-picker', {\n\t\t'has-many-variations': variations.length > 4,\n\t} );\n\n\treturn (\n\t\t<Placeholder\n\t\t\ticon={ icon }\n\t\t\tlabel={ label }\n\t\t\tinstructions={ instructions }\n\t\t\tclassName={ classes }\n\t\t>\n\t\t\t{ /*\n\t\t\t * Disable reason: The `list` ARIA role is redundant but\n\t\t\t * Safari+VoiceOver won't announce the list otherwise.\n\t\t\t */\n\t\t\t/* eslint-disable jsx-a11y/no-redundant-roles */ }\n\t\t\t<ul\n\t\t\t\tclassName=\"block-editor-block-variation-picker__variations\"\n\t\t\t\trole=\"list\"\n\t\t\t\taria-label={ __( 'Block variations' ) }\n\t\t\t>\n\t\t\t\t{ variations.map( ( variation ) => (\n\t\t\t\t\t<li key={ variation.name }>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\tvariation.icon && variation.icon.src\n\t\t\t\t\t\t\t\t\t? variation.icon.src\n\t\t\t\t\t\t\t\t\t: variation.icon\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticonSize={ 48 }\n\t\t\t\t\t\t\tonClick={ () => onSelect( variation ) }\n\t\t\t\t\t\t\tclassName=\"block-editor-block-variation-picker__variation\"\n\t\t\t\t\t\t\tlabel={ variation.description || variation.title }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<span className=\"block-editor-block-variation-picker__variation-label\">\n\t\t\t\t\t\t\t{ variation.title }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</li>\n\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t\t{ /* eslint-enable jsx-a11y/no-redundant-roles */ }\n\t\t\t{ allowSkip && (\n\t\t\t\t<div className=\"block-editor-block-variation-picker__skip\">\n\t\t\t\t\t<Button variant=\"link\" onClick={ () => onSelect() }>\n\t\t\t\t\t\t{ __( 'Skip' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Placeholder>\n\t);\n}\n\nexport default BlockVariationPicker;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,MAAM,EAAEC,WAAW,QAAQ,uBAAuB;AAC3D,SAASC,MAAM,QAAQ,kBAAkB;AAEzC,SAASC,oBAAoBA,CAAE;EAC9BC,IAAI,GAAGF,MAAM;EACbG,KAAK,GAAGN,EAAE,CAAE,kBAAmB,CAAC;EAChCO,YAAY,GAAGP,EAAE,CAAE,mCAAoC,CAAC;EACxDQ,UAAU;EACVC,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,MAAMC,OAAO,GAAGZ,UAAU,CAAE,qCAAqC,EAAE;IAClE,qBAAqB,EAAES,UAAU,CAACI,MAAM,GAAG;EAC5C,CAAE,CAAC;EAEH,OACCC,aAAA,CAACX,WAAW;IACXG,IAAI,EAAGA,IAAM;IACbC,KAAK,EAAGA,KAAO;IACfC,YAAY,EAAGA,YAAc;IAC7BO,SAAS,EAAGH;EAAS,GAOrBE,aAAA;IACCC,SAAS,EAAC,iDAAiD;IAC3DC,IAAI,EAAC,MAAM;IACX,cAAaf,EAAE,CAAE,kBAAmB;EAAG,GAErCQ,UAAU,CAACQ,GAAG,CAAIC,SAAS,IAC5BJ,aAAA;IAAIK,GAAG,EAAGD,SAAS,CAACE;EAAM,GACzBN,aAAA,CAACZ,MAAM;IACNmB,qBAAqB;IACrBC,OAAO,EAAC,UAAU;IAClBhB,IAAI,EACHY,SAAS,CAACZ,IAAI,IAAIY,SAAS,CAACZ,IAAI,CAACiB,GAAG,GACjCL,SAAS,CAACZ,IAAI,CAACiB,GAAG,GAClBL,SAAS,CAACZ,IACb;IACDkB,QAAQ,EAAG,EAAI;IACfC,OAAO,EAAGA,CAAA,KAAMf,QAAQ,CAAEQ,SAAU,CAAG;IACvCH,SAAS,EAAC,gDAAgD;IAC1DR,KAAK,EAAGW,SAAS,CAACQ,WAAW,IAAIR,SAAS,CAACS;EAAO,CAClD,CAAC,EACFb,aAAA;IAAMC,SAAS,EAAC;EAAsD,GACnEG,SAAS,CAACS,KACP,CACH,CACH,CACC,CAAC,EAEHhB,SAAS,IACVG,aAAA;IAAKC,SAAS,EAAC;EAA2C,GACzDD,aAAA,CAACZ,MAAM;IAACoB,OAAO,EAAC,MAAM;IAACG,OAAO,EAAGA,CAAA,KAAMf,QAAQ,CAAC;EAAG,GAChDT,EAAE,CAAE,MAAO,CACN,CACJ,CAEM,CAAC;AAEhB;AAEA,eAAeI,oBAAoB","ignoreList":[]}
+{"version":3,"names":["clsx","__","Button","Placeholder","layout","BlockVariationPicker","icon","label","instructions","variations","onSelect","allowSkip","classes","length","createElement","className","role","map","variation","key","name","__next40pxDefaultSize","variant","src","iconSize","onClick","description","title"],"sources":["@wordpress/block-editor/src/components/block-variation-picker/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Button, Placeholder } from '@wordpress/components';\nimport { layout } from '@wordpress/icons';\n\nfunction BlockVariationPicker( {\n\ticon = layout,\n\tlabel = __( 'Choose variation' ),\n\tinstructions = __( 'Select a variation to start with:' ),\n\tvariations,\n\tonSelect,\n\tallowSkip,\n} ) {\n\tconst classes = clsx( 'block-editor-block-variation-picker', {\n\t\t'has-many-variations': variations.length > 4,\n\t} );\n\n\treturn (\n\t\t<Placeholder\n\t\t\ticon={ icon }\n\t\t\tlabel={ label }\n\t\t\tinstructions={ instructions }\n\t\t\tclassName={ classes }\n\t\t>\n\t\t\t{ /*\n\t\t\t * Disable reason: The `list` ARIA role is redundant but\n\t\t\t * Safari+VoiceOver won't announce the list otherwise.\n\t\t\t */\n\t\t\t/* eslint-disable jsx-a11y/no-redundant-roles */ }\n\t\t\t<ul\n\t\t\t\tclassName=\"block-editor-block-variation-picker__variations\"\n\t\t\t\trole=\"list\"\n\t\t\t\taria-label={ __( 'Block variations' ) }\n\t\t\t>\n\t\t\t\t{ variations.map( ( variation ) => (\n\t\t\t\t\t<li key={ variation.name }>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\tvariation.icon && variation.icon.src\n\t\t\t\t\t\t\t\t\t? variation.icon.src\n\t\t\t\t\t\t\t\t\t: variation.icon\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticonSize={ 48 }\n\t\t\t\t\t\t\tonClick={ () => onSelect( variation ) }\n\t\t\t\t\t\t\tclassName=\"block-editor-block-variation-picker__variation\"\n\t\t\t\t\t\t\tlabel={ variation.description || variation.title }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<span className=\"block-editor-block-variation-picker__variation-label\">\n\t\t\t\t\t\t\t{ variation.title }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</li>\n\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t\t{ /* eslint-enable jsx-a11y/no-redundant-roles */ }\n\t\t\t{ allowSkip && (\n\t\t\t\t<div className=\"block-editor-block-variation-picker__skip\">\n\t\t\t\t\t<Button variant=\"link\" onClick={ () => onSelect() }>\n\t\t\t\t\t\t{ __( 'Skip' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Placeholder>\n\t);\n}\n\nexport default BlockVariationPicker;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,MAAM,EAAEC,WAAW,QAAQ,uBAAuB;AAC3D,SAASC,MAAM,QAAQ,kBAAkB;AAEzC,SAASC,oBAAoBA,CAAE;EAC9BC,IAAI,GAAGF,MAAM;EACbG,KAAK,GAAGN,EAAE,CAAE,kBAAmB,CAAC;EAChCO,YAAY,GAAGP,EAAE,CAAE,mCAAoC,CAAC;EACxDQ,UAAU;EACVC,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,MAAMC,OAAO,GAAGZ,IAAI,CAAE,qCAAqC,EAAE;IAC5D,qBAAqB,EAAES,UAAU,CAACI,MAAM,GAAG;EAC5C,CAAE,CAAC;EAEH,OACCC,aAAA,CAACX,WAAW;IACXG,IAAI,EAAGA,IAAM;IACbC,KAAK,EAAGA,KAAO;IACfC,YAAY,EAAGA,YAAc;IAC7BO,SAAS,EAAGH;EAAS,GAOrBE,aAAA;IACCC,SAAS,EAAC,iDAAiD;IAC3DC,IAAI,EAAC,MAAM;IACX,cAAaf,EAAE,CAAE,kBAAmB;EAAG,GAErCQ,UAAU,CAACQ,GAAG,CAAIC,SAAS,IAC5BJ,aAAA;IAAIK,GAAG,EAAGD,SAAS,CAACE;EAAM,GACzBN,aAAA,CAACZ,MAAM;IACNmB,qBAAqB;IACrBC,OAAO,EAAC,UAAU;IAClBhB,IAAI,EACHY,SAAS,CAACZ,IAAI,IAAIY,SAAS,CAACZ,IAAI,CAACiB,GAAG,GACjCL,SAAS,CAACZ,IAAI,CAACiB,GAAG,GAClBL,SAAS,CAACZ,IACb;IACDkB,QAAQ,EAAG,EAAI;IACfC,OAAO,EAAGA,CAAA,KAAMf,QAAQ,CAAEQ,SAAU,CAAG;IACvCH,SAAS,EAAC,gDAAgD;IAC1DR,KAAK,EAAGW,SAAS,CAACQ,WAAW,IAAIR,SAAS,CAACS;EAAO,CAClD,CAAC,EACFb,aAAA;IAAMC,SAAS,EAAC;EAAsD,GACnEG,SAAS,CAACS,KACP,CACH,CACH,CACC,CAAC,EAEHhB,SAAS,IACVG,aAAA;IAAKC,SAAS,EAAC;EAA2C,GACzDD,aAAA,CAACZ,MAAM;IAACoB,OAAO,EAAC,MAAM;IAACG,OAAO,EAAGA,CAAA,KAAMf,QAAQ,CAAC;EAAG,GAChDT,EAAE,CAAE,MAAO,CACN,CACJ,CAEM,CAAC;AAEhB;AAEA,eAAeI,oBAAoB","ignoreList":[]}

package/build-module/components/button-block-appender/index.js

@@ -2,7 +2,7 @@ import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -47,7 +47,7 @@ function ButtonBlockAppender({
         ref: ref,
         onFocus: onFocus,
         tabIndex: tabIndex,
-        className: classnames(className, 'block-editor-button-block-appender'),
+        className: clsx(className, 'block-editor-button-block-appender'),
         onClick: onToggle,
         "aria-haspopup": isToggleButton ? 'true' : undefined,
         "aria-expanded": isToggleButton ? isOpen : undefined,

package/build-module/components/button-block-appender/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","Button","Tooltip","VisuallyHidden","forwardRef","_x","sprintf","Icon","plus","deprecated","Inserter","ButtonBlockAppender","rootClientId","className","onFocus","tabIndex","ref","createElement","position","__experimentalIsQuick","renderToggle","onToggle","disabled","isOpen","blockTitle","hasSingleBlockType","label","isToggleButton","inserterButton","onClick","undefined","as","icon","text","isAppender","ButtonBlockerAppender","props","alternative","since"],"sources":["@wordpress/block-editor/src/components/button-block-appender/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Button, Tooltip, VisuallyHidden } from '@wordpress/components';\nimport { forwardRef } from '@wordpress/element';\nimport { _x, sprintf } from '@wordpress/i18n';\nimport { Icon, plus } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport Inserter from '../inserter';\n\nfunction ButtonBlockAppender(\n\t{ rootClientId, className, onFocus, tabIndex },\n\tref\n) {\n\treturn (\n\t\t<Inserter\n\t\t\tposition=\"bottom center\"\n\t\t\trootClientId={ rootClientId }\n\t\t\t__experimentalIsQuick\n\t\t\trenderToggle={ ( {\n\t\t\t\tonToggle,\n\t\t\t\tdisabled,\n\t\t\t\tisOpen,\n\t\t\t\tblockTitle,\n\t\t\t\thasSingleBlockType,\n\t\t\t} ) => {\n\t\t\t\tlet label;\n\t\t\t\tif ( hasSingleBlockType ) {\n\t\t\t\t\tlabel = sprintf(\n\t\t\t\t\t\t// translators: %s: the name of the block when there is only one\n\t\t\t\t\t\t_x( 'Add %s', 'directly add the only allowed block' ),\n\t\t\t\t\t\tblockTitle\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tlabel = _x(\n\t\t\t\t\t\t'Add block',\n\t\t\t\t\t\t'Generic label for block inserter button'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst isToggleButton = ! hasSingleBlockType;\n\n\t\t\t\tlet inserterButton = (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t'block-editor-button-block-appender'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup={ isToggleButton ? 'true' : undefined }\n\t\t\t\t\t\taria-expanded={ isToggleButton ? isOpen : undefined }\n\t\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! hasSingleBlockType && (\n\t\t\t\t\t\t\t<VisuallyHidden as=\"span\">{ label }</VisuallyHidden>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<Icon icon={ plus } />\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\n\t\t\t\tif ( isToggleButton || hasSingleBlockType ) {\n\t\t\t\t\tinserterButton = (\n\t\t\t\t\t\t<Tooltip text={ label }>{ inserterButton }</Tooltip>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\treturn inserterButton;\n\t\t\t} }\n\t\t\tisAppender\n\t\t/>\n\t);\n}\n\n/**\n * Use `ButtonBlockAppender` instead.\n *\n * @deprecated\n */\nexport const ButtonBlockerAppender = forwardRef( ( props, ref ) => {\n\tdeprecated( `wp.blockEditor.ButtonBlockerAppender`, {\n\t\talternative: 'wp.blockEditor.ButtonBlockAppender',\n\t\tsince: '5.9',\n\t} );\n\n\treturn ButtonBlockAppender( props, ref );\n} );\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/button-block-appender/README.md\n */\nexport default forwardRef( ButtonBlockAppender );\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,MAAM,EAAEC,OAAO,EAAEC,cAAc,QAAQ,uBAAuB;AACvE,SAASC,UAAU,QAAQ,oBAAoB;AAC/C,SAASC,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;AAC7C,SAASC,IAAI,EAAEC,IAAI,QAAQ,kBAAkB;AAC7C,OAAOC,UAAU,MAAM,uBAAuB;;AAE9C;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAElC,SAASC,mBAAmBA,CAC3B;EAAEC,YAAY;EAAEC,SAAS;EAAEC,OAAO;EAAEC;AAAS,CAAC,EAC9CC,GAAG,EACF;EACD,OACCC,aAAA,CAACP,QAAQ;IACRQ,QAAQ,EAAC,eAAe;IACxBN,YAAY,EAAGA,YAAc;IAC7BO,qBAAqB;IACrBC,YAAY,EAAGA,CAAE;MAChBC,QAAQ;MACRC,QAAQ;MACRC,MAAM;MACNC,UAAU;MACVC;IACD,CAAC,KAAM;MACN,IAAIC,KAAK;MACT,IAAKD,kBAAkB,EAAG;QACzBC,KAAK,GAAGpB,OAAO;QACd;QACAD,EAAE,CAAE,QAAQ,EAAE,qCAAsC,CAAC,EACrDmB,UACD,CAAC;MACF,CAAC,MAAM;QACNE,KAAK,GAAGrB,EAAE,CACT,WAAW,EACX,yCACD,CAAC;MACF;MACA,MAAMsB,cAAc,GAAG,CAAEF,kBAAkB;MAE3C,IAAIG,cAAc,GACjBX,aAAA,CAAChB,MAAM;QACNe,GAAG,EAAGA,GAAK;QACXF,OAAO,EAAGA,OAAS;QACnBC,QAAQ,EAAGA,QAAU;QACrBF,SAAS,EAAGb,UAAU,CACrBa,SAAS,EACT,oCACD,CAAG;QACHgB,OAAO,EAAGR,QAAU;QACpB,iBAAgBM,cAAc,GAAG,MAAM,GAAGG,SAAW;QACrD,iBAAgBH,cAAc,GAAGJ,MAAM,GAAGO,SAAW;QACrDR,QAAQ,EAAGA,QAAU;QACrBI,KAAK,EAAGA;MAAO,GAEb,CAAED,kBAAkB,IACrBR,aAAA,CAACd,cAAc;QAAC4B,EAAE,EAAC;MAAM,GAAGL,KAAuB,CACnD,EACDT,aAAA,CAACV,IAAI;QAACyB,IAAI,EAAGxB;MAAM,CAAE,CACd,CACR;MAED,IAAKmB,cAAc,IAAIF,kBAAkB,EAAG;QAC3CG,cAAc,GACbX,aAAA,CAACf,OAAO;UAAC+B,IAAI,EAAGP;QAAO,GAAGE,cAAyB,CACnD;MACF;MACA,OAAOA,cAAc;IACtB,CAAG;IACHM,UAAU;EAAA,CACV,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,qBAAqB,GAAG/B,UAAU,CAAE,CAAEgC,KAAK,EAAEpB,GAAG,KAAM;EAClEP,UAAU,CAAG,sCAAqC,EAAE;IACnD4B,WAAW,EAAE,oCAAoC;IACjDC,KAAK,EAAE;EACR,CAAE,CAAC;EAEH,OAAO3B,mBAAmB,CAAEyB,KAAK,EAAEpB,GAAI,CAAC;AACzC,CAAE,CAAC;;AAEH;AACA;AACA;AACA,eAAeZ,UAAU,CAAEO,mBAAoB,CAAC","ignoreList":[]}
+{"version":3,"names":["clsx","Button","Tooltip","VisuallyHidden","forwardRef","_x","sprintf","Icon","plus","deprecated","Inserter","ButtonBlockAppender","rootClientId","className","onFocus","tabIndex","ref","createElement","position","__experimentalIsQuick","renderToggle","onToggle","disabled","isOpen","blockTitle","hasSingleBlockType","label","isToggleButton","inserterButton","onClick","undefined","as","icon","text","isAppender","ButtonBlockerAppender","props","alternative","since"],"sources":["@wordpress/block-editor/src/components/button-block-appender/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Button, Tooltip, VisuallyHidden } from '@wordpress/components';\nimport { forwardRef } from '@wordpress/element';\nimport { _x, sprintf } from '@wordpress/i18n';\nimport { Icon, plus } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport Inserter from '../inserter';\n\nfunction ButtonBlockAppender(\n\t{ rootClientId, className, onFocus, tabIndex },\n\tref\n) {\n\treturn (\n\t\t<Inserter\n\t\t\tposition=\"bottom center\"\n\t\t\trootClientId={ rootClientId }\n\t\t\t__experimentalIsQuick\n\t\t\trenderToggle={ ( {\n\t\t\t\tonToggle,\n\t\t\t\tdisabled,\n\t\t\t\tisOpen,\n\t\t\t\tblockTitle,\n\t\t\t\thasSingleBlockType,\n\t\t\t} ) => {\n\t\t\t\tlet label;\n\t\t\t\tif ( hasSingleBlockType ) {\n\t\t\t\t\tlabel = sprintf(\n\t\t\t\t\t\t// translators: %s: the name of the block when there is only one\n\t\t\t\t\t\t_x( 'Add %s', 'directly add the only allowed block' ),\n\t\t\t\t\t\tblockTitle\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tlabel = _x(\n\t\t\t\t\t\t'Add block',\n\t\t\t\t\t\t'Generic label for block inserter button'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst isToggleButton = ! hasSingleBlockType;\n\n\t\t\t\tlet inserterButton = (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t'block-editor-button-block-appender'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup={ isToggleButton ? 'true' : undefined }\n\t\t\t\t\t\taria-expanded={ isToggleButton ? isOpen : undefined }\n\t\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! hasSingleBlockType && (\n\t\t\t\t\t\t\t<VisuallyHidden as=\"span\">{ label }</VisuallyHidden>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<Icon icon={ plus } />\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\n\t\t\t\tif ( isToggleButton || hasSingleBlockType ) {\n\t\t\t\t\tinserterButton = (\n\t\t\t\t\t\t<Tooltip text={ label }>{ inserterButton }</Tooltip>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\treturn inserterButton;\n\t\t\t} }\n\t\t\tisAppender\n\t\t/>\n\t);\n}\n\n/**\n * Use `ButtonBlockAppender` instead.\n *\n * @deprecated\n */\nexport const ButtonBlockerAppender = forwardRef( ( props, ref ) => {\n\tdeprecated( `wp.blockEditor.ButtonBlockerAppender`, {\n\t\talternative: 'wp.blockEditor.ButtonBlockAppender',\n\t\tsince: '5.9',\n\t} );\n\n\treturn ButtonBlockAppender( props, ref );\n} );\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/button-block-appender/README.md\n */\nexport default forwardRef( ButtonBlockAppender );\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,MAAM,EAAEC,OAAO,EAAEC,cAAc,QAAQ,uBAAuB;AACvE,SAASC,UAAU,QAAQ,oBAAoB;AAC/C,SAASC,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;AAC7C,SAASC,IAAI,EAAEC,IAAI,QAAQ,kBAAkB;AAC7C,OAAOC,UAAU,MAAM,uBAAuB;;AAE9C;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAElC,SAASC,mBAAmBA,CAC3B;EAAEC,YAAY;EAAEC,SAAS;EAAEC,OAAO;EAAEC;AAAS,CAAC,EAC9CC,GAAG,EACF;EACD,OACCC,aAAA,CAACP,QAAQ;IACRQ,QAAQ,EAAC,eAAe;IACxBN,YAAY,EAAGA,YAAc;IAC7BO,qBAAqB;IACrBC,YAAY,EAAGA,CAAE;MAChBC,QAAQ;MACRC,QAAQ;MACRC,MAAM;MACNC,UAAU;MACVC;IACD,CAAC,KAAM;MACN,IAAIC,KAAK;MACT,IAAKD,kBAAkB,EAAG;QACzBC,KAAK,GAAGpB,OAAO;QACd;QACAD,EAAE,CAAE,QAAQ,EAAE,qCAAsC,CAAC,EACrDmB,UACD,CAAC;MACF,CAAC,MAAM;QACNE,KAAK,GAAGrB,EAAE,CACT,WAAW,EACX,yCACD,CAAC;MACF;MACA,MAAMsB,cAAc,GAAG,CAAEF,kBAAkB;MAE3C,IAAIG,cAAc,GACjBX,aAAA,CAAChB,MAAM;QACNe,GAAG,EAAGA,GAAK;QACXF,OAAO,EAAGA,OAAS;QACnBC,QAAQ,EAAGA,QAAU;QACrBF,SAAS,EAAGb,IAAI,CACfa,SAAS,EACT,oCACD,CAAG;QACHgB,OAAO,EAAGR,QAAU;QACpB,iBAAgBM,cAAc,GAAG,MAAM,GAAGG,SAAW;QACrD,iBAAgBH,cAAc,GAAGJ,MAAM,GAAGO,SAAW;QACrDR,QAAQ,EAAGA,QAAU;QACrBI,KAAK,EAAGA;MAAO,GAEb,CAAED,kBAAkB,IACrBR,aAAA,CAACd,cAAc;QAAC4B,EAAE,EAAC;MAAM,GAAGL,KAAuB,CACnD,EACDT,aAAA,CAACV,IAAI;QAACyB,IAAI,EAAGxB;MAAM,CAAE,CACd,CACR;MAED,IAAKmB,cAAc,IAAIF,kBAAkB,EAAG;QAC3CG,cAAc,GACbX,aAAA,CAACf,OAAO;UAAC+B,IAAI,EAAGP;QAAO,GAAGE,cAAyB,CACnD;MACF;MACA,OAAOA,cAAc;IACtB,CAAG;IACHM,UAAU;EAAA,CACV,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,qBAAqB,GAAG/B,UAAU,CAAE,CAAEgC,KAAK,EAAEpB,GAAG,KAAM;EAClEP,UAAU,CAAG,sCAAqC,EAAE;IACnD4B,WAAW,EAAE,oCAAoC;IACjDC,KAAK,EAAE;EACR,CAAE,CAAC;EAEH,OAAO3B,mBAAmB,CAAEyB,KAAK,EAAEpB,GAAI,CAAC;AACzC,CAAE,CAAC;;AAEH;AACA;AACA;AACA,eAAeZ,UAAU,CAAEO,mBAAoB,CAAC","ignoreList":[]}

package/build-module/components/child-layout-control/index.js

@@ -192,7 +192,7 @@ export default function ChildLayoutControl({
     },
     value: columnStart,
     min: 1,
-    max: parentLayout?.columnCount
+    max: parentLayout?.columnCount ? parentLayout.columnCount - (columnSpan !== null && columnSpan !== void 0 ? columnSpan : 1) + 1 : undefined
   })), createElement(FlexItem, {
     style: {
       width: '50%'
@@ -211,7 +211,7 @@ export default function ChildLayoutControl({
     },
     value: rowStart,
     min: 1,
-    max: parentLayout?.columnCount
+    max: parentLayout?.rowCount ? parentLayout.rowCount - (rowSpan !== null && rowSpan !== void 0 ? rowSpan : 1) + 1 : undefined
   })))));
 }
 export function childLayoutOrientation(parentLayout) {

package/build-module/components/child-layout-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOption","ToggleGroupControlOption","__experimentalUnitControl","UnitControl","__experimentalInputControl","InputControl","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalToolsPanelItem","ToolsPanelItem","Flex","FlexItem","__","useEffect","helpText","selfStretch","parentLayout","orientation","ChildLayoutControl","value","childLayout","onChange","isShownByDefault","panelId","flexSize","columnStart","rowStart","columnSpan","rowSpan","type","parentType","default","defaultParentType","parentLayoutType","hasFlexValue","flexResetLabel","resetFlex","undefined","hasStartValue","hasSpanValue","resetGridStarts","resetGridSpans","createElement","Fragment","as","spacing","hasValue","label","onDeselect","__nextHasNoMarginBottom","size","childLayoutOrientation","help","newFlexSize","isBlock","key","min","window","__experimentalEnableGridInteractivity","style","width","max","columnCount"],"sources":["@wordpress/block-editor/src/components/child-layout-control/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalInputControl as InputControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useEffect } from '@wordpress/element';\n\nfunction helpText( selfStretch, parentLayout ) {\n\tconst { orientation = 'horizontal' } = parentLayout;\n\n\tif ( selfStretch === 'fill' ) {\n\t\treturn __( 'Stretch to fill available space.' );\n\t}\n\tif ( selfStretch === 'fixed' && orientation === 'horizontal' ) {\n\t\treturn __( 'Specify a fixed width.' );\n\t} else if ( selfStretch === 'fixed' ) {\n\t\treturn __( 'Specify a fixed height.' );\n\t}\n\treturn __( 'Fit contents.' );\n}\n\n/**\n * Form to edit the child layout value.\n *\n * @param {Object}   props                  Props.\n * @param {Object}   props.value            The child layout value.\n * @param {Function} props.onChange         Function to update the child layout value.\n * @param {Object}   props.parentLayout     The parent layout value.\n *\n * @param {boolean}  props.isShownByDefault\n * @param {string}   props.panelId\n * @return {Element} child layout edit element.\n */\nexport default function ChildLayoutControl( {\n\tvalue: childLayout = {},\n\tonChange,\n\tparentLayout,\n\tisShownByDefault,\n\tpanelId,\n} ) {\n\tconst {\n\t\tselfStretch,\n\t\tflexSize,\n\t\tcolumnStart,\n\t\trowStart,\n\t\tcolumnSpan,\n\t\trowSpan,\n\t} = childLayout;\n\tconst {\n\t\ttype: parentType,\n\t\tdefault: { type: defaultParentType = 'default' } = {},\n\t\torientation = 'horizontal',\n\t} = parentLayout ?? {};\n\tconst parentLayoutType = parentType || defaultParentType;\n\n\tconst hasFlexValue = () => !! selfStretch;\n\tconst flexResetLabel =\n\t\torientation === 'horizontal' ? __( 'Width' ) : __( 'Height' );\n\tconst resetFlex = () => {\n\t\tonChange( {\n\t\t\tselfStretch: undefined,\n\t\t\tflexSize: undefined,\n\t\t} );\n\t};\n\n\tconst hasStartValue = () => !! columnStart || !! rowStart;\n\tconst hasSpanValue = () => !! columnSpan || !! rowSpan;\n\tconst resetGridStarts = () => {\n\t\tonChange( {\n\t\t\tcolumnStart: undefined,\n\t\t\trowStart: undefined,\n\t\t} );\n\t};\n\tconst resetGridSpans = () => {\n\t\tonChange( {\n\t\t\tcolumnSpan: undefined,\n\t\t\trowSpan: undefined,\n\t\t} );\n\t};\n\n\tuseEffect( () => {\n\t\tif ( selfStretch === 'fixed' && ! flexSize ) {\n\t\t\tonChange( {\n\t\t\t\t...childLayout,\n\t\t\t\tselfStretch: 'fit',\n\t\t\t} );\n\t\t}\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t{ parentLayoutType === 'flex' && (\n\t\t\t\t<VStack\n\t\t\t\t\tas={ ToolsPanelItem }\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\thasValue={ hasFlexValue }\n\t\t\t\t\tlabel={ flexResetLabel }\n\t\t\t\t\tonDeselect={ resetFlex }\n\t\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\tlabel={ childLayoutOrientation( parentLayout ) }\n\t\t\t\t\t\tvalue={ selfStretch || 'fit' }\n\t\t\t\t\t\thelp={ helpText( selfStretch, parentLayout ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tconst newFlexSize =\n\t\t\t\t\t\t\t\tvalue !== 'fixed' ? null : flexSize;\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tselfStretch: value,\n\t\t\t\t\t\t\t\tflexSize: newFlexSize,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\tkey={ 'fit' }\n\t\t\t\t\t\t\tvalue={ 'fit' }\n\t\t\t\t\t\t\tlabel={ __( 'Fit' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\tkey={ 'fill' }\n\t\t\t\t\t\t\tvalue={ 'fill' }\n\t\t\t\t\t\t\tlabel={ __( 'Fill' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\tkey={ 'fixed' }\n\t\t\t\t\t\t\tvalue={ 'fixed' }\n\t\t\t\t\t\t\tlabel={ __( 'Fixed' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToggleGroupControl>\n\t\t\t\t\t{ selfStretch === 'fixed' && (\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\tselfStretch,\n\t\t\t\t\t\t\t\t\tflexSize: 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\tvalue={ flexSize }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t{ parentLayoutType === 'grid' && (\n\t\t\t\t<>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tas={ ToolsPanelItem }\n\t\t\t\t\t\thasValue={ hasSpanValue }\n\t\t\t\t\t\tlabel={ __( 'Grid span' ) }\n\t\t\t\t\t\tonDeselect={ resetGridSpans }\n\t\t\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tlabel={ __( 'Column span' ) }\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart,\n\t\t\t\t\t\t\t\t\trowSpan,\n\t\t\t\t\t\t\t\t\tcolumnSpan: 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\tvalue={ columnSpan }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tlabel={ __( 'Row span' ) }\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart,\n\t\t\t\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\t\t\t\trowSpan: 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\tvalue={ rowSpan }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t{ window.__experimentalEnableGridInteractivity && (\n\t\t\t\t\t\t// Use Flex with an explicit width on the FlexItem instead of HStack to\n\t\t\t\t\t\t// work around an issue in webkit where inputs with a max attribute are\n\t\t\t\t\t\t// sized incorrectly.\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tas={ ToolsPanelItem }\n\t\t\t\t\t\t\thasValue={ hasStartValue }\n\t\t\t\t\t\t\tlabel={ __( 'Grid placement' ) }\n\t\t\t\t\t\t\tonDeselect={ resetGridStarts }\n\t\t\t\t\t\t\tisShownByDefault={ false }\n\t\t\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FlexItem style={ { width: '50%' } }>\n\t\t\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Column' ) }\n\t\t\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t\tcolumnStart: value,\n\t\t\t\t\t\t\t\t\t\t\trowStart,\n\t\t\t\t\t\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\t\t\t\t\t\trowSpan,\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvalue={ columnStart }\n\t\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\t\tmax={ parentLayout?.columnCount }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t<FlexItem style={ { width: '50%' } }>\n\t\t\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Row' ) }\n\t\t\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\t\t\trowStart: value,\n\t\t\t\t\t\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\t\t\t\t\t\trowSpan,\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvalue={ rowStart }\n\t\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\t\tmax={ parentLayout?.columnCount }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport function childLayoutOrientation( parentLayout ) {\n\tconst { orientation = 'horizontal' } = parentLayout;\n\n\treturn orientation === 'horizontal' ? __( 'Width' ) : __( 'Height' );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOption","ToggleGroupControlOption","__experimentalUnitControl","UnitControl","__experimentalInputControl","InputControl","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalToolsPanelItem","ToolsPanelItem","Flex","FlexItem","__","useEffect","helpText","selfStretch","parentLayout","orientation","ChildLayoutControl","value","childLayout","onChange","isShownByDefault","panelId","flexSize","columnStart","rowStart","columnSpan","rowSpan","type","parentType","default","defaultParentType","parentLayoutType","hasFlexValue","flexResetLabel","resetFlex","undefined","hasStartValue","hasSpanValue","resetGridStarts","resetGridSpans","createElement","Fragment","as","spacing","hasValue","label","onDeselect","__nextHasNoMarginBottom","size","childLayoutOrientation","help","newFlexSize","isBlock","key","min","window","__experimentalEnableGridInteractivity","style","width","max","columnCount","rowCount"],"sources":["@wordpress/block-editor/src/components/child-layout-control/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalInputControl as InputControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useEffect } from '@wordpress/element';\n\nfunction helpText( selfStretch, parentLayout ) {\n\tconst { orientation = 'horizontal' } = parentLayout;\n\n\tif ( selfStretch === 'fill' ) {\n\t\treturn __( 'Stretch to fill available space.' );\n\t}\n\tif ( selfStretch === 'fixed' && orientation === 'horizontal' ) {\n\t\treturn __( 'Specify a fixed width.' );\n\t} else if ( selfStretch === 'fixed' ) {\n\t\treturn __( 'Specify a fixed height.' );\n\t}\n\treturn __( 'Fit contents.' );\n}\n\n/**\n * Form to edit the child layout value.\n *\n * @param {Object}   props                  Props.\n * @param {Object}   props.value            The child layout value.\n * @param {Function} props.onChange         Function to update the child layout value.\n * @param {Object}   props.parentLayout     The parent layout value.\n *\n * @param {boolean}  props.isShownByDefault\n * @param {string}   props.panelId\n * @return {Element} child layout edit element.\n */\nexport default function ChildLayoutControl( {\n\tvalue: childLayout = {},\n\tonChange,\n\tparentLayout,\n\tisShownByDefault,\n\tpanelId,\n} ) {\n\tconst {\n\t\tselfStretch,\n\t\tflexSize,\n\t\tcolumnStart,\n\t\trowStart,\n\t\tcolumnSpan,\n\t\trowSpan,\n\t} = childLayout;\n\tconst {\n\t\ttype: parentType,\n\t\tdefault: { type: defaultParentType = 'default' } = {},\n\t\torientation = 'horizontal',\n\t} = parentLayout ?? {};\n\tconst parentLayoutType = parentType || defaultParentType;\n\n\tconst hasFlexValue = () => !! selfStretch;\n\tconst flexResetLabel =\n\t\torientation === 'horizontal' ? __( 'Width' ) : __( 'Height' );\n\tconst resetFlex = () => {\n\t\tonChange( {\n\t\t\tselfStretch: undefined,\n\t\t\tflexSize: undefined,\n\t\t} );\n\t};\n\n\tconst hasStartValue = () => !! columnStart || !! rowStart;\n\tconst hasSpanValue = () => !! columnSpan || !! rowSpan;\n\tconst resetGridStarts = () => {\n\t\tonChange( {\n\t\t\tcolumnStart: undefined,\n\t\t\trowStart: undefined,\n\t\t} );\n\t};\n\tconst resetGridSpans = () => {\n\t\tonChange( {\n\t\t\tcolumnSpan: undefined,\n\t\t\trowSpan: undefined,\n\t\t} );\n\t};\n\n\tuseEffect( () => {\n\t\tif ( selfStretch === 'fixed' && ! flexSize ) {\n\t\t\tonChange( {\n\t\t\t\t...childLayout,\n\t\t\t\tselfStretch: 'fit',\n\t\t\t} );\n\t\t}\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t{ parentLayoutType === 'flex' && (\n\t\t\t\t<VStack\n\t\t\t\t\tas={ ToolsPanelItem }\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\thasValue={ hasFlexValue }\n\t\t\t\t\tlabel={ flexResetLabel }\n\t\t\t\t\tonDeselect={ resetFlex }\n\t\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\tlabel={ childLayoutOrientation( parentLayout ) }\n\t\t\t\t\t\tvalue={ selfStretch || 'fit' }\n\t\t\t\t\t\thelp={ helpText( selfStretch, parentLayout ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tconst newFlexSize =\n\t\t\t\t\t\t\t\tvalue !== 'fixed' ? null : flexSize;\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tselfStretch: value,\n\t\t\t\t\t\t\t\tflexSize: newFlexSize,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\tkey={ 'fit' }\n\t\t\t\t\t\t\tvalue={ 'fit' }\n\t\t\t\t\t\t\tlabel={ __( 'Fit' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\tkey={ 'fill' }\n\t\t\t\t\t\t\tvalue={ 'fill' }\n\t\t\t\t\t\t\tlabel={ __( 'Fill' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\tkey={ 'fixed' }\n\t\t\t\t\t\t\tvalue={ 'fixed' }\n\t\t\t\t\t\t\tlabel={ __( 'Fixed' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToggleGroupControl>\n\t\t\t\t\t{ selfStretch === 'fixed' && (\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\tselfStretch,\n\t\t\t\t\t\t\t\t\tflexSize: 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\tvalue={ flexSize }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t{ parentLayoutType === 'grid' && (\n\t\t\t\t<>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tas={ ToolsPanelItem }\n\t\t\t\t\t\thasValue={ hasSpanValue }\n\t\t\t\t\t\tlabel={ __( 'Grid span' ) }\n\t\t\t\t\t\tonDeselect={ resetGridSpans }\n\t\t\t\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tlabel={ __( 'Column span' ) }\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart,\n\t\t\t\t\t\t\t\t\trowSpan,\n\t\t\t\t\t\t\t\t\tcolumnSpan: 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\tvalue={ columnSpan }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tlabel={ __( 'Row span' ) }\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart,\n\t\t\t\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\t\t\t\trowSpan: 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\tvalue={ rowSpan }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t{ window.__experimentalEnableGridInteractivity && (\n\t\t\t\t\t\t// Use Flex with an explicit width on the FlexItem instead of HStack to\n\t\t\t\t\t\t// work around an issue in webkit where inputs with a max attribute are\n\t\t\t\t\t\t// sized incorrectly.\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tas={ ToolsPanelItem }\n\t\t\t\t\t\t\thasValue={ hasStartValue }\n\t\t\t\t\t\t\tlabel={ __( 'Grid placement' ) }\n\t\t\t\t\t\t\tonDeselect={ resetGridStarts }\n\t\t\t\t\t\t\tisShownByDefault={ false }\n\t\t\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FlexItem style={ { width: '50%' } }>\n\t\t\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Column' ) }\n\t\t\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t\tcolumnStart: value,\n\t\t\t\t\t\t\t\t\t\t\trowStart,\n\t\t\t\t\t\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\t\t\t\t\t\trowSpan,\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvalue={ columnStart }\n\t\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\t\t\tparentLayout?.columnCount\n\t\t\t\t\t\t\t\t\t\t\t? parentLayout.columnCount -\n\t\t\t\t\t\t\t\t\t\t\t  ( columnSpan ?? 1 ) +\n\t\t\t\t\t\t\t\t\t\t\t  1\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t<FlexItem style={ { width: '50%' } }>\n\t\t\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Row' ) }\n\t\t\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\t\t\trowStart: value,\n\t\t\t\t\t\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\t\t\t\t\t\trowSpan,\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tvalue={ rowStart }\n\t\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\t\t\tparentLayout?.rowCount\n\t\t\t\t\t\t\t\t\t\t\t? parentLayout.rowCount -\n\t\t\t\t\t\t\t\t\t\t\t  ( rowSpan ?? 1 ) +\n\t\t\t\t\t\t\t\t\t\t\t  1\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport function childLayoutOrientation( parentLayout ) {\n\tconst { orientation = 'horizontal' } = parentLayout;\n\n\treturn orientation === 'horizontal' ? __( 'Width' ) : __( 'Height' );\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/colors-gradients/control.js

@@ -2,7 +2,7 @@ import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -81,7 +81,7 @@ function ColorGradientControlInner({
   } = unlock(componentsPrivateApis);
   return createElement(BaseControl, {
     __nextHasNoMarginBottom: true,
-    className: classnames('block-editor-color-gradient-control', className)
+    className: clsx('block-editor-color-gradient-control', className)
   }, createElement("fieldset", {
     className: "block-editor-color-gradient-control__fieldset"
   }, createElement(VStack, {
@@ -92,7 +92,7 @@ function ColorGradientControlInner({
     defaultTabId: gradientValue ? TAB_IDS.gradient : !!canChooseAColor && TAB_IDS.color
   }, createElement(Tabs.TabList, null, createElement(Tabs.Tab, {
     tabId: TAB_IDS.color
-  }, __('Solid')), createElement(Tabs.Tab, {
+  }, __('Color')), createElement(Tabs.Tab, {
     tabId: TAB_IDS.gradient
   }, __('Gradient'))), createElement(Tabs.TabPanel, {
     tabId: TAB_IDS.color,

package/build-module/components/colors-gradients/control.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","__","BaseControl","__experimentalVStack","VStack","ColorPalette","GradientPicker","privateApis","componentsPrivateApis","useSettings","unlock","colorsAndGradientKeys","TAB_IDS","color","gradient","ColorGradientControlInner","colors","gradients","disableCustomColors","disableCustomGradients","__experimentalIsRenderedInSidebar","className","label","onColorChange","onGradientChange","colorValue","gradientValue","clearable","showTitle","enableAlpha","headingLevel","canChooseAColor","length","canChooseAGradient","tabPanels","createElement","value","onChange","newColor","newGradient","renderPanelType","type","Tabs","__nextHasNoMarginBottom","spacing","VisualLabel","defaultTabId","TabList","Tab","tabId","TabPanel","focusable","ColorGradientControlSelect","props","customColors","customGradients","ColorGradientControl","every","key","hasOwnProperty"],"sources":["@wordpress/block-editor/src/components/colors-gradients/control.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tColorPalette,\n\tGradientPicker,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_IDS = { color: 'color', gradient: 'gradient' };\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n\theadingLevel,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange &&\n\t\t( ( colors && colors.length > 0 ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ( gradients && gradients.length > 0 ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_IDS.color ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_IDS.gradient ]: (\n\t\t\t<GradientPicker\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\t// Unlocking `Tabs` too early causes the `unlock` method to receive an empty\n\t// object, due to circular dependencies.\n\t// See https://github.com/WordPress/gutenberg/issues/52692\n\tconst { Tabs } = unlock( componentsPrivateApis );\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Tabs\n\t\t\t\t\t\t\t\tdefaultTabId={\n\t\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t\t? TAB_IDS.gradient\n\t\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_IDS.color\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.color }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Solid' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.gradient }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Gradient' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t</Tabs.TabList>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.color }\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\t'block-editor-color-gradient-control__panel'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.color }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.gradient }\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\t'block-editor-color-gradient-control__panel'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.gradient }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t</Tabs>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! canChooseAGradient && renderPanelType( TAB_IDS.color ) }\n\t\t\t\t\t{ ! canChooseAColor && renderPanelType( TAB_IDS.gradient ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst [ colors, gradients, customColors, customGradients ] = useSettings(\n\t\t'color.palette',\n\t\t'color.gradients',\n\t\t'color.custom',\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\tcolors={ colors }\n\t\t\tgradients={ gradients }\n\t\t\tdisableCustomColors={ ! customColors }\n\t\t\tdisableCustomGradients={ ! customGradients }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","__","BaseControl","__experimentalVStack","VStack","ColorPalette","GradientPicker","privateApis","componentsPrivateApis","useSettings","unlock","colorsAndGradientKeys","TAB_IDS","color","gradient","ColorGradientControlInner","colors","gradients","disableCustomColors","disableCustomGradients","__experimentalIsRenderedInSidebar","className","label","onColorChange","onGradientChange","colorValue","gradientValue","clearable","showTitle","enableAlpha","headingLevel","canChooseAColor","length","canChooseAGradient","tabPanels","createElement","value","onChange","newColor","newGradient","renderPanelType","type","Tabs","__nextHasNoMarginBottom","spacing","VisualLabel","defaultTabId","TabList","Tab","tabId","TabPanel","focusable","ColorGradientControlSelect","props","customColors","customGradients","ColorGradientControl","every","key","hasOwnProperty"],"sources":["@wordpress/block-editor/src/components/colors-gradients/control.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tColorPalette,\n\tGradientPicker,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_IDS = { color: 'color', gradient: 'gradient' };\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n\theadingLevel,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange &&\n\t\t( ( colors && colors.length > 0 ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ( gradients && gradients.length > 0 ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_IDS.color ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_IDS.gradient ]: (\n\t\t\t<GradientPicker\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\t// Unlocking `Tabs` too early causes the `unlock` method to receive an empty\n\t// object, due to circular dependencies.\n\t// See https://github.com/WordPress/gutenberg/issues/52692\n\tconst { Tabs } = unlock( componentsPrivateApis );\n\n\treturn (\n\t\t<BaseControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Tabs\n\t\t\t\t\t\t\t\tdefaultTabId={\n\t\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t\t? TAB_IDS.gradient\n\t\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_IDS.color\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.color }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Color' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.gradient }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Gradient' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t</Tabs.TabList>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.color }\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\t'block-editor-color-gradient-control__panel'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.color }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.gradient }\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\t'block-editor-color-gradient-control__panel'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.gradient }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t</Tabs>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! canChooseAGradient && renderPanelType( TAB_IDS.color ) }\n\t\t\t\t\t{ ! canChooseAColor && renderPanelType( TAB_IDS.gradient ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst [ colors, gradients, customColors, customGradients ] = useSettings(\n\t\t'color.palette',\n\t\t'color.gradients',\n\t\t'color.custom',\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\tcolors={ colors }\n\t\t\tgradients={ gradients }\n\t\t\tdisableCustomColors={ ! customColors }\n\t\t\tdisableCustomGradients={ ! customGradients }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/colors-gradients/dropdown.js

@@ -2,7 +2,7 @@ import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -71,7 +71,7 @@ const renderToggle = settings => ({
   } = settings;
   const toggleProps = {
     onClick: onToggle,
-    className: classnames('block-editor-panel-color-gradient-settings__dropdown', {
+    className: clsx('block-editor-panel-color-gradient-settings__dropdown', {
       'is-open': isOpen
     }),
     'aria-expanded': isOpen

package/build-module/components/colors-gradients/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","Button","ColorIndicator","Dropdown","FlexItem","__experimentalDropdownContentWrapper","DropdownContentWrapper","__experimentalHStack","HStack","__experimentalToolsPanelItem","ToolsPanelItem","ColorGradientControl","WithToolsPanelItem","setting","children","panelId","props","clearValue","colorValue","onColorChange","gradientValue","onGradientChange","createElement","hasValue","label","onDeselect","isShownByDefault","undefined","className","resetAllFilter","LabeledColorIndicator","justify","title","renderToggle","settings","onToggle","isOpen","toggleProps","onClick","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","shift","Fragment","map","index","_setting$gradientValu","controlProps","clearable","showTitle","toggleSettings","key","renderContent","paddingSize"],"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tDropdown,\n\tFlexItem,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\t__experimentalHStack as HStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( { setting, children, panelId, ...props } ) => {\n\tconst clearValue = () => {\n\t\tif ( setting.colorValue ) {\n\t\t\tsetting.onColorChange();\n\t\t} else if ( setting.gradientValue ) {\n\t\t\tsetting.onGradientChange();\n\t\t}\n\t};\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => {\n\t\t\t\treturn !! setting.colorValue || !! setting.gradientValue;\n\t\t\t} }\n\t\t\tlabel={ setting.label }\n\t\t\tonDeselect={ clearValue }\n\t\t\tisShownByDefault={\n\t\t\t\tsetting.isShownByDefault !== undefined\n\t\t\t\t\t? setting.isShownByDefault\n\t\t\t\t\t: true\n\t\t\t}\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\n\t\t\tpanelId={ panelId }\n\t\t\t// Pass resetAllFilter if supplied due to rendering via SlotFill\n\t\t\t// into parent ToolsPanel.\n\t\t\tresetAllFilter={ setting.resetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanelItem>\n\t);\n};\n\nconst LabeledColorIndicator = ( { colorValue, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ColorIndicator\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-indicator\"\n\t\t\tcolorValue={ colorValue }\n\t\t/>\n\t\t<FlexItem\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-name\"\n\t\t\ttitle={ label }\n\t\t>\n\t\t\t{ label }\n\t\t</FlexItem>\n\t</HStack>\n);\n\n// Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`\n// or as a `Button` if it isn't e.g. the controls are being rendered in\n// a `ToolsPanel`.\nconst renderToggle =\n\t( settings ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst { colorValue, label } = settings;\n\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings__dropdown',\n\t\t\t\t{ 'is-open': isOpen }\n\t\t\t),\n\t\t\t'aria-expanded': isOpen,\n\t\t};\n\n\t\treturn (\n\t\t\t<Button { ...toggleProps }>\n\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\tcolorValue={ colorValue }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t);\n\t};\n\n// Renders a collection of color controls as dropdowns. Depending upon the\n// context in which these dropdowns are being rendered, they may be wrapped\n// in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively,\n// the may be individually wrapped in a `ToolsPanelItem` with the toggle as\n// a regular `Button`.\n//\n// For more context see: https://github.com/WordPress/gutenberg/pull/40084\nexport default function ColorGradientSettingsDropdown( {\n\tcolors,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tenableAlpha,\n\tgradients,\n\tsettings,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t\tshift: true,\n\t\t};\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tcolorValue: setting.colorValue,\n\t\t\t\t\tcolors,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t\tgradientValue: setting.gradientValue,\n\t\t\t\t\tgradients,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t\tonColorChange: setting.onColorChange,\n\t\t\t\t\tonGradientChange: setting.onGradientChange,\n\t\t\t\t\tshowTitle: false,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\t...setting,\n\t\t\t\t};\n\t\t\t\tconst toggleSettings = {\n\t\t\t\t\tcolorValue: setting.gradientValue ?? setting.colorValue,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\tsetting && (\n\t\t\t\t\t\t// If not in an `ItemGroup` wrap the dropdown in a\n\t\t\t\t\t\t// `ToolsPanelItem`\n\t\t\t\t\t\t<WithToolsPanelItem\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tsetting={ setting }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__dropdown\"\n\t\t\t\t\t\t\t\trenderToggle={ renderToggle( toggleSettings ) }\n\t\t\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-panel-color-gradient-settings__dropdown-content\">\n\t\t\t\t\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</WithToolsPanelItem>\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","Button","ColorIndicator","Dropdown","FlexItem","__experimentalDropdownContentWrapper","DropdownContentWrapper","__experimentalHStack","HStack","__experimentalToolsPanelItem","ToolsPanelItem","ColorGradientControl","WithToolsPanelItem","setting","children","panelId","props","clearValue","colorValue","onColorChange","gradientValue","onGradientChange","createElement","hasValue","label","onDeselect","isShownByDefault","undefined","className","resetAllFilter","LabeledColorIndicator","justify","title","renderToggle","settings","onToggle","isOpen","toggleProps","onClick","ColorGradientSettingsDropdown","colors","disableCustomColors","disableCustomGradients","enableAlpha","gradients","__experimentalIsRenderedInSidebar","popoverProps","placement","offset","shift","Fragment","map","index","_setting$gradientValu","controlProps","clearable","showTitle","toggleSettings","key","renderContent","paddingSize"],"sources":["@wordpress/block-editor/src/components/colors-gradients/dropdown.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tColorIndicator,\n\tDropdown,\n\tFlexItem,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\t__experimentalHStack as HStack,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientControl from './control';\n\n// When the `ColorGradientSettingsDropdown` controls are being rendered to a\n// `ToolsPanel` they must be wrapped in a `ToolsPanelItem`.\nconst WithToolsPanelItem = ( { setting, children, panelId, ...props } ) => {\n\tconst clearValue = () => {\n\t\tif ( setting.colorValue ) {\n\t\t\tsetting.onColorChange();\n\t\t} else if ( setting.gradientValue ) {\n\t\t\tsetting.onGradientChange();\n\t\t}\n\t};\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={ () => {\n\t\t\t\treturn !! setting.colorValue || !! setting.gradientValue;\n\t\t\t} }\n\t\t\tlabel={ setting.label }\n\t\t\tonDeselect={ clearValue }\n\t\t\tisShownByDefault={\n\t\t\t\tsetting.isShownByDefault !== undefined\n\t\t\t\t\t? setting.isShownByDefault\n\t\t\t\t\t: true\n\t\t\t}\n\t\t\t{ ...props }\n\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__item\"\n\t\t\tpanelId={ panelId }\n\t\t\t// Pass resetAllFilter if supplied due to rendering via SlotFill\n\t\t\t// into parent ToolsPanel.\n\t\t\tresetAllFilter={ setting.resetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanelItem>\n\t);\n};\n\nconst LabeledColorIndicator = ( { colorValue, label } ) => (\n\t<HStack justify=\"flex-start\">\n\t\t<ColorIndicator\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-indicator\"\n\t\t\tcolorValue={ colorValue }\n\t\t/>\n\t\t<FlexItem\n\t\t\tclassName=\"block-editor-panel-color-gradient-settings__color-name\"\n\t\t\ttitle={ label }\n\t\t>\n\t\t\t{ label }\n\t\t</FlexItem>\n\t</HStack>\n);\n\n// Renders a color dropdown's toggle as an `Item` if it is within an `ItemGroup`\n// or as a `Button` if it isn't e.g. the controls are being rendered in\n// a `ToolsPanel`.\nconst renderToggle =\n\t( settings ) =>\n\t( { onToggle, isOpen } ) => {\n\t\tconst { colorValue, label } = settings;\n\n\t\tconst toggleProps = {\n\t\t\tonClick: onToggle,\n\t\t\tclassName: clsx(\n\t\t\t\t'block-editor-panel-color-gradient-settings__dropdown',\n\t\t\t\t{ 'is-open': isOpen }\n\t\t\t),\n\t\t\t'aria-expanded': isOpen,\n\t\t};\n\n\t\treturn (\n\t\t\t<Button { ...toggleProps }>\n\t\t\t\t<LabeledColorIndicator\n\t\t\t\t\tcolorValue={ colorValue }\n\t\t\t\t\tlabel={ label }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t);\n\t};\n\n// Renders a collection of color controls as dropdowns. Depending upon the\n// context in which these dropdowns are being rendered, they may be wrapped\n// in an `ItemGroup` with each dropdown's toggle as an `Item`, or alternatively,\n// the may be individually wrapped in a `ToolsPanelItem` with the toggle as\n// a regular `Button`.\n//\n// For more context see: https://github.com/WordPress/gutenberg/pull/40084\nexport default function ColorGradientSettingsDropdown( {\n\tcolors,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tenableAlpha,\n\tgradients,\n\tsettings,\n\t__experimentalIsRenderedInSidebar,\n\t...props\n} ) {\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tpopoverProps = {\n\t\t\tplacement: 'left-start',\n\t\t\toffset: 36,\n\t\t\tshift: true,\n\t\t};\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ settings.map( ( setting, index ) => {\n\t\t\t\tconst controlProps = {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tcolorValue: setting.colorValue,\n\t\t\t\t\tcolors,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t\tgradientValue: setting.gradientValue,\n\t\t\t\t\tgradients,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t\tonColorChange: setting.onColorChange,\n\t\t\t\t\tonGradientChange: setting.onGradientChange,\n\t\t\t\t\tshowTitle: false,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\t...setting,\n\t\t\t\t};\n\t\t\t\tconst toggleSettings = {\n\t\t\t\t\tcolorValue: setting.gradientValue ?? setting.colorValue,\n\t\t\t\t\tlabel: setting.label,\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\tsetting && (\n\t\t\t\t\t\t// If not in an `ItemGroup` wrap the dropdown in a\n\t\t\t\t\t\t// `ToolsPanelItem`\n\t\t\t\t\t\t<WithToolsPanelItem\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tsetting={ setting }\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\t\tclassName=\"block-editor-tools-panel-color-gradient-settings__dropdown\"\n\t\t\t\t\t\t\t\trenderToggle={ renderToggle( toggleSettings ) }\n\t\t\t\t\t\t\t\trenderContent={ () => (\n\t\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-panel-color-gradient-settings__dropdown-content\">\n\t\t\t\t\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</WithToolsPanelItem>\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/colors-gradients/panel-color-gradient-settings.js

@@ -2,7 +2,7 @@ import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -38,7 +38,7 @@ export const PanelColorGradientSettingsInner = ({
     return null;
   }
   return createElement(ToolsPanel, {
-    className: classnames('block-editor-panel-color-gradient-settings', className),
+    className: clsx('block-editor-panel-color-gradient-settings', className),
     label: showTitle ? title : undefined,
     resetAll: () => {
       batch(() => {

package/build-module/components/colors-gradients/panel-color-gradient-settings.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","__experimentalSpacer","Spacer","__experimentalToolsPanel","ToolsPanel","useRegistry","useInstanceId","ColorGradientSettingsDropdown","useColorsAndGradientsPalettes","colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","length","every","setting","undefined","createElement","label","resetAll","forEach","colorValue","gradientValue","onColorChange","onGradientChange","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","Fragment","marginY","PanelColorGradientSettingsSelect","props","colorGradientSettings","PanelColorGradientSettings","key","hasOwnProperty"],"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport useColorsAndGradientsPalettes from './use-multiple-origin-colors-and-gradients';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nexport const PanelColorGradientSettingsInner = ( {\n\tclassName,\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tchildren,\n\tsettings,\n\ttitle,\n\tshowTitle = true,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\t( ! colors || colors.length === 0 ) &&\n\t\t( ! gradients || gradients.length === 0 ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\t( ! setting.colors || setting.colors.length === 0 ) &&\n\t\t\t\t( ! setting.gradients || setting.gradients.length === 0 ) &&\n\t\t\t\t( setting.disableCustomColors === undefined ||\n\t\t\t\t\tsetting.disableCustomColors ) &&\n\t\t\t\t( setting.disableCustomGradients === undefined ||\n\t\t\t\t\tsetting.disableCustomGradients )\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tclassName={ classnames(\n\t\t\t\t'block-editor-panel-color-gradient-settings',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tlabel={ showTitle ? title : undefined }\n\t\t\tresetAll={ () => {\n\t\t\t\tbatch( () => {\n\t\t\t\t\tsettings.forEach(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\tif ( colorValue ) {\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t\t} else if ( gradientValue ) {\n\t\t\t\t\t\t\t\tonGradientChange();\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} );\n\t\t\t} }\n\t\t\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings={ settings }\n\t\t\t\tpanelId={ panelId }\n\t\t\t\t{ ...{\n\t\t\t\t\tcolors,\n\t\t\t\t\tgradients,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ !! children && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer marginY={ 4 } /> { children }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n};\n\nconst PanelColorGradientSettingsSelect = ( props ) => {\n\tconst colorGradientSettings = useColorsAndGradientsPalettes();\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettings = ( props ) => {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","__experimentalSpacer","Spacer","__experimentalToolsPanel","ToolsPanel","useRegistry","useInstanceId","ColorGradientSettingsDropdown","useColorsAndGradientsPalettes","colorsAndGradientKeys","PanelColorGradientSettingsInner","className","colors","gradients","disableCustomColors","disableCustomGradients","children","settings","title","showTitle","__experimentalIsRenderedInSidebar","enableAlpha","panelId","batch","length","every","setting","undefined","createElement","label","resetAll","forEach","colorValue","gradientValue","onColorChange","onGradientChange","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","Fragment","marginY","PanelColorGradientSettingsSelect","props","colorGradientSettings","PanelColorGradientSettings","key","hasOwnProperty"],"sources":["@wordpress/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ColorGradientSettingsDropdown from './dropdown';\nimport useColorsAndGradientsPalettes from './use-multiple-origin-colors-and-gradients';\n\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nexport const PanelColorGradientSettingsInner = ( {\n\tclassName,\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\tchildren,\n\tsettings,\n\ttitle,\n\tshowTitle = true,\n\t__experimentalIsRenderedInSidebar,\n\tenableAlpha,\n} ) => {\n\tconst panelId = useInstanceId( PanelColorGradientSettingsInner );\n\tconst { batch } = useRegistry();\n\tif (\n\t\t( ! colors || colors.length === 0 ) &&\n\t\t( ! gradients || gradients.length === 0 ) &&\n\t\tdisableCustomColors &&\n\t\tdisableCustomGradients &&\n\t\tsettings?.every(\n\t\t\t( setting ) =>\n\t\t\t\t( ! setting.colors || setting.colors.length === 0 ) &&\n\t\t\t\t( ! setting.gradients || setting.gradients.length === 0 ) &&\n\t\t\t\t( setting.disableCustomColors === undefined ||\n\t\t\t\t\tsetting.disableCustomColors ) &&\n\t\t\t\t( setting.disableCustomGradients === undefined ||\n\t\t\t\t\tsetting.disableCustomGradients )\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-panel-color-gradient-settings',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tlabel={ showTitle ? title : undefined }\n\t\t\tresetAll={ () => {\n\t\t\t\tbatch( () => {\n\t\t\t\t\tsettings.forEach(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tcolorValue,\n\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\tonColorChange,\n\t\t\t\t\t\t\tonGradientChange,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\tif ( colorValue ) {\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t\t} else if ( gradientValue ) {\n\t\t\t\t\t\t\t\tonGradientChange();\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} );\n\t\t\t} }\n\t\t\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t>\n\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\tsettings={ settings }\n\t\t\t\tpanelId={ panelId }\n\t\t\t\t{ ...{\n\t\t\t\t\tcolors,\n\t\t\t\t\tgradients,\n\t\t\t\t\tdisableCustomColors,\n\t\t\t\t\tdisableCustomGradients,\n\t\t\t\t\t__experimentalIsRenderedInSidebar,\n\t\t\t\t\tenableAlpha,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ !! children && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer marginY={ 4 } /> { children }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n};\n\nconst PanelColorGradientSettingsSelect = ( props ) => {\n\tconst colorGradientSettings = useColorsAndGradientsPalettes();\n\treturn (\n\t\t<PanelColorGradientSettingsInner\n\t\t\t{ ...{ ...colorGradientSettings, ...props } }\n\t\t/>\n\t);\n};\n\nconst PanelColorGradientSettings = ( props ) => {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <PanelColorGradientSettingsInner { ...props } />;\n\t}\n\treturn <PanelColorGradientSettingsSelect { ...props } />;\n};\n\nexport default PanelColorGradientSettings;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/convert-to-group-buttons/index.js

@@ -5,7 +5,8 @@ import { createElement, Fragment } from "react";
 import { MenuItem } from '@wordpress/components';
 import { _x } from '@wordpress/i18n';
 import { switchToBlockType } from '@wordpress/blocks';
-import { useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
+import { displayShortcut } from '@wordpress/keycodes';
 
 /**
  * Internal dependencies
@@ -22,6 +23,9 @@ function ConvertToGroupButton({
   groupingBlockName,
   onClose = () => {}
 }) {
+  const {
+    getSelectedBlockClientIds
+  } = useSelect(blockEditorStore);
   const {
     replaceBlocks
   } = useDispatch(blockEditorStore);
@@ -45,7 +49,9 @@ function ConvertToGroupButton({
   if (!isGroupable && !isUngroupable) {
     return null;
   }
+  const selectedBlockClientIds = getSelectedBlockClientIds();
   return createElement(Fragment, null, isGroupable && createElement(MenuItem, {
+    shortcut: selectedBlockClientIds.length > 1 ? displayShortcut.primary('g') : undefined,
     onClick: () => {
       onConvertToGroup();
       onClose();

package/build-module/components/convert-to-group-buttons/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["MenuItem","_x","switchToBlockType","useDispatch","store","blockEditorStore","useConvertToGroupButtonProps","BlockGroupToolbar","ConvertToGroupButton","clientIds","isGroupable","isUngroupable","onUngroup","blocksSelection","groupingBlockName","onClose","replaceBlocks","onConvertToGroup","newBlocks","onConvertFromGroup","innerBlocks","length","attributes","createElement","Fragment","onClick"],"sources":["@wordpress/block-editor/src/components/convert-to-group-buttons/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem } from '@wordpress/components';\nimport { _x } from '@wordpress/i18n';\nimport { switchToBlockType } from '@wordpress/blocks';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport useConvertToGroupButtonProps from './use-convert-to-group-button-props';\nimport BlockGroupToolbar from './toolbar';\n\nfunction ConvertToGroupButton( {\n\tclientIds,\n\tisGroupable,\n\tisUngroupable,\n\tonUngroup,\n\tblocksSelection,\n\tgroupingBlockName,\n\tonClose = () => {},\n} ) {\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\tconst onConvertToGroup = () => {\n\t\t// Activate the `transform` on the Grouping Block which does the conversion.\n\t\tconst newBlocks = switchToBlockType(\n\t\t\tblocksSelection,\n\t\t\tgroupingBlockName\n\t\t);\n\t\tif ( newBlocks ) {\n\t\t\treplaceBlocks( clientIds, newBlocks );\n\t\t}\n\t};\n\n\tconst onConvertFromGroup = () => {\n\t\tlet innerBlocks = blocksSelection[ 0 ].innerBlocks;\n\t\tif ( ! innerBlocks.length ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( onUngroup ) {\n\t\t\tinnerBlocks = onUngroup(\n\t\t\t\tblocksSelection[ 0 ].attributes,\n\t\t\t\tblocksSelection[ 0 ].innerBlocks\n\t\t\t);\n\t\t}\n\t\treplaceBlocks( clientIds, innerBlocks );\n\t};\n\n\tif ( ! isGroupable && ! isUngroupable ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isGroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertToGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x( 'Group', 'verb' ) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t\t{ isUngroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertFromGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x(\n\t\t\t\t\t\t'Ungroup',\n\t\t\t\t\t\t'Ungrouping blocks from within a grouping block back into individual blocks within the Editor '\n\t\t\t\t\t) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport {\n\tBlockGroupToolbar,\n\tConvertToGroupButton,\n\tuseConvertToGroupButtonProps,\n};\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SAASC,WAAW,QAAQ,iBAAiB;;AAE7C;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,OAAOC,4BAA4B,MAAM,qCAAqC;AAC9E,OAAOC,iBAAiB,MAAM,WAAW;AAEzC,SAASC,oBAAoBA,CAAE;EAC9BC,SAAS;EACTC,WAAW;EACXC,aAAa;EACbC,SAAS;EACTC,eAAe;EACfC,iBAAiB;EACjBC,OAAO,GAAGA,CAAA,KAAM,CAAC;AAClB,CAAC,EAAG;EACH,MAAM;IAAEC;EAAc,CAAC,GAAGb,WAAW,CAAEE,gBAAiB,CAAC;EACzD,MAAMY,gBAAgB,GAAGA,CAAA,KAAM;IAC9B;IACA,MAAMC,SAAS,GAAGhB,iBAAiB,CAClCW,eAAe,EACfC,iBACD,CAAC;IACD,IAAKI,SAAS,EAAG;MAChBF,aAAa,CAAEP,SAAS,EAAES,SAAU,CAAC;IACtC;EACD,CAAC;EAED,MAAMC,kBAAkB,GAAGA,CAAA,KAAM;IAChC,IAAIC,WAAW,GAAGP,eAAe,CAAE,CAAC,CAAE,CAACO,WAAW;IAClD,IAAK,CAAEA,WAAW,CAACC,MAAM,EAAG;MAC3B;IACD;IACA,IAAKT,SAAS,EAAG;MAChBQ,WAAW,GAAGR,SAAS,CACtBC,eAAe,CAAE,CAAC,CAAE,CAACS,UAAU,EAC/BT,eAAe,CAAE,CAAC,CAAE,CAACO,WACtB,CAAC;IACF;IACAJ,aAAa,CAAEP,SAAS,EAAEW,WAAY,CAAC;EACxC,CAAC;EAED,IAAK,CAAEV,WAAW,IAAI,CAAEC,aAAa,EAAG;IACvC,OAAO,IAAI;EACZ;EAEA,OACCY,aAAA,CAAAC,QAAA,QACGd,WAAW,IACZa,aAAA,CAACvB,QAAQ;IACRyB,OAAO,EAAGA,CAAA,KAAM;MACfR,gBAAgB,CAAC,CAAC;MAClBF,OAAO,CAAC,CAAC;IACV;EAAG,GAEDd,EAAE,CAAE,OAAO,EAAE,MAAO,CACb,CACV,EACCU,aAAa,IACdY,aAAA,CAACvB,QAAQ;IACRyB,OAAO,EAAGA,CAAA,KAAM;MACfN,kBAAkB,CAAC,CAAC;MACpBJ,OAAO,CAAC,CAAC;IACV;EAAG,GAEDd,EAAE,CACH,SAAS,EACT,+FACD,CACS,CAEV,CAAC;AAEL;AAEA,SACCM,iBAAiB,EACjBC,oBAAoB,EACpBF,4BAA4B","ignoreList":[]}
+{"version":3,"names":["MenuItem","_x","switchToBlockType","useSelect","useDispatch","displayShortcut","store","blockEditorStore","useConvertToGroupButtonProps","BlockGroupToolbar","ConvertToGroupButton","clientIds","isGroupable","isUngroupable","onUngroup","blocksSelection","groupingBlockName","onClose","getSelectedBlockClientIds","replaceBlocks","onConvertToGroup","newBlocks","onConvertFromGroup","innerBlocks","length","attributes","selectedBlockClientIds","createElement","Fragment","shortcut","primary","undefined","onClick"],"sources":["@wordpress/block-editor/src/components/convert-to-group-buttons/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem } from '@wordpress/components';\nimport { _x } from '@wordpress/i18n';\nimport { switchToBlockType } from '@wordpress/blocks';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport useConvertToGroupButtonProps from './use-convert-to-group-button-props';\nimport BlockGroupToolbar from './toolbar';\n\nfunction ConvertToGroupButton( {\n\tclientIds,\n\tisGroupable,\n\tisUngroupable,\n\tonUngroup,\n\tblocksSelection,\n\tgroupingBlockName,\n\tonClose = () => {},\n} ) {\n\tconst { getSelectedBlockClientIds } = useSelect( blockEditorStore );\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\tconst onConvertToGroup = () => {\n\t\t// Activate the `transform` on the Grouping Block which does the conversion.\n\t\tconst newBlocks = switchToBlockType(\n\t\t\tblocksSelection,\n\t\t\tgroupingBlockName\n\t\t);\n\t\tif ( newBlocks ) {\n\t\t\treplaceBlocks( clientIds, newBlocks );\n\t\t}\n\t};\n\n\tconst onConvertFromGroup = () => {\n\t\tlet innerBlocks = blocksSelection[ 0 ].innerBlocks;\n\t\tif ( ! innerBlocks.length ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( onUngroup ) {\n\t\t\tinnerBlocks = onUngroup(\n\t\t\t\tblocksSelection[ 0 ].attributes,\n\t\t\t\tblocksSelection[ 0 ].innerBlocks\n\t\t\t);\n\t\t}\n\t\treplaceBlocks( clientIds, innerBlocks );\n\t};\n\n\tif ( ! isGroupable && ! isUngroupable ) {\n\t\treturn null;\n\t}\n\n\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\n\treturn (\n\t\t<>\n\t\t\t{ isGroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tshortcut={\n\t\t\t\t\t\tselectedBlockClientIds.length > 1\n\t\t\t\t\t\t\t? displayShortcut.primary( 'g' )\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertToGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x( 'Group', 'verb' ) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t\t{ isUngroupable && (\n\t\t\t\t<MenuItem\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonConvertFromGroup();\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ _x(\n\t\t\t\t\t\t'Ungroup',\n\t\t\t\t\t\t'Ungrouping blocks from within a grouping block back into individual blocks within the Editor '\n\t\t\t\t\t) }\n\t\t\t\t</MenuItem>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport {\n\tBlockGroupToolbar,\n\tConvertToGroupButton,\n\tuseConvertToGroupButtonProps,\n};\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SAASC,SAAS,EAAEC,WAAW,QAAQ,iBAAiB;AACxD,SAASC,eAAe,QAAQ,qBAAqB;;AAErD;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,OAAOC,4BAA4B,MAAM,qCAAqC;AAC9E,OAAOC,iBAAiB,MAAM,WAAW;AAEzC,SAASC,oBAAoBA,CAAE;EAC9BC,SAAS;EACTC,WAAW;EACXC,aAAa;EACbC,SAAS;EACTC,eAAe;EACfC,iBAAiB;EACjBC,OAAO,GAAGA,CAAA,KAAM,CAAC;AAClB,CAAC,EAAG;EACH,MAAM;IAAEC;EAA0B,CAAC,GAAGf,SAAS,CAAEI,gBAAiB,CAAC;EACnE,MAAM;IAAEY;EAAc,CAAC,GAAGf,WAAW,CAAEG,gBAAiB,CAAC;EACzD,MAAMa,gBAAgB,GAAGA,CAAA,KAAM;IAC9B;IACA,MAAMC,SAAS,GAAGnB,iBAAiB,CAClCa,eAAe,EACfC,iBACD,CAAC;IACD,IAAKK,SAAS,EAAG;MAChBF,aAAa,CAAER,SAAS,EAAEU,SAAU,CAAC;IACtC;EACD,CAAC;EAED,MAAMC,kBAAkB,GAAGA,CAAA,KAAM;IAChC,IAAIC,WAAW,GAAGR,eAAe,CAAE,CAAC,CAAE,CAACQ,WAAW;IAClD,IAAK,CAAEA,WAAW,CAACC,MAAM,EAAG;MAC3B;IACD;IACA,IAAKV,SAAS,EAAG;MAChBS,WAAW,GAAGT,SAAS,CACtBC,eAAe,CAAE,CAAC,CAAE,CAACU,UAAU,EAC/BV,eAAe,CAAE,CAAC,CAAE,CAACQ,WACtB,CAAC;IACF;IACAJ,aAAa,CAAER,SAAS,EAAEY,WAAY,CAAC;EACxC,CAAC;EAED,IAAK,CAAEX,WAAW,IAAI,CAAEC,aAAa,EAAG;IACvC,OAAO,IAAI;EACZ;EAEA,MAAMa,sBAAsB,GAAGR,yBAAyB,CAAC,CAAC;EAE1D,OACCS,aAAA,CAAAC,QAAA,QACGhB,WAAW,IACZe,aAAA,CAAC3B,QAAQ;IACR6B,QAAQ,EACPH,sBAAsB,CAACF,MAAM,GAAG,CAAC,GAC9BnB,eAAe,CAACyB,OAAO,CAAE,GAAI,CAAC,GAC9BC,SACH;IACDC,OAAO,EAAGA,CAAA,KAAM;MACfZ,gBAAgB,CAAC,CAAC;MAClBH,OAAO,CAAC,CAAC;IACV;EAAG,GAEDhB,EAAE,CAAE,OAAO,EAAE,MAAO,CACb,CACV,EACCY,aAAa,IACdc,aAAA,CAAC3B,QAAQ;IACRgC,OAAO,EAAGA,CAAA,KAAM;MACfV,kBAAkB,CAAC,CAAC;MACpBL,OAAO,CAAC,CAAC;IACV;EAAG,GAEDhB,EAAE,CACH,SAAS,EACT,+FACD,CACS,CAEV,CAAC;AAEL;AAEA,SACCQ,iBAAiB,EACjBC,oBAAoB,EACpBF,4BAA4B","ignoreList":[]}