@wordpress/block-editor 7.0.4 → 8.0.0

package/build-module/components/inserter/block-patterns-explorer/patterns-list.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-explorer/patterns-list.js"],"names":["useMemo","useEffect","_n","sprintf","useDebounce","useAsyncList","__experimentalHeading","Heading","speak","BlockPatternsList","InserterNoResults","useInsertionPoint","usePatternsState","InserterListbox","searchItems","INITIAL_INSERTER_RESULTS","PatternsListHeader","filterValue","filteredBlockPatternsLength","PatternList","selectedCategory","patternCategories","debouncedSpeak","destinationRootClientId","onInsertBlocks","shouldFocusBlock","allPatterns","onSelectBlockPattern","registeredPatternCategories","map","patternCategory","name","filteredBlockPatterns","filter","pattern","categories","length","every","category","includes","count","resultsFoundMessage","currentShownPatterns","step","hasItems"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useEffect } from '@wordpress/element';\nimport { _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useAsyncList } from '@wordpress/compose';\nimport { __experimentalHeading as Heading } from '@wordpress/components';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport BlockPatternsList from '../../block-patterns-list';\nimport InserterNoResults from '../no-results';\nimport useInsertionPoint from '../hooks/use-insertion-point';\nimport usePatternsState from '../hooks/use-patterns-state';\nimport InserterListbox from '../../inserter-listbox';\nimport { searchItems } from '../search-items';\n\nconst INITIAL_INSERTER_RESULTS = 2;\n\nfunction PatternsListHeader( { filterValue, filteredBlockPatternsLength } ) {\n\tif ( ! filterValue ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<Heading\n\t\t\tlevel={ 2 }\n\t\t\tlineHeight={ '48px' }\n\t\t\tclassName=\"block-editor-block-patterns-explorer__search-results-count\"\n\t\t>\n\t\t\t{ sprintf(\n\t\t\t\t/* translators: %d: number of patterns. %s: block pattern search query */\n\t\t\t\t_n(\n\t\t\t\t\t'%1$d pattern found for \"%2$s\"',\n\t\t\t\t\t'%1$d patterns found for \"%2$s\"',\n\t\t\t\t\tfilteredBlockPatternsLength\n\t\t\t\t),\n\t\t\t\tfilteredBlockPatternsLength,\n\t\t\t\tfilterValue\n\t\t\t) }\n\t\t</Heading>\n\t);\n}\n\nfunction PatternList( { filterValue, selectedCategory, patternCategories } ) {\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst [ destinationRootClientId, onInsertBlocks ] = useInsertionPoint( {\n\t\tshouldFocusBlock: true,\n\t} );\n\tconst [ allPatterns, , onSelectBlockPattern ] = usePatternsState(\n\t\tonInsertBlocks,\n\t\tdestinationRootClientId\n\t);\n\tconst registeredPatternCategories = useMemo(\n\t\t() =>\n\t\t\tpatternCategories.map(\n\t\t\t\t( patternCategory ) => patternCategory.name\n\t\t\t),\n\t\t[ patternCategories ]\n\t);\n\n\tconst filteredBlockPatterns = useMemo( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn allPatterns.filter( ( pattern ) =>\n\t\t\t\tselectedCategory === 'uncategorized'\n\t\t\t\t\t? ! pattern.categories?.length ||\n\t\t\t\t\t  pattern.categories.every(\n\t\t\t\t\t\t\t( category ) =>\n\t\t\t\t\t\t\t\t! registeredPatternCategories.includes(\n\t\t\t\t\t\t\t\t\tcategory\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t  )\n\t\t\t\t\t: pattern.categories?.includes( selectedCategory )\n\t\t\t);\n\t\t}\n\t\treturn searchItems( allPatterns, filterValue );\n\t}, [ filterValue, selectedCategory, allPatterns ] );\n\n\t// Announce search results on change.\n\tuseEffect( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn;\n\t\t}\n\t\tconst count = filteredBlockPatterns.length;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/* translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage );\n\t}, [ filterValue, debouncedSpeak ] );\n\n\tconst currentShownPatterns = useAsyncList( filteredBlockPatterns, {\n\t\tstep: INITIAL_INSERTER_RESULTS,\n\t} );\n\n\tconst hasItems = !! filteredBlockPatterns?.length;\n\treturn (\n\t\t<div className=\"block-editor-block-patterns-explorer__list\">\n\t\t\t{ hasItems && (\n\t\t\t\t<PatternsListHeader\n\t\t\t\t\tfilterValue={ filterValue }\n\t\t\t\t\tfilteredBlockPatternsLength={ filteredBlockPatterns.length }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<InserterListbox>\n\t\t\t\t{ ! hasItems && <InserterNoResults /> }\n\t\t\t\t{ hasItems && (\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tshownPatterns={ currentShownPatterns }\n\t\t\t\t\t\tblockPatterns={ filteredBlockPatterns }\n\t\t\t\t\t\tonClickPattern={ onSelectBlockPattern }\n\t\t\t\t\t\tisDraggable={ false }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</InserterListbox>\n\t\t</div>\n\t);\n}\n\nexport default PatternList;\n"]}

package/build-module/components/inserter/block-patterns-explorer/sidebar.js

@@ -0,0 +1,69 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { Button, SearchControl } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+
+function PatternCategoriesList({
+  selectedCategory,
+  patternCategories,
+  onClickCategory
+}) {
+  const baseClassName = 'block-editor-block-patterns-explorer__sidebar';
+  return createElement("div", {
+    className: `${baseClassName}__categories-list`
+  }, patternCategories.map(({
+    name,
+    label
+  }) => {
+    return createElement(Button, {
+      key: name,
+      label: label,
+      className: `${baseClassName}__categories-list__item`,
+      isPressed: selectedCategory === name,
+      onClick: () => {
+        onClickCategory(name);
+      }
+    }, label);
+  }));
+}
+
+function PatternsExplorerSearch({
+  filterValue,
+  setFilterValue
+}) {
+  const baseClassName = 'block-editor-block-patterns-explorer__search';
+  return createElement("div", {
+    className: baseClassName
+  }, createElement(SearchControl, {
+    onChange: setFilterValue,
+    value: filterValue,
+    label: __('Search for patterns'),
+    placeholder: __('Search')
+  }));
+}
+
+function PatternExplorerSidebar({
+  selectedCategory,
+  patternCategories,
+  onClickCategory,
+  filterValue,
+  setFilterValue
+}) {
+  const baseClassName = 'block-editor-block-patterns-explorer__sidebar';
+  return createElement("div", {
+    className: baseClassName
+  }, createElement(PatternsExplorerSearch, {
+    filterValue: filterValue,
+    setFilterValue: setFilterValue
+  }), !filterValue && createElement(PatternCategoriesList, {
+    selectedCategory: selectedCategory,
+    patternCategories: patternCategories,
+    onClickCategory: onClickCategory
+  }));
+}
+
+export default PatternExplorerSidebar;
+//# sourceMappingURL=sidebar.js.map

package/build-module/components/inserter/block-patterns-explorer/sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-explorer/sidebar.js"],"names":["Button","SearchControl","__","PatternCategoriesList","selectedCategory","patternCategories","onClickCategory","baseClassName","map","name","label","PatternsExplorerSearch","filterValue","setFilterValue","PatternExplorerSidebar"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,aAAjB,QAAsC,uBAAtC;AACA,SAASC,EAAT,QAAmB,iBAAnB;;AAEA,SAASC,qBAAT,CAAgC;AAC/BC,EAAAA,gBAD+B;AAE/BC,EAAAA,iBAF+B;AAG/BC,EAAAA;AAH+B,CAAhC,EAII;AACH,QAAMC,aAAa,GAAG,+CAAtB;AACA,SACC;AAAK,IAAA,SAAS,EAAI,GAAGA,aAAe;AAApC,KACGF,iBAAiB,CAACG,GAAlB,CAAuB,CAAE;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAF,KAAuB;AAC/C,WACC,cAAC,MAAD;AACC,MAAA,GAAG,EAAGD,IADP;AAEC,MAAA,KAAK,EAAGC,KAFT;AAGC,MAAA,SAAS,EAAI,GAAGH,aAAe,yBAHhC;AAIC,MAAA,SAAS,EAAGH,gBAAgB,KAAKK,IAJlC;AAKC,MAAA,OAAO,EAAG,MAAM;AACfH,QAAAA,eAAe,CAAEG,IAAF,CAAf;AACA;AAPF,OASGC,KATH,CADD;AAaA,GAdC,CADH,CADD;AAmBA;;AAED,SAASC,sBAAT,CAAiC;AAAEC,EAAAA,WAAF;AAAeC,EAAAA;AAAf,CAAjC,EAAmE;AAClE,QAAMN,aAAa,GAAG,8CAAtB;AACA,SACC;AAAK,IAAA,SAAS,EAAGA;AAAjB,KACC,cAAC,aAAD;AACC,IAAA,QAAQ,EAAGM,cADZ;AAEC,IAAA,KAAK,EAAGD,WAFT;AAGC,IAAA,KAAK,EAAGV,EAAE,CAAE,qBAAF,CAHX;AAIC,IAAA,WAAW,EAAGA,EAAE,CAAE,QAAF;AAJjB,IADD,CADD;AAUA;;AAED,SAASY,sBAAT,CAAiC;AAChCV,EAAAA,gBADgC;AAEhCC,EAAAA,iBAFgC;AAGhCC,EAAAA,eAHgC;AAIhCM,EAAAA,WAJgC;AAKhCC,EAAAA;AALgC,CAAjC,EAMI;AACH,QAAMN,aAAa,GAAG,+CAAtB;AACA,SACC;AAAK,IAAA,SAAS,EAAGA;AAAjB,KACC,cAAC,sBAAD;AACC,IAAA,WAAW,EAAGK,WADf;AAEC,IAAA,cAAc,EAAGC;AAFlB,IADD,EAKG,CAAED,WAAF,IACD,cAAC,qBAAD;AACC,IAAA,gBAAgB,EAAGR,gBADpB;AAEC,IAAA,iBAAiB,EAAGC,iBAFrB;AAGC,IAAA,eAAe,EAAGC;AAHnB,IANF,CADD;AAeA;;AAED,eAAeQ,sBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Button, SearchControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nfunction PatternCategoriesList( {\n\tselectedCategory,\n\tpatternCategories,\n\tonClickCategory,\n} ) {\n\tconst baseClassName = 'block-editor-block-patterns-explorer__sidebar';\n\treturn (\n\t\t<div className={ `${ baseClassName }__categories-list` }>\n\t\t\t{ patternCategories.map( ( { name, label } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ name }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\tclassName={ `${ baseClassName }__categories-list__item` }\n\t\t\t\t\t\tisPressed={ selectedCategory === name }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonClickCategory( name );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</div>\n\t);\n}\n\nfunction PatternsExplorerSearch( { filterValue, setFilterValue } ) {\n\tconst baseClassName = 'block-editor-block-patterns-explorer__search';\n\treturn (\n\t\t<div className={ baseClassName }>\n\t\t\t<SearchControl\n\t\t\t\tonChange={ setFilterValue }\n\t\t\t\tvalue={ filterValue }\n\t\t\t\tlabel={ __( 'Search for patterns' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction PatternExplorerSidebar( {\n\tselectedCategory,\n\tpatternCategories,\n\tonClickCategory,\n\tfilterValue,\n\tsetFilterValue,\n} ) {\n\tconst baseClassName = 'block-editor-block-patterns-explorer__sidebar';\n\treturn (\n\t\t<div className={ baseClassName }>\n\t\t\t<PatternsExplorerSearch\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tsetFilterValue={ setFilterValue }\n\t\t\t/>\n\t\t\t{ ! filterValue && (\n\t\t\t\t<PatternCategoriesList\n\t\t\t\t\tselectedCategory={ selectedCategory }\n\t\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\t\tonClickCategory={ onClickCategory }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default PatternExplorerSidebar;\n"]}

package/build-module/components/inserter/block-patterns-tab.js

@@ -1,14 +1,9 @@
 import { createElement, Fragment } from "@wordpress/element";
 
-/**
- * External dependencies
- */
-import { fromPairs } from 'lodash';
 /**
  * WordPress dependencies
  */
-
-import { useMemo, useCallback, useEffect } from '@wordpress/element';
+import { useMemo, useState, useCallback } from '@wordpress/element';
 import { _x } from '@wordpress/i18n';
 import { useAsyncList } from '@wordpress/compose';
 /**
@@ -18,50 +13,35 @@ import { useAsyncList } from '@wordpress/compose';
 import PatternInserterPanel from './pattern-panel';
 import usePatternsState from './hooks/use-patterns-state';
 import BlockPatternList from '../block-patterns-list';
+import PatternsExplorerModal from './block-patterns-explorer/explorer';
 
 function BlockPatternsCategory({
   rootClientId,
   onInsert,
   selectedCategory,
-  onClickCategory
+  populatedCategories
 }) {
-  const [allPatterns, allCategories, onClick] = usePatternsState(onInsert, rootClientId); // Remove any empty categories
-
-  const populatedCategories = useMemo(() => allCategories.filter(category => allPatterns.some(pattern => {
+  const [allPatterns,, onClick] = usePatternsState(onInsert, rootClientId);
+  const getPatternIndex = useCallback(pattern => {
     var _pattern$categories;
 
-    return (_pattern$categories = pattern.categories) === null || _pattern$categories === void 0 ? void 0 : _pattern$categories.includes(category.name);
-  })).sort(({
-    name: currentName
-  }, {
-    name: nextName
-  }) => {
-    if (![currentName, nextName].includes('featured')) {
-      return 0;
-    }
-
-    return currentName === 'featured' ? -1 : 1;
-  }), [allPatterns, allCategories]);
-  const patternCategory = selectedCategory ? selectedCategory : populatedCategories[0];
-  useEffect(() => {
-    if (allPatterns.some(pattern => getPatternIndex(pattern) === Infinity) && !populatedCategories.find(category => category.name === 'uncategorized')) {
-      populatedCategories.push({
-        name: 'uncategorized',
-        label: _x('Uncategorized')
-      });
-    }
-  }, [populatedCategories, allPatterns]);
-  const getPatternIndex = useCallback(pattern => {
-    if (!pattern.categories || !pattern.categories.length) {
+    if (!((_pattern$categories = pattern.categories) !== null && _pattern$categories !== void 0 && _pattern$categories.length)) {
       return Infinity;
     }
 
-    const indexedCategories = fromPairs(populatedCategories.map(({
+    const indexedCategories = populatedCategories.reduce((accumulator, {
       name
-    }, index) => [name, index]));
+    }, index) => {
+      accumulator[name] = index;
+      return accumulator;
+    }, {});
     return Math.min(...pattern.categories.map(cat => indexedCategories[cat] !== undefined ? indexedCategories[cat] : Infinity));
   }, [populatedCategories]);
-  const currentCategoryPatterns = useMemo(() => allPatterns.filter(pattern => patternCategory.name === 'uncategorized' ? getPatternIndex(pattern) === Infinity : pattern.categories && pattern.categories.includes(patternCategory.name)), [allPatterns, patternCategory]); // Ordering the patterns is important for the async rendering.
+  const currentCategoryPatterns = useMemo(() => allPatterns.filter(pattern => {
+    var _pattern$categories2;
+
+    return selectedCategory.name === 'uncategorized' ? getPatternIndex(pattern) === Infinity : (_pattern$categories2 = pattern.categories) === null || _pattern$categories2 === void 0 ? void 0 : _pattern$categories2.includes(selectedCategory.name);
+  }), [allPatterns, selectedCategory]); // Ordering the patterns is important for the async rendering.
 
   const orderedPatterns = useMemo(() => {
     return currentCategoryPatterns.sort((a, b) => {
@@ -69,18 +49,21 @@ function BlockPatternsCategory({
     });
   }, [currentCategoryPatterns, getPatternIndex]);
   const currentShownPatterns = useAsyncList(orderedPatterns);
-  return createElement(Fragment, null, !!currentCategoryPatterns.length && createElement(PatternInserterPanel, {
-    selectedCategory: patternCategory,
-    patternCategories: populatedCategories,
-    onClickCategory: onClickCategory
+
+  if (!currentCategoryPatterns.length) {
+    return null;
+  }
+
+  return createElement("div", {
+    className: "block-editor-inserter__panel-content"
   }, createElement(BlockPatternList, {
     shownPatterns: currentShownPatterns,
     blockPatterns: currentCategoryPatterns,
     onClickPattern: onClick,
-    label: patternCategory.label,
+    label: selectedCategory.label,
     orientation: "vertical",
     isDraggable: true
-  })));
+  }));
 }
 
 function BlockPatternsTabs({
@@ -89,12 +72,58 @@ function BlockPatternsTabs({
   onClickCategory,
   selectedCategory
 }) {
-  return createElement(BlockPatternsCategory, {
+  const [showPatternsExplorer, setShowPatternsExplorer] = useState(false);
+  const [allPatterns, allCategories] = usePatternsState();
+  const hasRegisteredCategory = useCallback(pattern => {
+    if (!pattern.categories || !pattern.categories.length) {
+      return false;
+    }
+
+    return pattern.categories.some(cat => allCategories.some(category => category.name === cat));
+  }, [allCategories]); // Remove any empty categories
+
+  const populatedCategories = useMemo(() => {
+    const categories = allCategories.filter(category => allPatterns.some(pattern => {
+      var _pattern$categories3;
+
+      return (_pattern$categories3 = pattern.categories) === null || _pattern$categories3 === void 0 ? void 0 : _pattern$categories3.includes(category.name);
+    })).sort(({
+      name: currentName
+    }, {
+      name: nextName
+    }) => {
+      if (![currentName, nextName].includes('featured')) {
+        return 0;
+      }
+
+      return currentName === 'featured' ? -1 : 1;
+    });
+
+    if (allPatterns.some(pattern => !hasRegisteredCategory(pattern)) && !categories.find(category => category.name === 'uncategorized')) {
+      categories.push({
+        name: 'uncategorized',
+        label: _x('Uncategorized')
+      });
+    }
+
+    return categories;
+  }, [allPatterns, allCategories]);
+  const patternCategory = selectedCategory ? selectedCategory : populatedCategories[0];
+  return createElement(Fragment, null, !showPatternsExplorer && createElement(Fragment, null, createElement(PatternInserterPanel, {
+    selectedCategory: patternCategory,
+    patternCategories: populatedCategories,
+    onClickCategory: onClickCategory,
+    openPatternExplorer: () => setShowPatternsExplorer(true)
+  }), createElement(BlockPatternsCategory, {
     rootClientId: rootClientId,
-    selectedCategory: selectedCategory,
     onInsert: onInsert,
-    onClickCategory: onClickCategory
-  });
+    selectedCategory: patternCategory,
+    populatedCategories: populatedCategories
+  })), showPatternsExplorer && createElement(PatternsExplorerModal, {
+    initialCategory: patternCategory,
+    patternCategories: populatedCategories,
+    onModalClose: () => setShowPatternsExplorer(false)
+  }));
 }
 
 export default BlockPatternsTabs;

package/build-module/components/inserter/block-patterns-tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab.js"],"names":["fromPairs","useMemo","useCallback","useEffect","_x","useAsyncList","PatternInserterPanel","usePatternsState","BlockPatternList","BlockPatternsCategory","rootClientId","onInsert","selectedCategory","onClickCategory","allPatterns","allCategories","onClick","populatedCategories","filter","category","some","pattern","categories","includes","name","sort","currentName","nextName","patternCategory","getPatternIndex","Infinity","find","push","label","length","indexedCategories","map","index","Math","min","cat","undefined","currentCategoryPatterns","orderedPatterns","a","b","currentShownPatterns","BlockPatternsTabs"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { fromPairs } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useCallback, useEffect } from '@wordpress/element';\nimport { _x } from '@wordpress/i18n';\nimport { useAsyncList } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport PatternInserterPanel from './pattern-panel';\nimport usePatternsState from './hooks/use-patterns-state';\nimport BlockPatternList from '../block-patterns-list';\n\nfunction BlockPatternsCategory( {\n\trootClientId,\n\tonInsert,\n\tselectedCategory,\n\tonClickCategory,\n} ) {\n\tconst [ allPatterns, allCategories, onClick ] = usePatternsState(\n\t\tonInsert,\n\t\trootClientId\n\t);\n\n\t// Remove any empty categories\n\tconst populatedCategories = useMemo(\n\t\t() =>\n\t\t\tallCategories\n\t\t\t\t.filter( ( category ) =>\n\t\t\t\t\tallPatterns.some( ( pattern ) =>\n\t\t\t\t\t\tpattern.categories?.includes( category.name )\n\t\t\t\t\t)\n\t\t\t\t)\n\t\t\t\t.sort( ( { name: currentName }, { name: nextName } ) => {\n\t\t\t\t\tif ( ! [ currentName, nextName ].includes( 'featured' ) ) {\n\t\t\t\t\t\treturn 0;\n\t\t\t\t\t}\n\t\t\t\t\treturn currentName === 'featured' ? -1 : 1;\n\t\t\t\t} ),\n\t\t[ allPatterns, allCategories ]\n\t);\n\n\tconst patternCategory = selectedCategory\n\t\t? selectedCategory\n\t\t: populatedCategories[ 0 ];\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\tallPatterns.some(\n\t\t\t\t( pattern ) => getPatternIndex( pattern ) === Infinity\n\t\t\t) &&\n\t\t\t! populatedCategories.find(\n\t\t\t\t( category ) => category.name === 'uncategorized'\n\t\t\t)\n\t\t) {\n\t\t\tpopulatedCategories.push( {\n\t\t\t\tname: 'uncategorized',\n\t\t\t\tlabel: _x( 'Uncategorized' ),\n\t\t\t} );\n\t\t}\n\t}, [ populatedCategories, allPatterns ] );\n\n\tconst getPatternIndex = useCallback(\n\t\t( pattern ) => {\n\t\t\tif ( ! pattern.categories || ! pattern.categories.length ) {\n\t\t\t\treturn Infinity;\n\t\t\t}\n\t\t\tconst indexedCategories = fromPairs(\n\t\t\t\tpopulatedCategories.map( ( { name }, index ) => [\n\t\t\t\t\tname,\n\t\t\t\t\tindex,\n\t\t\t\t] )\n\t\t\t);\n\t\t\treturn Math.min(\n\t\t\t\t...pattern.categories.map( ( cat ) =>\n\t\t\t\t\tindexedCategories[ cat ] !== undefined\n\t\t\t\t\t\t? indexedCategories[ cat ]\n\t\t\t\t\t\t: Infinity\n\t\t\t\t)\n\t\t\t);\n\t\t},\n\t\t[ populatedCategories ]\n\t);\n\n\tconst currentCategoryPatterns = useMemo(\n\t\t() =>\n\t\t\tallPatterns.filter( ( pattern ) =>\n\t\t\t\tpatternCategory.name === 'uncategorized'\n\t\t\t\t\t? getPatternIndex( pattern ) === Infinity\n\t\t\t\t\t: pattern.categories &&\n\t\t\t\t\t  pattern.categories.includes( patternCategory.name )\n\t\t\t),\n\t\t[ allPatterns, patternCategory ]\n\t);\n\n\t// Ordering the patterns is important for the async rendering.\n\tconst orderedPatterns = useMemo( () => {\n\t\treturn currentCategoryPatterns.sort( ( a, b ) => {\n\t\t\treturn getPatternIndex( a ) - getPatternIndex( b );\n\t\t} );\n\t}, [ currentCategoryPatterns, getPatternIndex ] );\n\n\tconst currentShownPatterns = useAsyncList( orderedPatterns );\n\n\treturn (\n\t\t<>\n\t\t\t{ !! currentCategoryPatterns.length && (\n\t\t\t\t<PatternInserterPanel\n\t\t\t\t\tselectedCategory={ patternCategory }\n\t\t\t\t\tpatternCategories={ populatedCategories }\n\t\t\t\t\tonClickCategory={ onClickCategory }\n\t\t\t\t>\n\t\t\t\t\t<BlockPatternList\n\t\t\t\t\t\tshownPatterns={ currentShownPatterns }\n\t\t\t\t\t\tblockPatterns={ currentCategoryPatterns }\n\t\t\t\t\t\tonClickPattern={ onClick }\n\t\t\t\t\t\tlabel={ patternCategory.label }\n\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\tisDraggable\n\t\t\t\t\t/>\n\t\t\t\t</PatternInserterPanel>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nfunction BlockPatternsTabs( {\n\trootClientId,\n\tonInsert,\n\tonClickCategory,\n\tselectedCategory,\n} ) {\n\treturn (\n\t\t<BlockPatternsCategory\n\t\t\trootClientId={ rootClientId }\n\t\t\tselectedCategory={ selectedCategory }\n\t\t\tonInsert={ onInsert }\n\t\t\tonClickCategory={ onClickCategory }\n\t\t/>\n\t);\n}\n\nexport default BlockPatternsTabs;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab.js"],"names":["useMemo","useState","useCallback","_x","useAsyncList","PatternInserterPanel","usePatternsState","BlockPatternList","PatternsExplorerModal","BlockPatternsCategory","rootClientId","onInsert","selectedCategory","populatedCategories","allPatterns","onClick","getPatternIndex","pattern","categories","length","Infinity","indexedCategories","reduce","accumulator","name","index","Math","min","map","cat","undefined","currentCategoryPatterns","filter","includes","orderedPatterns","sort","a","b","currentShownPatterns","label","BlockPatternsTabs","onClickCategory","showPatternsExplorer","setShowPatternsExplorer","allCategories","hasRegisteredCategory","some","category","currentName","nextName","find","push","patternCategory"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,QAAlB,EAA4BC,WAA5B,QAA+C,oBAA/C;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,YAAT,QAA6B,oBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,iBAAjC;AACA,OAAOC,gBAAP,MAA6B,4BAA7B;AACA,OAAOC,gBAAP,MAA6B,wBAA7B;AACA,OAAOC,qBAAP,MAAkC,oCAAlC;;AAEA,SAASC,qBAAT,CAAgC;AAC/BC,EAAAA,YAD+B;AAE/BC,EAAAA,QAF+B;AAG/BC,EAAAA,gBAH+B;AAI/BC,EAAAA;AAJ+B,CAAhC,EAKI;AACH,QAAM,CAAEC,WAAF,GAAiBC,OAAjB,IAA6BT,gBAAgB,CAClDK,QADkD,EAElDD,YAFkD,CAAnD;AAKA,QAAMM,eAAe,GAAGd,WAAW,CAChCe,OAAF,IAAe;AAAA;;AACd,QAAK,yBAAEA,OAAO,CAACC,UAAV,gDAAE,oBAAoBC,MAAtB,CAAL,EAAoC;AACnC,aAAOC,QAAP;AACA;;AACD,UAAMC,iBAAiB,GAAGR,mBAAmB,CAACS,MAApB,CACzB,CAAEC,WAAF,EAAe;AAAEC,MAAAA;AAAF,KAAf,EAAyBC,KAAzB,KAAoC;AACnCF,MAAAA,WAAW,CAAEC,IAAF,CAAX,GAAsBC,KAAtB;AACA,aAAOF,WAAP;AACA,KAJwB,EAKzB,EALyB,CAA1B;AAOA,WAAOG,IAAI,CAACC,GAAL,CACN,GAAGV,OAAO,CAACC,UAAR,CAAmBU,GAAnB,CAA0BC,GAAF,IAC1BR,iBAAiB,CAAEQ,GAAF,CAAjB,KAA6BC,SAA7B,GACGT,iBAAiB,CAAEQ,GAAF,CADpB,GAEGT,QAHD,CADG,CAAP;AAOA,GAnBiC,EAoBlC,CAAEP,mBAAF,CApBkC,CAAnC;AAuBA,QAAMkB,uBAAuB,GAAG/B,OAAO,CACtC,MACCc,WAAW,CAACkB,MAAZ,CAAsBf,OAAF;AAAA;;AAAA,WACnBL,gBAAgB,CAACY,IAAjB,KAA0B,eAA1B,GACGR,eAAe,CAAEC,OAAF,CAAf,KAA+BG,QADlC,2BAEGH,OAAO,CAACC,UAFX,yDAEG,qBAAoBe,QAApB,CAA8BrB,gBAAgB,CAACY,IAA/C,CAHgB;AAAA,GAApB,CAFqC,EAOtC,CAAEV,WAAF,EAAeF,gBAAf,CAPsC,CAAvC,CA7BG,CAuCH;;AACA,QAAMsB,eAAe,GAAGlC,OAAO,CAAE,MAAM;AACtC,WAAO+B,uBAAuB,CAACI,IAAxB,CAA8B,CAAEC,CAAF,EAAKC,CAAL,KAAY;AAChD,aAAOrB,eAAe,CAAEoB,CAAF,CAAf,GAAuBpB,eAAe,CAAEqB,CAAF,CAA7C;AACA,KAFM,CAAP;AAGA,GAJ8B,EAI5B,CAAEN,uBAAF,EAA2Bf,eAA3B,CAJ4B,CAA/B;AAMA,QAAMsB,oBAAoB,GAAGlC,YAAY,CAAE8B,eAAF,CAAzC;;AAEA,MAAK,CAAEH,uBAAuB,CAACZ,MAA/B,EAAwC;AACvC,WAAO,IAAP;AACA;;AAED,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,gBAAD;AACC,IAAA,aAAa,EAAGmB,oBADjB;AAEC,IAAA,aAAa,EAAGP,uBAFjB;AAGC,IAAA,cAAc,EAAGhB,OAHlB;AAIC,IAAA,KAAK,EAAGH,gBAAgB,CAAC2B,KAJ1B;AAKC,IAAA,WAAW,EAAC,UALb;AAMC,IAAA,WAAW;AANZ,IADD,CADD;AAYA;;AAED,SAASC,iBAAT,CAA4B;AAC3B9B,EAAAA,YAD2B;AAE3BC,EAAAA,QAF2B;AAG3B8B,EAAAA,eAH2B;AAI3B7B,EAAAA;AAJ2B,CAA5B,EAKI;AACH,QAAM,CAAE8B,oBAAF,EAAwBC,uBAAxB,IAAoD1C,QAAQ,CAAE,KAAF,CAAlE;AACA,QAAM,CAAEa,WAAF,EAAe8B,aAAf,IAAiCtC,gBAAgB,EAAvD;AAEA,QAAMuC,qBAAqB,GAAG3C,WAAW,CACtCe,OAAF,IAAe;AACd,QAAK,CAAEA,OAAO,CAACC,UAAV,IAAwB,CAAED,OAAO,CAACC,UAAR,CAAmBC,MAAlD,EAA2D;AAC1D,aAAO,KAAP;AACA;;AAED,WAAOF,OAAO,CAACC,UAAR,CAAmB4B,IAAnB,CAA2BjB,GAAF,IAC/Be,aAAa,CAACE,IAAd,CAAsBC,QAAF,IAAgBA,QAAQ,CAACvB,IAAT,KAAkBK,GAAtD,CADM,CAAP;AAGA,GATuC,EAUxC,CAAEe,aAAF,CAVwC,CAAzC,CAJG,CAiBH;;AACA,QAAM/B,mBAAmB,GAAGb,OAAO,CAAE,MAAM;AAC1C,UAAMkB,UAAU,GAAG0B,aAAa,CAC9BZ,MADiB,CACPe,QAAF,IACRjC,WAAW,CAACgC,IAAZ,CAAoB7B,OAAF;AAAA;;AAAA,qCACjBA,OAAO,CAACC,UADS,yDACjB,qBAAoBe,QAApB,CAA8Bc,QAAQ,CAACvB,IAAvC,CADiB;AAAA,KAAlB,CAFiB,EAMjBW,IANiB,CAMX,CAAE;AAAEX,MAAAA,IAAI,EAAEwB;AAAR,KAAF,EAAyB;AAAExB,MAAAA,IAAI,EAAEyB;AAAR,KAAzB,KAAiD;AACvD,UAAK,CAAE,CAAED,WAAF,EAAeC,QAAf,EAA0BhB,QAA1B,CAAoC,UAApC,CAAP,EAA0D;AACzD,eAAO,CAAP;AACA;;AACD,aAAOe,WAAW,KAAK,UAAhB,GAA6B,CAAC,CAA9B,GAAkC,CAAzC;AACA,KAXiB,CAAnB;;AAaA,QACClC,WAAW,CAACgC,IAAZ,CACG7B,OAAF,IAAe,CAAE4B,qBAAqB,CAAE5B,OAAF,CADvC,KAGA,CAAEC,UAAU,CAACgC,IAAX,CACCH,QAAF,IAAgBA,QAAQ,CAACvB,IAAT,KAAkB,eADjC,CAJH,EAOE;AACDN,MAAAA,UAAU,CAACiC,IAAX,CAAiB;AAChB3B,QAAAA,IAAI,EAAE,eADU;AAEhBe,QAAAA,KAAK,EAAEpC,EAAE,CAAE,eAAF;AAFO,OAAjB;AAIA;;AAED,WAAOe,UAAP;AACA,GA7BkC,EA6BhC,CAAEJ,WAAF,EAAe8B,aAAf,CA7BgC,CAAnC;AA+BA,QAAMQ,eAAe,GAAGxC,gBAAgB,GACrCA,gBADqC,GAErCC,mBAAmB,CAAE,CAAF,CAFtB;AAIA,SACC,8BACG,CAAE6B,oBAAF,IACD,8BACC,cAAC,oBAAD;AACC,IAAA,gBAAgB,EAAGU,eADpB;AAEC,IAAA,iBAAiB,EAAGvC,mBAFrB;AAGC,IAAA,eAAe,EAAG4B,eAHnB;AAIC,IAAA,mBAAmB,EAAG,MACrBE,uBAAuB,CAAE,IAAF;AALzB,IADD,EASC,cAAC,qBAAD;AACC,IAAA,YAAY,EAAGjC,YADhB;AAEC,IAAA,QAAQ,EAAGC,QAFZ;AAGC,IAAA,gBAAgB,EAAGyC,eAHpB;AAIC,IAAA,mBAAmB,EAAGvC;AAJvB,IATD,CAFF,EAmBG6B,oBAAoB,IACrB,cAAC,qBAAD;AACC,IAAA,eAAe,EAAGU,eADnB;AAEC,IAAA,iBAAiB,EAAGvC,mBAFrB;AAGC,IAAA,YAAY,EAAG,MAAM8B,uBAAuB,CAAE,KAAF;AAH7C,IApBF,CADD;AA6BA;;AAED,eAAeH,iBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useState, useCallback } from '@wordpress/element';\nimport { _x } from '@wordpress/i18n';\nimport { useAsyncList } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport PatternInserterPanel from './pattern-panel';\nimport usePatternsState from './hooks/use-patterns-state';\nimport BlockPatternList from '../block-patterns-list';\nimport PatternsExplorerModal from './block-patterns-explorer/explorer';\n\nfunction BlockPatternsCategory( {\n\trootClientId,\n\tonInsert,\n\tselectedCategory,\n\tpopulatedCategories,\n} ) {\n\tconst [ allPatterns, , onClick ] = usePatternsState(\n\t\tonInsert,\n\t\trootClientId\n\t);\n\n\tconst getPatternIndex = useCallback(\n\t\t( pattern ) => {\n\t\t\tif ( ! pattern.categories?.length ) {\n\t\t\t\treturn Infinity;\n\t\t\t}\n\t\t\tconst indexedCategories = populatedCategories.reduce(\n\t\t\t\t( accumulator, { name }, index ) => {\n\t\t\t\t\taccumulator[ name ] = index;\n\t\t\t\t\treturn accumulator;\n\t\t\t\t},\n\t\t\t\t{}\n\t\t\t);\n\t\t\treturn Math.min(\n\t\t\t\t...pattern.categories.map( ( cat ) =>\n\t\t\t\t\tindexedCategories[ cat ] !== undefined\n\t\t\t\t\t\t? indexedCategories[ cat ]\n\t\t\t\t\t\t: Infinity\n\t\t\t\t)\n\t\t\t);\n\t\t},\n\t\t[ populatedCategories ]\n\t);\n\n\tconst currentCategoryPatterns = useMemo(\n\t\t() =>\n\t\t\tallPatterns.filter( ( pattern ) =>\n\t\t\t\tselectedCategory.name === 'uncategorized'\n\t\t\t\t\t? getPatternIndex( pattern ) === Infinity\n\t\t\t\t\t: pattern.categories?.includes( selectedCategory.name )\n\t\t\t),\n\t\t[ allPatterns, selectedCategory ]\n\t);\n\n\t// Ordering the patterns is important for the async rendering.\n\tconst orderedPatterns = useMemo( () => {\n\t\treturn currentCategoryPatterns.sort( ( a, b ) => {\n\t\t\treturn getPatternIndex( a ) - getPatternIndex( b );\n\t\t} );\n\t}, [ currentCategoryPatterns, getPatternIndex ] );\n\n\tconst currentShownPatterns = useAsyncList( orderedPatterns );\n\n\tif ( ! currentCategoryPatterns.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<div className=\"block-editor-inserter__panel-content\">\n\t\t\t<BlockPatternList\n\t\t\t\tshownPatterns={ currentShownPatterns }\n\t\t\t\tblockPatterns={ currentCategoryPatterns }\n\t\t\t\tonClickPattern={ onClick }\n\t\t\t\tlabel={ selectedCategory.label }\n\t\t\t\torientation=\"vertical\"\n\t\t\t\tisDraggable\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction BlockPatternsTabs( {\n\trootClientId,\n\tonInsert,\n\tonClickCategory,\n\tselectedCategory,\n} ) {\n\tconst [ showPatternsExplorer, setShowPatternsExplorer ] = useState( false );\n\tconst [ allPatterns, allCategories ] = usePatternsState();\n\n\tconst hasRegisteredCategory = useCallback(\n\t\t( pattern ) => {\n\t\t\tif ( ! pattern.categories || ! pattern.categories.length ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\treturn pattern.categories.some( ( cat ) =>\n\t\t\t\tallCategories.some( ( category ) => category.name === cat )\n\t\t\t);\n\t\t},\n\t\t[ allCategories ]\n\t);\n\n\t// Remove any empty categories\n\tconst populatedCategories = useMemo( () => {\n\t\tconst categories = allCategories\n\t\t\t.filter( ( category ) =>\n\t\t\t\tallPatterns.some( ( pattern ) =>\n\t\t\t\t\tpattern.categories?.includes( category.name )\n\t\t\t\t)\n\t\t\t)\n\t\t\t.sort( ( { name: currentName }, { name: nextName } ) => {\n\t\t\t\tif ( ! [ currentName, nextName ].includes( 'featured' ) ) {\n\t\t\t\t\treturn 0;\n\t\t\t\t}\n\t\t\t\treturn currentName === 'featured' ? -1 : 1;\n\t\t\t} );\n\n\t\tif (\n\t\t\tallPatterns.some(\n\t\t\t\t( pattern ) => ! hasRegisteredCategory( pattern )\n\t\t\t) &&\n\t\t\t! categories.find(\n\t\t\t\t( category ) => category.name === 'uncategorized'\n\t\t\t)\n\t\t) {\n\t\t\tcategories.push( {\n\t\t\t\tname: 'uncategorized',\n\t\t\t\tlabel: _x( 'Uncategorized' ),\n\t\t\t} );\n\t\t}\n\n\t\treturn categories;\n\t}, [ allPatterns, allCategories ] );\n\n\tconst patternCategory = selectedCategory\n\t\t? selectedCategory\n\t\t: populatedCategories[ 0 ];\n\n\treturn (\n\t\t<>\n\t\t\t{ ! showPatternsExplorer && (\n\t\t\t\t<>\n\t\t\t\t\t<PatternInserterPanel\n\t\t\t\t\t\tselectedCategory={ patternCategory }\n\t\t\t\t\t\tpatternCategories={ populatedCategories }\n\t\t\t\t\t\tonClickCategory={ onClickCategory }\n\t\t\t\t\t\topenPatternExplorer={ () =>\n\t\t\t\t\t\t\tsetShowPatternsExplorer( true )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<BlockPatternsCategory\n\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\tonInsert={ onInsert }\n\t\t\t\t\t\tselectedCategory={ patternCategory }\n\t\t\t\t\t\tpopulatedCategories={ populatedCategories }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ showPatternsExplorer && (\n\t\t\t\t<PatternsExplorerModal\n\t\t\t\t\tinitialCategory={ patternCategory }\n\t\t\t\t\tpatternCategories={ populatedCategories }\n\t\t\t\t\tonModalClose={ () => setShowPatternsExplorer( false ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default BlockPatternsTabs;\n"]}

package/build-module/components/inserter/hooks/use-block-type-impressions.native.js

@@ -11,27 +11,24 @@ import { store as blockEditorStore } from '../../../store';
 
 function useBlockTypeImpressions(blockTypes) {
   const {
-    blockTypeImpressions,
-    enableEditorOnboarding
+    blockTypeImpressions
   } = useSelect(select => {
     const {
       getSettings: getBlockEditorSettings
     } = select(blockEditorStore);
     const {
-      editorOnboarding,
       impressions
     } = getBlockEditorSettings();
     return {
-      blockTypeImpressions: impressions,
-      enableEditorOnboarding: editorOnboarding
+      blockTypeImpressions: impressions
     };
   }, []);
   const {
     updateSettings
   } = useDispatch(blockEditorStore);
-  const items = enableEditorOnboarding ? blockTypes.map(blockType => ({ ...blockType,
+  const items = blockTypes.map(blockType => ({ ...blockType,
     isNew: blockTypeImpressions[blockType.name] > 0
-  })) : blockTypes;
+  }));
 
   const trackBlockTypeSelected = ({
     name

package/build-module/components/inserter/hooks/use-block-type-impressions.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/hooks/use-block-type-impressions.native.js"],"names":["useSelect","useDispatch","setBlockTypeImpressions","store","blockEditorStore","useBlockTypeImpressions","blockTypes","blockTypeImpressions","enableEditorOnboarding","select","getSettings","getBlockEditorSettings","editorOnboarding","impressions","updateSettings","items","map","blockType","isNew","name","trackBlockTypeSelected","updatedBlockTypeImpressions"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AACA,SAASC,uBAAT,QAAwC,gCAAxC;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,gBAA1C;;AAEA,SAASC,uBAAT,CAAkCC,UAAlC,EAA+C;AAC9C,QAAM;AAAEC,IAAAA,oBAAF;AAAwBC,IAAAA;AAAxB,MAAmDR,SAAS,CAC/DS,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA,WAAW,EAAEC;AAAf,QAA0CF,MAAM,CACrDL,gBADqD,CAAtD;AAGA,UAAM;AAAEQ,MAAAA,gBAAF;AAAoBC,MAAAA;AAApB,QAAoCF,sBAAsB,EAAhE;AAEA,WAAO;AACNJ,MAAAA,oBAAoB,EAAEM,WADhB;AAENL,MAAAA,sBAAsB,EAAEI;AAFlB,KAAP;AAIA,GAXgE,EAYjE,EAZiE,CAAlE;AAcA,QAAM;AAAEE,IAAAA;AAAF,MAAqBb,WAAW,CAAEG,gBAAF,CAAtC;AAEA,QAAMW,KAAK,GAAGP,sBAAsB,GACjCF,UAAU,CAACU,GAAX,CAAkBC,SAAF,KAAmB,EACnC,GAAGA,SADgC;AAEnCC,IAAAA,KAAK,EAAEX,oBAAoB,CAAEU,SAAS,CAACE,IAAZ,CAApB,GAAyC;AAFb,GAAnB,CAAhB,CADiC,GAKjCb,UALH;;AAOA,QAAMc,sBAAsB,GAAG,CAAE;AAAED,IAAAA;AAAF,GAAF,KAAgB;AAC9C,QAAKZ,oBAAoB,CAAEY,IAAF,CAApB,GAA+B,CAApC,EAAwC;AACvC,YAAME,2BAA2B,GAAG,EACnC,GAAGd,oBADgC;AAEnC,SAAEY,IAAF,GAAU;AAFyB,OAApC,CADuC,CAKvC;;AACAL,MAAAA,cAAc,CAAE;AACfD,QAAAA,WAAW,EAAEQ;AADE,OAAF,CAAd,CANuC,CAUvC;;AACAnB,MAAAA,uBAAuB,CAAEmB,2BAAF,CAAvB;AACA;AACD,GAdD;;AAgBA,SAAO;AAAEN,IAAAA,KAAF;AAASK,IAAAA;AAAT,GAAP;AACA;;AAED,eAAef,uBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { setBlockTypeImpressions } from '@wordpress/react-native-bridge';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../../store';\n\nfunction useBlockTypeImpressions( blockTypes ) {\n\tconst { blockTypeImpressions, enableEditorOnboarding } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getSettings: getBlockEditorSettings } = select(\n\t\t\t\tblockEditorStore\n\t\t\t);\n\t\t\tconst { editorOnboarding, impressions } = getBlockEditorSettings();\n\n\t\t\treturn {\n\t\t\t\tblockTypeImpressions: impressions,\n\t\t\t\tenableEditorOnboarding: editorOnboarding,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { updateSettings } = useDispatch( blockEditorStore );\n\n\tconst items = enableEditorOnboarding\n\t\t? blockTypes.map( ( blockType ) => ( {\n\t\t\t\t...blockType,\n\t\t\t\tisNew: blockTypeImpressions[ blockType.name ] > 0,\n\t\t  } ) )\n\t\t: blockTypes;\n\n\tconst trackBlockTypeSelected = ( { name } ) => {\n\t\tif ( blockTypeImpressions[ name ] > 0 ) {\n\t\t\tconst updatedBlockTypeImpressions = {\n\t\t\t\t...blockTypeImpressions,\n\t\t\t\t[ name ]: 0,\n\t\t\t};\n\t\t\t// Persist block type impression to JavaScript store\n\t\t\tupdateSettings( {\n\t\t\t\timpressions: updatedBlockTypeImpressions,\n\t\t\t} );\n\n\t\t\t// Persist block type impression count to native app store\n\t\t\tsetBlockTypeImpressions( updatedBlockTypeImpressions );\n\t\t}\n\t};\n\n\treturn { items, trackBlockTypeSelected };\n}\n\nexport default useBlockTypeImpressions;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/hooks/use-block-type-impressions.native.js"],"names":["useSelect","useDispatch","setBlockTypeImpressions","store","blockEditorStore","useBlockTypeImpressions","blockTypes","blockTypeImpressions","select","getSettings","getBlockEditorSettings","impressions","updateSettings","items","map","blockType","isNew","name","trackBlockTypeSelected","updatedBlockTypeImpressions"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AACA,SAASC,uBAAT,QAAwC,gCAAxC;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,gBAA1C;;AAEA,SAASC,uBAAT,CAAkCC,UAAlC,EAA+C;AAC9C,QAAM;AAAEC,IAAAA;AAAF,MAA2BP,SAAS,CAAIQ,MAAF,IAAc;AACzD,UAAM;AAAEC,MAAAA,WAAW,EAAEC;AAAf,QAA0CF,MAAM,CACrDJ,gBADqD,CAAtD;AAGA,UAAM;AAAEO,MAAAA;AAAF,QAAkBD,sBAAsB,EAA9C;AAEA,WAAO;AACNH,MAAAA,oBAAoB,EAAEI;AADhB,KAAP;AAGA,GATyC,EASvC,EATuC,CAA1C;AAUA,QAAM;AAAEC,IAAAA;AAAF,MAAqBX,WAAW,CAAEG,gBAAF,CAAtC;AAEA,QAAMS,KAAK,GAAGP,UAAU,CAACQ,GAAX,CAAkBC,SAAF,KAAmB,EAChD,GAAGA,SAD6C;AAEhDC,IAAAA,KAAK,EAAET,oBAAoB,CAAEQ,SAAS,CAACE,IAAZ,CAApB,GAAyC;AAFA,GAAnB,CAAhB,CAAd;;AAIA,QAAMC,sBAAsB,GAAG,CAAE;AAAED,IAAAA;AAAF,GAAF,KAAgB;AAC9C,QAAKV,oBAAoB,CAAEU,IAAF,CAApB,GAA+B,CAApC,EAAwC;AACvC,YAAME,2BAA2B,GAAG,EACnC,GAAGZ,oBADgC;AAEnC,SAAEU,IAAF,GAAU;AAFyB,OAApC,CADuC,CAKvC;;AACAL,MAAAA,cAAc,CAAE;AACfD,QAAAA,WAAW,EAAEQ;AADE,OAAF,CAAd,CANuC,CAUvC;;AACAjB,MAAAA,uBAAuB,CAAEiB,2BAAF,CAAvB;AACA;AACD,GAdD;;AAgBA,SAAO;AAAEN,IAAAA,KAAF;AAASK,IAAAA;AAAT,GAAP;AACA;;AAED,eAAeb,uBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { setBlockTypeImpressions } from '@wordpress/react-native-bridge';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../../store';\n\nfunction useBlockTypeImpressions( blockTypes ) {\n\tconst { blockTypeImpressions } = useSelect( ( select ) => {\n\t\tconst { getSettings: getBlockEditorSettings } = select(\n\t\t\tblockEditorStore\n\t\t);\n\t\tconst { impressions } = getBlockEditorSettings();\n\n\t\treturn {\n\t\t\tblockTypeImpressions: impressions,\n\t\t};\n\t}, [] );\n\tconst { updateSettings } = useDispatch( blockEditorStore );\n\n\tconst items = blockTypes.map( ( blockType ) => ( {\n\t\t...blockType,\n\t\tisNew: blockTypeImpressions[ blockType.name ] > 0,\n\t} ) );\n\tconst trackBlockTypeSelected = ( { name } ) => {\n\t\tif ( blockTypeImpressions[ name ] > 0 ) {\n\t\t\tconst updatedBlockTypeImpressions = {\n\t\t\t\t...blockTypeImpressions,\n\t\t\t\t[ name ]: 0,\n\t\t\t};\n\t\t\t// Persist block type impression to JavaScript store\n\t\t\tupdateSettings( {\n\t\t\t\timpressions: updatedBlockTypeImpressions,\n\t\t\t} );\n\n\t\t\t// Persist block type impression count to native app store\n\t\t\tsetBlockTypeImpressions( updatedBlockTypeImpressions );\n\t\t}\n\t};\n\n\treturn { items, trackBlockTypeSelected };\n}\n\nexport default useBlockTypeImpressions;\n"]}

package/build-module/components/inserter/pattern-panel.js

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement } from "@wordpress/element";
 
 /**
  * External dependencies
@@ -8,15 +8,18 @@ import classnames from 'classnames';
  * WordPress dependencies
  */
 
-import { SelectControl } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
+import { Flex, FlexItem, SelectControl, Button } from '@wordpress/components';
+import { __, _x } from '@wordpress/i18n';
+import { useViewportMatch } from '@wordpress/compose';
 
 function PatternInserterPanel({
   selectedCategory,
   patternCategories,
   onClickCategory,
-  children
+  openPatternExplorer
 }) {
+  const isMobile = useViewportMatch('medium', '<');
+
   const categoryOptions = () => {
     const options = [];
     patternCategories.map(patternCategory => {
@@ -32,22 +35,24 @@ function PatternInserterPanel({
     onClickCategory(patternCategories.find(patternCategory => selected === patternCategory.name));
   };
 
-  const getPanelHeaderClassName = () => {
-    return classnames('block-editor-inserter__panel-header', 'block-editor-inserter__panel-header-patterns');
-  }; // In iOS-based mobile devices, the onBlur will fire when selecting an option
+  const className = classnames('block-editor-inserter__panel-header', 'block-editor-inserter__panel-header-patterns'); // In iOS-based mobile devices, the onBlur will fire when selecting an option
   // from a Select element. To prevent closing the useDialog on iOS devices, we
   // stop propagating the onBlur event if there is no relatedTarget, which means
   // that the user most likely did not click on an element within the editor canvas.
 
-
   const onBlur = event => {
     if (!(event !== null && event !== void 0 && event.relatedTarget)) {
       event.stopPropagation();
     }
   };
 
-  return createElement(Fragment, null, createElement("div", {
-    className: getPanelHeaderClassName()
+  return createElement(Flex, {
+    justify: "space-between",
+    align: "start",
+    gap: "4",
+    className: className
+  }, createElement(FlexItem, {
+    isBlock: true
   }, createElement(SelectControl, {
     className: "block-editor-inserter__panel-dropdown",
     label: __('Filter patterns'),
@@ -56,9 +61,12 @@ function PatternInserterPanel({
     onChange: onChangeSelect,
     onBlur: onBlur,
     options: categoryOptions()
-  })), createElement("div", {
-    className: "block-editor-inserter__panel-content"
-  }, children));
+  })), !isMobile && createElement(FlexItem, null, createElement(Button, {
+    variant: "secondary",
+    className: "block-editor-inserter__patterns-explorer-expand",
+    label: __('Explore all patterns'),
+    onClick: () => openPatternExplorer()
+  }, _x('Explore', 'Label for showing all block patterns'))));
 }
 
 export default PatternInserterPanel;

package/build-module/components/inserter/pattern-panel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/pattern-panel.js"],"names":["classnames","SelectControl","__","PatternInserterPanel","selectedCategory","patternCategories","onClickCategory","children","categoryOptions","options","map","patternCategory","push","value","name","label","onChangeSelect","selected","find","getPanelHeaderClassName","onBlur","event","relatedTarget","stopPropagation"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,aAAT,QAA8B,uBAA9B;AACA,SAASC,EAAT,QAAmB,iBAAnB;;AAEA,SAASC,oBAAT,CAA+B;AAC9BC,EAAAA,gBAD8B;AAE9BC,EAAAA,iBAF8B;AAG9BC,EAAAA,eAH8B;AAI9BC,EAAAA;AAJ8B,CAA/B,EAKI;AACH,QAAMC,eAAe,GAAG,MAAM;AAC7B,UAAMC,OAAO,GAAG,EAAhB;AAEAJ,IAAAA,iBAAiB,CAACK,GAAlB,CAAyBC,eAAF,IAAuB;AAC7C,aAAOF,OAAO,CAACG,IAAR,CAAc;AACpBC,QAAAA,KAAK,EAAEF,eAAe,CAACG,IADH;AAEpBC,QAAAA,KAAK,EAAEJ,eAAe,CAACI;AAFH,OAAd,CAAP;AAIA,KALD;AAOA,WAAON,OAAP;AACA,GAXD;;AAaA,QAAMO,cAAc,GAAKC,QAAF,IAAgB;AACtCX,IAAAA,eAAe,CACdD,iBAAiB,CAACa,IAAlB,CACGP,eAAF,IAAuBM,QAAQ,KAAKN,eAAe,CAACG,IADrD,CADc,CAAf;AAKA,GAND;;AAQA,QAAMK,uBAAuB,GAAG,MAAM;AACrC,WAAOnB,UAAU,CAChB,qCADgB,EAEhB,8CAFgB,CAAjB;AAIA,GALD,CAtBG,CA6BH;AACA;AACA;AACA;;;AACA,QAAMoB,MAAM,GAAKC,KAAF,IAAa;AAC3B,QAAK,EAAEA,KAAF,aAAEA,KAAF,eAAEA,KAAK,CAAEC,aAAT,CAAL,EAA8B;AAC7BD,MAAAA,KAAK,CAACE,eAAN;AACA;AACD,GAJD;;AAMA,SACC,8BACC;AAAK,IAAA,SAAS,EAAGJ,uBAAuB;AAAxC,KACC,cAAC,aAAD;AACC,IAAA,SAAS,EAAC,uCADX;AAEC,IAAA,KAAK,EAAGjB,EAAE,CAAE,iBAAF,CAFX;AAGC,IAAA,mBAAmB,MAHpB;AAIC,IAAA,KAAK,EAAGE,gBAAgB,CAACU,IAJ1B;AAKC,IAAA,QAAQ,EAAGE,cALZ;AAMC,IAAA,MAAM,EAAGI,MANV;AAOC,IAAA,OAAO,EAAGZ,eAAe;AAP1B,IADD,CADD,EAYC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,QADH,CAZD,CADD;AAkBA;;AAED,eAAeJ,oBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { SelectControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nfunction PatternInserterPanel( {\n\tselectedCategory,\n\tpatternCategories,\n\tonClickCategory,\n\tchildren,\n} ) {\n\tconst categoryOptions = () => {\n\t\tconst options = [];\n\n\t\tpatternCategories.map( ( patternCategory ) => {\n\t\t\treturn options.push( {\n\t\t\t\tvalue: patternCategory.name,\n\t\t\t\tlabel: patternCategory.label,\n\t\t\t} );\n\t\t} );\n\n\t\treturn options;\n\t};\n\n\tconst onChangeSelect = ( selected ) => {\n\t\tonClickCategory(\n\t\t\tpatternCategories.find(\n\t\t\t\t( patternCategory ) => selected === patternCategory.name\n\t\t\t)\n\t\t);\n\t};\n\n\tconst getPanelHeaderClassName = () => {\n\t\treturn classnames(\n\t\t\t'block-editor-inserter__panel-header',\n\t\t\t'block-editor-inserter__panel-header-patterns'\n\t\t);\n\t};\n\n\t// In iOS-based mobile devices, the onBlur will fire when selecting an option\n\t// from a Select element. To prevent closing the useDialog on iOS devices, we\n\t// stop propagating the onBlur event if there is no relatedTarget, which means\n\t// that the user most likely did not click on an element within the editor canvas.\n\tconst onBlur = ( event ) => {\n\t\tif ( ! event?.relatedTarget ) {\n\t\t\tevent.stopPropagation();\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<div className={ getPanelHeaderClassName() }>\n\t\t\t\t<SelectControl\n\t\t\t\t\tclassName=\"block-editor-inserter__panel-dropdown\"\n\t\t\t\t\tlabel={ __( 'Filter patterns' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tvalue={ selectedCategory.name }\n\t\t\t\t\tonChange={ onChangeSelect }\n\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\toptions={ categoryOptions() }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div className=\"block-editor-inserter__panel-content\">\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default PatternInserterPanel;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/pattern-panel.js"],"names":["classnames","Flex","FlexItem","SelectControl","Button","__","_x","useViewportMatch","PatternInserterPanel","selectedCategory","patternCategories","onClickCategory","openPatternExplorer","isMobile","categoryOptions","options","map","patternCategory","push","value","name","label","onChangeSelect","selected","find","className","onBlur","event","relatedTarget","stopPropagation"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,EAAeC,QAAf,EAAyBC,aAAzB,EAAwCC,MAAxC,QAAsD,uBAAtD;AACA,SAASC,EAAT,EAAaC,EAAb,QAAuB,iBAAvB;AACA,SAASC,gBAAT,QAAiC,oBAAjC;;AAEA,SAASC,oBAAT,CAA+B;AAC9BC,EAAAA,gBAD8B;AAE9BC,EAAAA,iBAF8B;AAG9BC,EAAAA,eAH8B;AAI9BC,EAAAA;AAJ8B,CAA/B,EAKI;AACH,QAAMC,QAAQ,GAAGN,gBAAgB,CAAE,QAAF,EAAY,GAAZ,CAAjC;;AACA,QAAMO,eAAe,GAAG,MAAM;AAC7B,UAAMC,OAAO,GAAG,EAAhB;AAEAL,IAAAA,iBAAiB,CAACM,GAAlB,CAAyBC,eAAF,IAAuB;AAC7C,aAAOF,OAAO,CAACG,IAAR,CAAc;AACpBC,QAAAA,KAAK,EAAEF,eAAe,CAACG,IADH;AAEpBC,QAAAA,KAAK,EAAEJ,eAAe,CAACI;AAFH,OAAd,CAAP;AAIA,KALD;AAOA,WAAON,OAAP;AACA,GAXD;;AAaA,QAAMO,cAAc,GAAKC,QAAF,IAAgB;AACtCZ,IAAAA,eAAe,CACdD,iBAAiB,CAACc,IAAlB,CACGP,eAAF,IAAuBM,QAAQ,KAAKN,eAAe,CAACG,IADrD,CADc,CAAf;AAKA,GAND;;AAQA,QAAMK,SAAS,GAAGzB,UAAU,CAC3B,qCAD2B,EAE3B,8CAF2B,CAA5B,CAvBG,CA4BH;AACA;AACA;AACA;;AACA,QAAM0B,MAAM,GAAKC,KAAF,IAAa;AAC3B,QAAK,EAAEA,KAAF,aAAEA,KAAF,eAAEA,KAAK,CAAEC,aAAT,CAAL,EAA8B;AAC7BD,MAAAA,KAAK,CAACE,eAAN;AACA;AACD,GAJD;;AAMA,SACC,cAAC,IAAD;AACC,IAAA,OAAO,EAAC,eADT;AAEC,IAAA,KAAK,EAAC,OAFP;AAGC,IAAA,GAAG,EAAC,GAHL;AAIC,IAAA,SAAS,EAAGJ;AAJb,KAMC,cAAC,QAAD;AAAU,IAAA,OAAO;AAAjB,KACC,cAAC,aAAD;AACC,IAAA,SAAS,EAAC,uCADX;AAEC,IAAA,KAAK,EAAGpB,EAAE,CAAE,iBAAF,CAFX;AAGC,IAAA,mBAAmB,MAHpB;AAIC,IAAA,KAAK,EAAGI,gBAAgB,CAACW,IAJ1B;AAKC,IAAA,QAAQ,EAAGE,cALZ;AAMC,IAAA,MAAM,EAAGI,MANV;AAOC,IAAA,OAAO,EAAGZ,eAAe;AAP1B,IADD,CAND,EAiBG,CAAED,QAAF,IACD,cAAC,QAAD,QACC,cAAC,MAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,SAAS,EAAC,iDAFX;AAGC,IAAA,KAAK,EAAGR,EAAE,CAAE,sBAAF,CAHX;AAIC,IAAA,OAAO,EAAG,MAAMO,mBAAmB;AAJpC,KAMGN,EAAE,CACH,SADG,EAEH,sCAFG,CANL,CADD,CAlBF,CADD;AAmCA;;AAED,eAAeE,oBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Flex, FlexItem, SelectControl, Button } from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { useViewportMatch } from '@wordpress/compose';\n\nfunction PatternInserterPanel( {\n\tselectedCategory,\n\tpatternCategories,\n\tonClickCategory,\n\topenPatternExplorer,\n} ) {\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\tconst categoryOptions = () => {\n\t\tconst options = [];\n\n\t\tpatternCategories.map( ( patternCategory ) => {\n\t\t\treturn options.push( {\n\t\t\t\tvalue: patternCategory.name,\n\t\t\t\tlabel: patternCategory.label,\n\t\t\t} );\n\t\t} );\n\n\t\treturn options;\n\t};\n\n\tconst onChangeSelect = ( selected ) => {\n\t\tonClickCategory(\n\t\t\tpatternCategories.find(\n\t\t\t\t( patternCategory ) => selected === patternCategory.name\n\t\t\t)\n\t\t);\n\t};\n\n\tconst className = classnames(\n\t\t'block-editor-inserter__panel-header',\n\t\t'block-editor-inserter__panel-header-patterns'\n\t);\n\n\t// In iOS-based mobile devices, the onBlur will fire when selecting an option\n\t// from a Select element. To prevent closing the useDialog on iOS devices, we\n\t// stop propagating the onBlur event if there is no relatedTarget, which means\n\t// that the user most likely did not click on an element within the editor canvas.\n\tconst onBlur = ( event ) => {\n\t\tif ( ! event?.relatedTarget ) {\n\t\t\tevent.stopPropagation();\n\t\t}\n\t};\n\n\treturn (\n\t\t<Flex\n\t\t\tjustify=\"space-between\"\n\t\t\talign=\"start\"\n\t\t\tgap=\"4\"\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<FlexItem isBlock>\n\t\t\t\t<SelectControl\n\t\t\t\t\tclassName=\"block-editor-inserter__panel-dropdown\"\n\t\t\t\t\tlabel={ __( 'Filter patterns' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tvalue={ selectedCategory.name }\n\t\t\t\t\tonChange={ onChangeSelect }\n\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\toptions={ categoryOptions() }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t\t{ ! isMobile && (\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-explorer-expand\"\n\t\t\t\t\t\tlabel={ __( 'Explore all patterns' ) }\n\t\t\t\t\t\tonClick={ () => openPatternExplorer() }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ _x(\n\t\t\t\t\t\t\t'Explore',\n\t\t\t\t\t\t\t'Label for showing all block patterns'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t) }\n\t\t</Flex>\n\t);\n}\n\nexport default PatternInserterPanel;\n"]}

package/build-module/components/inspector-controls/groups.js

@@ -5,10 +5,12 @@ import { createSlotFill } from '@wordpress/components';
 const InspectorControlsDefault = createSlotFill('InspectorControls');
 const InspectorControlsAdvanced = createSlotFill('InspectorAdvancedControls');
 const InspectorControlsDimensions = createSlotFill('InspectorControlsDimensions');
+const InspectorControlsTypography = createSlotFill('InspectorControlsTypography');
 const groups = {
   default: InspectorControlsDefault,
   advanced: InspectorControlsAdvanced,
-  dimensions: InspectorControlsDimensions
+  dimensions: InspectorControlsDimensions,
+  typography: InspectorControlsTypography
 };
 export default groups;
 //# sourceMappingURL=groups.js.map

package/build-module/components/inspector-controls/groups.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/inspector-controls/groups.js"],"names":["createSlotFill","InspectorControlsDefault","InspectorControlsAdvanced","InspectorControlsDimensions","groups","default","advanced","dimensions"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,uBAA/B;AAEA,MAAMC,wBAAwB,GAAGD,cAAc,CAAE,mBAAF,CAA/C;AACA,MAAME,yBAAyB,GAAGF,cAAc,CAAE,2BAAF,CAAhD;AACA,MAAMG,2BAA2B,GAAGH,cAAc,CACjD,6BADiD,CAAlD;AAIA,MAAMI,MAAM,GAAG;AACdC,EAAAA,OAAO,EAAEJ,wBADK;AAEdK,EAAAA,QAAQ,EAAEJ,yBAFI;AAGdK,EAAAA,UAAU,EAAEJ;AAHE,CAAf;AAMA,eAAeC,MAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createSlotFill } from '@wordpress/components';\n\nconst InspectorControlsDefault = createSlotFill( 'InspectorControls' );\nconst InspectorControlsAdvanced = createSlotFill( 'InspectorAdvancedControls' );\nconst InspectorControlsDimensions = createSlotFill(\n\t'InspectorControlsDimensions'\n);\n\nconst groups = {\n\tdefault: InspectorControlsDefault,\n\tadvanced: InspectorControlsAdvanced,\n\tdimensions: InspectorControlsDimensions,\n};\n\nexport default groups;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/inspector-controls/groups.js"],"names":["createSlotFill","InspectorControlsDefault","InspectorControlsAdvanced","InspectorControlsDimensions","InspectorControlsTypography","groups","default","advanced","dimensions","typography"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,uBAA/B;AAEA,MAAMC,wBAAwB,GAAGD,cAAc,CAAE,mBAAF,CAA/C;AACA,MAAME,yBAAyB,GAAGF,cAAc,CAAE,2BAAF,CAAhD;AACA,MAAMG,2BAA2B,GAAGH,cAAc,CACjD,6BADiD,CAAlD;AAGA,MAAMI,2BAA2B,GAAGJ,cAAc,CACjD,6BADiD,CAAlD;AAIA,MAAMK,MAAM,GAAG;AACdC,EAAAA,OAAO,EAAEL,wBADK;AAEdM,EAAAA,QAAQ,EAAEL,yBAFI;AAGdM,EAAAA,UAAU,EAAEL,2BAHE;AAIdM,EAAAA,UAAU,EAAEL;AAJE,CAAf;AAOA,eAAeC,MAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createSlotFill } from '@wordpress/components';\n\nconst InspectorControlsDefault = createSlotFill( 'InspectorControls' );\nconst InspectorControlsAdvanced = createSlotFill( 'InspectorAdvancedControls' );\nconst InspectorControlsDimensions = createSlotFill(\n\t'InspectorControlsDimensions'\n);\nconst InspectorControlsTypography = createSlotFill(\n\t'InspectorControlsTypography'\n);\n\nconst groups = {\n\tdefault: InspectorControlsDefault,\n\tadvanced: InspectorControlsAdvanced,\n\tdimensions: InspectorControlsDimensions,\n\ttypography: InspectorControlsTypography,\n};\n\nexport default groups;\n"]}

package/build-module/components/letter-spacing-control/index.js

@@ -13,15 +13,18 @@ import useSetting from '../../components/use-setting';
 /**
  * Control for letter-spacing.
  *
- * @param {Object}   props          Component props.
- * @param {string}   props.value    Currently selected letter-spacing.
- * @param {Function} props.onChange Handles change in letter-spacing selection.
- * @return {WPElement}                      Letter-spacing control.
+ * @param {Object}   props                      Component props.
+ * @param {string}   props.value                Currently selected letter-spacing.
+ * @param {Function} props.onChange             Handles change in letter-spacing selection.
+ * @param {boolean}  props.__unstableInputWidth Input width to pass through to inner UnitControl.
+ *
+ * @return {WPElement}                          Letter-spacing control.
  */
 
 export default function LetterSpacingControl({
   value,
-  onChange
+  onChange,
+  __unstableInputWidth = '60px'
 }) {
   const units = useCustomUnits({
     availableUnits: useSetting('spacing.units') || ['px', 'em', 'rem'],
@@ -34,7 +37,7 @@ export default function LetterSpacingControl({
   return createElement(UnitControl, {
     label: __('Letter-spacing'),
     value: value,
-    __unstableInputWidth: "60px",
+    __unstableInputWidth: __unstableInputWidth,
     units: units,
     onChange: onChange
   });

package/build-module/components/letter-spacing-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/letter-spacing-control/index.js"],"names":["__experimentalUnitControl","UnitControl","__experimentalUseCustomUnits","useCustomUnits","__","useSetting","LetterSpacingControl","value","onChange","units","availableUnits","defaultValues","px","em","rem"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,yBAAyB,IAAIC,WAD9B,EAECC,4BAA4B,IAAIC,cAFjC,QAGO,uBAHP;AAIA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,8BAAvB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,oBAAT,CAA+B;AAAEC,EAAAA,KAAF;AAASC,EAAAA;AAAT,CAA/B,EAAqD;AACnE,QAAMC,KAAK,GAAGN,cAAc,CAAE;AAC7BO,IAAAA,cAAc,EAAEL,UAAU,CAAE,eAAF,CAAV,IAAiC,CAAE,IAAF,EAAQ,IAAR,EAAc,KAAd,CADpB;AAE7BM,IAAAA,aAAa,EAAE;AAAEC,MAAAA,EAAE,EAAE,GAAN;AAAWC,MAAAA,EAAE,EAAE,IAAf;AAAqBC,MAAAA,GAAG,EAAE;AAA1B;AAFc,GAAF,CAA5B;AAIA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGV,EAAE,CAAE,gBAAF,CADX;AAEC,IAAA,KAAK,EAAGG,KAFT;AAGC,IAAA,oBAAoB,EAAC,MAHtB;AAIC,IAAA,KAAK,EAAGE,KAJT;AAKC,IAAA,QAAQ,EAAGD;AALZ,IADD;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../../components/use-setting';\n\n/**\n * Control for letter-spacing.\n *\n * @param {Object}   props          Component props.\n * @param {string}   props.value    Currently selected letter-spacing.\n * @param {Function} props.onChange Handles change in letter-spacing selection.\n * @return {WPElement}                      Letter-spacing control.\n */\nexport default function LetterSpacingControl( { value, onChange } ) {\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [ 'px', 'em', 'rem' ],\n\t\tdefaultValues: { px: '2', em: '.2', rem: '.2' },\n\t} );\n\treturn (\n\t\t<UnitControl\n\t\t\tlabel={ __( 'Letter-spacing' ) }\n\t\t\tvalue={ value }\n\t\t\t__unstableInputWidth=\"60px\"\n\t\t\tunits={ units }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/letter-spacing-control/index.js"],"names":["__experimentalUnitControl","UnitControl","__experimentalUseCustomUnits","useCustomUnits","__","useSetting","LetterSpacingControl","value","onChange","__unstableInputWidth","units","availableUnits","defaultValues","px","em","rem"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,yBAAyB,IAAIC,WAD9B,EAECC,4BAA4B,IAAIC,cAFjC,QAGO,uBAHP;AAIA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,8BAAvB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,oBAAT,CAA+B;AAC7CC,EAAAA,KAD6C;AAE7CC,EAAAA,QAF6C;AAG7CC,EAAAA,oBAAoB,GAAG;AAHsB,CAA/B,EAIX;AACH,QAAMC,KAAK,GAAGP,cAAc,CAAE;AAC7BQ,IAAAA,cAAc,EAAEN,UAAU,CAAE,eAAF,CAAV,IAAiC,CAAE,IAAF,EAAQ,IAAR,EAAc,KAAd,CADpB;AAE7BO,IAAAA,aAAa,EAAE;AAAEC,MAAAA,EAAE,EAAE,GAAN;AAAWC,MAAAA,EAAE,EAAE,IAAf;AAAqBC,MAAAA,GAAG,EAAE;AAA1B;AAFc,GAAF,CAA5B;AAIA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGX,EAAE,CAAE,gBAAF,CADX;AAEC,IAAA,KAAK,EAAGG,KAFT;AAGC,IAAA,oBAAoB,EAAGE,oBAHxB;AAIC,IAAA,KAAK,EAAGC,KAJT;AAKC,IAAA,QAAQ,EAAGF;AALZ,IADD;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../../components/use-setting';\n\n/**\n * Control for letter-spacing.\n *\n * @param {Object}   props                      Component props.\n * @param {string}   props.value                Currently selected letter-spacing.\n * @param {Function} props.onChange             Handles change in letter-spacing selection.\n * @param {boolean}  props.__unstableInputWidth Input width to pass through to inner UnitControl.\n *\n * @return {WPElement}                          Letter-spacing control.\n */\nexport default function LetterSpacingControl( {\n\tvalue,\n\tonChange,\n\t__unstableInputWidth = '60px',\n} ) {\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [ 'px', 'em', 'rem' ],\n\t\tdefaultValues: { px: '2', em: '.2', rem: '.2' },\n\t} );\n\treturn (\n\t\t<UnitControl\n\t\t\tlabel={ __( 'Letter-spacing' ) }\n\t\t\tvalue={ value }\n\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\tunits={ units }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n"]}