@wordpress/block-editor 12.13.0 → 12.14.0

package/build/components/inserter/{block-patterns-filter.js → block-patterns-tab/patterns-filter.js}

@@ -3,14 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.BlockPatternsSyncFilter = BlockPatternsSyncFilter;
-exports.SYNC_TYPES = exports.PATTERN_TYPES = void 0;
+exports.PatternsFilter = PatternsFilter;
 var _react = require("react");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
 var _icons = require("@wordpress/icons");
 var _element = require("@wordpress/element");
-var _blockPatternsTab = require("./block-patterns-tab");
+var _utils = require("./utils");
 /**
  * WordPress dependencies
  */
@@ -19,26 +18,11 @@ var _blockPatternsTab = require("./block-patterns-tab");
  * Internal dependencies
  */
 
-const PATTERN_TYPES = {
-  all: 'all',
-  synced: 'synced',
-  unsynced: 'unsynced',
-  user: 'user',
-  theme: 'theme',
-  directory: 'directory'
-};
-exports.PATTERN_TYPES = PATTERN_TYPES;
-const SYNC_TYPES = {
-  all: 'all',
-  full: 'fully',
-  unsynced: 'unsynced'
-};
-exports.SYNC_TYPES = SYNC_TYPES;
-const getShouldDisableSyncFilter = sourceFilter => sourceFilter !== PATTERN_TYPES.all && sourceFilter !== PATTERN_TYPES.user;
+const getShouldDisableSyncFilter = sourceFilter => sourceFilter !== _utils.PATTERN_TYPES.all && sourceFilter !== _utils.PATTERN_TYPES.user;
 const getShouldDisableNonUserSources = category => {
-  return category.name === _blockPatternsTab.myPatternsCategory.name;
+  return category.name === _utils.myPatternsCategory.name;
 };
-function BlockPatternsSyncFilter({
+function PatternsFilter({
   setPatternSyncFilter,
   setPatternSourceFilter,
   patternSyncFilter,
@@ -50,7 +34,7 @@ function BlockPatternsSyncFilter({
   // we do this by deriving from props rather than calling setPatternSourceFilter otherwise
   // the user may be confused when switching to another category if the haven't explicity set
   // this filter themselves.
-  const currentPatternSourceFilter = category.name === _blockPatternsTab.myPatternsCategory.name ? PATTERN_TYPES.user : patternSourceFilter;
+  const currentPatternSourceFilter = category.name === _utils.myPatternsCategory.name ? _utils.PATTERN_TYPES.user : patternSourceFilter;
 
   // We need to disable the sync filter option if the source filter is not 'all' or 'user'
   // otherwise applying them will just result in no patterns being shown.
@@ -60,37 +44,37 @@ function BlockPatternsSyncFilter({
   // is `myPatterns` otherwise applying them will also just result in no patterns being shown.
   const shouldDisableNonUserSources = getShouldDisableNonUserSources(category);
   const patternSyncMenuOptions = (0, _element.useMemo)(() => [{
-    value: SYNC_TYPES.all,
-    label: (0, _i18n.__)('All')
+    value: _utils.SYNC_TYPES.all,
+    label: (0, _i18n._x)('All', 'Option that shows all patterns')
   }, {
-    value: SYNC_TYPES.full,
-    label: (0, _i18n.__)('Synced'),
+    value: _utils.SYNC_TYPES.full,
+    label: (0, _i18n._x)('Synced', 'Option that shows all synchronized patterns'),
     disabled: shouldDisableSyncFilter
   }, {
-    value: SYNC_TYPES.unsynced,
-    label: (0, _i18n.__)('Not synced'),
+    value: _utils.SYNC_TYPES.unsynced,
+    label: (0, _i18n._x)('Not synced', 'Option that shows all patterns that are not synchronized'),
     disabled: shouldDisableSyncFilter
   }], [shouldDisableSyncFilter]);
   const patternSourceMenuOptions = (0, _element.useMemo)(() => [{
-    value: PATTERN_TYPES.all,
+    value: _utils.PATTERN_TYPES.all,
     label: (0, _i18n.__)('All'),
     disabled: shouldDisableNonUserSources
   }, {
-    value: PATTERN_TYPES.directory,
+    value: _utils.PATTERN_TYPES.directory,
     label: (0, _i18n.__)('Pattern Directory'),
     disabled: shouldDisableNonUserSources
   }, {
-    value: PATTERN_TYPES.theme,
+    value: _utils.PATTERN_TYPES.theme,
     label: (0, _i18n.__)('Theme & Plugins'),
     disabled: shouldDisableNonUserSources
   }, {
-    value: PATTERN_TYPES.user,
+    value: _utils.PATTERN_TYPES.user,
     label: (0, _i18n.__)('User')
   }], [shouldDisableNonUserSources]);
   function handleSetSourceFilterChange(newSourceFilter) {
     setPatternSourceFilter(newSourceFilter);
     if (getShouldDisableSyncFilter(newSourceFilter)) {
-      setPatternSyncFilter(SYNC_TYPES.all);
+      setPatternSyncFilter(_utils.SYNC_TYPES.all);
     }
   }
   return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_components.DropdownMenu, {
@@ -136,4 +120,4 @@ function BlockPatternsSyncFilter({
     })
   })))));
 }
-//# sourceMappingURL=block-patterns-filter.js.map
+//# sourceMappingURL=patterns-filter.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_components","require","_i18n","_icons","_element","_utils","getShouldDisableSyncFilter","sourceFilter","PATTERN_TYPES","all","user","getShouldDisableNonUserSources","category","name","myPatternsCategory","PatternsFilter","setPatternSyncFilter","setPatternSourceFilter","patternSyncFilter","patternSourceFilter","scrollContainerRef","currentPatternSourceFilter","shouldDisableSyncFilter","shouldDisableNonUserSources","patternSyncMenuOptions","useMemo","value","SYNC_TYPES","label","_x","full","disabled","unsynced","patternSourceMenuOptions","__","directory","theme","handleSetSourceFilterChange","newSourceFilter","_react","createElement","Fragment","DropdownMenu","popoverProps","placement","icon","Icon","SVG","width","height","viewBox","fill","xmlns","Path","d","MenuGroup","MenuItemsChoice","choices","onSelect","current","scrollTo","className","createInterpolateElement","Link","ExternalLink","href"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/patterns-filter.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tSVG,\n\tPath,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItemsChoice,\n\tExternalLink,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { Icon } from '@wordpress/icons';\nimport { useMemo, createInterpolateElement } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { myPatternsCategory, SYNC_TYPES, PATTERN_TYPES } from './utils';\n\nconst getShouldDisableSyncFilter = ( sourceFilter ) =>\n\tsourceFilter !== PATTERN_TYPES.all && sourceFilter !== PATTERN_TYPES.user;\n\nconst getShouldDisableNonUserSources = ( category ) => {\n\treturn category.name === myPatternsCategory.name;\n};\n\nexport function PatternsFilter( {\n\tsetPatternSyncFilter,\n\tsetPatternSourceFilter,\n\tpatternSyncFilter,\n\tpatternSourceFilter,\n\tscrollContainerRef,\n\tcategory,\n} ) {\n\t// If the category is `myPatterns` then we need to set the source filter to `user`, but\n\t// we do this by deriving from props rather than calling setPatternSourceFilter otherwise\n\t// the user may be confused when switching to another category if the haven't explicity set\n\t// this filter themselves.\n\tconst currentPatternSourceFilter =\n\t\tcategory.name === myPatternsCategory.name\n\t\t\t? PATTERN_TYPES.user\n\t\t\t: patternSourceFilter;\n\n\t// We need to disable the sync filter option if the source filter is not 'all' or 'user'\n\t// otherwise applying them will just result in no patterns being shown.\n\tconst shouldDisableSyncFilter = getShouldDisableSyncFilter(\n\t\tcurrentPatternSourceFilter\n\t);\n\n\t// We also need to disable the directory and theme source filter options if the category\n\t// is `myPatterns` otherwise applying them will also just result in no patterns being shown.\n\tconst shouldDisableNonUserSources =\n\t\tgetShouldDisableNonUserSources( category );\n\n\tconst patternSyncMenuOptions = useMemo(\n\t\t() => [\n\t\t\t{\n\t\t\t\tvalue: SYNC_TYPES.all,\n\t\t\t\tlabel: _x( 'All', 'Option that shows all patterns' ),\n\t\t\t},\n\t\t\t{\n\t\t\t\tvalue: SYNC_TYPES.full,\n\t\t\t\tlabel: _x(\n\t\t\t\t\t'Synced',\n\t\t\t\t\t'Option that shows all synchronized patterns'\n\t\t\t\t),\n\t\t\t\tdisabled: shouldDisableSyncFilter,\n\t\t\t},\n\t\t\t{\n\t\t\t\tvalue: SYNC_TYPES.unsynced,\n\t\t\t\tlabel: _x(\n\t\t\t\t\t'Not synced',\n\t\t\t\t\t'Option that shows all patterns that are not synchronized'\n\t\t\t\t),\n\t\t\t\tdisabled: shouldDisableSyncFilter,\n\t\t\t},\n\t\t],\n\t\t[ shouldDisableSyncFilter ]\n\t);\n\n\tconst patternSourceMenuOptions = useMemo(\n\t\t() => [\n\t\t\t{\n\t\t\t\tvalue: PATTERN_TYPES.all,\n\t\t\t\tlabel: __( 'All' ),\n\t\t\t\tdisabled: shouldDisableNonUserSources,\n\t\t\t},\n\t\t\t{\n\t\t\t\tvalue: PATTERN_TYPES.directory,\n\t\t\t\tlabel: __( 'Pattern Directory' ),\n\t\t\t\tdisabled: shouldDisableNonUserSources,\n\t\t\t},\n\t\t\t{\n\t\t\t\tvalue: PATTERN_TYPES.theme,\n\t\t\t\tlabel: __( 'Theme & Plugins' ),\n\t\t\t\tdisabled: shouldDisableNonUserSources,\n\t\t\t},\n\t\t\t{\n\t\t\t\tvalue: PATTERN_TYPES.user,\n\t\t\t\tlabel: __( 'User' ),\n\t\t\t},\n\t\t],\n\t\t[ shouldDisableNonUserSources ]\n\t);\n\n\tfunction handleSetSourceFilterChange( newSourceFilter ) {\n\t\tsetPatternSourceFilter( newSourceFilter );\n\t\tif ( getShouldDisableSyncFilter( newSourceFilter ) ) {\n\t\t\tsetPatternSyncFilter( SYNC_TYPES.all );\n\t\t}\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<DropdownMenu\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tplacement: 'right-end',\n\t\t\t\t} }\n\t\t\t\tlabel=\"Filter patterns\"\n\t\t\t\ticon={\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t<SVG\n\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Path\n\t\t\t\t\t\t\t\t\td=\"M10 17.5H14V16H10V17.5ZM6 6V7.5H18V6H6ZM8 12.5H16V11H8V12.5Z\"\n\t\t\t\t\t\t\t\t\tfill=\"#1E1E1E\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</SVG>\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ () => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<MenuGroup label={ __( 'Source' ) }>\n\t\t\t\t\t\t\t<MenuItemsChoice\n\t\t\t\t\t\t\t\tchoices={ patternSourceMenuOptions }\n\t\t\t\t\t\t\t\tonSelect={ ( value ) => {\n\t\t\t\t\t\t\t\t\thandleSetSourceFilterChange( value );\n\t\t\t\t\t\t\t\t\tscrollContainerRef.current?.scrollTo(\n\t\t\t\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t\t\t\t0\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tvalue={ currentPatternSourceFilter }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t<MenuGroup label={ __( 'Type' ) }>\n\t\t\t\t\t\t\t<MenuItemsChoice\n\t\t\t\t\t\t\t\tchoices={ patternSyncMenuOptions }\n\t\t\t\t\t\t\t\tonSelect={ ( value ) => {\n\t\t\t\t\t\t\t\t\tsetPatternSyncFilter( value );\n\t\t\t\t\t\t\t\t\tscrollContainerRef.current?.scrollTo(\n\t\t\t\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t\t\t\t0\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tvalue={ patternSyncFilter }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t<div className=\"block-editor-tool-selector__help\">\n\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t'Patterns are available from the <Link>WordPress.org Pattern Directory</Link>, bundled in the active theme, or created by users on this site. Only patterns created on this site can be synced.'\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tLink: (\n\t\t\t\t\t\t\t\t\t\t<ExternalLink\n\t\t\t\t\t\t\t\t\t\t\thref={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t'https://wordpress.org/patterns/'\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</DropdownMenu>\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAQA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAJ,OAAA;AAlBA;AACA;AACA;;AAaA;AACA;AACA;;AAGA,MAAMK,0BAA0B,GAAKC,YAAY,IAChDA,YAAY,KAAKC,oBAAa,CAACC,GAAG,IAAIF,YAAY,KAAKC,oBAAa,CAACE,IAAI;AAE1E,MAAMC,8BAA8B,GAAKC,QAAQ,IAAM;EACtD,OAAOA,QAAQ,CAACC,IAAI,KAAKC,yBAAkB,CAACD,IAAI;AACjD,CAAC;AAEM,SAASE,cAAcA,CAAE;EAC/BC,oBAAoB;EACpBC,sBAAsB;EACtBC,iBAAiB;EACjBC,mBAAmB;EACnBC,kBAAkB;EAClBR;AACD,CAAC,EAAG;EACH;EACA;EACA;EACA;EACA,MAAMS,0BAA0B,GAC/BT,QAAQ,CAACC,IAAI,KAAKC,yBAAkB,CAACD,IAAI,GACtCL,oBAAa,CAACE,IAAI,GAClBS,mBAAmB;;EAEvB;EACA;EACA,MAAMG,uBAAuB,GAAGhB,0BAA0B,CACzDe,0BACD,CAAC;;EAED;EACA;EACA,MAAME,2BAA2B,GAChCZ,8BAA8B,CAAEC,QAAS,CAAC;EAE3C,MAAMY,sBAAsB,GAAG,IAAAC,gBAAO,EACrC,MAAM,CACL;IACCC,KAAK,EAAEC,iBAAU,CAAClB,GAAG;IACrBmB,KAAK,EAAE,IAAAC,QAAE,EAAE,KAAK,EAAE,gCAAiC;EACpD,CAAC,EACD;IACCH,KAAK,EAAEC,iBAAU,CAACG,IAAI;IACtBF,KAAK,EAAE,IAAAC,QAAE,EACR,QAAQ,EACR,6CACD,CAAC;IACDE,QAAQ,EAAET;EACX,CAAC,EACD;IACCI,KAAK,EAAEC,iBAAU,CAACK,QAAQ;IAC1BJ,KAAK,EAAE,IAAAC,QAAE,EACR,YAAY,EACZ,0DACD,CAAC;IACDE,QAAQ,EAAET;EACX,CAAC,CACD,EACD,CAAEA,uBAAuB,CAC1B,CAAC;EAED,MAAMW,wBAAwB,GAAG,IAAAR,gBAAO,EACvC,MAAM,CACL;IACCC,KAAK,EAAElB,oBAAa,CAACC,GAAG;IACxBmB,KAAK,EAAE,IAAAM,QAAE,EAAE,KAAM,CAAC;IAClBH,QAAQ,EAAER;EACX,CAAC,EACD;IACCG,KAAK,EAAElB,oBAAa,CAAC2B,SAAS;IAC9BP,KAAK,EAAE,IAAAM,QAAE,EAAE,mBAAoB,CAAC;IAChCH,QAAQ,EAAER;EACX,CAAC,EACD;IACCG,KAAK,EAAElB,oBAAa,CAAC4B,KAAK;IAC1BR,KAAK,EAAE,IAAAM,QAAE,EAAE,iBAAkB,CAAC;IAC9BH,QAAQ,EAAER;EACX,CAAC,EACD;IACCG,KAAK,EAAElB,oBAAa,CAACE,IAAI;IACzBkB,KAAK,EAAE,IAAAM,QAAE,EAAE,MAAO;EACnB,CAAC,CACD,EACD,CAAEX,2BAA2B,CAC9B,CAAC;EAED,SAASc,2BAA2BA,CAAEC,eAAe,EAAG;IACvDrB,sBAAsB,CAAEqB,eAAgB,CAAC;IACzC,IAAKhC,0BAA0B,CAAEgC,eAAgB,CAAC,EAAG;MACpDtB,oBAAoB,CAAEW,iBAAU,CAAClB,GAAI,CAAC;IACvC;EACD;EAEA,OACC,IAAA8B,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAE,QAAA,QACC,IAAAF,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAA0C,YAAY;IACZC,YAAY,EAAG;MACdC,SAAS,EAAE;IACZ,CAAG;IACHhB,KAAK,EAAC,iBAAiB;IACvBiB,IAAI,EACH,IAAAN,MAAA,CAAAC,aAAA,EAACrC,MAAA,CAAA2C,IAAI;MACJD,IAAI,EACH,IAAAN,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAA+C,GAAG;QACHC,KAAK,EAAC,IAAI;QACVC,MAAM,EAAC,IAAI;QACXC,OAAO,EAAC,WAAW;QACnBC,IAAI,EAAC,MAAM;QACXC,KAAK,EAAC;MAA4B,GAElC,IAAAb,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAAqD,IAAI;QACJC,CAAC,EAAC,8DAA8D;QAChEH,IAAI,EAAC;MAAS,CACd,CACG;IACL,CACD;EACD,GAEC,MACD,IAAAZ,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAE,QAAA,QACC,IAAAF,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAAuD,SAAS;IAAC3B,KAAK,EAAG,IAAAM,QAAE,EAAE,QAAS;EAAG,GAClC,IAAAK,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAAwD,eAAe;IACfC,OAAO,EAAGxB,wBAA0B;IACpCyB,QAAQ,EAAKhC,KAAK,IAAM;MACvBW,2BAA2B,CAAEX,KAAM,CAAC;MACpCN,kBAAkB,CAACuC,OAAO,EAAEC,QAAQ,CACnC,CAAC,EACD,CACD,CAAC;IACF,CAAG;IACHlC,KAAK,EAAGL;EAA4B,CACpC,CACS,CAAC,EACZ,IAAAkB,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAAuD,SAAS;IAAC3B,KAAK,EAAG,IAAAM,QAAE,EAAE,MAAO;EAAG,GAChC,IAAAK,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAAwD,eAAe;IACfC,OAAO,EAAGjC,sBAAwB;IAClCkC,QAAQ,EAAKhC,KAAK,IAAM;MACvBV,oBAAoB,CAAEU,KAAM,CAAC;MAC7BN,kBAAkB,CAACuC,OAAO,EAAEC,QAAQ,CACnC,CAAC,EACD,CACD,CAAC;IACF,CAAG;IACHlC,KAAK,EAAGR;EAAmB,CAC3B,CACS,CAAC,EACZ,IAAAqB,MAAA,CAAAC,aAAA;IAAKqB,SAAS,EAAC;EAAkC,GAC9C,IAAAC,iCAAwB,EACzB,IAAA5B,QAAE,EACD,gMACD,CAAC,EACD;IACC6B,IAAI,EACH,IAAAxB,MAAA,CAAAC,aAAA,EAACxC,WAAA,CAAAgE,YAAY;MACZC,IAAI,EAAG,IAAA/B,QAAE,EACR,iCACD;IAAG,CACH;EAEH,CACD,CACI,CACJ,CAEU,CACb,CAAC;AAEL"}

package/build/components/inserter/block-patterns-tab/use-pattern-categories.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePatternCategories = usePatternCategories;
+var _element = require("@wordpress/element");
+var _i18n = require("@wordpress/i18n");
+var _a11y = require("@wordpress/a11y");
+var _usePatternsState = _interopRequireDefault(require("../hooks/use-patterns-state"));
+var _utils = require("./utils");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+function usePatternCategories(rootClientId, sourceFilter = 'all') {
+  const [patterns, allCategories] = (0, _usePatternsState.default)(undefined, rootClientId);
+  const filteredPatterns = (0, _element.useMemo)(() => sourceFilter === 'all' ? patterns : patterns.filter(pattern => !(0, _utils.isPatternFiltered)(pattern, sourceFilter)), [sourceFilter, patterns]);
+  const hasRegisteredCategory = (0, _element.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 = (0, _element.useMemo)(() => {
+    const categories = allCategories.filter(category => filteredPatterns.some(pattern => pattern.categories?.includes(category.name))).sort((a, b) => a.label.localeCompare(b.label));
+    if (filteredPatterns.some(pattern => !hasRegisteredCategory(pattern)) && !categories.find(category => category.name === 'uncategorized')) {
+      categories.push({
+        name: 'uncategorized',
+        label: (0, _i18n._x)('Uncategorized')
+      });
+    }
+    if (filteredPatterns.some(pattern => pattern.id)) {
+      categories.unshift(_utils.myPatternsCategory);
+    }
+    if (filteredPatterns.length > 0) {
+      categories.unshift({
+        name: _utils.allPatternsCategory.name,
+        label: _utils.allPatternsCategory.label
+      });
+    }
+    (0, _a11y.speak)((0, _i18n.sprintf)( /* translators: %d: number of categories . */
+    (0, _i18n._n)('%d category button displayed.', '%d category buttons displayed.', categories.length), categories.length));
+    return categories;
+  }, [allCategories, filteredPatterns, hasRegisteredCategory]);
+  return populatedCategories;
+}
+//# sourceMappingURL=use-pattern-categories.js.map

package/build/components/inserter/block-patterns-tab/use-pattern-categories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_element","require","_i18n","_a11y","_usePatternsState","_interopRequireDefault","_utils","usePatternCategories","rootClientId","sourceFilter","patterns","allCategories","usePatternsState","undefined","filteredPatterns","useMemo","filter","pattern","isPatternFiltered","hasRegisteredCategory","useCallback","categories","length","some","cat","category","name","populatedCategories","includes","sort","a","b","label","localeCompare","find","push","_x","id","unshift","myPatternsCategory","allPatternsCategory","speak","sprintf","_n"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/use-pattern-categories.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useCallback } from '@wordpress/element';\nimport { _x, _n, sprintf } from '@wordpress/i18n';\n\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport usePatternsState from '../hooks/use-patterns-state';\nimport {\n\tisPatternFiltered,\n\tallPatternsCategory,\n\tmyPatternsCategory,\n} from './utils';\n\nexport function usePatternCategories( rootClientId, sourceFilter = 'all' ) {\n\tconst [ patterns, allCategories ] = usePatternsState(\n\t\tundefined,\n\t\trootClientId\n\t);\n\n\tconst filteredPatterns = useMemo(\n\t\t() =>\n\t\t\tsourceFilter === 'all'\n\t\t\t\t? patterns\n\t\t\t\t: patterns.filter(\n\t\t\t\t\t\t( pattern ) =>\n\t\t\t\t\t\t\t! isPatternFiltered( pattern, sourceFilter )\n\t\t\t\t  ),\n\t\t[ sourceFilter, patterns ]\n\t);\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\tfilteredPatterns.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( ( a, b ) => a.label.localeCompare( b.label ) );\n\n\t\tif (\n\t\t\tfilteredPatterns.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\t\tif ( filteredPatterns.some( ( pattern ) => pattern.id ) ) {\n\t\t\tcategories.unshift( myPatternsCategory );\n\t\t}\n\t\tif ( filteredPatterns.length > 0 ) {\n\t\t\tcategories.unshift( {\n\t\t\t\tname: allPatternsCategory.name,\n\t\t\t\tlabel: allPatternsCategory.label,\n\t\t\t} );\n\t\t}\n\t\tspeak(\n\t\t\tsprintf(\n\t\t\t\t/* translators: %d: number of categories . */\n\t\t\t\t_n(\n\t\t\t\t\t'%d category button displayed.',\n\t\t\t\t\t'%d category buttons displayed.',\n\t\t\t\t\tcategories.length\n\t\t\t\t),\n\t\t\t\tcategories.length\n\t\t\t)\n\t\t);\n\t\treturn categories;\n\t}, [ allCategories, filteredPatterns, hasRegisteredCategory ] );\n\n\treturn populatedCategories;\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAEA,IAAAE,KAAA,GAAAF,OAAA;AAKA,IAAAG,iBAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AAZA;AACA;AACA;;AAMA;AACA;AACA;;AAQO,SAASM,oBAAoBA,CAAEC,YAAY,EAAEC,YAAY,GAAG,KAAK,EAAG;EAC1E,MAAM,CAAEC,QAAQ,EAAEC,aAAa,CAAE,GAAG,IAAAC,yBAAgB,EACnDC,SAAS,EACTL,YACD,CAAC;EAED,MAAMM,gBAAgB,GAAG,IAAAC,gBAAO,EAC/B,MACCN,YAAY,KAAK,KAAK,GACnBC,QAAQ,GACRA,QAAQ,CAACM,MAAM,CACbC,OAAO,IACR,CAAE,IAAAC,wBAAiB,EAAED,OAAO,EAAER,YAAa,CAC5C,CAAC,EACL,CAAEA,YAAY,EAAEC,QAAQ,CACzB,CAAC;EAED,MAAMS,qBAAqB,GAAG,IAAAC,oBAAW,EACtCH,OAAO,IAAM;IACd,IAAK,CAAEA,OAAO,CAACI,UAAU,IAAI,CAAEJ,OAAO,CAACI,UAAU,CAACC,MAAM,EAAG;MAC1D,OAAO,KAAK;IACb;IAEA,OAAOL,OAAO,CAACI,UAAU,CAACE,IAAI,CAAIC,GAAG,IACpCb,aAAa,CAACY,IAAI,CAAIE,QAAQ,IAAMA,QAAQ,CAACC,IAAI,KAAKF,GAAI,CAC3D,CAAC;EACF,CAAC,EACD,CAAEb,aAAa,CAChB,CAAC;;EAED;EACA,MAAMgB,mBAAmB,GAAG,IAAAZ,gBAAO,EAAE,MAAM;IAC1C,MAAMM,UAAU,GAAGV,aAAa,CAC9BK,MAAM,CAAIS,QAAQ,IAClBX,gBAAgB,CAACS,IAAI,CAAIN,OAAO,IAC/BA,OAAO,CAACI,UAAU,EAAEO,QAAQ,CAAEH,QAAQ,CAACC,IAAK,CAC7C,CACD,CAAC,CACAG,IAAI,CAAE,CAAEC,CAAC,EAAEC,CAAC,KAAMD,CAAC,CAACE,KAAK,CAACC,aAAa,CAAEF,CAAC,CAACC,KAAM,CAAE,CAAC;IAEtD,IACClB,gBAAgB,CAACS,IAAI,CAClBN,OAAO,IAAM,CAAEE,qBAAqB,CAAEF,OAAQ,CACjD,CAAC,IACD,CAAEI,UAAU,CAACa,IAAI,CACdT,QAAQ,IAAMA,QAAQ,CAACC,IAAI,KAAK,eACnC,CAAC,EACA;MACDL,UAAU,CAACc,IAAI,CAAE;QAChBT,IAAI,EAAE,eAAe;QACrBM,KAAK,EAAE,IAAAI,QAAE,EAAE,eAAgB;MAC5B,CAAE,CAAC;IACJ;IACA,IAAKtB,gBAAgB,CAACS,IAAI,CAAIN,OAAO,IAAMA,OAAO,CAACoB,EAAG,CAAC,EAAG;MACzDhB,UAAU,CAACiB,OAAO,CAAEC,yBAAmB,CAAC;IACzC;IACA,IAAKzB,gBAAgB,CAACQ,MAAM,GAAG,CAAC,EAAG;MAClCD,UAAU,CAACiB,OAAO,CAAE;QACnBZ,IAAI,EAAEc,0BAAmB,CAACd,IAAI;QAC9BM,KAAK,EAAEQ,0BAAmB,CAACR;MAC5B,CAAE,CAAC;IACJ;IACA,IAAAS,WAAK,EACJ,IAAAC,aAAO,GACN;IACA,IAAAC,QAAE,EACD,+BAA+B,EAC/B,gCAAgC,EAChCtB,UAAU,CAACC,MACZ,CAAC,EACDD,UAAU,CAACC,MACZ,CACD,CAAC;IACD,OAAOD,UAAU;EAClB,CAAC,EAAE,CAAEV,aAAa,EAAEG,gBAAgB,EAAEK,qBAAqB,CAAG,CAAC;EAE/D,OAAOQ,mBAAmB;AAC3B"}

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

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.allPatternsCategory = exports.SYNC_TYPES = exports.PATTERN_TYPES = void 0;
+exports.isPatternFiltered = isPatternFiltered;
+exports.myPatternsCategory = void 0;
+var _i18n = require("@wordpress/i18n");
+/**
+ * WordPress dependencies
+ */
+
+const PATTERN_TYPES = {
+  all: 'all',
+  synced: 'synced',
+  unsynced: 'unsynced',
+  user: 'user',
+  theme: 'theme',
+  directory: 'directory'
+};
+exports.PATTERN_TYPES = PATTERN_TYPES;
+const SYNC_TYPES = {
+  all: 'all',
+  full: 'fully',
+  unsynced: 'unsynced'
+};
+exports.SYNC_TYPES = SYNC_TYPES;
+const allPatternsCategory = {
+  name: 'allPatterns',
+  label: (0, _i18n.__)('All patterns')
+};
+exports.allPatternsCategory = allPatternsCategory;
+const myPatternsCategory = {
+  name: 'myPatterns',
+  label: (0, _i18n.__)('My patterns')
+};
+exports.myPatternsCategory = myPatternsCategory;
+function isPatternFiltered(pattern, sourceFilter, syncFilter) {
+  const isUserPattern = pattern.name.startsWith('core/block');
+  const isDirectoryPattern = pattern.source === 'core' || pattern.source?.startsWith('pattern-directory');
+
+  // If theme source selected, filter out user created patterns and those from
+  // the core patterns directory.
+  if (sourceFilter === PATTERN_TYPES.theme && (isUserPattern || isDirectoryPattern)) {
+    return true;
+  }
+
+  // If the directory source is selected, filter out user created patterns
+  // and those bundled with the theme.
+  if (sourceFilter === PATTERN_TYPES.directory && (isUserPattern || !isDirectoryPattern)) {
+    return true;
+  }
+
+  // If user source selected, filter out theme patterns. Any pattern without
+  // an id wasn't created by a user.
+  if (sourceFilter === PATTERN_TYPES.user && !pattern.id) {
+    return true;
+  }
+
+  // Filter by sync status.
+  if (syncFilter === SYNC_TYPES.full && pattern.syncStatus !== '') {
+    return true;
+  }
+  if (syncFilter === SYNC_TYPES.unsynced && pattern.syncStatus !== 'unsynced' && isUserPattern) {
+    return true;
+  }
+  return false;
+}
+//# sourceMappingURL=utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_i18n","require","PATTERN_TYPES","all","synced","unsynced","user","theme","directory","exports","SYNC_TYPES","full","allPatternsCategory","name","label","__","myPatternsCategory","isPatternFiltered","pattern","sourceFilter","syncFilter","isUserPattern","startsWith","isDirectoryPattern","source","id","syncStatus"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/utils.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\n\nimport { __ } from '@wordpress/i18n';\n\nexport const PATTERN_TYPES = {\n\tall: 'all',\n\tsynced: 'synced',\n\tunsynced: 'unsynced',\n\tuser: 'user',\n\ttheme: 'theme',\n\tdirectory: 'directory',\n};\n\nexport const SYNC_TYPES = {\n\tall: 'all',\n\tfull: 'fully',\n\tunsynced: 'unsynced',\n};\n\nexport const allPatternsCategory = {\n\tname: 'allPatterns',\n\tlabel: __( 'All patterns' ),\n};\n\nexport const myPatternsCategory = {\n\tname: 'myPatterns',\n\tlabel: __( 'My patterns' ),\n};\n\nexport function isPatternFiltered( pattern, sourceFilter, syncFilter ) {\n\tconst isUserPattern = pattern.name.startsWith( 'core/block' );\n\tconst isDirectoryPattern =\n\t\tpattern.source === 'core' ||\n\t\tpattern.source?.startsWith( 'pattern-directory' );\n\n\t// If theme source selected, filter out user created patterns and those from\n\t// the core patterns directory.\n\tif (\n\t\tsourceFilter === PATTERN_TYPES.theme &&\n\t\t( isUserPattern || isDirectoryPattern )\n\t) {\n\t\treturn true;\n\t}\n\n\t// If the directory source is selected, filter out user created patterns\n\t// and those bundled with the theme.\n\tif (\n\t\tsourceFilter === PATTERN_TYPES.directory &&\n\t\t( isUserPattern || ! isDirectoryPattern )\n\t) {\n\t\treturn true;\n\t}\n\n\t// If user source selected, filter out theme patterns. Any pattern without\n\t// an id wasn't created by a user.\n\tif ( sourceFilter === PATTERN_TYPES.user && ! pattern.id ) {\n\t\treturn true;\n\t}\n\n\t// Filter by sync status.\n\tif ( syncFilter === SYNC_TYPES.full && pattern.syncStatus !== '' ) {\n\t\treturn true;\n\t}\n\n\tif (\n\t\tsyncFilter === SYNC_TYPES.unsynced &&\n\t\tpattern.syncStatus !== 'unsynced' &&\n\t\tisUserPattern\n\t) {\n\t\treturn true;\n\t}\n\n\treturn false;\n}\n"],"mappings":";;;;;;;;AAIA,IAAAA,KAAA,GAAAC,OAAA;AAJA;AACA;AACA;;AAIO,MAAMC,aAAa,GAAG;EAC5BC,GAAG,EAAE,KAAK;EACVC,MAAM,EAAE,QAAQ;EAChBC,QAAQ,EAAE,UAAU;EACpBC,IAAI,EAAE,MAAM;EACZC,KAAK,EAAE,OAAO;EACdC,SAAS,EAAE;AACZ,CAAC;AAACC,OAAA,CAAAP,aAAA,GAAAA,aAAA;AAEK,MAAMQ,UAAU,GAAG;EACzBP,GAAG,EAAE,KAAK;EACVQ,IAAI,EAAE,OAAO;EACbN,QAAQ,EAAE;AACX,CAAC;AAACI,OAAA,CAAAC,UAAA,GAAAA,UAAA;AAEK,MAAME,mBAAmB,GAAG;EAClCC,IAAI,EAAE,aAAa;EACnBC,KAAK,EAAE,IAAAC,QAAE,EAAE,cAAe;AAC3B,CAAC;AAACN,OAAA,CAAAG,mBAAA,GAAAA,mBAAA;AAEK,MAAMI,kBAAkB,GAAG;EACjCH,IAAI,EAAE,YAAY;EAClBC,KAAK,EAAE,IAAAC,QAAE,EAAE,aAAc;AAC1B,CAAC;AAACN,OAAA,CAAAO,kBAAA,GAAAA,kBAAA;AAEK,SAASC,iBAAiBA,CAAEC,OAAO,EAAEC,YAAY,EAAEC,UAAU,EAAG;EACtE,MAAMC,aAAa,GAAGH,OAAO,CAACL,IAAI,CAACS,UAAU,CAAE,YAAa,CAAC;EAC7D,MAAMC,kBAAkB,GACvBL,OAAO,CAACM,MAAM,KAAK,MAAM,IACzBN,OAAO,CAACM,MAAM,EAAEF,UAAU,CAAE,mBAAoB,CAAC;;EAElD;EACA;EACA,IACCH,YAAY,KAAKjB,aAAa,CAACK,KAAK,KAClCc,aAAa,IAAIE,kBAAkB,CAAE,EACtC;IACD,OAAO,IAAI;EACZ;;EAEA;EACA;EACA,IACCJ,YAAY,KAAKjB,aAAa,CAACM,SAAS,KACtCa,aAAa,IAAI,CAAEE,kBAAkB,CAAE,EACxC;IACD,OAAO,IAAI;EACZ;;EAEA;EACA;EACA,IAAKJ,YAAY,KAAKjB,aAAa,CAACI,IAAI,IAAI,CAAEY,OAAO,CAACO,EAAE,EAAG;IAC1D,OAAO,IAAI;EACZ;;EAEA;EACA,IAAKL,UAAU,KAAKV,UAAU,CAACC,IAAI,IAAIO,OAAO,CAACQ,UAAU,KAAK,EAAE,EAAG;IAClE,OAAO,IAAI;EACZ;EAEA,IACCN,UAAU,KAAKV,UAAU,CAACL,QAAQ,IAClCa,OAAO,CAACQ,UAAU,KAAK,UAAU,IACjCL,aAAa,EACZ;IACD,OAAO,IAAI;EACZ;EAEA,OAAO,KAAK;AACb"}

package/build/components/inserter/media-tab/media-list.js

@@ -8,6 +8,7 @@ var _react = require("react");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
 var _mediaPreview = require("./media-preview");
+var _lockUnlock = require("../../../lock-unlock");
 /**
  * WordPress dependencies
  */
@@ -16,15 +17,19 @@ var _mediaPreview = require("./media-preview");
  * Internal dependencies
  */
 
+const {
+  CompositeV2: Composite,
+  useCompositeStoreV2: useCompositeStore
+} = (0, _lockUnlock.unlock)(_components.privateApis);
 function MediaList({
   mediaList,
   category,
   onClick,
   label = (0, _i18n.__)('Media List')
 }) {
-  const composite = (0, _components.__unstableUseCompositeState)();
-  return (0, _react.createElement)(_components.__unstableComposite, {
-    ...composite,
+  const compositeStore = useCompositeStore();
+  return (0, _react.createElement)(Composite, {
+    store: compositeStore,
     role: "listbox",
     className: "block-editor-inserter__media-list",
     "aria-label": label
@@ -32,8 +37,7 @@ function MediaList({
     key: media.id || media.sourceId || index,
     media: media,
     category: category,
-    onClick: onClick,
-    composite: composite
+    onClick: onClick
   })));
 }
 var _default = MediaList;

package/build/components/inserter/media-tab/media-list.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_mediaPreview","MediaList","mediaList","category","onClick","label","__","composite","useCompositeState","_react","createElement","__unstableComposite","role","className","map","media","index","MediaPreview","key","id","sourceId","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-list.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { MediaPreview } from './media-preview';\n\nfunction MediaList( {\n\tmediaList,\n\tcategory,\n\tonClick,\n\tlabel = __( 'Media List' ),\n} ) {\n\tconst composite = useCompositeState();\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-inserter__media-list\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ mediaList.map( ( media, index ) => (\n\t\t\t\t<MediaPreview\n\t\t\t\t\tkey={ media.id || media.sourceId || index }\n\t\t\t\t\tmedia={ media }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\tcomposite={ composite }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nexport default MediaList;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAIA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,aAAA,GAAAF,OAAA;AAZA;AACA;AACA;;AAOA;AACA;AACA;;AAGA,SAASG,SAASA,CAAE;EACnBC,SAAS;EACTC,QAAQ;EACRC,OAAO;EACPC,KAAK,GAAG,IAAAC,QAAE,EAAE,YAAa;AAC1B,CAAC,EAAG;EACH,MAAMC,SAAS,GAAG,IAAAC,uCAAiB,EAAC,CAAC;EACrC,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACb,WAAA,CAAAc,mBAAS;IAAA,GACJJ,SAAS;IACdK,IAAI,EAAC,SAAS;IACdC,SAAS,EAAC,mCAAmC;IAC7C,cAAaR;EAAO,GAElBH,SAAS,CAACY,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,KAC9B,IAAAP,MAAA,CAAAC,aAAA,EAACV,aAAA,CAAAiB,YAAY;IACZC,GAAG,EAAGH,KAAK,CAACI,EAAE,IAAIJ,KAAK,CAACK,QAAQ,IAAIJ,KAAO;IAC3CD,KAAK,EAAGA,KAAO;IACfZ,QAAQ,EAAGA,QAAU;IACrBC,OAAO,EAAGA,OAAS;IACnBG,SAAS,EAAGA;EAAW,CACvB,CACA,CACQ,CAAC;AAEd;AAAC,IAAAc,QAAA,GAEcpB,SAAS;AAAAqB,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_components","require","_i18n","_mediaPreview","_lockUnlock","CompositeV2","Composite","useCompositeStoreV2","useCompositeStore","unlock","componentsPrivateApis","MediaList","mediaList","category","onClick","label","__","compositeStore","_react","createElement","store","role","className","map","media","index","MediaPreview","key","id","sourceId","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-list.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { MediaPreview } from './media-preview';\nimport { unlock } from '../../../lock-unlock';\n\nconst { CompositeV2: Composite, useCompositeStoreV2: useCompositeStore } =\n\tunlock( componentsPrivateApis );\n\nfunction MediaList( {\n\tmediaList,\n\tcategory,\n\tonClick,\n\tlabel = __( 'Media List' ),\n} ) {\n\tconst compositeStore = useCompositeStore();\n\treturn (\n\t\t<Composite\n\t\t\tstore={ compositeStore }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-inserter__media-list\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ mediaList.map( ( media, index ) => (\n\t\t\t\t<MediaPreview\n\t\t\t\t\tkey={ media.id || media.sourceId || index }\n\t\t\t\t\tmedia={ media }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nexport default MediaList;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,aAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA,MAAM;EAAEI,WAAW,EAAEC,SAAS;EAAEC,mBAAmB,EAAEC;AAAkB,CAAC,GACvE,IAAAC,kBAAM,EAAEC,uBAAsB,CAAC;AAEhC,SAASC,SAASA,CAAE;EACnBC,SAAS;EACTC,QAAQ;EACRC,OAAO;EACPC,KAAK,GAAG,IAAAC,QAAE,EAAE,YAAa;AAC1B,CAAC,EAAG;EACH,MAAMC,cAAc,GAAGT,iBAAiB,CAAC,CAAC;EAC1C,OACC,IAAAU,MAAA,CAAAC,aAAA,EAACb,SAAS;IACTc,KAAK,EAAGH,cAAgB;IACxBI,IAAI,EAAC,SAAS;IACdC,SAAS,EAAC,mCAAmC;IAC7C,cAAaP;EAAO,GAElBH,SAAS,CAACW,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,KAC9B,IAAAP,MAAA,CAAAC,aAAA,EAAChB,aAAA,CAAAuB,YAAY;IACZC,GAAG,EAAGH,KAAK,CAACI,EAAE,IAAIJ,KAAK,CAACK,QAAQ,IAAIJ,KAAO;IAC3CD,KAAK,EAAGA,KAAO;IACfX,QAAQ,EAAGA,QAAU;IACrBC,OAAO,EAAGA;EAAS,CACnB,CACA,CACQ,CAAC;AAEd;AAAC,IAAAgB,QAAA,GAEcnB,SAAS;AAAAoB,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/components/inserter/media-tab/media-preview.js

@@ -18,6 +18,7 @@ var _blob = require("@wordpress/blob");
 var _inserterDraggableBlocks = _interopRequireDefault(require("../../inserter-draggable-blocks"));
 var _utils = require("./utils");
 var _store = require("../../../store");
+var _lockUnlock = require("../../../lock-unlock");
 /**
  * External dependencies
  */
@@ -36,6 +37,9 @@ const MEDIA_OPTIONS_POPOVER_PROPS = {
   position: 'bottom left',
   className: 'block-editor-inserter__media-list__item-preview-options__popover'
 };
+const {
+  CompositeItemV2: CompositeItem
+} = (0, _lockUnlock.unlock)(_components.privateApis);
 function MediaPreviewOptions({
   category,
   media
@@ -80,7 +84,6 @@ function InsertExternalImageModal({
 function MediaPreview({
   media,
   onClick,
-  composite,
   category
 }) {
   const [showExternalUploadModal, setShowExternalUploadModal] = (0, _element.useState)(false);
@@ -172,26 +175,26 @@ function MediaPreview({
     draggable: draggable,
     onDragStart: onDragStart,
     onDragEnd: onDragEnd
-  }, (0, _react.createElement)(_components.Tooltip, {
-    text: truncatedTitle || title
   }, (0, _react.createElement)("div", {
     onMouseEnter: onMouseEnter,
     onMouseLeave: onMouseLeave
-  }, (0, _react.createElement)(_components.__unstableCompositeItem, {
-    role: "option",
-    as: "div",
-    ...composite,
-    className: "block-editor-inserter__media-list__item",
-    onClick: () => onMediaInsert(block),
-    "aria-label": title
+  }, (0, _react.createElement)(_components.Tooltip, {
+    text: truncatedTitle || title
+  }, (0, _react.createElement)(CompositeItem, {
+    render: (0, _react.createElement)("div", {
+      "aria-label": title,
+      role: "option",
+      className: "block-editor-inserter__media-list__item"
+    }),
+    onClick: () => onMediaInsert(block)
   }, (0, _react.createElement)("div", {
     className: "block-editor-inserter__media-list__item-preview"
   }, preview, isInserting && (0, _react.createElement)("div", {
     className: "block-editor-inserter__media-list__item-preview-spinner"
-  }, (0, _react.createElement)(_components.Spinner, null)))), !isInserting && (0, _react.createElement)(MediaPreviewOptions, {
+  }, (0, _react.createElement)(_components.Spinner, null))))), !isInserting && (0, _react.createElement)(MediaPreviewOptions, {
     category: category,
     media: media
-  }))))), showExternalUploadModal && (0, _react.createElement)(InsertExternalImageModal, {
+  })))), showExternalUploadModal && (0, _react.createElement)(InsertExternalImageModal, {
     onClose: () => setShowExternalUploadModal(false),
     onSubmit: () => {
       onClick((0, _blocks.cloneBlock)(block));

package/build/components/inserter/media-tab/media-preview.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_i18n","_element","_blocks","_icons","_data","_notices","_blob","_inserterDraggableBlocks","_utils","_store","ALLOWED_MEDIA_TYPES","MAXIMUM_TITLE_LENGTH","MEDIA_OPTIONS_POPOVER_PROPS","position","className","MediaPreviewOptions","category","media","getReportUrl","reportUrl","_react","createElement","DropdownMenu","label","__","popoverProps","icon","moreVertical","MenuGroup","MenuItem","onClick","window","open","focus","external","sprintf","mediaType","InsertExternalImageModal","onClose","onSubmit","Modal","title","onRequestClose","__experimentalVStack","spacing","Flex","justify","expanded","FlexItem","Button","variant","MediaPreview","composite","showExternalUploadModal","setShowExternalUploadModal","useState","isHovered","setIsHovered","isInserting","setIsInserting","block","preview","useMemo","getBlockAndPreviewFromMedia","createErrorNotice","createSuccessNotice","useDispatch","noticesStore","mediaUpload","useSelect","select","blockEditorStore","getSettings","onMediaInsert","useCallback","previewBlock","clonedBlock","cloneBlock","id","url","caption","attributes","fetch","then","response","blob","filesList","additionalData","onFileChange","img","isBlobURL","type","allowedTypes","onError","message","catch","rendered","truncatedTitle","length","omission","slice","onMouseEnter","onMouseLeave","Fragment","default","isEnabled","blocks","draggable","onDragStart","onDragEnd","classnames","Tooltip","text","__unstableCompositeItem","role","as","Spinner"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-preview.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__unstableCompositeItem as CompositeItem,\n\tTooltip,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\tSpinner,\n\tModal,\n\tFlex,\n\tFlexItem,\n\tButton,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useMemo, useCallback, useState } from '@wordpress/element';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { moreVertical, external } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { isBlobURL } from '@wordpress/blob';\n\n/**\n * Internal dependencies\n */\nimport InserterDraggableBlocks from '../../inserter-draggable-blocks';\nimport { getBlockAndPreviewFromMedia } from './utils';\nimport { store as blockEditorStore } from '../../../store';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image' ];\nconst MAXIMUM_TITLE_LENGTH = 25;\nconst MEDIA_OPTIONS_POPOVER_PROPS = {\n\tposition: 'bottom left',\n\tclassName:\n\t\t'block-editor-inserter__media-list__item-preview-options__popover',\n};\n\nfunction MediaPreviewOptions( { category, media } ) {\n\tif ( ! category.getReportUrl ) {\n\t\treturn null;\n\t}\n\tconst reportUrl = category.getReportUrl( media );\n\treturn (\n\t\t<DropdownMenu\n\t\t\tclassName=\"block-editor-inserter__media-list__item-preview-options\"\n\t\t\tlabel={ __( 'Options' ) }\n\t\t\tpopoverProps={ MEDIA_OPTIONS_POPOVER_PROPS }\n\t\t\ticon={ moreVertical }\n\t\t>\n\t\t\t{ () => (\n\t\t\t\t<MenuGroup>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\twindow.open( reportUrl, '_blank' ).focus()\n\t\t\t\t\t\t}\n\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t/* translators: %s: The media type to report e.g: \"image\", \"video\", \"audio\" */\n\t\t\t\t\t\t\t__( 'Report %s' ),\n\t\t\t\t\t\t\tcategory.mediaType\n\t\t\t\t\t\t) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction InsertExternalImageModal( { onClose, onSubmit } ) {\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Insert external image' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t\tclassName=\"block-editor-inserter-media-tab-media-preview-inserter-external-image-modal\"\n\t\t>\n\t\t\t<VStack spacing={ 3 }>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t</VStack>\n\t\t\t<Flex\n\t\t\t\tclassName=\"block-editor-block-lock-modal__actions\"\n\t\t\t\tjustify=\"flex-end\"\n\t\t\t\texpanded={ false }\n\t\t\t>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"tertiary\" onClick={ onClose }>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"primary\" onClick={ onSubmit }>\n\t\t\t\t\t\t{ __( 'Insert' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</Modal>\n\t);\n}\n\nexport function MediaPreview( { media, onClick, composite, category } ) {\n\tconst [ showExternalUploadModal, setShowExternalUploadModal ] =\n\t\tuseState( false );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ isInserting, setIsInserting ] = useState( false );\n\tconst [ block, preview ] = useMemo(\n\t\t() => getBlockAndPreviewFromMedia( media, category.mediaType ),\n\t\t[ media, category.mediaType ]\n\t);\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\tconst mediaUpload = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings().mediaUpload,\n\t\t[]\n\t);\n\tconst onMediaInsert = useCallback(\n\t\t( previewBlock ) => {\n\t\t\t// Prevent multiple uploads when we're in the process of inserting.\n\t\t\tif ( isInserting ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst clonedBlock = cloneBlock( previewBlock );\n\t\t\tconst { id, url, caption } = clonedBlock.attributes;\n\t\t\t// Media item already exists in library, so just insert it.\n\t\t\tif ( !! id ) {\n\t\t\t\tonClick( clonedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetIsInserting( true );\n\t\t\t// Media item does not exist in library, so try to upload it.\n\t\t\t// Fist fetch the image data. This may fail if the image host\n\t\t\t// doesn't allow CORS with the domain.\n\t\t\t// If this happens, we insert the image block using the external\n\t\t\t// URL and let the user know about the possible implications.\n\t\t\twindow\n\t\t\t\t.fetch( url )\n\t\t\t\t.then( ( response ) => response.blob() )\n\t\t\t\t.then( ( blob ) => {\n\t\t\t\t\tmediaUpload( {\n\t\t\t\t\t\tfilesList: [ blob ],\n\t\t\t\t\t\tadditionalData: { caption },\n\t\t\t\t\t\tonFileChange( [ img ] ) {\n\t\t\t\t\t\t\tif ( isBlobURL( img.url ) ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick( {\n\t\t\t\t\t\t\t\t...clonedBlock,\n\t\t\t\t\t\t\t\tattributes: {\n\t\t\t\t\t\t\t\t\t...clonedBlock.attributes,\n\t\t\t\t\t\t\t\t\tid: img.id,\n\t\t\t\t\t\t\t\t\turl: img.url,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tcreateSuccessNotice(\n\t\t\t\t\t\t\t\t__( 'Image uploaded and inserted.' ),\n\t\t\t\t\t\t\t\t{ type: 'snackbar' }\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\t\t\t\t\tonError( message ) {\n\t\t\t\t\t\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t} );\n\t\t\t\t} )\n\t\t\t\t.catch( () => {\n\t\t\t\t\tsetShowExternalUploadModal( true );\n\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tisInserting,\n\t\t\tonClick,\n\t\t\tmediaUpload,\n\t\t\tcreateErrorNotice,\n\t\t\tcreateSuccessNotice,\n\t\t]\n\t);\n\tconst title = media.title?.rendered || media.title;\n\tlet truncatedTitle;\n\tif ( title.length > MAXIMUM_TITLE_LENGTH ) {\n\t\tconst omission = '...';\n\t\ttruncatedTitle =\n\t\t\ttitle.slice( 0, MAXIMUM_TITLE_LENGTH - omission.length ) + omission;\n\t}\n\tconst onMouseEnter = useCallback( () => setIsHovered( true ), [] );\n\tconst onMouseLeave = useCallback( () => setIsHovered( false ), [] );\n\treturn (\n\t\t<>\n\t\t\t<InserterDraggableBlocks isEnabled={ true } blocks={ [ block ] }>\n\t\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'block-editor-inserter__media-list__list-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Tooltip text={ truncatedTitle || title }>\n\t\t\t\t\t\t\t{ /* Adding `is-hovered` class to the wrapper element is needed\n\t\t\t\t\t\t\tbecause the options Popover is rendered outside of this node. */ }\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\t\t\t\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-inserter__media-list__item\"\n\t\t\t\t\t\t\t\t\tonClick={ () => onMediaInsert( block ) }\n\t\t\t\t\t\t\t\t\taria-label={ title }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview\">\n\t\t\t\t\t\t\t\t\t\t{ preview }\n\t\t\t\t\t\t\t\t\t\t{ isInserting && (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview-spinner\">\n\t\t\t\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</CompositeItem>\n\t\t\t\t\t\t\t\t{ ! isInserting && (\n\t\t\t\t\t\t\t\t\t<MediaPreviewOptions\n\t\t\t\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t\t\t\t\tmedia={ media }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</InserterDraggableBlocks>\n\t\t\t{ showExternalUploadModal && (\n\t\t\t\t<InsertExternalImageModal\n\t\t\t\t\tonClose={ () => setShowExternalUploadModal( false ) }\n\t\t\t\t\tonSubmit={ () => {\n\t\t\t\t\t\tonClick( cloneBlock( block ) );\n\t\t\t\t\t\tcreateSuccessNotice( __( 'Image inserted.' ), {\n\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsetShowExternalUploadModal( false );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_i18n","_element","_blocks","_icons","_data","_notices","_blob","_inserterDraggableBlocks","_utils","_store","_lockUnlock","ALLOWED_MEDIA_TYPES","MAXIMUM_TITLE_LENGTH","MEDIA_OPTIONS_POPOVER_PROPS","position","className","CompositeItemV2","CompositeItem","unlock","componentsPrivateApis","MediaPreviewOptions","category","media","getReportUrl","reportUrl","_react","createElement","DropdownMenu","label","__","popoverProps","icon","moreVertical","MenuGroup","MenuItem","onClick","window","open","focus","external","sprintf","mediaType","InsertExternalImageModal","onClose","onSubmit","Modal","title","onRequestClose","__experimentalVStack","spacing","Flex","justify","expanded","FlexItem","Button","variant","MediaPreview","showExternalUploadModal","setShowExternalUploadModal","useState","isHovered","setIsHovered","isInserting","setIsInserting","block","preview","useMemo","getBlockAndPreviewFromMedia","createErrorNotice","createSuccessNotice","useDispatch","noticesStore","mediaUpload","useSelect","select","blockEditorStore","getSettings","onMediaInsert","useCallback","previewBlock","clonedBlock","cloneBlock","id","url","caption","attributes","fetch","then","response","blob","filesList","additionalData","onFileChange","img","isBlobURL","type","allowedTypes","onError","message","catch","rendered","truncatedTitle","length","omission","slice","onMouseEnter","onMouseLeave","Fragment","default","isEnabled","blocks","draggable","onDragStart","onDragEnd","classnames","Tooltip","text","render","role","Spinner"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-preview.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tTooltip,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\tSpinner,\n\tModal,\n\tFlex,\n\tFlexItem,\n\tButton,\n\tprivateApis as componentsPrivateApis,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useMemo, useCallback, useState } from '@wordpress/element';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { moreVertical, external } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { isBlobURL } from '@wordpress/blob';\n\n/**\n * Internal dependencies\n */\nimport InserterDraggableBlocks from '../../inserter-draggable-blocks';\nimport { getBlockAndPreviewFromMedia } from './utils';\nimport { store as blockEditorStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image' ];\nconst MAXIMUM_TITLE_LENGTH = 25;\nconst MEDIA_OPTIONS_POPOVER_PROPS = {\n\tposition: 'bottom left',\n\tclassName:\n\t\t'block-editor-inserter__media-list__item-preview-options__popover',\n};\n\nconst { CompositeItemV2: CompositeItem } = unlock( componentsPrivateApis );\n\nfunction MediaPreviewOptions( { category, media } ) {\n\tif ( ! category.getReportUrl ) {\n\t\treturn null;\n\t}\n\tconst reportUrl = category.getReportUrl( media );\n\treturn (\n\t\t<DropdownMenu\n\t\t\tclassName=\"block-editor-inserter__media-list__item-preview-options\"\n\t\t\tlabel={ __( 'Options' ) }\n\t\t\tpopoverProps={ MEDIA_OPTIONS_POPOVER_PROPS }\n\t\t\ticon={ moreVertical }\n\t\t>\n\t\t\t{ () => (\n\t\t\t\t<MenuGroup>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\twindow.open( reportUrl, '_blank' ).focus()\n\t\t\t\t\t\t}\n\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t/* translators: %s: The media type to report e.g: \"image\", \"video\", \"audio\" */\n\t\t\t\t\t\t\t__( 'Report %s' ),\n\t\t\t\t\t\t\tcategory.mediaType\n\t\t\t\t\t\t) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction InsertExternalImageModal( { onClose, onSubmit } ) {\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Insert external image' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t\tclassName=\"block-editor-inserter-media-tab-media-preview-inserter-external-image-modal\"\n\t\t>\n\t\t\t<VStack spacing={ 3 }>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t</VStack>\n\t\t\t<Flex\n\t\t\t\tclassName=\"block-editor-block-lock-modal__actions\"\n\t\t\t\tjustify=\"flex-end\"\n\t\t\t\texpanded={ false }\n\t\t\t>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"tertiary\" onClick={ onClose }>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"primary\" onClick={ onSubmit }>\n\t\t\t\t\t\t{ __( 'Insert' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</Modal>\n\t);\n}\n\nexport function MediaPreview( { media, onClick, category } ) {\n\tconst [ showExternalUploadModal, setShowExternalUploadModal ] =\n\t\tuseState( false );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ isInserting, setIsInserting ] = useState( false );\n\tconst [ block, preview ] = useMemo(\n\t\t() => getBlockAndPreviewFromMedia( media, category.mediaType ),\n\t\t[ media, category.mediaType ]\n\t);\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\tconst mediaUpload = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings().mediaUpload,\n\t\t[]\n\t);\n\tconst onMediaInsert = useCallback(\n\t\t( previewBlock ) => {\n\t\t\t// Prevent multiple uploads when we're in the process of inserting.\n\t\t\tif ( isInserting ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst clonedBlock = cloneBlock( previewBlock );\n\t\t\tconst { id, url, caption } = clonedBlock.attributes;\n\t\t\t// Media item already exists in library, so just insert it.\n\t\t\tif ( !! id ) {\n\t\t\t\tonClick( clonedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetIsInserting( true );\n\t\t\t// Media item does not exist in library, so try to upload it.\n\t\t\t// Fist fetch the image data. This may fail if the image host\n\t\t\t// doesn't allow CORS with the domain.\n\t\t\t// If this happens, we insert the image block using the external\n\t\t\t// URL and let the user know about the possible implications.\n\t\t\twindow\n\t\t\t\t.fetch( url )\n\t\t\t\t.then( ( response ) => response.blob() )\n\t\t\t\t.then( ( blob ) => {\n\t\t\t\t\tmediaUpload( {\n\t\t\t\t\t\tfilesList: [ blob ],\n\t\t\t\t\t\tadditionalData: { caption },\n\t\t\t\t\t\tonFileChange( [ img ] ) {\n\t\t\t\t\t\t\tif ( isBlobURL( img.url ) ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick( {\n\t\t\t\t\t\t\t\t...clonedBlock,\n\t\t\t\t\t\t\t\tattributes: {\n\t\t\t\t\t\t\t\t\t...clonedBlock.attributes,\n\t\t\t\t\t\t\t\t\tid: img.id,\n\t\t\t\t\t\t\t\t\turl: img.url,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tcreateSuccessNotice(\n\t\t\t\t\t\t\t\t__( 'Image uploaded and inserted.' ),\n\t\t\t\t\t\t\t\t{ type: 'snackbar' }\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\t\t\t\t\tonError( message ) {\n\t\t\t\t\t\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t} );\n\t\t\t\t} )\n\t\t\t\t.catch( () => {\n\t\t\t\t\tsetShowExternalUploadModal( true );\n\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tisInserting,\n\t\t\tonClick,\n\t\t\tmediaUpload,\n\t\t\tcreateErrorNotice,\n\t\t\tcreateSuccessNotice,\n\t\t]\n\t);\n\tconst title = media.title?.rendered || media.title;\n\tlet truncatedTitle;\n\tif ( title.length > MAXIMUM_TITLE_LENGTH ) {\n\t\tconst omission = '...';\n\t\ttruncatedTitle =\n\t\t\ttitle.slice( 0, MAXIMUM_TITLE_LENGTH - omission.length ) + omission;\n\t}\n\tconst onMouseEnter = useCallback( () => setIsHovered( true ), [] );\n\tconst onMouseLeave = useCallback( () => setIsHovered( false ), [] );\n\treturn (\n\t\t<>\n\t\t\t<InserterDraggableBlocks isEnabled={ true } blocks={ [ block ] }>\n\t\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'block-editor-inserter__media-list__list-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ /* Adding `is-hovered` class to the wrapper element is needed\n\t\t\t\t\t\tbecause the options Popover is rendered outside of this node. */ }\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\t\t\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Tooltip text={ truncatedTitle || title }>\n\t\t\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\taria-label={ title }\n\t\t\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-inserter__media-list__item\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => onMediaInsert( block ) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview\">\n\t\t\t\t\t\t\t\t\t\t{ preview }\n\t\t\t\t\t\t\t\t\t\t{ isInserting && (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview-spinner\">\n\t\t\t\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</CompositeItem>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t{ ! isInserting && (\n\t\t\t\t\t\t\t\t<MediaPreviewOptions\n\t\t\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t\t\t\tmedia={ media }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</InserterDraggableBlocks>\n\t\t\t{ showExternalUploadModal && (\n\t\t\t\t<InsertExternalImageModal\n\t\t\t\t\tonClose={ () => setShowExternalUploadModal( false ) }\n\t\t\t\t\tonSubmit={ () => {\n\t\t\t\t\t\tonClick( cloneBlock( block ) );\n\t\t\t\t\t\tcreateSuccessNotice( __( 'Image inserted.' ), {\n\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsetShowExternalUploadModal( false );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,WAAA,GAAAD,OAAA;AAaA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,KAAA,GAAAN,OAAA;AACA,IAAAO,QAAA,GAAAP,OAAA;AACA,IAAAQ,KAAA,GAAAR,OAAA;AAKA,IAAAS,wBAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,MAAA,GAAAV,OAAA;AACA,IAAAW,MAAA,GAAAX,OAAA;AACA,IAAAY,WAAA,GAAAZ,OAAA;AAnCA;AACA;AACA;;AAGA;AACA;AACA;;AAsBA;AACA;AACA;;AAMA,MAAMa,mBAAmB,GAAG,CAAE,OAAO,CAAE;AACvC,MAAMC,oBAAoB,GAAG,EAAE;AAC/B,MAAMC,2BAA2B,GAAG;EACnCC,QAAQ,EAAE,aAAa;EACvBC,SAAS,EACR;AACF,CAAC;AAED,MAAM;EAAEC,eAAe,EAAEC;AAAc,CAAC,GAAG,IAAAC,kBAAM,EAAEC,uBAAsB,CAAC;AAE1E,SAASC,mBAAmBA,CAAE;EAAEC,QAAQ;EAAEC;AAAM,CAAC,EAAG;EACnD,IAAK,CAAED,QAAQ,CAACE,YAAY,EAAG;IAC9B,OAAO,IAAI;EACZ;EACA,MAAMC,SAAS,GAAGH,QAAQ,CAACE,YAAY,CAAED,KAAM,CAAC;EAChD,OACC,IAAAG,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAA4B,YAAY;IACZZ,SAAS,EAAC,yDAAyD;IACnEa,KAAK,EAAG,IAAAC,QAAE,EAAE,SAAU,CAAG;IACzBC,YAAY,EAAGjB,2BAA6B;IAC5CkB,IAAI,EAAGC;EAAc,GAEnB,MACD,IAAAP,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAkC,SAAS,QACT,IAAAR,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAmC,QAAQ;IACRC,OAAO,EAAGA,CAAA,KACTC,MAAM,CAACC,IAAI,CAAEb,SAAS,EAAE,QAAS,CAAC,CAACc,KAAK,CAAC,CACzC;IACDP,IAAI,EAAGQ;EAAU,GAEf,IAAAC,aAAO,GACR;EACA,IAAAX,QAAE,EAAE,WAAY,CAAC,EACjBR,QAAQ,CAACoB,SACV,CACS,CACA,CAEC,CAAC;AAEjB;AAEA,SAASC,wBAAwBA,CAAE;EAAEC,OAAO;EAAEC;AAAS,CAAC,EAAG;EAC1D,OACC,IAAAnB,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAA8C,KAAK;IACLC,KAAK,EAAG,IAAAjB,QAAE,EAAE,uBAAwB,CAAG;IACvCkB,cAAc,EAAGJ,OAAS;IAC1B5B,SAAS,EAAC;EAA6E,GAEvF,IAAAU,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAiD,oBAAM;IAACC,OAAO,EAAG;EAAG,GACpB,IAAAxB,MAAA,CAAAC,aAAA,aACG,IAAAG,QAAE,EACH,yGACD,CACE,CAAC,EACJ,IAAAJ,MAAA,CAAAC,aAAA,aACG,IAAAG,QAAE,EACH,qJACD,CACE,CACI,CAAC,EACT,IAAAJ,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAmD,IAAI;IACJnC,SAAS,EAAC,wCAAwC;IAClDoC,OAAO,EAAC,UAAU;IAClBC,QAAQ,EAAG;EAAO,GAElB,IAAA3B,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAsD,QAAQ,QACR,IAAA5B,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAuD,MAAM;IAACC,OAAO,EAAC,UAAU;IAACpB,OAAO,EAAGQ;EAAS,GAC3C,IAAAd,QAAE,EAAE,QAAS,CACR,CACC,CAAC,EACX,IAAAJ,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAsD,QAAQ,QACR,IAAA5B,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAuD,MAAM;IAACC,OAAO,EAAC,SAAS;IAACpB,OAAO,EAAGS;EAAU,GAC3C,IAAAf,QAAE,EAAE,QAAS,CACR,CACC,CACL,CACA,CAAC;AAEV;AAEO,SAAS2B,YAAYA,CAAE;EAAElC,KAAK;EAAEa,OAAO;EAAEd;AAAS,CAAC,EAAG;EAC5D,MAAM,CAAEoC,uBAAuB,EAAEC,0BAA0B,CAAE,GAC5D,IAAAC,iBAAQ,EAAE,KAAM,CAAC;EAClB,MAAM,CAAEC,SAAS,EAAEC,YAAY,CAAE,GAAG,IAAAF,iBAAQ,EAAE,KAAM,CAAC;EACrD,MAAM,CAAEG,WAAW,EAAEC,cAAc,CAAE,GAAG,IAAAJ,iBAAQ,EAAE,KAAM,CAAC;EACzD,MAAM,CAAEK,KAAK,EAAEC,OAAO,CAAE,GAAG,IAAAC,gBAAO,EACjC,MAAM,IAAAC,kCAA2B,EAAE7C,KAAK,EAAED,QAAQ,CAACoB,SAAU,CAAC,EAC9D,CAAEnB,KAAK,EAAED,QAAQ,CAACoB,SAAS,CAC5B,CAAC;EACD,MAAM;IAAE2B,iBAAiB;IAAEC;EAAoB,CAAC,GAC/C,IAAAC,iBAAW,EAAEC,cAAa,CAAC;EAC5B,MAAMC,WAAW,GAAG,IAAAC,eAAS,EAC1BC,MAAM,IAAMA,MAAM,CAAEC,YAAiB,CAAC,CAACC,WAAW,CAAC,CAAC,CAACJ,WAAW,EAClE,EACD,CAAC;EACD,MAAMK,aAAa,GAAG,IAAAC,oBAAW,EAC9BC,YAAY,IAAM;IACnB;IACA,IAAKjB,WAAW,EAAG;MAClB;IACD;IACA,MAAMkB,WAAW,GAAG,IAAAC,kBAAU,EAAEF,YAAa,CAAC;IAC9C,MAAM;MAAEG,EAAE;MAAEC,GAAG;MAAEC;IAAQ,CAAC,GAAGJ,WAAW,CAACK,UAAU;IACnD;IACA,IAAK,CAAC,CAAEH,EAAE,EAAG;MACZ/C,OAAO,CAAE6C,WAAY,CAAC;MACtB;IACD;IACAjB,cAAc,CAAE,IAAK,CAAC;IACtB;IACA;IACA;IACA;IACA;IACA3B,MAAM,CACJkD,KAAK,CAAEH,GAAI,CAAC,CACZI,IAAI,CAAIC,QAAQ,IAAMA,QAAQ,CAACC,IAAI,CAAC,CAAE,CAAC,CACvCF,IAAI,CAAIE,IAAI,IAAM;MAClBjB,WAAW,CAAE;QACZkB,SAAS,EAAE,CAAED,IAAI,CAAE;QACnBE,cAAc,EAAE;UAAEP;QAAQ,CAAC;QAC3BQ,YAAYA,CAAE,CAAEC,GAAG,CAAE,EAAG;UACvB,IAAK,IAAAC,eAAS,EAAED,GAAG,CAACV,GAAI,CAAC,EAAG;YAC3B;UACD;UACAhD,OAAO,CAAE;YACR,GAAG6C,WAAW;YACdK,UAAU,EAAE;cACX,GAAGL,WAAW,CAACK,UAAU;cACzBH,EAAE,EAAEW,GAAG,CAACX,EAAE;cACVC,GAAG,EAAEU,GAAG,CAACV;YACV;UACD,CAAE,CAAC;UACHd,mBAAmB,CAClB,IAAAxC,QAAE,EAAE,8BAA+B,CAAC,EACpC;YAAEkE,IAAI,EAAE;UAAW,CACpB,CAAC;UACDhC,cAAc,CAAE,KAAM,CAAC;QACxB,CAAC;QACDiC,YAAY,EAAErF,mBAAmB;QACjCsF,OAAOA,CAAEC,OAAO,EAAG;UAClB9B,iBAAiB,CAAE8B,OAAO,EAAE;YAAEH,IAAI,EAAE;UAAW,CAAE,CAAC;UAClDhC,cAAc,CAAE,KAAM,CAAC;QACxB;MACD,CAAE,CAAC;IACJ,CAAE,CAAC,CACFoC,KAAK,CAAE,MAAM;MACbzC,0BAA0B,CAAE,IAAK,CAAC;MAClCK,cAAc,CAAE,KAAM,CAAC;IACxB,CAAE,CAAC;EACL,CAAC,EACD,CACCD,WAAW,EACX3B,OAAO,EACPqC,WAAW,EACXJ,iBAAiB,EACjBC,mBAAmB,CAErB,CAAC;EACD,MAAMvB,KAAK,GAAGxB,KAAK,CAACwB,KAAK,EAAEsD,QAAQ,IAAI9E,KAAK,CAACwB,KAAK;EAClD,IAAIuD,cAAc;EAClB,IAAKvD,KAAK,CAACwD,MAAM,GAAG1F,oBAAoB,EAAG;IAC1C,MAAM2F,QAAQ,GAAG,KAAK;IACtBF,cAAc,GACbvD,KAAK,CAAC0D,KAAK,CAAE,CAAC,EAAE5F,oBAAoB,GAAG2F,QAAQ,CAACD,MAAO,CAAC,GAAGC,QAAQ;EACrE;EACA,MAAME,YAAY,GAAG,IAAA3B,oBAAW,EAAE,MAAMjB,YAAY,CAAE,IAAK,CAAC,EAAE,EAAG,CAAC;EAClE,MAAM6C,YAAY,GAAG,IAAA5B,oBAAW,EAAE,MAAMjB,YAAY,CAAE,KAAM,CAAC,EAAE,EAAG,CAAC;EACnE,OACC,IAAApC,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAkF,QAAA,QACC,IAAAlF,MAAA,CAAAC,aAAA,EAACnB,wBAAA,CAAAqG,OAAuB;IAACC,SAAS,EAAG,IAAM;IAACC,MAAM,EAAG,CAAE9C,KAAK;EAAI,GAC7D,CAAE;IAAE+C,SAAS;IAAEC,WAAW;IAAEC;EAAU,CAAC,KACxC,IAAAxF,MAAA,CAAAC,aAAA;IACCX,SAAS,EAAG,IAAAmG,mBAAU,EACrB,8CAA8C,EAC9C;MACC,YAAY,EAAEtD;IACf,CACD,CAAG;IACHmD,SAAS,EAAGA,SAAW;IACvBC,WAAW,EAAGA,WAAa;IAC3BC,SAAS,EAAGA;EAAW,GAIvB,IAAAxF,MAAA,CAAAC,aAAA;IACC+E,YAAY,EAAGA,YAAc;IAC7BC,YAAY,EAAGA;EAAc,GAE7B,IAAAjF,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAoH,OAAO;IAACC,IAAI,EAAGf,cAAc,IAAIvD;EAAO,GACxC,IAAArB,MAAA,CAAAC,aAAA,EAACT,aAAa;IACboG,MAAM,EACL,IAAA5F,MAAA,CAAAC,aAAA;MACC,cAAaoB,KAAO;MACpBwE,IAAI,EAAC,QAAQ;MACbvG,SAAS,EAAC;IAAyC,CACnD,CACD;IACDoB,OAAO,EAAGA,CAAA,KAAM0C,aAAa,CAAEb,KAAM;EAAG,GAExC,IAAAvC,MAAA,CAAAC,aAAA;IAAKX,SAAS,EAAC;EAAiD,GAC7DkD,OAAO,EACPH,WAAW,IACZ,IAAArC,MAAA,CAAAC,aAAA;IAAKX,SAAS,EAAC;EAAyD,GACvE,IAAAU,MAAA,CAAAC,aAAA,EAAC3B,WAAA,CAAAwH,OAAO,MAAE,CACN,CAEF,CACS,CACP,CAAC,EACR,CAAEzD,WAAW,IACd,IAAArC,MAAA,CAAAC,aAAA,EAACN,mBAAmB;IACnBC,QAAQ,EAAGA,QAAU;IACrBC,KAAK,EAAGA;EAAO,CACf,CAEE,CACD,CAEkB,CAAC,EACxBmC,uBAAuB,IACxB,IAAAhC,MAAA,CAAAC,aAAA,EAACgB,wBAAwB;IACxBC,OAAO,EAAGA,CAAA,KAAMe,0BAA0B,CAAE,KAAM,CAAG;IACrDd,QAAQ,EAAGA,CAAA,KAAM;MAChBT,OAAO,CAAE,IAAA8C,kBAAU,EAAEjB,KAAM,CAAE,CAAC;MAC9BK,mBAAmB,CAAE,IAAAxC,QAAE,EAAE,iBAAkB,CAAC,EAAE;QAC7CkE,IAAI,EAAE;MACP,CAAE,CAAC;MACHrC,0BAA0B,CAAE,KAAM,CAAC;IACpC;EAAG,CACH,CAED,CAAC;AAEL"}

package/build/components/inserter/menu.js

@@ -14,15 +14,14 @@ var _data = require("@wordpress/data");
 var _tips = _interopRequireDefault(require("./tips"));
 var _previewPanel = _interopRequireDefault(require("./preview-panel"));
 var _blockTypesTab = _interopRequireDefault(require("./block-types-tab"));
-var _blockPatternsTab = _interopRequireWildcard(require("./block-patterns-tab"));
+var _blockPatternsTab = _interopRequireDefault(require("./block-patterns-tab"));
+var _patternCategoryPreviewPanel = require("./block-patterns-tab/pattern-category-preview-panel");
 var _mediaTab = require("./media-tab");
 var _searchResults = _interopRequireDefault(require("./search-results"));
 var _useDebouncedInput = _interopRequireDefault(require("./hooks/use-debounced-input"));
 var _useInsertionPoint = _interopRequireDefault(require("./hooks/use-insertion-point"));
 var _tabs = _interopRequireDefault(require("./tabs"));
 var _store = require("../../store");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 /**
  * External dependencies
  */
@@ -194,7 +193,7 @@ function InserterMenu({
     category: selectedMediaCategory
   }), showInserterHelpPanel && hoveredItem && (0, _react.createElement)(_previewPanel.default, {
     item: hoveredItem
-  }), showPatternPanel && (0, _react.createElement)(_blockPatternsTab.BlockPatternsCategoryDialog, {
+  }), showPatternPanel && (0, _react.createElement)(_patternCategoryPreviewPanel.PatternCategoryPreviewPanel, {
     rootClientId: destinationRootClientId,
     onInsert: onInsertPattern,
     onHover: onHoverPattern,