@wordpress/block-editor 12.7.0 → 12.8.1

package/build-module/components/block-styles/menu-items.js

@@ -1,18 +1,15 @@
 import { createElement, Fragment } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
 import { MenuItem, __experimentalText as Text } from '@wordpress/components';
 import { check } from '@wordpress/icons';
+
 /**
  * Internal dependencies
  */
-
 import useStylesForBlocks from './use-styles-for-block';
-
 const noop = () => {};
-
 export default function BlockStylesMenuItems({
   clientId,
   onSwitch = noop
@@ -25,11 +22,9 @@ export default function BlockStylesMenuItems({
     clientId,
     onSwitch
   });
-
   if (!stylesToRender || stylesToRender.length === 0) {
     return null;
   }
-
   return createElement(Fragment, null, stylesToRender.map(style => {
     const menuItemText = style.label || style.name;
     return createElement(MenuItem, {

package/build-module/components/block-styles/menu-items.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-styles/menu-items.js"],"names":["MenuItem","__experimentalText","Text","check","useStylesForBlocks","noop","BlockStylesMenuItems","clientId","onSwitch","onSelect","stylesToRender","activeStyle","length","map","style","menuItemText","label","name"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,kBAAkB,IAAIC,IAAzC,QAAqD,uBAArD;AACA,SAASC,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,wBAA/B;;AAEA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,eAAe,SAASC,oBAAT,CAA+B;AAAEC,EAAAA,QAAF;AAAYC,EAAAA,QAAQ,GAAGH;AAAvB,CAA/B,EAA+D;AAC7E,QAAM;AAAEI,IAAAA,QAAF;AAAYC,IAAAA,cAAZ;AAA4BC,IAAAA;AAA5B,MAA4CP,kBAAkB,CAAE;AACrEG,IAAAA,QADqE;AAErEC,IAAAA;AAFqE,GAAF,CAApE;;AAKA,MAAK,CAAEE,cAAF,IAAoBA,cAAc,CAACE,MAAf,KAA0B,CAAnD,EAAuD;AACtD,WAAO,IAAP;AACA;;AACD,SACC,8BACGF,cAAc,CAACG,GAAf,CAAsBC,KAAF,IAAa;AAClC,UAAMC,YAAY,GAAGD,KAAK,CAACE,KAAN,IAAeF,KAAK,CAACG,IAA1C;AACA,WACC,cAAC,QAAD;AACC,MAAA,GAAG,EAAGH,KAAK,CAACG,IADb;AAEC,MAAA,IAAI,EAAGN,WAAW,CAACM,IAAZ,KAAqBH,KAAK,CAACG,IAA3B,GAAkCd,KAAlC,GAA0C,IAFlD;AAGC,MAAA,OAAO,EAAG,MAAMM,QAAQ,CAAEK,KAAF;AAHzB,OAKC,cAAC,IAAD;AACC,MAAA,EAAE,EAAC,MADJ;AAEC,MAAA,KAAK,EAAG,EAFT;AAGC,MAAA,aAAa,EAAC,MAHf;AAIC,MAAA,QAAQ;AAJT,OAMGC,YANH,CALD,CADD;AAgBA,GAlBC,CADH,CADD;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem, __experimentalText as Text } from '@wordpress/components';\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useStylesForBlocks from './use-styles-for-block';\n\nconst noop = () => {};\n\nexport default function BlockStylesMenuItems( { clientId, onSwitch = noop } ) {\n\tconst { onSelect, stylesToRender, activeStyle } = useStylesForBlocks( {\n\t\tclientId,\n\t\tonSwitch,\n\t} );\n\n\tif ( ! stylesToRender || stylesToRender.length === 0 ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<>\n\t\t\t{ stylesToRender.map( ( style ) => {\n\t\t\t\tconst menuItemText = style.label || style.name;\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ style.name }\n\t\t\t\t\t\ticon={ activeStyle.name === style.name ? check : null }\n\t\t\t\t\t\tonClick={ () => onSelect( style ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\tlimit={ 18 }\n\t\t\t\t\t\t\tellipsizeMode=\"tail\"\n\t\t\t\t\t\t\ttruncate\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ menuItemText }\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"names":["MenuItem","__experimentalText","Text","check","useStylesForBlocks","noop","BlockStylesMenuItems","clientId","onSwitch","onSelect","stylesToRender","activeStyle","length","createElement","Fragment","map","style","menuItemText","label","name","key","icon","onClick","as","limit","ellipsizeMode","truncate"],"sources":["@wordpress/block-editor/src/components/block-styles/menu-items.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem, __experimentalText as Text } from '@wordpress/components';\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport useStylesForBlocks from './use-styles-for-block';\n\nconst noop = () => {};\n\nexport default function BlockStylesMenuItems( { clientId, onSwitch = noop } ) {\n\tconst { onSelect, stylesToRender, activeStyle } = useStylesForBlocks( {\n\t\tclientId,\n\t\tonSwitch,\n\t} );\n\n\tif ( ! stylesToRender || stylesToRender.length === 0 ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<>\n\t\t\t{ stylesToRender.map( ( style ) => {\n\t\t\t\tconst menuItemText = style.label || style.name;\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ style.name }\n\t\t\t\t\t\ticon={ activeStyle.name === style.name ? check : null }\n\t\t\t\t\t\tonClick={ () => onSelect( style ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\tlimit={ 18 }\n\t\t\t\t\t\t\tellipsizeMode=\"tail\"\n\t\t\t\t\t\t\ttruncate\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ menuItemText }\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,EAAEC,kBAAkB,IAAIC,IAAI,QAAQ,uBAAuB;AAC5E,SAASC,KAAK,QAAQ,kBAAkB;;AAExC;AACA;AACA;AACA,OAAOC,kBAAkB,MAAM,wBAAwB;AAEvD,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,eAAe,SAASC,oBAAoBA,CAAE;EAAEC,QAAQ;EAAEC,QAAQ,GAAGH;AAAK,CAAC,EAAG;EAC7E,MAAM;IAAEI,QAAQ;IAAEC,cAAc;IAAEC;EAAY,CAAC,GAAGP,kBAAkB,CAAE;IACrEG,QAAQ;IACRC;EACD,CAAE,CAAC;EAEH,IAAK,CAAEE,cAAc,IAAIA,cAAc,CAACE,MAAM,KAAK,CAAC,EAAG;IACtD,OAAO,IAAI;EACZ;EACA,OACCC,aAAA,CAAAC,QAAA,QACGJ,cAAc,CAACK,GAAG,CAAIC,KAAK,IAAM;IAClC,MAAMC,YAAY,GAAGD,KAAK,CAACE,KAAK,IAAIF,KAAK,CAACG,IAAI;IAC9C,OACCN,aAAA,CAACb,QAAQ;MACRoB,GAAG,EAAGJ,KAAK,CAACG,IAAM;MAClBE,IAAI,EAAGV,WAAW,CAACQ,IAAI,KAAKH,KAAK,CAACG,IAAI,GAAGhB,KAAK,GAAG,IAAM;MACvDmB,OAAO,EAAGA,CAAA,KAAMb,QAAQ,CAAEO,KAAM;IAAG,GAEnCH,aAAA,CAACX,IAAI;MACJqB,EAAE,EAAC,MAAM;MACTC,KAAK,EAAG,EAAI;MACZC,aAAa,EAAC,MAAM;MACpBC,QAAQ;IAAA,GAENT,YACG,CACG,CAAC;EAEb,CAAE,CACD,CAAC;AAEL"}

package/build-module/components/block-styles/preview-panel.js

@@ -1,14 +1,13 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
 import { getBlockType } from '@wordpress/blocks';
 import { useMemo } from '@wordpress/element';
+
 /**
  * Internal dependencies
  */
-
 import InserterPreviewPanel from '../inserter/preview-panel';
 import { replaceActiveStyle } from './utils';
 export default function BlockStylesPreviewPanel({
@@ -20,10 +19,12 @@ export default function BlockStylesPreviewPanel({
   const example = getBlockType(genericPreviewBlock.name)?.example;
   const styleClassName = replaceActiveStyle(className, activeStyle, style);
   const previewBlocks = useMemo(() => {
-    return { ...genericPreviewBlock,
+    return {
+      ...genericPreviewBlock,
       title: style.label || style.name,
       description: style.description,
-      initialAttributes: { ...genericPreviewBlock.attributes,
+      initialAttributes: {
+        ...genericPreviewBlock.attributes,
         className: styleClassName + ' block-editor-block-styles__block-preview-container'
       },
       example

package/build-module/components/block-styles/preview-panel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-styles/preview-panel.js"],"names":["getBlockType","useMemo","InserterPreviewPanel","replaceActiveStyle","BlockStylesPreviewPanel","genericPreviewBlock","style","className","activeStyle","example","name","styleClassName","previewBlocks","title","label","description","initialAttributes","attributes"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,YAAT,QAA6B,mBAA7B;AACA,SAASC,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,SAASC,kBAAT,QAAmC,SAAnC;AAEA,eAAe,SAASC,uBAAT,CAAkC;AAChDC,EAAAA,mBADgD;AAEhDC,EAAAA,KAFgD;AAGhDC,EAAAA,SAHgD;AAIhDC,EAAAA;AAJgD,CAAlC,EAKX;AACH,QAAMC,OAAO,GAAGT,YAAY,CAAEK,mBAAmB,CAACK,IAAtB,CAAZ,EAA0CD,OAA1D;AACA,QAAME,cAAc,GAAGR,kBAAkB,CAAEI,SAAF,EAAaC,WAAb,EAA0BF,KAA1B,CAAzC;AACA,QAAMM,aAAa,GAAGX,OAAO,CAAE,MAAM;AACpC,WAAO,EACN,GAAGI,mBADG;AAENQ,MAAAA,KAAK,EAAEP,KAAK,CAACQ,KAAN,IAAeR,KAAK,CAACI,IAFtB;AAGNK,MAAAA,WAAW,EAAET,KAAK,CAACS,WAHb;AAINC,MAAAA,iBAAiB,EAAE,EAClB,GAAGX,mBAAmB,CAACY,UADL;AAElBV,QAAAA,SAAS,EACRI,cAAc,GACd;AAJiB,OAJb;AAUNF,MAAAA;AAVM,KAAP;AAYA,GAb4B,EAa1B,CAAEJ,mBAAF,EAAuBM,cAAvB,CAb0B,CAA7B;AAeA,SAAO,cAAC,oBAAD;AAAsB,IAAA,IAAI,EAAGC;AAA7B,IAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InserterPreviewPanel from '../inserter/preview-panel';\nimport { replaceActiveStyle } from './utils';\n\nexport default function BlockStylesPreviewPanel( {\n\tgenericPreviewBlock,\n\tstyle,\n\tclassName,\n\tactiveStyle,\n} ) {\n\tconst example = getBlockType( genericPreviewBlock.name )?.example;\n\tconst styleClassName = replaceActiveStyle( className, activeStyle, style );\n\tconst previewBlocks = useMemo( () => {\n\t\treturn {\n\t\t\t...genericPreviewBlock,\n\t\t\ttitle: style.label || style.name,\n\t\t\tdescription: style.description,\n\t\t\tinitialAttributes: {\n\t\t\t\t...genericPreviewBlock.attributes,\n\t\t\t\tclassName:\n\t\t\t\t\tstyleClassName +\n\t\t\t\t\t' block-editor-block-styles__block-preview-container',\n\t\t\t},\n\t\t\texample,\n\t\t};\n\t}, [ genericPreviewBlock, styleClassName ] );\n\n\treturn <InserterPreviewPanel item={ previewBlocks } />;\n}\n"]}
+{"version":3,"names":["getBlockType","useMemo","InserterPreviewPanel","replaceActiveStyle","BlockStylesPreviewPanel","genericPreviewBlock","style","className","activeStyle","example","name","styleClassName","previewBlocks","title","label","description","initialAttributes","attributes","createElement","item"],"sources":["@wordpress/block-editor/src/components/block-styles/preview-panel.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InserterPreviewPanel from '../inserter/preview-panel';\nimport { replaceActiveStyle } from './utils';\n\nexport default function BlockStylesPreviewPanel( {\n\tgenericPreviewBlock,\n\tstyle,\n\tclassName,\n\tactiveStyle,\n} ) {\n\tconst example = getBlockType( genericPreviewBlock.name )?.example;\n\tconst styleClassName = replaceActiveStyle( className, activeStyle, style );\n\tconst previewBlocks = useMemo( () => {\n\t\treturn {\n\t\t\t...genericPreviewBlock,\n\t\t\ttitle: style.label || style.name,\n\t\t\tdescription: style.description,\n\t\t\tinitialAttributes: {\n\t\t\t\t...genericPreviewBlock.attributes,\n\t\t\t\tclassName:\n\t\t\t\t\tstyleClassName +\n\t\t\t\t\t' block-editor-block-styles__block-preview-container',\n\t\t\t},\n\t\t\texample,\n\t\t};\n\t}, [ genericPreviewBlock, styleClassName ] );\n\n\treturn <InserterPreviewPanel item={ previewBlocks } />;\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,OAAO,QAAQ,oBAAoB;;AAE5C;AACA;AACA;AACA,OAAOC,oBAAoB,MAAM,2BAA2B;AAC5D,SAASC,kBAAkB,QAAQ,SAAS;AAE5C,eAAe,SAASC,uBAAuBA,CAAE;EAChDC,mBAAmB;EACnBC,KAAK;EACLC,SAAS;EACTC;AACD,CAAC,EAAG;EACH,MAAMC,OAAO,GAAGT,YAAY,CAAEK,mBAAmB,CAACK,IAAK,CAAC,EAAED,OAAO;EACjE,MAAME,cAAc,GAAGR,kBAAkB,CAAEI,SAAS,EAAEC,WAAW,EAAEF,KAAM,CAAC;EAC1E,MAAMM,aAAa,GAAGX,OAAO,CAAE,MAAM;IACpC,OAAO;MACN,GAAGI,mBAAmB;MACtBQ,KAAK,EAAEP,KAAK,CAACQ,KAAK,IAAIR,KAAK,CAACI,IAAI;MAChCK,WAAW,EAAET,KAAK,CAACS,WAAW;MAC9BC,iBAAiB,EAAE;QAClB,GAAGX,mBAAmB,CAACY,UAAU;QACjCV,SAAS,EACRI,cAAc,GACd;MACF,CAAC;MACDF;IACD,CAAC;EACF,CAAC,EAAE,CAAEJ,mBAAmB,EAAEM,cAAc,CAAG,CAAC;EAE5C,OAAOO,aAAA,CAAChB,oBAAoB;IAACiB,IAAI,EAAGP;EAAe,CAAE,CAAC;AACvD"}

package/build-module/components/block-styles/preview.native.js

@@ -1,24 +1,22 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import { View, TouchableWithoutFeedback, Text, Dimensions, Animated, Easing, Image } from 'react-native';
+
 /**
  * WordPress dependencies
  */
-
 import { BottomSheet } from '@wordpress/components';
 import { useState, useEffect, useRef } from '@wordpress/element';
 import { usePreferredColorSchemeStyle } from '@wordpress/compose';
+
 /**
  * Internal dependencies
  */
-
 import styles from './style.scss';
 const MAX_ITEM_WIDTH = 120;
 const HALF_COLUMN = 0.5;
-
 function StylePreview({
   onPress,
   isActive,
@@ -31,13 +29,12 @@ function StylePreview({
     name
   } = style;
   const opacity = useRef(new Animated.Value(1)).current;
-
   function onLayout() {
-    const columnsNum = // To indicate scroll availabilty, there is a need to display additional half the column.
+    const columnsNum =
+    // To indicate scroll availabilty, there is a need to display additional half the column.
     Math.floor(BottomSheet.getWidth() / MAX_ITEM_WIDTH) + HALF_COLUMN;
     setItemWidth(BottomSheet.getWidth() / columnsNum);
   }
-
   useEffect(() => {
     onLayout();
     const dimensionsChangeSubscription = Dimensions.addEventListener('change', onLayout);
@@ -46,7 +43,6 @@ function StylePreview({
     };
   }, []);
   const labelStyle = usePreferredColorSchemeStyle(styles.label, styles.labelDark);
-
   const animateOutline = () => {
     opacity.setValue(0);
     Animated.timing(opacity, {
@@ -56,9 +52,7 @@ function StylePreview({
       easing: Easing.linear
     }).start();
   };
-
   const innerOutlineStyle = usePreferredColorSchemeStyle(styles.innerOutline, styles.innerOutlineDark);
-
   const getOutline = outlineStyles => outlineStyles.map((outlineStyle, index) => {
     return createElement(Animated.View, {
       style: [outlineStyle, {
@@ -67,7 +61,6 @@ function StylePreview({
       key: index
     });
   });
-
   return createElement(TouchableWithoutFeedback, {
     onPress: () => {
       onPress();
@@ -88,6 +81,5 @@ function StylePreview({
     style: [labelStyle, isActive && styles.labelSelected]
   }, label)));
 }
-
 export default StylePreview;
 //# sourceMappingURL=preview.native.js.map

package/build-module/components/block-styles/preview.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-styles/preview.native.js"],"names":["View","TouchableWithoutFeedback","Text","Dimensions","Animated","Easing","Image","BottomSheet","useState","useEffect","useRef","usePreferredColorSchemeStyle","styles","MAX_ITEM_WIDTH","HALF_COLUMN","StylePreview","onPress","isActive","style","url","itemWidth","setItemWidth","label","name","opacity","Value","current","onLayout","columnsNum","Math","floor","getWidth","dimensionsChangeSubscription","addEventListener","remove","labelStyle","labelDark","animateOutline","setValue","timing","toValue","duration","useNativeDriver","easing","linear","start","innerOutlineStyle","innerOutline","innerOutlineDark","getOutline","outlineStyles","map","outlineStyle","index","container","width","imageWrapper","outline","image","uri","labelSelected"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tView,\n\tTouchableWithoutFeedback,\n\tText,\n\tDimensions,\n\tAnimated,\n\tEasing,\n\tImage,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { BottomSheet } from '@wordpress/components';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst MAX_ITEM_WIDTH = 120;\nconst HALF_COLUMN = 0.5;\n\nfunction StylePreview( { onPress, isActive, style, url } ) {\n\tconst [ itemWidth, setItemWidth ] = useState( MAX_ITEM_WIDTH );\n\tconst { label, name } = style;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tfunction onLayout() {\n\t\tconst columnsNum =\n\t\t\t// To indicate scroll availabilty, there is a need to display additional half the column.\n\t\t\tMath.floor( BottomSheet.getWidth() / MAX_ITEM_WIDTH ) + HALF_COLUMN;\n\t\tsetItemWidth( BottomSheet.getWidth() / columnsNum );\n\t}\n\n\tuseEffect( () => {\n\t\tonLayout();\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonLayout\n\t\t);\n\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tconst labelStyle = usePreferredColorSchemeStyle(\n\t\tstyles.label,\n\t\tstyles.labelDark\n\t);\n\n\tconst animateOutline = () => {\n\t\topacity.setValue( 0 );\n\t\tAnimated.timing( opacity, {\n\t\t\ttoValue: 1,\n\t\t\tduration: 100,\n\t\t\tuseNativeDriver: true,\n\t\t\teasing: Easing.linear,\n\t\t} ).start();\n\t};\n\n\tconst innerOutlineStyle = usePreferredColorSchemeStyle(\n\t\tstyles.innerOutline,\n\t\tstyles.innerOutlineDark\n\t);\n\n\tconst getOutline = ( outlineStyles ) =>\n\t\toutlineStyles.map( ( outlineStyle, index ) => {\n\t\t\treturn (\n\t\t\t\t<Animated.View\n\t\t\t\t\tstyle={ [ outlineStyle, { opacity }, styles[ name ] ] }\n\t\t\t\t\tkey={ index }\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\n\treturn (\n\t\t<TouchableWithoutFeedback\n\t\t\tonPress={ () => {\n\t\t\t\tonPress();\n\t\t\t\tanimateOutline();\n\t\t\t} }\n\t\t>\n\t\t\t<View style={ [ styles.container, { width: itemWidth } ] }>\n\t\t\t\t<View style={ styles.imageWrapper }>\n\t\t\t\t\t{ isActive &&\n\t\t\t\t\t\tgetOutline( [ styles.outline, innerOutlineStyle ] ) }\n\t\t\t\t\t<Image\n\t\t\t\t\t\tstyle={ [ styles.image, styles[ name ] ] }\n\t\t\t\t\t\tsource={ { uri: url } }\n\t\t\t\t\t/>\n\t\t\t\t</View>\n\t\t\t\t<Text\n\t\t\t\t\tstyle={ [ labelStyle, isActive && styles.labelSelected ] }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</Text>\n\t\t\t</View>\n\t\t</TouchableWithoutFeedback>\n\t);\n}\n\nexport default StylePreview;\n"]}
+{"version":3,"names":["View","TouchableWithoutFeedback","Text","Dimensions","Animated","Easing","Image","BottomSheet","useState","useEffect","useRef","usePreferredColorSchemeStyle","styles","MAX_ITEM_WIDTH","HALF_COLUMN","StylePreview","onPress","isActive","style","url","itemWidth","setItemWidth","label","name","opacity","Value","current","onLayout","columnsNum","Math","floor","getWidth","dimensionsChangeSubscription","addEventListener","remove","labelStyle","labelDark","animateOutline","setValue","timing","toValue","duration","useNativeDriver","easing","linear","start","innerOutlineStyle","innerOutline","innerOutlineDark","getOutline","outlineStyles","map","outlineStyle","index","createElement","key","container","width","imageWrapper","outline","image","source","uri","labelSelected"],"sources":["@wordpress/block-editor/src/components/block-styles/preview.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tView,\n\tTouchableWithoutFeedback,\n\tText,\n\tDimensions,\n\tAnimated,\n\tEasing,\n\tImage,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { BottomSheet } from '@wordpress/components';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst MAX_ITEM_WIDTH = 120;\nconst HALF_COLUMN = 0.5;\n\nfunction StylePreview( { onPress, isActive, style, url } ) {\n\tconst [ itemWidth, setItemWidth ] = useState( MAX_ITEM_WIDTH );\n\tconst { label, name } = style;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tfunction onLayout() {\n\t\tconst columnsNum =\n\t\t\t// To indicate scroll availabilty, there is a need to display additional half the column.\n\t\t\tMath.floor( BottomSheet.getWidth() / MAX_ITEM_WIDTH ) + HALF_COLUMN;\n\t\tsetItemWidth( BottomSheet.getWidth() / columnsNum );\n\t}\n\n\tuseEffect( () => {\n\t\tonLayout();\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonLayout\n\t\t);\n\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tconst labelStyle = usePreferredColorSchemeStyle(\n\t\tstyles.label,\n\t\tstyles.labelDark\n\t);\n\n\tconst animateOutline = () => {\n\t\topacity.setValue( 0 );\n\t\tAnimated.timing( opacity, {\n\t\t\ttoValue: 1,\n\t\t\tduration: 100,\n\t\t\tuseNativeDriver: true,\n\t\t\teasing: Easing.linear,\n\t\t} ).start();\n\t};\n\n\tconst innerOutlineStyle = usePreferredColorSchemeStyle(\n\t\tstyles.innerOutline,\n\t\tstyles.innerOutlineDark\n\t);\n\n\tconst getOutline = ( outlineStyles ) =>\n\t\toutlineStyles.map( ( outlineStyle, index ) => {\n\t\t\treturn (\n\t\t\t\t<Animated.View\n\t\t\t\t\tstyle={ [ outlineStyle, { opacity }, styles[ name ] ] }\n\t\t\t\t\tkey={ index }\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\n\treturn (\n\t\t<TouchableWithoutFeedback\n\t\t\tonPress={ () => {\n\t\t\t\tonPress();\n\t\t\t\tanimateOutline();\n\t\t\t} }\n\t\t>\n\t\t\t<View style={ [ styles.container, { width: itemWidth } ] }>\n\t\t\t\t<View style={ styles.imageWrapper }>\n\t\t\t\t\t{ isActive &&\n\t\t\t\t\t\tgetOutline( [ styles.outline, innerOutlineStyle ] ) }\n\t\t\t\t\t<Image\n\t\t\t\t\t\tstyle={ [ styles.image, styles[ name ] ] }\n\t\t\t\t\t\tsource={ { uri: url } }\n\t\t\t\t\t/>\n\t\t\t\t</View>\n\t\t\t\t<Text\n\t\t\t\t\tstyle={ [ labelStyle, isActive && styles.labelSelected ] }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</Text>\n\t\t\t</View>\n\t\t</TouchableWithoutFeedback>\n\t);\n}\n\nexport default StylePreview;\n"],"mappings":"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"}

package/build-module/components/block-styles/use-styles-for-block.js

@@ -4,36 +4,35 @@
 import { useDispatch, useSelect } from '@wordpress/data';
 import { cloneBlock, getBlockType, getBlockFromExample, store as blocksStore } from '@wordpress/blocks';
 import { useMemo } from '@wordpress/element';
+
 /**
  * Internal dependencies
  */
-
 import { getActiveStyle, getRenderedStyles, replaceActiveStyle } from './utils';
 import { store as blockEditorStore } from '../../store';
+
 /**
  *
  * @param {WPBlock}     block Block object.
  * @param {WPBlockType} type  Block type settings.
  * @return {WPBlock}          A generic block ready for styles preview.
  */
-
 function useGenericPreviewBlock(block, type) {
   return useMemo(() => {
     const example = type?.example;
     const blockName = type?.name;
-
     if (example && blockName) {
       return getBlockFromExample(blockName, {
         attributes: example.attributes,
         innerBlocks: example.innerBlocks
       });
     }
-
     if (block) {
       return cloneBlock(block);
     }
   }, [type?.example ? block?.name : block, type]);
 }
+
 /**
  * @typedef useStylesForBlocksArguments
  * @property {string}     clientId Block client ID.
@@ -45,8 +44,6 @@ function useGenericPreviewBlock(block, type) {
  * @param {useStylesForBlocksArguments} useStylesForBlocks arguments.
  * @return {Object}                                         Results of the select methods.
  */
-
-
 export default function useStylesForBlocks({
   clientId,
   onSwitch
@@ -56,11 +53,9 @@ export default function useStylesForBlocks({
       getBlock
     } = select(blockEditorStore);
     const block = getBlock(clientId);
-
     if (!block) {
       return {};
     }
-
     const blockType = getBlockType(block.name);
     const {
       getBlockStyles
@@ -72,7 +67,6 @@ export default function useStylesForBlocks({
       className: block.attributes.className || ''
     };
   };
-
   const {
     styles,
     block,
@@ -85,7 +79,6 @@ export default function useStylesForBlocks({
   const stylesToRender = getRenderedStyles(styles);
   const activeStyle = getActiveStyle(stylesToRender, className);
   const genericPreviewBlock = useGenericPreviewBlock(block, blockType);
-
   const onSelect = style => {
     const styleClassName = replaceActiveStyle(className, activeStyle, style);
     updateBlockAttributes(clientId, {
@@ -93,7 +86,6 @@ export default function useStylesForBlocks({
     });
     onSwitch();
   };
-
   return {
     onSelect,
     stylesToRender,

package/build-module/components/block-styles/use-styles-for-block.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-styles/use-styles-for-block.js"],"names":["useDispatch","useSelect","cloneBlock","getBlockType","getBlockFromExample","store","blocksStore","useMemo","getActiveStyle","getRenderedStyles","replaceActiveStyle","blockEditorStore","useGenericPreviewBlock","block","type","example","blockName","name","attributes","innerBlocks","useStylesForBlocks","clientId","onSwitch","selector","select","getBlock","blockType","getBlockStyles","styles","className","updateBlockAttributes","stylesToRender","activeStyle","genericPreviewBlock","onSelect","style","styleClassName"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport {\n\tcloneBlock,\n\tgetBlockType,\n\tgetBlockFromExample,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getActiveStyle, getRenderedStyles, replaceActiveStyle } from './utils';\nimport { store as blockEditorStore } from '../../store';\n\n/**\n *\n * @param {WPBlock}     block Block object.\n * @param {WPBlockType} type  Block type settings.\n * @return {WPBlock}          A generic block ready for styles preview.\n */\nfunction useGenericPreviewBlock( block, type ) {\n\treturn useMemo( () => {\n\t\tconst example = type?.example;\n\t\tconst blockName = type?.name;\n\n\t\tif ( example && blockName ) {\n\t\t\treturn getBlockFromExample( blockName, {\n\t\t\t\tattributes: example.attributes,\n\t\t\t\tinnerBlocks: example.innerBlocks,\n\t\t\t} );\n\t\t}\n\n\t\tif ( block ) {\n\t\t\treturn cloneBlock( block );\n\t\t}\n\t}, [ type?.example ? block?.name : block, type ] );\n}\n\n/**\n * @typedef useStylesForBlocksArguments\n * @property {string}     clientId Block client ID.\n * @property {() => void} onSwitch Block style switch callback function.\n */\n\n/**\n *\n * @param {useStylesForBlocksArguments} useStylesForBlocks arguments.\n * @return {Object}                                         Results of the select methods.\n */\nexport default function useStylesForBlocks( { clientId, onSwitch } ) {\n\tconst selector = ( select ) => {\n\t\tconst { getBlock } = select( blockEditorStore );\n\t\tconst block = getBlock( clientId );\n\n\t\tif ( ! block ) {\n\t\t\treturn {};\n\t\t}\n\t\tconst blockType = getBlockType( block.name );\n\t\tconst { getBlockStyles } = select( blocksStore );\n\n\t\treturn {\n\t\t\tblock,\n\t\t\tblockType,\n\t\t\tstyles: getBlockStyles( block.name ),\n\t\t\tclassName: block.attributes.className || '',\n\t\t};\n\t};\n\tconst { styles, block, blockType, className } = useSelect( selector, [\n\t\tclientId,\n\t] );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst stylesToRender = getRenderedStyles( styles );\n\tconst activeStyle = getActiveStyle( stylesToRender, className );\n\tconst genericPreviewBlock = useGenericPreviewBlock( block, blockType );\n\n\tconst onSelect = ( style ) => {\n\t\tconst styleClassName = replaceActiveStyle(\n\t\t\tclassName,\n\t\t\tactiveStyle,\n\t\t\tstyle\n\t\t);\n\t\tupdateBlockAttributes( clientId, {\n\t\t\tclassName: styleClassName,\n\t\t} );\n\t\tonSwitch();\n\t};\n\n\treturn {\n\t\tonSelect,\n\t\tstylesToRender,\n\t\tactiveStyle,\n\t\tgenericPreviewBlock,\n\t\tclassName,\n\t};\n}\n"]}
+{"version":3,"names":["useDispatch","useSelect","cloneBlock","getBlockType","getBlockFromExample","store","blocksStore","useMemo","getActiveStyle","getRenderedStyles","replaceActiveStyle","blockEditorStore","useGenericPreviewBlock","block","type","example","blockName","name","attributes","innerBlocks","useStylesForBlocks","clientId","onSwitch","selector","select","getBlock","blockType","getBlockStyles","styles","className","updateBlockAttributes","stylesToRender","activeStyle","genericPreviewBlock","onSelect","style","styleClassName"],"sources":["@wordpress/block-editor/src/components/block-styles/use-styles-for-block.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport {\n\tcloneBlock,\n\tgetBlockType,\n\tgetBlockFromExample,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getActiveStyle, getRenderedStyles, replaceActiveStyle } from './utils';\nimport { store as blockEditorStore } from '../../store';\n\n/**\n *\n * @param {WPBlock}     block Block object.\n * @param {WPBlockType} type  Block type settings.\n * @return {WPBlock}          A generic block ready for styles preview.\n */\nfunction useGenericPreviewBlock( block, type ) {\n\treturn useMemo( () => {\n\t\tconst example = type?.example;\n\t\tconst blockName = type?.name;\n\n\t\tif ( example && blockName ) {\n\t\t\treturn getBlockFromExample( blockName, {\n\t\t\t\tattributes: example.attributes,\n\t\t\t\tinnerBlocks: example.innerBlocks,\n\t\t\t} );\n\t\t}\n\n\t\tif ( block ) {\n\t\t\treturn cloneBlock( block );\n\t\t}\n\t}, [ type?.example ? block?.name : block, type ] );\n}\n\n/**\n * @typedef useStylesForBlocksArguments\n * @property {string}     clientId Block client ID.\n * @property {() => void} onSwitch Block style switch callback function.\n */\n\n/**\n *\n * @param {useStylesForBlocksArguments} useStylesForBlocks arguments.\n * @return {Object}                                         Results of the select methods.\n */\nexport default function useStylesForBlocks( { clientId, onSwitch } ) {\n\tconst selector = ( select ) => {\n\t\tconst { getBlock } = select( blockEditorStore );\n\t\tconst block = getBlock( clientId );\n\n\t\tif ( ! block ) {\n\t\t\treturn {};\n\t\t}\n\t\tconst blockType = getBlockType( block.name );\n\t\tconst { getBlockStyles } = select( blocksStore );\n\n\t\treturn {\n\t\t\tblock,\n\t\t\tblockType,\n\t\t\tstyles: getBlockStyles( block.name ),\n\t\t\tclassName: block.attributes.className || '',\n\t\t};\n\t};\n\tconst { styles, block, blockType, className } = useSelect( selector, [\n\t\tclientId,\n\t] );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst stylesToRender = getRenderedStyles( styles );\n\tconst activeStyle = getActiveStyle( stylesToRender, className );\n\tconst genericPreviewBlock = useGenericPreviewBlock( block, blockType );\n\n\tconst onSelect = ( style ) => {\n\t\tconst styleClassName = replaceActiveStyle(\n\t\t\tclassName,\n\t\t\tactiveStyle,\n\t\t\tstyle\n\t\t);\n\t\tupdateBlockAttributes( clientId, {\n\t\t\tclassName: styleClassName,\n\t\t} );\n\t\tonSwitch();\n\t};\n\n\treturn {\n\t\tonSelect,\n\t\tstylesToRender,\n\t\tactiveStyle,\n\t\tgenericPreviewBlock,\n\t\tclassName,\n\t};\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;AACxD,SACCC,UAAU,EACVC,YAAY,EACZC,mBAAmB,EACnBC,KAAK,IAAIC,WAAW,QACd,mBAAmB;AAC1B,SAASC,OAAO,QAAQ,oBAAoB;;AAE5C;AACA;AACA;AACA,SAASC,cAAc,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAQ,SAAS;AAC/E,SAASL,KAAK,IAAIM,gBAAgB,QAAQ,aAAa;;AAEvD;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,sBAAsBA,CAAEC,KAAK,EAAEC,IAAI,EAAG;EAC9C,OAAOP,OAAO,CAAE,MAAM;IACrB,MAAMQ,OAAO,GAAGD,IAAI,EAAEC,OAAO;IAC7B,MAAMC,SAAS,GAAGF,IAAI,EAAEG,IAAI;IAE5B,IAAKF,OAAO,IAAIC,SAAS,EAAG;MAC3B,OAAOZ,mBAAmB,CAAEY,SAAS,EAAE;QACtCE,UAAU,EAAEH,OAAO,CAACG,UAAU;QAC9BC,WAAW,EAAEJ,OAAO,CAACI;MACtB,CAAE,CAAC;IACJ;IAEA,IAAKN,KAAK,EAAG;MACZ,OAAOX,UAAU,CAAEW,KAAM,CAAC;IAC3B;EACD,CAAC,EAAE,CAAEC,IAAI,EAAEC,OAAO,GAAGF,KAAK,EAAEI,IAAI,GAAGJ,KAAK,EAAEC,IAAI,CAAG,CAAC;AACnD;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASM,kBAAkBA,CAAE;EAAEC,QAAQ;EAAEC;AAAS,CAAC,EAAG;EACpE,MAAMC,QAAQ,GAAKC,MAAM,IAAM;IAC9B,MAAM;MAAEC;IAAS,CAAC,GAAGD,MAAM,CAAEb,gBAAiB,CAAC;IAC/C,MAAME,KAAK,GAAGY,QAAQ,CAAEJ,QAAS,CAAC;IAElC,IAAK,CAAER,KAAK,EAAG;MACd,OAAO,CAAC,CAAC;IACV;IACA,MAAMa,SAAS,GAAGvB,YAAY,CAAEU,KAAK,CAACI,IAAK,CAAC;IAC5C,MAAM;MAAEU;IAAe,CAAC,GAAGH,MAAM,CAAElB,WAAY,CAAC;IAEhD,OAAO;MACNO,KAAK;MACLa,SAAS;MACTE,MAAM,EAAED,cAAc,CAAEd,KAAK,CAACI,IAAK,CAAC;MACpCY,SAAS,EAAEhB,KAAK,CAACK,UAAU,CAACW,SAAS,IAAI;IAC1C,CAAC;EACF,CAAC;EACD,MAAM;IAAED,MAAM;IAAEf,KAAK;IAAEa,SAAS;IAAEG;EAAU,CAAC,GAAG5B,SAAS,CAAEsB,QAAQ,EAAE,CACpEF,QAAQ,CACP,CAAC;EACH,MAAM;IAAES;EAAsB,CAAC,GAAG9B,WAAW,CAAEW,gBAAiB,CAAC;EACjE,MAAMoB,cAAc,GAAGtB,iBAAiB,CAAEmB,MAAO,CAAC;EAClD,MAAMI,WAAW,GAAGxB,cAAc,CAAEuB,cAAc,EAAEF,SAAU,CAAC;EAC/D,MAAMI,mBAAmB,GAAGrB,sBAAsB,CAAEC,KAAK,EAAEa,SAAU,CAAC;EAEtE,MAAMQ,QAAQ,GAAKC,KAAK,IAAM;IAC7B,MAAMC,cAAc,GAAG1B,kBAAkB,CACxCmB,SAAS,EACTG,WAAW,EACXG,KACD,CAAC;IACDL,qBAAqB,CAAET,QAAQ,EAAE;MAChCQ,SAAS,EAAEO;IACZ,CAAE,CAAC;IACHd,QAAQ,CAAC,CAAC;EACX,CAAC;EAED,OAAO;IACNY,QAAQ;IACRH,cAAc;IACdC,WAAW;IACXC,mBAAmB;IACnBJ;EACD,CAAC;AACF"}

package/build-module/components/block-styles/utils.js

@@ -3,6 +3,7 @@
  */
 import TokenList from '@wordpress/token-list';
 import { _x } from '@wordpress/i18n';
+
 /**
  * Returns the active style from the given className.
  *
@@ -11,25 +12,22 @@ import { _x } from '@wordpress/i18n';
  *
  * @return {Object?} The active style.
  */
-
 export function getActiveStyle(styles, className) {
   for (const style of new TokenList(className).values()) {
     if (style.indexOf('is-style-') === -1) {
       continue;
     }
-
     const potentialStyleName = style.substring(9);
     const activeStyle = styles?.find(({
       name
     }) => name === potentialStyleName);
-
     if (activeStyle) {
       return activeStyle;
     }
   }
-
   return getDefaultStyle(styles);
 }
+
 /**
  * Replaces the active style in the block's className.
  *
@@ -39,17 +37,15 @@ export function getActiveStyle(styles, className) {
  *
  * @return {string} The updated className.
  */
-
 export function replaceActiveStyle(className, activeStyle, newStyle) {
   const list = new TokenList(className);
-
   if (activeStyle) {
     list.remove('is-style-' + activeStyle.name);
   }
-
   list.add('is-style-' + newStyle.name);
   return list.value;
 }
+
 /**
  * Returns a collection of styles that can be represented on the frontend.
  * The function checks a style collection for a default style. If none is found, it adds one to
@@ -60,18 +56,17 @@ export function replaceActiveStyle(className, activeStyle, newStyle) {
  *
  * @return {Array<Object?>}        The style collection.
  */
-
 export function getRenderedStyles(styles) {
   if (!styles || styles.length === 0) {
     return [];
   }
-
   return getDefaultStyle(styles) ? styles : [{
     name: 'default',
     label: _x('Default', 'block style'),
     isDefault: true
   }, ...styles];
 }
+
 /**
  * Returns a style object from a collection of styles where that style object is the default block style.
  *
@@ -79,7 +74,6 @@ export function getRenderedStyles(styles) {
  *
  * @return {Object?}        The default style object, if found.
  */
-
 export function getDefaultStyle(styles) {
   return styles?.find(style => style.isDefault);
 }

package/build-module/components/block-styles/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-styles/utils.js"],"names":["TokenList","_x","getActiveStyle","styles","className","style","values","indexOf","potentialStyleName","substring","activeStyle","find","name","getDefaultStyle","replaceActiveStyle","newStyle","list","remove","add","value","getRenderedStyles","length","label","isDefault"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAP,MAAsB,uBAAtB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,cAAT,CAAyBC,MAAzB,EAAiCC,SAAjC,EAA6C;AACnD,OAAM,MAAMC,KAAZ,IAAqB,IAAIL,SAAJ,CAAeI,SAAf,EAA2BE,MAA3B,EAArB,EAA2D;AAC1D,QAAKD,KAAK,CAACE,OAAN,CAAe,WAAf,MAAiC,CAAC,CAAvC,EAA2C;AAC1C;AACA;;AAED,UAAMC,kBAAkB,GAAGH,KAAK,CAACI,SAAN,CAAiB,CAAjB,CAA3B;AACA,UAAMC,WAAW,GAAGP,MAAM,EAAEQ,IAAR,CACnB,CAAE;AAAEC,MAAAA;AAAF,KAAF,KAAgBA,IAAI,KAAKJ,kBADN,CAApB;;AAGA,QAAKE,WAAL,EAAmB;AAClB,aAAOA,WAAP;AACA;AACD;;AAED,SAAOG,eAAe,CAAEV,MAAF,CAAtB;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASW,kBAAT,CAA6BV,SAA7B,EAAwCM,WAAxC,EAAqDK,QAArD,EAAgE;AACtE,QAAMC,IAAI,GAAG,IAAIhB,SAAJ,CAAeI,SAAf,CAAb;;AAEA,MAAKM,WAAL,EAAmB;AAClBM,IAAAA,IAAI,CAACC,MAAL,CAAa,cAAcP,WAAW,CAACE,IAAvC;AACA;;AAEDI,EAAAA,IAAI,CAACE,GAAL,CAAU,cAAcH,QAAQ,CAACH,IAAjC;AAEA,SAAOI,IAAI,CAACG,KAAZ;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,iBAAT,CAA4BjB,MAA5B,EAAqC;AAC3C,MAAK,CAAEA,MAAF,IAAYA,MAAM,CAACkB,MAAP,KAAkB,CAAnC,EAAuC;AACtC,WAAO,EAAP;AACA;;AAED,SAAOR,eAAe,CAAEV,MAAF,CAAf,GACJA,MADI,GAEJ,CACA;AACCS,IAAAA,IAAI,EAAE,SADP;AAECU,IAAAA,KAAK,EAAErB,EAAE,CAAE,SAAF,EAAa,aAAb,CAFV;AAGCsB,IAAAA,SAAS,EAAE;AAHZ,GADA,EAMA,GAAGpB,MANH,CAFH;AAUA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASU,eAAT,CAA0BV,MAA1B,EAAmC;AACzC,SAAOA,MAAM,EAAEQ,IAAR,CAAgBN,KAAF,IAAaA,KAAK,CAACkB,SAAjC,CAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport TokenList from '@wordpress/token-list';\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Returns the active style from the given className.\n *\n * @param {Array}  styles    Block styles.\n * @param {string} className Class name\n *\n * @return {Object?} The active style.\n */\nexport function getActiveStyle( styles, className ) {\n\tfor ( const style of new TokenList( className ).values() ) {\n\t\tif ( style.indexOf( 'is-style-' ) === -1 ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst potentialStyleName = style.substring( 9 );\n\t\tconst activeStyle = styles?.find(\n\t\t\t( { name } ) => name === potentialStyleName\n\t\t);\n\t\tif ( activeStyle ) {\n\t\t\treturn activeStyle;\n\t\t}\n\t}\n\n\treturn getDefaultStyle( styles );\n}\n\n/**\n * Replaces the active style in the block's className.\n *\n * @param {string}  className   Class name.\n * @param {Object?} activeStyle The replaced style.\n * @param {Object}  newStyle    The replacing style.\n *\n * @return {string} The updated className.\n */\nexport function replaceActiveStyle( className, activeStyle, newStyle ) {\n\tconst list = new TokenList( className );\n\n\tif ( activeStyle ) {\n\t\tlist.remove( 'is-style-' + activeStyle.name );\n\t}\n\n\tlist.add( 'is-style-' + newStyle.name );\n\n\treturn list.value;\n}\n\n/**\n * Returns a collection of styles that can be represented on the frontend.\n * The function checks a style collection for a default style. If none is found, it adds one to\n * act as a fallback for when there is no active style applied to a block. The default item also serves\n * as a switch on the frontend to deactivate non-default styles.\n *\n * @param {Array} styles Block styles.\n *\n * @return {Array<Object?>}        The style collection.\n */\nexport function getRenderedStyles( styles ) {\n\tif ( ! styles || styles.length === 0 ) {\n\t\treturn [];\n\t}\n\n\treturn getDefaultStyle( styles )\n\t\t? styles\n\t\t: [\n\t\t\t\t{\n\t\t\t\t\tname: 'default',\n\t\t\t\t\tlabel: _x( 'Default', 'block style' ),\n\t\t\t\t\tisDefault: true,\n\t\t\t\t},\n\t\t\t\t...styles,\n\t\t  ];\n}\n\n/**\n * Returns a style object from a collection of styles where that style object is the default block style.\n *\n * @param {Array} styles Block styles.\n *\n * @return {Object?}        The default style object, if found.\n */\nexport function getDefaultStyle( styles ) {\n\treturn styles?.find( ( style ) => style.isDefault );\n}\n"]}
+{"version":3,"names":["TokenList","_x","getActiveStyle","styles","className","style","values","indexOf","potentialStyleName","substring","activeStyle","find","name","getDefaultStyle","replaceActiveStyle","newStyle","list","remove","add","value","getRenderedStyles","length","label","isDefault"],"sources":["@wordpress/block-editor/src/components/block-styles/utils.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport TokenList from '@wordpress/token-list';\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Returns the active style from the given className.\n *\n * @param {Array}  styles    Block styles.\n * @param {string} className Class name\n *\n * @return {Object?} The active style.\n */\nexport function getActiveStyle( styles, className ) {\n\tfor ( const style of new TokenList( className ).values() ) {\n\t\tif ( style.indexOf( 'is-style-' ) === -1 ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst potentialStyleName = style.substring( 9 );\n\t\tconst activeStyle = styles?.find(\n\t\t\t( { name } ) => name === potentialStyleName\n\t\t);\n\t\tif ( activeStyle ) {\n\t\t\treturn activeStyle;\n\t\t}\n\t}\n\n\treturn getDefaultStyle( styles );\n}\n\n/**\n * Replaces the active style in the block's className.\n *\n * @param {string}  className   Class name.\n * @param {Object?} activeStyle The replaced style.\n * @param {Object}  newStyle    The replacing style.\n *\n * @return {string} The updated className.\n */\nexport function replaceActiveStyle( className, activeStyle, newStyle ) {\n\tconst list = new TokenList( className );\n\n\tif ( activeStyle ) {\n\t\tlist.remove( 'is-style-' + activeStyle.name );\n\t}\n\n\tlist.add( 'is-style-' + newStyle.name );\n\n\treturn list.value;\n}\n\n/**\n * Returns a collection of styles that can be represented on the frontend.\n * The function checks a style collection for a default style. If none is found, it adds one to\n * act as a fallback for when there is no active style applied to a block. The default item also serves\n * as a switch on the frontend to deactivate non-default styles.\n *\n * @param {Array} styles Block styles.\n *\n * @return {Array<Object?>}        The style collection.\n */\nexport function getRenderedStyles( styles ) {\n\tif ( ! styles || styles.length === 0 ) {\n\t\treturn [];\n\t}\n\n\treturn getDefaultStyle( styles )\n\t\t? styles\n\t\t: [\n\t\t\t\t{\n\t\t\t\t\tname: 'default',\n\t\t\t\t\tlabel: _x( 'Default', 'block style' ),\n\t\t\t\t\tisDefault: true,\n\t\t\t\t},\n\t\t\t\t...styles,\n\t\t  ];\n}\n\n/**\n * Returns a style object from a collection of styles where that style object is the default block style.\n *\n * @param {Array} styles Block styles.\n *\n * @return {Object?}        The default style object, if found.\n */\nexport function getDefaultStyle( styles ) {\n\treturn styles?.find( ( style ) => style.isDefault );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,SAAS,MAAM,uBAAuB;AAC7C,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAEC,MAAM,EAAEC,SAAS,EAAG;EACnD,KAAM,MAAMC,KAAK,IAAI,IAAIL,SAAS,CAAEI,SAAU,CAAC,CAACE,MAAM,CAAC,CAAC,EAAG;IAC1D,IAAKD,KAAK,CAACE,OAAO,CAAE,WAAY,CAAC,KAAK,CAAC,CAAC,EAAG;MAC1C;IACD;IAEA,MAAMC,kBAAkB,GAAGH,KAAK,CAACI,SAAS,CAAE,CAAE,CAAC;IAC/C,MAAMC,WAAW,GAAGP,MAAM,EAAEQ,IAAI,CAC/B,CAAE;MAAEC;IAAK,CAAC,KAAMA,IAAI,KAAKJ,kBAC1B,CAAC;IACD,IAAKE,WAAW,EAAG;MAClB,OAAOA,WAAW;IACnB;EACD;EAEA,OAAOG,eAAe,CAAEV,MAAO,CAAC;AACjC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASW,kBAAkBA,CAAEV,SAAS,EAAEM,WAAW,EAAEK,QAAQ,EAAG;EACtE,MAAMC,IAAI,GAAG,IAAIhB,SAAS,CAAEI,SAAU,CAAC;EAEvC,IAAKM,WAAW,EAAG;IAClBM,IAAI,CAACC,MAAM,CAAE,WAAW,GAAGP,WAAW,CAACE,IAAK,CAAC;EAC9C;EAEAI,IAAI,CAACE,GAAG,CAAE,WAAW,GAAGH,QAAQ,CAACH,IAAK,CAAC;EAEvC,OAAOI,IAAI,CAACG,KAAK;AAClB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,iBAAiBA,CAAEjB,MAAM,EAAG;EAC3C,IAAK,CAAEA,MAAM,IAAIA,MAAM,CAACkB,MAAM,KAAK,CAAC,EAAG;IACtC,OAAO,EAAE;EACV;EAEA,OAAOR,eAAe,CAAEV,MAAO,CAAC,GAC7BA,MAAM,GACN,CACA;IACCS,IAAI,EAAE,SAAS;IACfU,KAAK,EAAErB,EAAE,CAAE,SAAS,EAAE,aAAc,CAAC;IACrCsB,SAAS,EAAE;EACZ,CAAC,EACD,GAAGpB,MAAM,CACR;AACL;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASU,eAAeA,CAAEV,MAAM,EAAG;EACzC,OAAOA,MAAM,EAAEQ,IAAI,CAAIN,KAAK,IAAMA,KAAK,CAACkB,SAAU,CAAC;AACpD"}

package/build-module/components/block-switcher/block-styles-menu.js

@@ -1,14 +1,13 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
 import { MenuGroup } from '@wordpress/components';
+
 /**
  * Internal dependencies
  */
-
 import BlockStylesMenuItems from '../block-styles/menu-items';
 export default function BlockStylesMenu({
   hoveredBlock,

package/build-module/components/block-switcher/block-styles-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-switcher/block-styles-menu.js"],"names":["__","MenuGroup","BlockStylesMenuItems","BlockStylesMenu","hoveredBlock","onSwitch","clientId"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,SAAT,QAA0B,uBAA1B;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,4BAAjC;AAEA,eAAe,SAASC,eAAT,CAA0B;AAAEC,EAAAA,YAAF;AAAgBC,EAAAA;AAAhB,CAA1B,EAAuD;AACrE,QAAM;AAAEC,IAAAA;AAAF,MAAeF,YAArB;AAEA,SACC,cAAC,SAAD;AACC,IAAA,KAAK,EAAGJ,EAAE,CAAE,QAAF,CADX;AAEC,IAAA,SAAS,EAAC;AAFX,KAIC,cAAC,oBAAD;AAAsB,IAAA,QAAQ,EAAGM,QAAjC;AAA4C,IAAA,QAAQ,EAAGD;AAAvD,IAJD,CADD;AAQA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { MenuGroup } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BlockStylesMenuItems from '../block-styles/menu-items';\n\nexport default function BlockStylesMenu( { hoveredBlock, onSwitch } ) {\n\tconst { clientId } = hoveredBlock;\n\n\treturn (\n\t\t<MenuGroup\n\t\t\tlabel={ __( 'Styles' ) }\n\t\t\tclassName=\"block-editor-block-switcher__styles__menugroup\"\n\t\t>\n\t\t\t<BlockStylesMenuItems clientId={ clientId } onSwitch={ onSwitch } />\n\t\t</MenuGroup>\n\t);\n}\n"]}
+{"version":3,"names":["__","MenuGroup","BlockStylesMenuItems","BlockStylesMenu","hoveredBlock","onSwitch","clientId","createElement","label","className"],"sources":["@wordpress/block-editor/src/components/block-switcher/block-styles-menu.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { MenuGroup } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BlockStylesMenuItems from '../block-styles/menu-items';\n\nexport default function BlockStylesMenu( { hoveredBlock, onSwitch } ) {\n\tconst { clientId } = hoveredBlock;\n\n\treturn (\n\t\t<MenuGroup\n\t\t\tlabel={ __( 'Styles' ) }\n\t\t\tclassName=\"block-editor-block-switcher__styles__menugroup\"\n\t\t>\n\t\t\t<BlockStylesMenuItems clientId={ clientId } onSwitch={ onSwitch } />\n\t\t</MenuGroup>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,QAAQ,uBAAuB;;AAEjD;AACA;AACA;AACA,OAAOC,oBAAoB,MAAM,4BAA4B;AAE7D,eAAe,SAASC,eAAeA,CAAE;EAAEC,YAAY;EAAEC;AAAS,CAAC,EAAG;EACrE,MAAM;IAAEC;EAAS,CAAC,GAAGF,YAAY;EAEjC,OACCG,aAAA,CAACN,SAAS;IACTO,KAAK,EAAGR,EAAE,CAAE,QAAS,CAAG;IACxBS,SAAS,EAAC;EAAgD,GAE1DF,aAAA,CAACL,oBAAoB;IAACI,QAAQ,EAAGA,QAAU;IAACD,QAAQ,EAAGA;EAAU,CAAE,CACzD,CAAC;AAEd"}

package/build-module/components/block-switcher/block-transformations-menu.js

@@ -1,5 +1,4 @@
 import { createElement, Fragment } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
@@ -7,13 +6,14 @@ import { __ } from '@wordpress/i18n';
 import { MenuGroup, MenuItem } from '@wordpress/components';
 import { getBlockMenuDefaultClassName, switchToBlockType } from '@wordpress/blocks';
 import { useState, useMemo } from '@wordpress/element';
+
 /**
  * Internal dependencies
  */
-
 import BlockIcon from '../block-icon';
 import PreviewBlockPopover from './preview-block-popover';
 import BlockVariationTransformations from './block-variation-transformations';
+
 /**
  * Helper hook to group transformations to display them in a specific order in the UI.
  * For now we group only priority content driven transformations(ex. paragraph -> heading).
@@ -24,7 +24,6 @@ import BlockVariationTransformations from './block-variation-transformations';
  * @param {Object[]} possibleBlockTransformations The available block transformations.
  * @return {Record<string, Object[]>} The grouped block transformations.
  */
-
 function useGroupedTransforms(possibleBlockTransformations) {
   const priorityContentTranformationBlocks = {
     'core/paragraph': 1,
@@ -38,20 +37,19 @@ function useGroupedTransforms(possibleBlockTransformations) {
       const {
         name
       } = item;
-
       if (priorityTextTranformsNames.includes(name)) {
         accumulator.priorityTextTransformations.push(item);
       } else {
         accumulator.restTransformations.push(item);
       }
-
       return accumulator;
     }, {
       priorityTextTransformations: [],
       restTransformations: []
     });
-  }, [possibleBlockTransformations]); // Order the priority text transformations.
+  }, [possibleBlockTransformations]);
 
+  // Order the priority text transformations.
   transformations.priorityTextTransformations.sort(({
     name: currentName
   }, {
@@ -61,7 +59,6 @@ function useGroupedTransforms(possibleBlockTransformations) {
   });
   return transformations;
 }
-
 const BlockTransformationsMenu = ({
   className,
   possibleBlockTransformations,
@@ -74,9 +71,9 @@ const BlockTransformationsMenu = ({
   const {
     priorityTextTransformations,
     restTransformations
-  } = useGroupedTransforms(possibleBlockTransformations); // We have to check if both content transformations(priority and rest) are set
+  } = useGroupedTransforms(possibleBlockTransformations);
+  // We have to check if both content transformations(priority and rest) are set
   // in order to create a separate MenuGroup for them.
-
   const hasBothContentTransformations = priorityTextTransformations.length && restTransformations.length;
   const restTransformItems = !!restTransformations.length && createElement(RestTransformationItems, {
     restTransformations: restTransformations,
@@ -101,7 +98,6 @@ const BlockTransformationsMenu = ({
     className: className
   }, restTransformItems));
 };
-
 function RestTransformationItems({
   restTransformations,
   onSelect,
@@ -114,7 +110,6 @@ function RestTransformationItems({
     setHoveredTransformItemName: setHoveredTransformItemName
   }));
 }
-
 function BlockTranformationItem({
   item,
   onSelect,
@@ -140,6 +135,5 @@ function BlockTranformationItem({
     showColors: true
   }), title);
 }
-
 export default BlockTransformationsMenu;
 //# sourceMappingURL=block-transformations-menu.js.map

package/build-module/components/block-switcher/block-transformations-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/block-switcher/block-transformations-menu.js"],"names":["__","MenuGroup","MenuItem","getBlockMenuDefaultClassName","switchToBlockType","useState","useMemo","BlockIcon","PreviewBlockPopover","BlockVariationTransformations","useGroupedTransforms","possibleBlockTransformations","priorityContentTranformationBlocks","transformations","priorityTextTranformsNames","Object","keys","reduce","accumulator","item","name","includes","priorityTextTransformations","push","restTransformations","sort","currentName","nextName","BlockTransformationsMenu","className","possibleBlockVariationTransformations","onSelect","onSelectVariation","blocks","hoveredTransformItemName","setHoveredTransformItemName","hasBothContentTransformations","length","restTransformItems","map","RestTransformationItems","BlockTranformationItem","icon","title","isDisabled","event","preventDefault"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { MenuGroup, MenuItem } from '@wordpress/components';\nimport {\n\tgetBlockMenuDefaultClassName,\n\tswitchToBlockType,\n} from '@wordpress/blocks';\nimport { useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockIcon from '../block-icon';\nimport PreviewBlockPopover from './preview-block-popover';\nimport BlockVariationTransformations from './block-variation-transformations';\n\n/**\n * Helper hook to group transformations to display them in a specific order in the UI.\n * For now we group only priority content driven transformations(ex. paragraph -> heading).\n *\n * Later on we could also group 'layout' transformations(ex. paragraph -> group) and\n * display them in different sections.\n *\n * @param {Object[]} possibleBlockTransformations The available block transformations.\n * @return {Record<string, Object[]>} The grouped block transformations.\n */\nfunction useGroupedTransforms( possibleBlockTransformations ) {\n\tconst priorityContentTranformationBlocks = {\n\t\t'core/paragraph': 1,\n\t\t'core/heading': 2,\n\t\t'core/list': 3,\n\t\t'core/quote': 4,\n\t};\n\tconst transformations = useMemo( () => {\n\t\tconst priorityTextTranformsNames = Object.keys(\n\t\t\tpriorityContentTranformationBlocks\n\t\t);\n\t\treturn possibleBlockTransformations.reduce(\n\t\t\t( accumulator, item ) => {\n\t\t\t\tconst { name } = item;\n\t\t\t\tif ( priorityTextTranformsNames.includes( name ) ) {\n\t\t\t\t\taccumulator.priorityTextTransformations.push( item );\n\t\t\t\t} else {\n\t\t\t\t\taccumulator.restTransformations.push( item );\n\t\t\t\t}\n\t\t\t\treturn accumulator;\n\t\t\t},\n\t\t\t{ priorityTextTransformations: [], restTransformations: [] }\n\t\t);\n\t}, [ possibleBlockTransformations ] );\n\n\t// Order the priority text transformations.\n\ttransformations.priorityTextTransformations.sort(\n\t\t( { name: currentName }, { name: nextName } ) => {\n\t\t\treturn priorityContentTranformationBlocks[ currentName ] <\n\t\t\t\tpriorityContentTranformationBlocks[ nextName ]\n\t\t\t\t? -1\n\t\t\t\t: 1;\n\t\t}\n\t);\n\treturn transformations;\n}\n\nconst BlockTransformationsMenu = ( {\n\tclassName,\n\tpossibleBlockTransformations,\n\tpossibleBlockVariationTransformations,\n\tonSelect,\n\tonSelectVariation,\n\tblocks,\n} ) => {\n\tconst [ hoveredTransformItemName, setHoveredTransformItemName ] =\n\t\tuseState();\n\n\tconst { priorityTextTransformations, restTransformations } =\n\t\tuseGroupedTransforms( possibleBlockTransformations );\n\t// We have to check if both content transformations(priority and rest) are set\n\t// in order to create a separate MenuGroup for them.\n\tconst hasBothContentTransformations =\n\t\tpriorityTextTransformations.length && restTransformations.length;\n\tconst restTransformItems = !! restTransformations.length && (\n\t\t<RestTransformationItems\n\t\t\trestTransformations={ restTransformations }\n\t\t\tonSelect={ onSelect }\n\t\t\tsetHoveredTransformItemName={ setHoveredTransformItemName }\n\t\t/>\n\t);\n\treturn (\n\t\t<>\n\t\t\t<MenuGroup label={ __( 'Transform to' ) } className={ className }>\n\t\t\t\t{ hoveredTransformItemName && (\n\t\t\t\t\t<PreviewBlockPopover\n\t\t\t\t\t\tblocks={ switchToBlockType(\n\t\t\t\t\t\t\tblocks,\n\t\t\t\t\t\t\thoveredTransformItemName\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ !! possibleBlockVariationTransformations?.length && (\n\t\t\t\t\t<BlockVariationTransformations\n\t\t\t\t\t\ttransformations={\n\t\t\t\t\t\t\tpossibleBlockVariationTransformations\n\t\t\t\t\t\t}\n\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\tonSelect={ onSelectVariation }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ priorityTextTransformations.map( ( item ) => (\n\t\t\t\t\t<BlockTranformationItem\n\t\t\t\t\t\tkey={ item.name }\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\tsetHoveredTransformItemName={\n\t\t\t\t\t\t\tsetHoveredTransformItemName\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t\t{ ! hasBothContentTransformations && restTransformItems }\n\t\t\t</MenuGroup>\n\t\t\t{ !! hasBothContentTransformations && (\n\t\t\t\t<MenuGroup className={ className }>\n\t\t\t\t\t{ restTransformItems }\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nfunction RestTransformationItems( {\n\trestTransformations,\n\tonSelect,\n\tsetHoveredTransformItemName,\n} ) {\n\treturn restTransformations.map( ( item ) => (\n\t\t<BlockTranformationItem\n\t\t\tkey={ item.name }\n\t\t\titem={ item }\n\t\t\tonSelect={ onSelect }\n\t\t\tsetHoveredTransformItemName={ setHoveredTransformItemName }\n\t\t/>\n\t) );\n}\n\nfunction BlockTranformationItem( {\n\titem,\n\tonSelect,\n\tsetHoveredTransformItemName,\n} ) {\n\tconst { name, icon, title, isDisabled } = item;\n\treturn (\n\t\t<MenuItem\n\t\t\tclassName={ getBlockMenuDefaultClassName( name ) }\n\t\t\tonClick={ ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonSelect( name );\n\t\t\t} }\n\t\t\tdisabled={ isDisabled }\n\t\t\tonMouseLeave={ () => setHoveredTransformItemName( null ) }\n\t\t\tonMouseEnter={ () => setHoveredTransformItemName( name ) }\n\t\t>\n\t\t\t<BlockIcon icon={ icon } showColors />\n\t\t\t{ title }\n\t\t</MenuItem>\n\t);\n}\n\nexport default BlockTransformationsMenu;\n"]}
+{"version":3,"names":["__","MenuGroup","MenuItem","getBlockMenuDefaultClassName","switchToBlockType","useState","useMemo","BlockIcon","PreviewBlockPopover","BlockVariationTransformations","useGroupedTransforms","possibleBlockTransformations","priorityContentTranformationBlocks","transformations","priorityTextTranformsNames","Object","keys","reduce","accumulator","item","name","includes","priorityTextTransformations","push","restTransformations","sort","currentName","nextName","BlockTransformationsMenu","className","possibleBlockVariationTransformations","onSelect","onSelectVariation","blocks","hoveredTransformItemName","setHoveredTransformItemName","hasBothContentTransformations","length","restTransformItems","createElement","RestTransformationItems","Fragment","label","map","BlockTranformationItem","key","icon","title","isDisabled","onClick","event","preventDefault","disabled","onMouseLeave","onMouseEnter","showColors"],"sources":["@wordpress/block-editor/src/components/block-switcher/block-transformations-menu.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { MenuGroup, MenuItem } from '@wordpress/components';\nimport {\n\tgetBlockMenuDefaultClassName,\n\tswitchToBlockType,\n} from '@wordpress/blocks';\nimport { useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BlockIcon from '../block-icon';\nimport PreviewBlockPopover from './preview-block-popover';\nimport BlockVariationTransformations from './block-variation-transformations';\n\n/**\n * Helper hook to group transformations to display them in a specific order in the UI.\n * For now we group only priority content driven transformations(ex. paragraph -> heading).\n *\n * Later on we could also group 'layout' transformations(ex. paragraph -> group) and\n * display them in different sections.\n *\n * @param {Object[]} possibleBlockTransformations The available block transformations.\n * @return {Record<string, Object[]>} The grouped block transformations.\n */\nfunction useGroupedTransforms( possibleBlockTransformations ) {\n\tconst priorityContentTranformationBlocks = {\n\t\t'core/paragraph': 1,\n\t\t'core/heading': 2,\n\t\t'core/list': 3,\n\t\t'core/quote': 4,\n\t};\n\tconst transformations = useMemo( () => {\n\t\tconst priorityTextTranformsNames = Object.keys(\n\t\t\tpriorityContentTranformationBlocks\n\t\t);\n\t\treturn possibleBlockTransformations.reduce(\n\t\t\t( accumulator, item ) => {\n\t\t\t\tconst { name } = item;\n\t\t\t\tif ( priorityTextTranformsNames.includes( name ) ) {\n\t\t\t\t\taccumulator.priorityTextTransformations.push( item );\n\t\t\t\t} else {\n\t\t\t\t\taccumulator.restTransformations.push( item );\n\t\t\t\t}\n\t\t\t\treturn accumulator;\n\t\t\t},\n\t\t\t{ priorityTextTransformations: [], restTransformations: [] }\n\t\t);\n\t}, [ possibleBlockTransformations ] );\n\n\t// Order the priority text transformations.\n\ttransformations.priorityTextTransformations.sort(\n\t\t( { name: currentName }, { name: nextName } ) => {\n\t\t\treturn priorityContentTranformationBlocks[ currentName ] <\n\t\t\t\tpriorityContentTranformationBlocks[ nextName ]\n\t\t\t\t? -1\n\t\t\t\t: 1;\n\t\t}\n\t);\n\treturn transformations;\n}\n\nconst BlockTransformationsMenu = ( {\n\tclassName,\n\tpossibleBlockTransformations,\n\tpossibleBlockVariationTransformations,\n\tonSelect,\n\tonSelectVariation,\n\tblocks,\n} ) => {\n\tconst [ hoveredTransformItemName, setHoveredTransformItemName ] =\n\t\tuseState();\n\n\tconst { priorityTextTransformations, restTransformations } =\n\t\tuseGroupedTransforms( possibleBlockTransformations );\n\t// We have to check if both content transformations(priority and rest) are set\n\t// in order to create a separate MenuGroup for them.\n\tconst hasBothContentTransformations =\n\t\tpriorityTextTransformations.length && restTransformations.length;\n\tconst restTransformItems = !! restTransformations.length && (\n\t\t<RestTransformationItems\n\t\t\trestTransformations={ restTransformations }\n\t\t\tonSelect={ onSelect }\n\t\t\tsetHoveredTransformItemName={ setHoveredTransformItemName }\n\t\t/>\n\t);\n\treturn (\n\t\t<>\n\t\t\t<MenuGroup label={ __( 'Transform to' ) } className={ className }>\n\t\t\t\t{ hoveredTransformItemName && (\n\t\t\t\t\t<PreviewBlockPopover\n\t\t\t\t\t\tblocks={ switchToBlockType(\n\t\t\t\t\t\t\tblocks,\n\t\t\t\t\t\t\thoveredTransformItemName\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ !! possibleBlockVariationTransformations?.length && (\n\t\t\t\t\t<BlockVariationTransformations\n\t\t\t\t\t\ttransformations={\n\t\t\t\t\t\t\tpossibleBlockVariationTransformations\n\t\t\t\t\t\t}\n\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\tonSelect={ onSelectVariation }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ priorityTextTransformations.map( ( item ) => (\n\t\t\t\t\t<BlockTranformationItem\n\t\t\t\t\t\tkey={ item.name }\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\tsetHoveredTransformItemName={\n\t\t\t\t\t\t\tsetHoveredTransformItemName\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t\t{ ! hasBothContentTransformations && restTransformItems }\n\t\t\t</MenuGroup>\n\t\t\t{ !! hasBothContentTransformations && (\n\t\t\t\t<MenuGroup className={ className }>\n\t\t\t\t\t{ restTransformItems }\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nfunction RestTransformationItems( {\n\trestTransformations,\n\tonSelect,\n\tsetHoveredTransformItemName,\n} ) {\n\treturn restTransformations.map( ( item ) => (\n\t\t<BlockTranformationItem\n\t\t\tkey={ item.name }\n\t\t\titem={ item }\n\t\t\tonSelect={ onSelect }\n\t\t\tsetHoveredTransformItemName={ setHoveredTransformItemName }\n\t\t/>\n\t) );\n}\n\nfunction BlockTranformationItem( {\n\titem,\n\tonSelect,\n\tsetHoveredTransformItemName,\n} ) {\n\tconst { name, icon, title, isDisabled } = item;\n\treturn (\n\t\t<MenuItem\n\t\t\tclassName={ getBlockMenuDefaultClassName( name ) }\n\t\t\tonClick={ ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonSelect( name );\n\t\t\t} }\n\t\t\tdisabled={ isDisabled }\n\t\t\tonMouseLeave={ () => setHoveredTransformItemName( null ) }\n\t\t\tonMouseEnter={ () => setHoveredTransformItemName( name ) }\n\t\t>\n\t\t\t<BlockIcon icon={ icon } showColors />\n\t\t\t{ title }\n\t\t</MenuItem>\n\t);\n}\n\nexport default BlockTransformationsMenu;\n"],"mappings":"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"}