@wordpress/edit-site 5.12.7 → 5.12.8

package/build-module/components/page-patterns/duplicate-menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/duplicate-menu-item.js"],"names":["MenuItem","store","coreStore","useDispatch","__","sprintf","noticesStore","privateApis","routerPrivateApis","TEMPLATE_PARTS","PATTERNS","SYNC_TYPES","USER_PATTERNS","USER_PATTERN_CATEGORY","useExistingTemplateParts","getUniqueTemplatePartTitle","getCleanTemplatePartSlug","unlock","useHistory","getPatternMeta","item","type","wp_pattern_sync_status","unsynced","syncStatus","reusableBlock","isUnsynced","meta","undefined","DuplicateMenuItem","categoryId","label","onClose","saveEntityRecord","createErrorNotice","createSuccessNotice","history","existingTemplateParts","createTemplatePart","copiedTitle","title","slug","area","content","templatePart","result","throwOnError","id","actions","onClick","push","postType","postId","categoryType","error","errorMessage","message","code","createPattern","isThemePattern","status","actionLabel","newLocation","path","createItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuItem } from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport {\n\tTEMPLATE_PARTS,\n\tPATTERNS,\n\tSYNC_TYPES,\n\tUSER_PATTERNS,\n\tUSER_PATTERN_CATEGORY,\n} from './utils';\nimport {\n\tuseExistingTemplateParts,\n\tgetUniqueTemplatePartTitle,\n\tgetCleanTemplatePartSlug,\n} from '../../utils/template-part-create';\nimport { unlock } from '../../lock-unlock';\n\nconst { useHistory } = unlock( routerPrivateApis );\n\nfunction getPatternMeta( item ) {\n\tif ( item.type === PATTERNS ) {\n\t\treturn { wp_pattern_sync_status: SYNC_TYPES.unsynced };\n\t}\n\n\tconst syncStatus = item.reusableBlock.wp_pattern_sync_status;\n\tconst isUnsynced = syncStatus === SYNC_TYPES.unsynced;\n\n\treturn {\n\t\t...item.reusableBlock.meta,\n\t\twp_pattern_sync_status: isUnsynced ? syncStatus : undefined,\n\t};\n}\n\nexport default function DuplicateMenuItem( {\n\tcategoryId,\n\titem,\n\tlabel = __( 'Duplicate' ),\n\tonClose,\n} ) {\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\n\tconst history = useHistory();\n\tconst existingTemplateParts = useExistingTemplateParts();\n\n\tasync function createTemplatePart() {\n\t\ttry {\n\t\t\tconst copiedTitle = sprintf(\n\t\t\t\t/* translators: %s: Existing template part title */\n\t\t\t\t__( '%s (Copy)' ),\n\t\t\t\titem.title\n\t\t\t);\n\t\t\tconst title = getUniqueTemplatePartTitle(\n\t\t\t\tcopiedTitle,\n\t\t\t\texistingTemplateParts\n\t\t\t);\n\t\t\tconst slug = getCleanTemplatePartSlug( title );\n\t\t\tconst { area, content } = item.templatePart;\n\n\t\t\tconst result = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_template_part',\n\t\t\t\t{ slug, title, content, area },\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\n\t\t\tcreateSuccessNotice(\n\t\t\t\tsprintf(\n\t\t\t\t\t// translators: %s: The new template part's title e.g. 'Call to action (copy)'.\n\t\t\t\t\t__( '\"%s\" created.' ),\n\t\t\t\t\ttitle\n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tid: 'edit-site-patterns-success',\n\t\t\t\t\tactions: [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Edit' ),\n\t\t\t\t\t\t\tonClick: () =>\n\t\t\t\t\t\t\t\thistory.push( {\n\t\t\t\t\t\t\t\t\tpostType: TEMPLATE_PARTS,\n\t\t\t\t\t\t\t\t\tpostId: result?.id,\n\t\t\t\t\t\t\t\t\tcategoryType: TEMPLATE_PARTS,\n\t\t\t\t\t\t\t\t\tcategoryId,\n\t\t\t\t\t\t\t\t} ),\n\t\t\t\t\t\t},\n\t\t\t\t\t],\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tonClose();\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __(\n\t\t\t\t\t\t\t'An error occurred while creating the template part.'\n\t\t\t\t\t  );\n\n\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'edit-site-patterns-error',\n\t\t\t} );\n\t\t\tonClose();\n\t\t}\n\t}\n\n\tasync function createPattern() {\n\t\ttry {\n\t\t\tconst isThemePattern = item.type === PATTERNS;\n\t\t\tconst title = sprintf(\n\t\t\t\t/* translators: %s: Existing pattern title */\n\t\t\t\t__( '%s (Copy)' ),\n\t\t\t\titem.title\n\t\t\t);\n\n\t\t\tconst result = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_block',\n\t\t\t\t{\n\t\t\t\t\tcontent: isThemePattern\n\t\t\t\t\t\t? item.content\n\t\t\t\t\t\t: item.reusableBlock.content,\n\t\t\t\t\tmeta: getPatternMeta( item ),\n\t\t\t\t\tstatus: 'publish',\n\t\t\t\t\ttitle,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\n\t\t\tconst actionLabel = isThemePattern\n\t\t\t\t? __( 'View my patterns' )\n\t\t\t\t: __( 'Edit' );\n\n\t\t\tconst newLocation = isThemePattern\n\t\t\t\t? {\n\t\t\t\t\t\tcategoryType: USER_PATTERNS,\n\t\t\t\t\t\tcategoryId: USER_PATTERN_CATEGORY,\n\t\t\t\t\t\tpath: '/patterns',\n\t\t\t\t  }\n\t\t\t\t: {\n\t\t\t\t\t\tcategoryType: USER_PATTERNS,\n\t\t\t\t\t\tcategoryId: USER_PATTERN_CATEGORY,\n\t\t\t\t\t\tpostType: USER_PATTERNS,\n\t\t\t\t\t\tpostId: result?.id,\n\t\t\t\t  };\n\n\t\t\tcreateSuccessNotice(\n\t\t\t\tsprintf(\n\t\t\t\t\t// translators: %s: The new pattern's title e.g. 'Call to action (copy)'.\n\t\t\t\t\t__( '\"%s\" added to my patterns.' ),\n\t\t\t\t\ttitle\n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tid: 'edit-site-patterns-success',\n\t\t\t\t\tactions: [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: actionLabel,\n\t\t\t\t\t\t\tonClick: () => history.push( newLocation ),\n\t\t\t\t\t\t},\n\t\t\t\t\t],\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tonClose();\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while creating the pattern.' );\n\n\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'edit-site-patterns-error',\n\t\t\t} );\n\t\t\tonClose();\n\t\t}\n\t}\n\n\tconst createItem =\n\t\titem.type === TEMPLATE_PARTS ? createTemplatePart : createPattern;\n\n\treturn <MenuItem onClick={ createItem }>{ label }</MenuItem>;\n}\n"]}

package/build-module/components/page-patterns/grid-item.js

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement } from "@wordpress/element";
 
 /**
  * External dependencies
@@ -9,31 +9,38 @@ import classnames from 'classnames';
  */
 
 import { BlockPreview } from '@wordpress/block-editor';
-import { __experimentalConfirmDialog as ConfirmDialog, DropdownMenu, MenuGroup, MenuItem, __experimentalHeading as Heading, __experimentalHStack as HStack, __unstableCompositeItem as CompositeItem, Tooltip, Flex } from '@wordpress/components';
+import { Button, __experimentalConfirmDialog as ConfirmDialog, DropdownMenu, MenuGroup, MenuItem, __experimentalHeading as Heading, __experimentalHStack as HStack, Tooltip, Flex } from '@wordpress/components';
 import { useDispatch } from '@wordpress/data';
-import { useState, useId } from '@wordpress/element';
+import { useState, useId, memo } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
-import { Icon, header, footer, symbolFilled, moreHorizontal, lockSmall } from '@wordpress/icons';
+import { Icon, header, footer, symbolFilled as uncategorized, symbol, moreHorizontal, lockSmall } from '@wordpress/icons';
 import { store as noticesStore } from '@wordpress/notices';
 import { store as reusableBlocksStore } from '@wordpress/reusable-blocks';
-import { DELETE, BACKSPACE } from '@wordpress/keycodes';
 /**
  * Internal dependencies
  */
 
-import { PATTERNS, USER_PATTERNS } from './utils';
+import RenameMenuItem from './rename-menu-item';
+import DuplicateMenuItem from './duplicate-menu-item';
+import { PATTERNS, TEMPLATE_PARTS, USER_PATTERNS, SYNC_TYPES } from './utils';
+import { store as editSiteStore } from '../../store';
 import { useLink } from '../routes/link';
+const templatePartIcons = {
+  header,
+  footer,
+  uncategorized
+};
 
-const THEME_PATTERN_TOOLTIP = __('Theme patterns cannot be edited.');
-
-export default function GridItem({
+function GridItem({
   categoryId,
-  composite,
-  icon,
-  item
+  item,
+  ...props
 }) {
   const descriptionId = useId();
   const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
+  const {
+    removeTemplate
+  } = useDispatch(editSiteStore);
   const {
     __experimentalDeleteReusableBlock
   } = useDispatch(reusableBlocksStore);
@@ -41,76 +48,74 @@ export default function GridItem({
     createErrorNotice,
     createSuccessNotice
   } = useDispatch(noticesStore);
+  const isUserPattern = item.type === USER_PATTERNS;
+  const isNonUserPattern = item.type === PATTERNS;
+  const isTemplatePart = item.type === TEMPLATE_PARTS;
   const {
     onClick
   } = useLink({
     postType: item.type,
-    postId: item.type === USER_PATTERNS ? item.id : item.name,
+    postId: isUserPattern ? item.id : item.name,
     categoryId,
     categoryType: item.type
   });
-
-  const onKeyDown = event => {
-    if (DELETE === event.keyCode || BACKSPACE === event.keyCode) {
-      setIsDeleteDialogOpen(true);
-    }
-  };
-
   const isEmpty = !item.blocks?.length;
   const patternClassNames = classnames('edit-site-patterns__pattern', {
     'is-placeholder': isEmpty
   });
   const previewClassNames = classnames('edit-site-patterns__preview', {
-    'is-inactive': item.type === PATTERNS
+    'is-inactive': isNonUserPattern
   });
 
   const deletePattern = async () => {
     try {
       await __experimentalDeleteReusableBlock(item.id);
-      createSuccessNotice(__('Pattern successfully deleted.'), {
-        type: 'snackbar'
+      createSuccessNotice(sprintf( // translators: %s: The pattern's title e.g. 'Call to action'.
+      __('"%s" deleted.'), item.title), {
+        type: 'snackbar',
+        id: 'edit-site-patterns-success'
       });
     } catch (error) {
       const errorMessage = error.message && error.code !== 'unknown_error' ? error.message : __('An error occurred while deleting the pattern.');
       createErrorNotice(errorMessage, {
-        type: 'snackbar'
+        type: 'snackbar',
+        id: 'edit-site-patterns-error'
       });
     }
   };
 
-  const isUserPattern = item.type === USER_PATTERNS;
+  const deleteItem = () => isTemplatePart ? removeTemplate(item) : deletePattern(); // Only custom patterns or custom template parts can be renamed or deleted.
+
+
+  const isCustomPattern = isUserPattern || isTemplatePart && item.isCustom;
+  const hasThemeFile = isTemplatePart && item.templatePart.has_theme_file;
   const ariaDescriptions = [];
 
-  if (isUserPattern) {
+  if (isCustomPattern) {
     // User patterns don't have descriptions, but can be edited and deleted, so include some help text.
     ariaDescriptions.push(__('Press Enter to edit, or Delete to delete the pattern.'));
   } else if (item.description) {
     ariaDescriptions.push(item.description);
   }
 
-  if (item.type === PATTERNS) {
-    ariaDescriptions.push(THEME_PATTERN_TOOLTIP);
-  }
-
-  let itemIcon = icon;
-
-  if (categoryId === 'header') {
-    itemIcon = header;
-  } else if (categoryId === 'footer') {
-    itemIcon = footer;
-  } else if (categoryId === 'uncategorized') {
-    itemIcon = symbolFilled;
+  if (isNonUserPattern) {
+    ariaDescriptions.push(__('Theme patterns cannot be edited.'));
   }
 
-  return createElement(Fragment, null, createElement("div", {
+  const itemIcon = templatePartIcons[categoryId] || (item.syncStatus === SYNC_TYPES.full ? symbol : undefined);
+  const confirmButtonText = hasThemeFile ? __('Clear') : __('Delete');
+  const confirmPrompt = hasThemeFile ? __('Are you sure you want to clear these customizations?') : sprintf( // translators: %s: The pattern or template part's title e.g. 'Call to action'.
+  __('Are you sure you want to delete "%s"?'), item.title);
+  return createElement("li", {
     className: patternClassNames
-  }, createElement(CompositeItem, {
-    className: previewClassNames,
-    role: "option",
-    as: "div",
-    ...composite,
+  }, createElement("button", {
+    className: previewClassNames // Even though still incomplete, passing ids helps performance.
+    // @see https://reakit.io/docs/composite/#performance.
+    ,
+    id: `edit-site-patterns-${item.name}`,
+    ...props,
     onClick: item.type !== PATTERNS ? onClick : undefined,
-    onKeyDown: isUserPattern ? onKeyDown : undefined,
+    "aria-disabled": item.type !== PATTERNS ? 'false' : 'true',
     "aria-label": item.title,
     "aria-describedby": ariaDescriptions.length ? ariaDescriptions.map((_, index) => `${descriptionId}-${index}`).join(' ') : undefined
   }, isEmpty && __('Empty pattern'), !isEmpty && createElement(BlockPreview, {
@@ -120,7 +125,6 @@ export default function GridItem({
     hidden: true,
     id: `${descriptionId}-${index}`
   }, ariaDescription)), createElement(HStack, {
-    "aria-hidden": "true",
     className: "edit-site-patterns__footer",
     justify: "space-between"
   }, createElement(HStack, {
@@ -128,26 +132,33 @@ export default function GridItem({
     justify: "left",
     spacing: 3,
     className: "edit-site-patterns__pattern-title"
-  }, icon && createElement(Icon, {
+  }, itemIcon && createElement(Tooltip, {
+    position: "top center",
+    text: __('Editing this pattern will also update anywhere it is used')
+  }, createElement("span", null, createElement(Icon, {
     className: "edit-site-patterns__pattern-icon",
     icon: itemIcon
-  }), createElement(Flex, {
-    as: Heading,
-    level: 5,
+  }))), createElement(Flex, {
+    as: "span",
     gap: 0,
     justify: "left"
-  }, item.title, item.type === PATTERNS && createElement(Tooltip, {
+  }, item.type === PATTERNS ? item.title : createElement(Heading, {
+    level: 5
+  }, createElement(Button, {
+    variant: "link",
+    onClick: onClick // Required for the grid's roving tab index system.
+    // See https://github.com/WordPress/gutenberg/pull/51898#discussion_r1243399243.
+    ,
+    tabIndex: "-1"
+  }, item.title)), item.type === PATTERNS && createElement(Tooltip, {
     position: "top center",
     text: __('Theme patterns cannot be edited.')
   }, createElement("span", {
     className: "edit-site-patterns__pattern-lock-icon"
   }, createElement(Icon, {
-    style: {
-      fill: 'currentcolor'
-    },
     icon: lockSmall,
     size: 24
-  }))))), item.type === USER_PATTERNS && createElement(DropdownMenu, {
+  }))))), createElement(DropdownMenu, {
     icon: moreHorizontal,
     label: __('Actions'),
     className: "edit-site-patterns__dropdown",
@@ -159,18 +170,26 @@ export default function GridItem({
       isSmall: true,
       describedBy: sprintf(
       /* translators: %s: pattern name */
-      __('Action menu for %s pattern'), item.title),
-      // The dropdown menu is not focusable using the
-      // keyboard as this would interfere with the grid's
-      // roving tab index system. Instead, keyboard users
-      // use keyboard shortcuts to trigger actions.
-      tabIndex: -1
+      __('Action menu for %s pattern'), item.title)
     }
-  }, () => createElement(MenuGroup, null, createElement(MenuItem, {
+  }, ({
+    onClose
+  }) => createElement(MenuGroup, null, isCustomPattern && !hasThemeFile && createElement(RenameMenuItem, {
+    item: item,
+    onClose: onClose
+  }), createElement(DuplicateMenuItem, {
+    categoryId: categoryId,
+    item: item,
+    onClose: onClose,
+    label: isNonUserPattern ? __('Copy to My patterns') : __('Duplicate')
+  }), isCustomPattern && createElement(MenuItem, {
     onClick: () => setIsDeleteDialogOpen(true)
-  }, __('Delete')))))), isDeleteDialogOpen && createElement(ConfirmDialog, {
-    onConfirm: deletePattern,
+  }, hasThemeFile ? __('Clear customizations') : __('Delete'))))), isDeleteDialogOpen && createElement(ConfirmDialog, {
+    confirmButtonText: confirmButtonText,
+    onConfirm: deleteItem,
     onCancel: () => setIsDeleteDialogOpen(false)
-  }, __('Are you sure you want to delete this pattern?')));
+  }, confirmPrompt));
 }
+
+export default memo(GridItem);
 //# sourceMappingURL=grid-item.js.map

package/build-module/components/page-patterns/grid-item.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/grid-item.js"],"names":["classnames","BlockPreview","__experimentalConfirmDialog","ConfirmDialog","DropdownMenu","MenuGroup","MenuItem","__experimentalHeading","Heading","__experimentalHStack","HStack","__unstableCompositeItem","CompositeItem","Tooltip","Flex","useDispatch","useState","useId","__","sprintf","Icon","header","footer","symbolFilled","moreHorizontal","lockSmall","store","noticesStore","reusableBlocksStore","DELETE","BACKSPACE","PATTERNS","USER_PATTERNS","useLink","THEME_PATTERN_TOOLTIP","GridItem","categoryId","composite","icon","item","descriptionId","isDeleteDialogOpen","setIsDeleteDialogOpen","__experimentalDeleteReusableBlock","createErrorNotice","createSuccessNotice","onClick","postType","type","postId","id","name","categoryType","onKeyDown","event","keyCode","isEmpty","blocks","length","patternClassNames","previewClassNames","deletePattern","error","errorMessage","message","code","isUserPattern","ariaDescriptions","push","description","itemIcon","undefined","title","map","_","index","join","ariaDescription","fill","placement","className","isSmall","describedBy","tabIndex"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { BlockPreview } from '@wordpress/block-editor';\nimport {\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\t__experimentalHeading as Heading,\n\t__experimentalHStack as HStack,\n\t__unstableCompositeItem as CompositeItem,\n\tTooltip,\n\tFlex,\n} from '@wordpress/components';\nimport { useDispatch } from '@wordpress/data';\nimport { useState, useId } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tIcon,\n\theader,\n\tfooter,\n\tsymbolFilled,\n\tmoreHorizontal,\n\tlockSmall,\n} from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as reusableBlocksStore } from '@wordpress/reusable-blocks';\nimport { DELETE, BACKSPACE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { PATTERNS, USER_PATTERNS } from './utils';\nimport { useLink } from '../routes/link';\n\nconst THEME_PATTERN_TOOLTIP = __( 'Theme patterns cannot be edited.' );\n\nexport default function GridItem( { categoryId, composite, icon, item } ) {\n\tconst descriptionId = useId();\n\tconst [ isDeleteDialogOpen, setIsDeleteDialogOpen ] = useState( false );\n\n\tconst { __experimentalDeleteReusableBlock } =\n\t\tuseDispatch( reusableBlocksStore );\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\n\tconst { onClick } = useLink( {\n\t\tpostType: item.type,\n\t\tpostId: item.type === USER_PATTERNS ? item.id : item.name,\n\t\tcategoryId,\n\t\tcategoryType: item.type,\n\t} );\n\n\tconst onKeyDown = ( event ) => {\n\t\tif ( DELETE === event.keyCode || BACKSPACE === event.keyCode ) {\n\t\t\tsetIsDeleteDialogOpen( true );\n\t\t}\n\t};\n\n\tconst isEmpty = ! item.blocks?.length;\n\tconst patternClassNames = classnames( 'edit-site-patterns__pattern', {\n\t\t'is-placeholder': isEmpty,\n\t} );\n\tconst previewClassNames = classnames( 'edit-site-patterns__preview', {\n\t\t'is-inactive': item.type === PATTERNS,\n\t} );\n\n\tconst deletePattern = async () => {\n\t\ttry {\n\t\t\tawait __experimentalDeleteReusableBlock( item.id );\n\t\t\tcreateSuccessNotice( __( 'Pattern successfully deleted.' ), {\n\t\t\t\ttype: 'snackbar',\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while deleting the pattern.' );\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\t\t}\n\t};\n\n\tconst isUserPattern = item.type === USER_PATTERNS;\n\tconst ariaDescriptions = [];\n\tif ( isUserPattern ) {\n\t\t// User patterns don't have descriptions, but can be edited and deleted, so include some help text.\n\t\tariaDescriptions.push(\n\t\t\t__( 'Press Enter to edit, or Delete to delete the pattern.' )\n\t\t);\n\t} else if ( item.description ) {\n\t\tariaDescriptions.push( item.description );\n\t}\n\tif ( item.type === PATTERNS ) {\n\t\tariaDescriptions.push( THEME_PATTERN_TOOLTIP );\n\t}\n\n\tlet itemIcon = icon;\n\tif ( categoryId === 'header' ) {\n\t\titemIcon = header;\n\t} else if ( categoryId === 'footer' ) {\n\t\titemIcon = footer;\n\t} else if ( categoryId === 'uncategorized' ) {\n\t\titemIcon = symbolFilled;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<div className={ patternClassNames }>\n\t\t\t\t<CompositeItem\n\t\t\t\t\tclassName={ previewClassNames }\n\t\t\t\t\trole=\"option\"\n\t\t\t\t\tas=\"div\"\n\t\t\t\t\t{ ...composite }\n\t\t\t\t\tonClick={ item.type !== PATTERNS ? onClick : undefined }\n\t\t\t\t\tonKeyDown={ isUserPattern ? onKeyDown : undefined }\n\t\t\t\t\taria-label={ item.title }\n\t\t\t\t\taria-describedby={\n\t\t\t\t\t\tariaDescriptions.length\n\t\t\t\t\t\t\t? ariaDescriptions\n\t\t\t\t\t\t\t\t\t.map(\n\t\t\t\t\t\t\t\t\t\t( _, index ) =>\n\t\t\t\t\t\t\t\t\t\t\t`${ descriptionId }-${ index }`\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t.join( ' ' )\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ isEmpty && __( 'Empty pattern' ) }\n\t\t\t\t\t{ ! isEmpty && <BlockPreview blocks={ item.blocks } /> }\n\t\t\t\t</CompositeItem>\n\t\t\t\t{ ariaDescriptions.map( ( ariaDescription, index ) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\thidden\n\t\t\t\t\t\tid={ `${ descriptionId }-${ index }` }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ariaDescription }\n\t\t\t\t\t</div>\n\t\t\t\t) ) }\n\t\t\t\t<HStack\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tclassName=\"edit-site-patterns__footer\"\n\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\talignment=\"center\"\n\t\t\t\t\t\tjustify=\"left\"\n\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t\tclassName=\"edit-site-patterns__pattern-title\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tclassName=\"edit-site-patterns__pattern-icon\"\n\t\t\t\t\t\t\t\ticon={ itemIcon }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tas={ Heading }\n\t\t\t\t\t\t\tlevel={ 5 }\n\t\t\t\t\t\t\tgap={ 0 }\n\t\t\t\t\t\t\tjustify=\"left\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.title }\n\t\t\t\t\t\t\t{ item.type === PATTERNS && (\n\t\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\t\tposition=\"top center\"\n\t\t\t\t\t\t\t\t\ttext={ __(\n\t\t\t\t\t\t\t\t\t\t'Theme patterns cannot be edited.'\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\t\t<span className=\"edit-site-patterns__pattern-lock-icon\">\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\tstyle={ { fill: 'currentcolor' } }\n\t\t\t\t\t\t\t\t\t\t\ticon={ lockSmall }\n\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t{ item.type === USER_PATTERNS && (\n\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\ticon={ moreHorizontal }\n\t\t\t\t\t\t\tlabel={ __( 'Actions' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-patterns__dropdown\"\n\t\t\t\t\t\t\tpopoverProps={ { placement: 'bottom-end' } }\n\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\tclassName: 'edit-site-patterns__button',\n\t\t\t\t\t\t\t\tisSmall: true,\n\t\t\t\t\t\t\t\tdescribedBy: sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: pattern name */\n\t\t\t\t\t\t\t\t\t__( 'Action menu for %s pattern' ),\n\t\t\t\t\t\t\t\t\titem.title\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t// The dropdown menu is not focusable using the\n\t\t\t\t\t\t\t\t// keyboard as this would interfere with the grid's\n\t\t\t\t\t\t\t\t// roving tab index system. Instead, keyboard users\n\t\t\t\t\t\t\t\t// use keyboard shortcuts to trigger actions.\n\t\t\t\t\t\t\t\ttabIndex: -1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ () => (\n\t\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\tsetIsDeleteDialogOpen( true )\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\t\t{ __( 'Delete' ) }\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</DropdownMenu>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t</div>\n\t\t\t{ isDeleteDialogOpen && (\n\t\t\t\t<ConfirmDialog\n\t\t\t\t\tonConfirm={ deletePattern }\n\t\t\t\t\tonCancel={ () => setIsDeleteDialogOpen( false ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Are you sure you want to delete this pattern?' ) }\n\t\t\t\t</ConfirmDialog>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/grid-item.js"],"names":["classnames","BlockPreview","Button","__experimentalConfirmDialog","ConfirmDialog","DropdownMenu","MenuGroup","MenuItem","__experimentalHeading","Heading","__experimentalHStack","HStack","Tooltip","Flex","useDispatch","useState","useId","memo","__","sprintf","Icon","header","footer","symbolFilled","uncategorized","symbol","moreHorizontal","lockSmall","store","noticesStore","reusableBlocksStore","RenameMenuItem","DuplicateMenuItem","PATTERNS","TEMPLATE_PARTS","USER_PATTERNS","SYNC_TYPES","editSiteStore","useLink","templatePartIcons","GridItem","categoryId","item","props","descriptionId","isDeleteDialogOpen","setIsDeleteDialogOpen","removeTemplate","__experimentalDeleteReusableBlock","createErrorNotice","createSuccessNotice","isUserPattern","type","isNonUserPattern","isTemplatePart","onClick","postType","postId","id","name","categoryType","isEmpty","blocks","length","patternClassNames","previewClassNames","deletePattern","title","error","errorMessage","message","code","deleteItem","isCustomPattern","isCustom","hasThemeFile","templatePart","has_theme_file","ariaDescriptions","push","description","itemIcon","syncStatus","full","undefined","confirmButtonText","confirmPrompt","map","_","index","join","ariaDescription","placement","className","isSmall","describedBy","onClose"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { BlockPreview } from '@wordpress/block-editor';\nimport {\n\tButton,\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\t__experimentalHeading as Heading,\n\t__experimentalHStack as HStack,\n\tTooltip,\n\tFlex,\n} from '@wordpress/components';\nimport { useDispatch } from '@wordpress/data';\nimport { useState, useId, memo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tIcon,\n\theader,\n\tfooter,\n\tsymbolFilled as uncategorized,\n\tsymbol,\n\tmoreHorizontal,\n\tlockSmall,\n} from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as reusableBlocksStore } from '@wordpress/reusable-blocks';\n\n/**\n * Internal dependencies\n */\nimport RenameMenuItem from './rename-menu-item';\nimport DuplicateMenuItem from './duplicate-menu-item';\nimport { PATTERNS, TEMPLATE_PARTS, USER_PATTERNS, SYNC_TYPES } from './utils';\nimport { store as editSiteStore } from '../../store';\nimport { useLink } from '../routes/link';\n\nconst templatePartIcons = { header, footer, uncategorized };\n\nfunction GridItem( { categoryId, item, ...props } ) {\n\tconst descriptionId = useId();\n\tconst [ isDeleteDialogOpen, setIsDeleteDialogOpen ] = useState( false );\n\n\tconst { removeTemplate } = useDispatch( editSiteStore );\n\tconst { __experimentalDeleteReusableBlock } =\n\t\tuseDispatch( reusableBlocksStore );\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\n\tconst isUserPattern = item.type === USER_PATTERNS;\n\tconst isNonUserPattern = item.type === PATTERNS;\n\tconst isTemplatePart = item.type === TEMPLATE_PARTS;\n\n\tconst { onClick } = useLink( {\n\t\tpostType: item.type,\n\t\tpostId: isUserPattern ? item.id : item.name,\n\t\tcategoryId,\n\t\tcategoryType: item.type,\n\t} );\n\n\tconst isEmpty = ! item.blocks?.length;\n\tconst patternClassNames = classnames( 'edit-site-patterns__pattern', {\n\t\t'is-placeholder': isEmpty,\n\t} );\n\tconst previewClassNames = classnames( 'edit-site-patterns__preview', {\n\t\t'is-inactive': isNonUserPattern,\n\t} );\n\n\tconst deletePattern = async () => {\n\t\ttry {\n\t\t\tawait __experimentalDeleteReusableBlock( item.id );\n\t\t\tcreateSuccessNotice(\n\t\t\t\tsprintf(\n\t\t\t\t\t// translators: %s: The pattern's title e.g. 'Call to action'.\n\t\t\t\t\t__( '\"%s\" deleted.' ),\n\t\t\t\t\titem.title\n\t\t\t\t),\n\t\t\t\t{ type: 'snackbar', id: 'edit-site-patterns-success' }\n\t\t\t);\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while deleting the pattern.' );\n\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'edit-site-patterns-error',\n\t\t\t} );\n\t\t}\n\t};\n\tconst deleteItem = () =>\n\t\tisTemplatePart ? removeTemplate( item ) : deletePattern();\n\n\t// Only custom patterns or custom template parts can be renamed or deleted.\n\tconst isCustomPattern =\n\t\tisUserPattern || ( isTemplatePart && item.isCustom );\n\tconst hasThemeFile = isTemplatePart && item.templatePart.has_theme_file;\n\tconst ariaDescriptions = [];\n\n\tif ( isCustomPattern ) {\n\t\t// User patterns don't have descriptions, but can be edited and deleted, so include some help text.\n\t\tariaDescriptions.push(\n\t\t\t__( 'Press Enter to edit, or Delete to delete the pattern.' )\n\t\t);\n\t} else if ( item.description ) {\n\t\tariaDescriptions.push( item.description );\n\t}\n\n\tif ( isNonUserPattern ) {\n\t\tariaDescriptions.push( __( 'Theme patterns cannot be edited.' ) );\n\t}\n\n\tconst itemIcon =\n\t\ttemplatePartIcons[ categoryId ] ||\n\t\t( item.syncStatus === SYNC_TYPES.full ? symbol : undefined );\n\n\tconst confirmButtonText = hasThemeFile ? __( 'Clear' ) : __( 'Delete' );\n\tconst confirmPrompt = hasThemeFile\n\t\t? __( 'Are you sure you want to clear these customizations?' )\n\t\t: sprintf(\n\t\t\t\t// translators: %s: The pattern or template part's title e.g. 'Call to action'.\n\t\t\t\t__( 'Are you sure you want to delete \"%s\"?' ),\n\t\t\t\titem.title\n\t\t  );\n\n\treturn (\n\t\t<li className={ patternClassNames }>\n\t\t\t<button\n\t\t\t\tclassName={ previewClassNames }\n\t\t\t\t// Even though still incomplete, passing ids helps performance.\n\t\t\t\t// @see https://reakit.io/docs/composite/#performance.\n\t\t\t\tid={ `edit-site-patterns-${ item.name }` }\n\t\t\t\t{ ...props }\n\t\t\t\tonClick={ item.type !== PATTERNS ? onClick : undefined }\n\t\t\t\taria-disabled={ item.type !== PATTERNS ? 'false' : 'true' }\n\t\t\t\taria-label={ item.title }\n\t\t\t\taria-describedby={\n\t\t\t\t\tariaDescriptions.length\n\t\t\t\t\t\t? ariaDescriptions\n\t\t\t\t\t\t\t\t.map(\n\t\t\t\t\t\t\t\t\t( _, index ) =>\n\t\t\t\t\t\t\t\t\t\t`${ descriptionId }-${ index }`\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t.join( ' ' )\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ isEmpty && __( 'Empty pattern' ) }\n\t\t\t\t{ ! isEmpty && <BlockPreview blocks={ item.blocks } /> }\n\t\t\t</button>\n\t\t\t{ ariaDescriptions.map( ( ariaDescription, index ) => (\n\t\t\t\t<div\n\t\t\t\t\tkey={ index }\n\t\t\t\t\thidden\n\t\t\t\t\tid={ `${ descriptionId }-${ index }` }\n\t\t\t\t>\n\t\t\t\t\t{ ariaDescription }\n\t\t\t\t</div>\n\t\t\t) ) }\n\t\t\t<HStack\n\t\t\t\tclassName=\"edit-site-patterns__footer\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\talignment=\"center\"\n\t\t\t\t\tjustify=\"left\"\n\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\tclassName=\"edit-site-patterns__pattern-title\"\n\t\t\t\t>\n\t\t\t\t\t{ itemIcon && (\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tposition=\"top center\"\n\t\t\t\t\t\t\ttext={ __(\n\t\t\t\t\t\t\t\t'Editing this pattern will also update anywhere it is used'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-patterns__pattern-icon\"\n\t\t\t\t\t\t\t\t\ticon={ itemIcon }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) }\n\t\t\t\t\t<Flex as=\"span\" gap={ 0 } justify=\"left\">\n\t\t\t\t\t\t{ item.type === PATTERNS ? (\n\t\t\t\t\t\t\titem.title\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Heading level={ 5 }>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\t\t\t\t// Required for the grid's roving tab index system.\n\t\t\t\t\t\t\t\t\t// See https://github.com/WordPress/gutenberg/pull/51898#discussion_r1243399243.\n\t\t\t\t\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ item.title }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ item.type === PATTERNS && (\n\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\tposition=\"top center\"\n\t\t\t\t\t\t\t\ttext={ __(\n\t\t\t\t\t\t\t\t\t'Theme patterns cannot be edited.'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span className=\"edit-site-patterns__pattern-lock-icon\">\n\t\t\t\t\t\t\t\t\t<Icon icon={ lockSmall } size={ 24 } />\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Flex>\n\t\t\t\t</HStack>\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ticon={ moreHorizontal }\n\t\t\t\t\tlabel={ __( 'Actions' ) }\n\t\t\t\t\tclassName=\"edit-site-patterns__dropdown\"\n\t\t\t\t\tpopoverProps={ { placement: 'bottom-end' } }\n\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\tclassName: 'edit-site-patterns__button',\n\t\t\t\t\t\tisSmall: true,\n\t\t\t\t\t\tdescribedBy: sprintf(\n\t\t\t\t\t\t\t/* translators: %s: pattern name */\n\t\t\t\t\t\t\t__( 'Action menu for %s pattern' ),\n\t\t\t\t\t\t\titem.title\n\t\t\t\t\t\t),\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ ( { onClose } ) => (\n\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t{ isCustomPattern && ! hasThemeFile && (\n\t\t\t\t\t\t\t\t<RenameMenuItem\n\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<DuplicateMenuItem\n\t\t\t\t\t\t\t\tcategoryId={ categoryId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\tisNonUserPattern\n\t\t\t\t\t\t\t\t\t\t? __( 'Copy to My patterns' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Duplicate' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ isCustomPattern && (\n\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\tsetIsDeleteDialogOpen( true )\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\t\t{ hasThemeFile\n\t\t\t\t\t\t\t\t\t\t? __( 'Clear customizations' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Delete' ) }\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenu>\n\t\t\t</HStack>\n\n\t\t\t{ isDeleteDialogOpen && (\n\t\t\t\t<ConfirmDialog\n\t\t\t\t\tconfirmButtonText={ confirmButtonText }\n\t\t\t\t\tonConfirm={ deleteItem }\n\t\t\t\t\tonCancel={ () => setIsDeleteDialogOpen( false ) }\n\t\t\t\t>\n\t\t\t\t\t{ confirmPrompt }\n\t\t\t\t</ConfirmDialog>\n\t\t\t) }\n\t\t</li>\n\t);\n}\n\nexport default memo( GridItem );\n"]}

package/build-module/components/page-patterns/grid.js

@@ -1,38 +1,45 @@
-import { createElement } from "@wordpress/element";
+import { createElement, Fragment } from "@wordpress/element";
 
 /**
  * WordPress dependencies
  */
-import { __unstableComposite as Composite, __unstableUseCompositeState as useCompositeState } from '@wordpress/components';
+import { __experimentalText as Text } from '@wordpress/components';
+import { useRef } from '@wordpress/element';
+import { __, sprintf } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
 
 import GridItem from './grid-item';
+const PAGE_SIZE = 100;
 export default function Grid({
   categoryId,
-  label,
-  icon,
-  items
+  items,
+  ...props
 }) {
-  const composite = useCompositeState({
-    orientation: 'vertical'
-  });
+  const gridRef = useRef();
 
   if (!items?.length) {
     return null;
   }
 
-  return createElement(Composite, { ...composite,
+  const list = items.slice(0, PAGE_SIZE);
+  const restLength = items.length - PAGE_SIZE;
+  return createElement(Fragment, null, createElement("ul", {
     role: "listbox",
     className: "edit-site-patterns__grid",
-    "aria-label": label
-  }, items.map(item => createElement(GridItem, {
+    ...props,
+    ref: gridRef
+  }, list.map(item => createElement(GridItem, {
     key: item.name,
-    icon: icon,
     item: item,
-    categoryId: categoryId,
-    composite: composite
-  })));
+    categoryId: categoryId
+  }))), restLength > 0 && createElement(Text, {
+    variant: "muted",
+    as: "p",
+    align: "center"
+  }, sprintf(
+  /* translators: %d: number of patterns */
+  __('+ %d more patterns discoverable by searching'), restLength)));
 }
 //# sourceMappingURL=grid.js.map

package/build-module/components/page-patterns/grid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/grid.js"],"names":["__unstableComposite","Composite","__unstableUseCompositeState","useCompositeState","GridItem","Grid","categoryId","label","icon","items","composite","orientation","length","map","item","name"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,mBAAmB,IAAIC,SADxB,EAECC,2BAA2B,IAAIC,iBAFhC,QAGO,uBAHP;AAKA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,aAArB;AAEA,eAAe,SAASC,IAAT,CAAe;AAAEC,EAAAA,UAAF;AAAcC,EAAAA,KAAd;AAAqBC,EAAAA,IAArB;AAA2BC,EAAAA;AAA3B,CAAf,EAAoD;AAClE,QAAMC,SAAS,GAAGP,iBAAiB,CAAE;AAAEQ,IAAAA,WAAW,EAAE;AAAf,GAAF,CAAnC;;AAEA,MAAK,CAAEF,KAAK,EAAEG,MAAd,EAAuB;AACtB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,SAAD,OACMF,SADN;AAEC,IAAA,IAAI,EAAC,SAFN;AAGC,IAAA,SAAS,EAAC,0BAHX;AAIC,kBAAaH;AAJd,KAMGE,KAAK,CAACI,GAAN,CAAaC,IAAF,IACZ,cAAC,QAAD;AACC,IAAA,GAAG,EAAGA,IAAI,CAACC,IADZ;AAEC,IAAA,IAAI,EAAGP,IAFR;AAGC,IAAA,IAAI,EAAGM,IAHR;AAIC,IAAA,UAAU,EAAGR,UAJd;AAKC,IAAA,SAAS,EAAGI;AALb,IADC,CANH,CADD;AAkBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport GridItem from './grid-item';\n\nexport default function Grid( { categoryId, label, icon, items } ) {\n\tconst composite = useCompositeState( { orientation: 'vertical' } );\n\n\tif ( ! items?.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"edit-site-patterns__grid\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ items.map( ( item ) => (\n\t\t\t\t<GridItem\n\t\t\t\t\tkey={ item.name }\n\t\t\t\t\ticon={ icon }\n\t\t\t\t\titem={ item }\n\t\t\t\t\tcategoryId={ categoryId }\n\t\t\t\t\tcomposite={ composite }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/grid.js"],"names":["__experimentalText","Text","useRef","__","sprintf","GridItem","PAGE_SIZE","Grid","categoryId","items","props","gridRef","length","list","slice","restLength","map","item","name"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,kBAAkB,IAAIC,IAA/B,QAA2C,uBAA3C;AACA,SAASC,MAAT,QAAuB,oBAAvB;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,aAArB;AAEA,MAAMC,SAAS,GAAG,GAAlB;AAEA,eAAe,SAASC,IAAT,CAAe;AAAEC,EAAAA,UAAF;AAAcC,EAAAA,KAAd;AAAqB,KAAGC;AAAxB,CAAf,EAAiD;AAC/D,QAAMC,OAAO,GAAGT,MAAM,EAAtB;;AAEA,MAAK,CAAEO,KAAK,EAAEG,MAAd,EAAuB;AACtB,WAAO,IAAP;AACA;;AAED,QAAMC,IAAI,GAAGJ,KAAK,CAACK,KAAN,CAAa,CAAb,EAAgBR,SAAhB,CAAb;AACA,QAAMS,UAAU,GAAGN,KAAK,CAACG,MAAN,GAAeN,SAAlC;AAEA,SACC,8BACC;AACC,IAAA,IAAI,EAAC,SADN;AAEC,IAAA,SAAS,EAAC,0BAFX;AAAA,OAGMI,KAHN;AAIC,IAAA,GAAG,EAAGC;AAJP,KAMGE,IAAI,CAACG,GAAL,CAAYC,IAAF,IACX,cAAC,QAAD;AACC,IAAA,GAAG,EAAGA,IAAI,CAACC,IADZ;AAEC,IAAA,IAAI,EAAGD,IAFR;AAGC,IAAA,UAAU,EAAGT;AAHd,IADC,CANH,CADD,EAeGO,UAAU,GAAG,CAAb,IACD,cAAC,IAAD;AAAM,IAAA,OAAO,EAAC,OAAd;AAAsB,IAAA,EAAE,EAAC,GAAzB;AAA6B,IAAA,KAAK,EAAC;AAAnC,KACGX,OAAO;AACR;AACAD,EAAAA,EAAE,CAAE,8CAAF,CAFM,EAGRY,UAHQ,CADV,CAhBF,CADD;AA2BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalText as Text } from '@wordpress/components';\nimport { useRef } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport GridItem from './grid-item';\n\nconst PAGE_SIZE = 100;\n\nexport default function Grid( { categoryId, items, ...props } ) {\n\tconst gridRef = useRef();\n\n\tif ( ! items?.length ) {\n\t\treturn null;\n\t}\n\n\tconst list = items.slice( 0, PAGE_SIZE );\n\tconst restLength = items.length - PAGE_SIZE;\n\n\treturn (\n\t\t<>\n\t\t\t<ul\n\t\t\t\trole=\"listbox\"\n\t\t\t\tclassName=\"edit-site-patterns__grid\"\n\t\t\t\t{ ...props }\n\t\t\t\tref={ gridRef }\n\t\t\t>\n\t\t\t\t{ list.map( ( item ) => (\n\t\t\t\t\t<GridItem\n\t\t\t\t\t\tkey={ item.name }\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tcategoryId={ categoryId }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t\t{ restLength > 0 && (\n\t\t\t\t<Text variant=\"muted\" as=\"p\" align=\"center\">\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t/* translators: %d: number of patterns */\n\t\t\t\t\t\t__( '+ %d more patterns discoverable by searching' ),\n\t\t\t\t\t\trestLength\n\t\t\t\t\t) }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}

package/build-module/components/page-patterns/header.js

@@ -0,0 +1,54 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalVStack as VStack, __experimentalHeading as Heading, __experimentalText as Text } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+import { store as editorStore } from '@wordpress/editor';
+import { useSelect } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+
+import usePatternCategories from '../sidebar-navigation-screen-patterns/use-pattern-categories';
+import { USER_PATTERN_CATEGORY, USER_PATTERNS, TEMPLATE_PARTS, PATTERNS } from './utils';
+export default function PatternsHeader({
+  categoryId,
+  type,
+  titleId,
+  descriptionId
+}) {
+  const {
+    patternCategories
+  } = usePatternCategories();
+  const templatePartAreas = useSelect(select => select(editorStore).__experimentalGetDefaultTemplatePartAreas(), []);
+  let title, description;
+
+  if (categoryId === USER_PATTERN_CATEGORY && type === USER_PATTERNS) {
+    title = __('My Patterns');
+    description = '';
+  } else if (type === TEMPLATE_PARTS) {
+    const templatePartArea = templatePartAreas.find(area => area.area === categoryId);
+    title = templatePartArea?.label;
+    description = templatePartArea?.description;
+  } else if (type === PATTERNS) {
+    const patternCategory = patternCategories.find(category => category.name === categoryId);
+    title = patternCategory?.label;
+    description = patternCategory?.description;
+  }
+
+  if (!title) return null;
+  return createElement(VStack, {
+    className: "edit-site-patterns__section-header"
+  }, createElement(Heading, {
+    as: "h2",
+    level: 4,
+    id: titleId
+  }, title), description ? createElement(Text, {
+    variant: "muted",
+    as: "p",
+    id: descriptionId
+  }, description) : null);
+}
+//# sourceMappingURL=header.js.map

package/build-module/components/page-patterns/header.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/header.js"],"names":["__experimentalVStack","VStack","__experimentalHeading","Heading","__experimentalText","Text","__","store","editorStore","useSelect","usePatternCategories","USER_PATTERN_CATEGORY","USER_PATTERNS","TEMPLATE_PARTS","PATTERNS","PatternsHeader","categoryId","type","titleId","descriptionId","patternCategories","templatePartAreas","select","__experimentalGetDefaultTemplatePartAreas","title","description","templatePartArea","find","area","label","patternCategory","category","name"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,oBAAoB,IAAIC,MADzB,EAECC,qBAAqB,IAAIC,OAF1B,EAGCC,kBAAkB,IAAIC,IAHvB,QAIO,uBAJP;AAKA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,KAAK,IAAIC,WAAlB,QAAqC,mBAArC;AACA,SAASC,SAAT,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,OAAOC,oBAAP,MAAiC,8DAAjC;AACA,SACCC,qBADD,EAECC,aAFD,EAGCC,cAHD,EAICC,QAJD,QAKO,SALP;AAOA,eAAe,SAASC,cAAT,CAAyB;AACvCC,EAAAA,UADuC;AAEvCC,EAAAA,IAFuC;AAGvCC,EAAAA,OAHuC;AAIvCC,EAAAA;AAJuC,CAAzB,EAKX;AACH,QAAM;AAAEC,IAAAA;AAAF,MAAwBV,oBAAoB,EAAlD;AACA,QAAMW,iBAAiB,GAAGZ,SAAS,CAChCa,MAAF,IACCA,MAAM,CAAEd,WAAF,CAAN,CAAsBe,yCAAtB,EAFiC,EAGlC,EAHkC,CAAnC;AAMA,MAAIC,KAAJ,EAAWC,WAAX;;AACA,MAAKT,UAAU,KAAKL,qBAAf,IAAwCM,IAAI,KAAKL,aAAtD,EAAsE;AACrEY,IAAAA,KAAK,GAAGlB,EAAE,CAAE,aAAF,CAAV;AACAmB,IAAAA,WAAW,GAAG,EAAd;AACA,GAHD,MAGO,IAAKR,IAAI,KAAKJ,cAAd,EAA+B;AACrC,UAAMa,gBAAgB,GAAGL,iBAAiB,CAACM,IAAlB,CACtBC,IAAF,IAAYA,IAAI,CAACA,IAAL,KAAcZ,UADF,CAAzB;AAGAQ,IAAAA,KAAK,GAAGE,gBAAgB,EAAEG,KAA1B;AACAJ,IAAAA,WAAW,GAAGC,gBAAgB,EAAED,WAAhC;AACA,GANM,MAMA,IAAKR,IAAI,KAAKH,QAAd,EAAyB;AAC/B,UAAMgB,eAAe,GAAGV,iBAAiB,CAACO,IAAlB,CACrBI,QAAF,IAAgBA,QAAQ,CAACC,IAAT,KAAkBhB,UADX,CAAxB;AAGAQ,IAAAA,KAAK,GAAGM,eAAe,EAAED,KAAzB;AACAJ,IAAAA,WAAW,GAAGK,eAAe,EAAEL,WAA/B;AACA;;AAED,MAAK,CAAED,KAAP,EAAe,OAAO,IAAP;AAEf,SACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACC,cAAC,OAAD;AAAS,IAAA,EAAE,EAAC,IAAZ;AAAiB,IAAA,KAAK,EAAG,CAAzB;AAA6B,IAAA,EAAE,EAAGN;AAAlC,KACGM,KADH,CADD,EAIGC,WAAW,GACZ,cAAC,IAAD;AAAM,IAAA,OAAO,EAAC,OAAd;AAAsB,IAAA,EAAE,EAAC,GAAzB;AAA6B,IAAA,EAAE,EAAGN;AAAlC,KACGM,WADH,CADY,GAIT,IARL,CADD;AAYA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHeading as Heading,\n\t__experimentalText as Text,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { store as editorStore } from '@wordpress/editor';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport usePatternCategories from '../sidebar-navigation-screen-patterns/use-pattern-categories';\nimport {\n\tUSER_PATTERN_CATEGORY,\n\tUSER_PATTERNS,\n\tTEMPLATE_PARTS,\n\tPATTERNS,\n} from './utils';\n\nexport default function PatternsHeader( {\n\tcategoryId,\n\ttype,\n\ttitleId,\n\tdescriptionId,\n} ) {\n\tconst { patternCategories } = usePatternCategories();\n\tconst templatePartAreas = useSelect(\n\t\t( select ) =>\n\t\t\tselect( editorStore ).__experimentalGetDefaultTemplatePartAreas(),\n\t\t[]\n\t);\n\n\tlet title, description;\n\tif ( categoryId === USER_PATTERN_CATEGORY && type === USER_PATTERNS ) {\n\t\ttitle = __( 'My Patterns' );\n\t\tdescription = '';\n\t} else if ( type === TEMPLATE_PARTS ) {\n\t\tconst templatePartArea = templatePartAreas.find(\n\t\t\t( area ) => area.area === categoryId\n\t\t);\n\t\ttitle = templatePartArea?.label;\n\t\tdescription = templatePartArea?.description;\n\t} else if ( type === PATTERNS ) {\n\t\tconst patternCategory = patternCategories.find(\n\t\t\t( category ) => category.name === categoryId\n\t\t);\n\t\ttitle = patternCategory?.label;\n\t\tdescription = patternCategory?.description;\n\t}\n\n\tif ( ! title ) return null;\n\n\treturn (\n\t\t<VStack className=\"edit-site-patterns__section-header\">\n\t\t\t<Heading as=\"h2\" level={ 4 } id={ titleId }>\n\t\t\t\t{ title }\n\t\t\t</Heading>\n\t\t\t{ description ? (\n\t\t\t\t<Text variant=\"muted\" as=\"p\" id={ descriptionId }>\n\t\t\t\t\t{ description }\n\t\t\t\t</Text>\n\t\t\t) : null }\n\t\t</VStack>\n\t);\n}\n"]}

package/build-module/components/page-patterns/index.js

@@ -35,7 +35,9 @@ export default function PagePatterns() {
     className: "edit-site-patterns",
     title: __('Patterns content'),
     hideTitleFromUI: true
-  }, createElement(PatternsList, {
+  }, createElement(PatternsList // Reset the states when switching between categories and types.
+  , {
+    key: `${type}-${category}`,
     type: type,
     categoryId: category
   })));

package/build-module/components/page-patterns/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/index.js"],"names":["__","privateApis","blockEditorPrivateApis","getQueryArgs","DEFAULT_CATEGORY","DEFAULT_TYPE","Page","PatternsList","usePatternSettings","unlock","ExperimentalBlockEditorProvider","PagePatterns","categoryType","categoryId","window","location","href","type","category","settings"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,WAAW,IAAIC,sBAAxB,QAAsD,yBAAtD;AACA,SAASC,YAAT,QAA6B,gBAA7B;AAEA;AACA;AACA;;AACA,SAASC,gBAAT,EAA2BC,YAA3B,QAA+C,SAA/C;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,YAAP,MAAyB,iBAAzB;AACA,OAAOC,kBAAP,MAA+B,wBAA/B;AACA,SAASC,MAAT,QAAuB,mBAAvB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAsCD,MAAM,CAAEP,sBAAF,CAAlD;AAEA,eAAe,SAASS,YAAT,GAAwB;AACtC,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MAA+BV,YAAY,CAAEW,MAAM,CAACC,QAAP,CAAgBC,IAAlB,CAAjD;AACA,QAAMC,IAAI,GAAGL,YAAY,IAAIP,YAA7B;AACA,QAAMa,QAAQ,GAAGL,UAAU,IAAIT,gBAA/B;AACA,QAAMe,QAAQ,GAAGX,kBAAkB,EAAnC,CAJsC,CAMtC;AACA;AACA;;AACA,SACC,cAAC,+BAAD;AAAiC,IAAA,QAAQ,EAAGW;AAA5C,KACC,cAAC,IAAD;AACC,IAAA,SAAS,EAAC,oBADX;AAEC,IAAA,KAAK,EAAGnB,EAAE,CAAE,kBAAF,CAFX;AAGC,IAAA,eAAe;AAHhB,KAKC,cAAC,YAAD;AAAc,IAAA,IAAI,EAAGiB,IAArB;AAA4B,IAAA,UAAU,EAAGC;AAAzC,IALD,CADD,CADD;AAWA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { getQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport { DEFAULT_CATEGORY, DEFAULT_TYPE } from './utils';\nimport Page from '../page';\nimport PatternsList from './patterns-list';\nimport usePatternSettings from './use-pattern-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis );\n\nexport default function PagePatterns() {\n\tconst { categoryType, categoryId } = getQueryArgs( window.location.href );\n\tconst type = categoryType || DEFAULT_TYPE;\n\tconst category = categoryId || DEFAULT_CATEGORY;\n\tconst settings = usePatternSettings();\n\n\t// Wrap everything in a block editor provider.\n\t// This ensures 'styles' that are needed for the previews are synced\n\t// from the site editor store to the block editor store.\n\treturn (\n\t\t<ExperimentalBlockEditorProvider settings={ settings }>\n\t\t\t<Page\n\t\t\t\tclassName=\"edit-site-patterns\"\n\t\t\t\ttitle={ __( 'Patterns content' ) }\n\t\t\t\thideTitleFromUI\n\t\t\t>\n\t\t\t\t<PatternsList type={ type } categoryId={ category } />\n\t\t\t</Page>\n\t\t</ExperimentalBlockEditorProvider>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-patterns/index.js"],"names":["__","privateApis","blockEditorPrivateApis","getQueryArgs","DEFAULT_CATEGORY","DEFAULT_TYPE","Page","PatternsList","usePatternSettings","unlock","ExperimentalBlockEditorProvider","PagePatterns","categoryType","categoryId","window","location","href","type","category","settings"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,WAAW,IAAIC,sBAAxB,QAAsD,yBAAtD;AACA,SAASC,YAAT,QAA6B,gBAA7B;AAEA;AACA;AACA;;AACA,SAASC,gBAAT,EAA2BC,YAA3B,QAA+C,SAA/C;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,YAAP,MAAyB,iBAAzB;AACA,OAAOC,kBAAP,MAA+B,wBAA/B;AACA,SAASC,MAAT,QAAuB,mBAAvB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAsCD,MAAM,CAAEP,sBAAF,CAAlD;AAEA,eAAe,SAASS,YAAT,GAAwB;AACtC,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MAA+BV,YAAY,CAAEW,MAAM,CAACC,QAAP,CAAgBC,IAAlB,CAAjD;AACA,QAAMC,IAAI,GAAGL,YAAY,IAAIP,YAA7B;AACA,QAAMa,QAAQ,GAAGL,UAAU,IAAIT,gBAA/B;AACA,QAAMe,QAAQ,GAAGX,kBAAkB,EAAnC,CAJsC,CAMtC;AACA;AACA;;AACA,SACC,cAAC,+BAAD;AAAiC,IAAA,QAAQ,EAAGW;AAA5C,KACC,cAAC,IAAD;AACC,IAAA,SAAS,EAAC,oBADX;AAEC,IAAA,KAAK,EAAGnB,EAAE,CAAE,kBAAF,CAFX;AAGC,IAAA,eAAe;AAHhB,KAKC,cAAC,YAAD,CACC;AADD;AAEC,IAAA,GAAG,EAAI,GAAGiB,IAAM,IAAIC,QAAU,EAF/B;AAGC,IAAA,IAAI,EAAGD,IAHR;AAIC,IAAA,UAAU,EAAGC;AAJd,IALD,CADD,CADD;AAgBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { getQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport { DEFAULT_CATEGORY, DEFAULT_TYPE } from './utils';\nimport Page from '../page';\nimport PatternsList from './patterns-list';\nimport usePatternSettings from './use-pattern-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis );\n\nexport default function PagePatterns() {\n\tconst { categoryType, categoryId } = getQueryArgs( window.location.href );\n\tconst type = categoryType || DEFAULT_TYPE;\n\tconst category = categoryId || DEFAULT_CATEGORY;\n\tconst settings = usePatternSettings();\n\n\t// Wrap everything in a block editor provider.\n\t// This ensures 'styles' that are needed for the previews are synced\n\t// from the site editor store to the block editor store.\n\treturn (\n\t\t<ExperimentalBlockEditorProvider settings={ settings }>\n\t\t\t<Page\n\t\t\t\tclassName=\"edit-site-patterns\"\n\t\t\t\ttitle={ __( 'Patterns content' ) }\n\t\t\t\thideTitleFromUI\n\t\t\t>\n\t\t\t\t<PatternsList\n\t\t\t\t\t// Reset the states when switching between categories and types.\n\t\t\t\t\tkey={ `${ type }-${ category }` }\n\t\t\t\t\ttype={ type }\n\t\t\t\t\tcategoryId={ category }\n\t\t\t\t/>\n\t\t\t</Page>\n\t\t</ExperimentalBlockEditorProvider>\n\t);\n}\n"]}