@wordpress/block-editor 15.5.0 → 15.5.1-next.47f435fc9.0

package/build-module/components/block-patterns-list/index.js

@@ -1,40 +1,25 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
-/**
- * WordPress dependencies
- */
-import { cloneBlock } from '@wordpress/blocks';
-import { useEffect, useState, forwardRef, useMemo } from '@wordpress/element';
-import { Composite, VisuallyHidden, Tooltip, __experimentalHStack as HStack } from '@wordpress/components';
-import { useInstanceId } from '@wordpress/compose';
-import { __ } from '@wordpress/i18n';
-import { Icon, symbol } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import BlockPreview from '../block-preview';
-import InserterDraggableBlocks from '../inserter-draggable-blocks';
-import BlockPatternsPaging from '../block-patterns-paging';
-import { INSERTER_PATTERN_TYPES } from '../inserter/block-patterns-tab/utils';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-const WithToolTip = ({
-  showTooltip,
-  title,
-  children
-}) => {
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { cloneBlock } from "@wordpress/blocks";
+import { useEffect, useState, forwardRef, useMemo } from "@wordpress/element";
+import {
+  Composite,
+  VisuallyHidden,
+  Tooltip,
+  __experimentalHStack as HStack
+} from "@wordpress/components";
+import { useInstanceId } from "@wordpress/compose";
+import { __ } from "@wordpress/i18n";
+import { Icon, symbol } from "@wordpress/icons";
+import BlockPreview from "../block-preview";
+import InserterDraggableBlocks from "../inserter-draggable-blocks";
+import BlockPatternsPaging from "../block-patterns-paging";
+import { INSERTER_PATTERN_TYPES } from "../inserter/block-patterns-tab/utils";
+const WithToolTip = ({ showTooltip, title, children }) => {
   if (showTooltip) {
-    return /*#__PURE__*/_jsx(Tooltip, {
-      text: title,
-      children: children
-    });
+    return /* @__PURE__ */ jsx(Tooltip, { text: title, children });
   }
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: children
-  });
+  return /* @__PURE__ */ jsx(Fragment, { children });
 };
 function BlockPattern({
   id,
@@ -47,111 +32,127 @@ function BlockPattern({
   isSelected
 }) {
   const [isDragging, setIsDragging] = useState(false);
-  const {
-    blocks,
-    viewportWidth
-  } = pattern;
+  const { blocks, viewportWidth } = pattern;
   const instanceId = useInstanceId(BlockPattern);
   const descriptionId = `block-editor-block-patterns-list__item-description-${instanceId}`;
   const isUserPattern = pattern.type === INSERTER_PATTERN_TYPES.user;
-
-  // When we have a selected category and the pattern is draggable, we need to update the
-  // pattern's categories in metadata to only contain the selected category, and pass this to
-  // InserterDraggableBlocks component. We do that because we use this information for pattern
-  // shuffling and it makes more sense to show only the ones from the initially selected category during insertion.
   const patternBlocks = useMemo(() => {
     if (!category || !isDraggable) {
       return blocks;
     }
-    return (blocks !== null && blocks !== void 0 ? blocks : []).map(block => {
+    return (blocks ?? []).map((block) => {
       const clonedBlock = cloneBlock(block);
-      if (clonedBlock.attributes.metadata?.categories?.includes(category)) {
+      if (clonedBlock.attributes.metadata?.categories?.includes(
+        category
+      )) {
         clonedBlock.attributes.metadata.categories = [category];
       }
       return clonedBlock;
     });
   }, [blocks, isDraggable, category]);
-  return /*#__PURE__*/_jsx(InserterDraggableBlocks, {
-    isEnabled: isDraggable,
-    blocks: patternBlocks,
-    pattern: pattern,
-    children: ({
-      draggable,
-      onDragStart,
-      onDragEnd
-    }) => /*#__PURE__*/_jsx("div", {
-      className: "block-editor-block-patterns-list__list-item",
-      draggable: draggable,
-      onDragStart: event => {
-        setIsDragging(true);
-        if (onDragStart) {
-          onHover?.(null);
-          onDragStart(event);
-        }
-      },
-      onDragEnd: event => {
-        setIsDragging(false);
-        if (onDragEnd) {
-          onDragEnd(event);
-        }
-      },
-      children: /*#__PURE__*/_jsx(WithToolTip, {
-        showTooltip: showTitlesAsTooltip && !isUserPattern,
-        title: pattern.title,
-        children: /*#__PURE__*/_jsxs(Composite.Item, {
-          render: /*#__PURE__*/_jsx("div", {
-            role: "option",
-            "aria-label": pattern.title,
-            "aria-describedby": pattern.description ? descriptionId : undefined,
-            className: clsx('block-editor-block-patterns-list__item', {
-              'block-editor-block-patterns-list__list-item-synced': pattern.type === INSERTER_PATTERN_TYPES.user && !pattern.syncStatus,
-              'is-selected': isSelected
-            })
-          }),
-          id: id,
-          onClick: () => {
-            onClick(pattern, blocks);
-            onHover?.(null);
+  return /* @__PURE__ */ jsx(
+    InserterDraggableBlocks,
+    {
+      isEnabled: isDraggable,
+      blocks: patternBlocks,
+      pattern,
+      children: ({ draggable, onDragStart, onDragEnd }) => /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "block-editor-block-patterns-list__list-item",
+          draggable,
+          onDragStart: (event) => {
+            setIsDragging(true);
+            if (onDragStart) {
+              onHover?.(null);
+              onDragStart(event);
+            }
           },
-          onMouseEnter: () => {
-            if (isDragging) {
-              return;
+          onDragEnd: (event) => {
+            setIsDragging(false);
+            if (onDragEnd) {
+              onDragEnd(event);
             }
-            onHover?.(pattern);
           },
-          onMouseLeave: () => onHover?.(null),
-          children: [/*#__PURE__*/_jsx(BlockPreview.Async, {
-            placeholder: /*#__PURE__*/_jsx(BlockPatternPlaceholder, {}),
-            children: /*#__PURE__*/_jsx(BlockPreview, {
-              blocks: blocks,
-              viewportWidth: viewportWidth
-            })
-          }), (!showTitlesAsTooltip || isUserPattern) && /*#__PURE__*/_jsxs(HStack, {
-            className: "block-editor-patterns__pattern-details",
-            spacing: 2,
-            children: [isUserPattern && !pattern.syncStatus && /*#__PURE__*/_jsx("div", {
-              className: "block-editor-patterns__pattern-icon-wrapper",
-              children: /*#__PURE__*/_jsx(Icon, {
-                className: "block-editor-patterns__pattern-icon",
-                icon: symbol
-              })
-            }), /*#__PURE__*/_jsx("div", {
-              className: "block-editor-block-patterns-list__item-title",
-              children: pattern.title
-            })]
-          }), !!pattern.description && /*#__PURE__*/_jsx(VisuallyHidden, {
-            id: descriptionId,
-            children: pattern.description
-          })]
-        })
-      })
-    })
-  });
+          children: /* @__PURE__ */ jsx(
+            WithToolTip,
+            {
+              showTooltip: showTitlesAsTooltip && !isUserPattern,
+              title: pattern.title,
+              children: /* @__PURE__ */ jsxs(
+                Composite.Item,
+                {
+                  render: /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      role: "option",
+                      "aria-label": pattern.title,
+                      "aria-describedby": pattern.description ? descriptionId : void 0,
+                      className: clsx(
+                        "block-editor-block-patterns-list__item",
+                        {
+                          "block-editor-block-patterns-list__list-item-synced": pattern.type === INSERTER_PATTERN_TYPES.user && !pattern.syncStatus,
+                          "is-selected": isSelected
+                        }
+                      )
+                    }
+                  ),
+                  id,
+                  onClick: () => {
+                    onClick(pattern, blocks);
+                    onHover?.(null);
+                  },
+                  onMouseEnter: () => {
+                    if (isDragging) {
+                      return;
+                    }
+                    onHover?.(pattern);
+                  },
+                  onMouseLeave: () => onHover?.(null),
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      BlockPreview.Async,
+                      {
+                        placeholder: /* @__PURE__ */ jsx(BlockPatternPlaceholder, {}),
+                        children: /* @__PURE__ */ jsx(
+                          BlockPreview,
+                          {
+                            blocks,
+                            viewportWidth
+                          }
+                        )
+                      }
+                    ),
+                    (!showTitlesAsTooltip || isUserPattern) && /* @__PURE__ */ jsxs(
+                      HStack,
+                      {
+                        className: "block-editor-patterns__pattern-details",
+                        spacing: 2,
+                        children: [
+                          isUserPattern && !pattern.syncStatus && /* @__PURE__ */ jsx("div", { className: "block-editor-patterns__pattern-icon-wrapper", children: /* @__PURE__ */ jsx(
+                            Icon,
+                            {
+                              className: "block-editor-patterns__pattern-icon",
+                              icon: symbol
+                            }
+                          ) }),
+                          /* @__PURE__ */ jsx("div", { className: "block-editor-block-patterns-list__item-title", children: pattern.title })
+                        ]
+                      }
+                    ),
+                    !!pattern.description && /* @__PURE__ */ jsx(VisuallyHidden, { id: descriptionId, children: pattern.description })
+                  ]
+                }
+              )
+            }
+          )
+        }
+      )
+    }
+  );
 }
 function BlockPatternPlaceholder() {
-  return /*#__PURE__*/_jsx("div", {
-    className: "block-editor-block-patterns-list__item is-placeholder"
-  });
+  return /* @__PURE__ */ jsx("div", { className: "block-editor-block-patterns-list__item is-placeholder" });
 }
 function BlockPatternsList({
   isDraggable,
@@ -159,18 +160,14 @@ function BlockPatternsList({
   onHover,
   onClickPattern,
   orientation,
-  label = __('Block patterns'),
+  label = __("Block patterns"),
   category,
   showTitlesAsTooltip,
   pagingProps
 }, ref) {
-  const [activeCompositeId, setActiveCompositeId] = useState(undefined);
-  const [activePattern, setActivePattern] = useState(null); // State to track active pattern
-
+  const [activeCompositeId, setActiveCompositeId] = useState(void 0);
+  const [activePattern, setActivePattern] = useState(null);
   useEffect(() => {
-    // Reset the active composite item whenever the available patterns change,
-    // to make sure that Composite widget can receive focus correctly when its
-    // composite items change. The first composite item will receive focus.
     const firstCompositeItemId = blockPatterns[0]?.name;
     setActiveCompositeId(firstCompositeItemId);
   }, [blockPatterns]);
@@ -178,27 +175,38 @@ function BlockPatternsList({
     setActivePattern(pattern.name);
     onClickPattern(pattern, blocks);
   };
-  return /*#__PURE__*/_jsxs(Composite, {
-    orientation: orientation,
-    activeId: activeCompositeId,
-    setActiveId: setActiveCompositeId,
-    role: "listbox",
-    className: "block-editor-block-patterns-list",
-    "aria-label": label,
-    ref: ref,
-    children: [blockPatterns.map(pattern => /*#__PURE__*/_jsx(BlockPattern, {
-      id: pattern.name,
-      pattern: pattern,
-      onClick: handleClickPattern,
-      onHover: onHover,
-      isDraggable: isDraggable,
-      showTitlesAsTooltip: showTitlesAsTooltip,
-      category: category,
-      isSelected: !!activePattern && activePattern === pattern.name
-    }, pattern.name)), pagingProps && /*#__PURE__*/_jsx(BlockPatternsPaging, {
-      ...pagingProps
-    })]
-  });
+  return /* @__PURE__ */ jsxs(
+    Composite,
+    {
+      orientation,
+      activeId: activeCompositeId,
+      setActiveId: setActiveCompositeId,
+      role: "listbox",
+      className: "block-editor-block-patterns-list",
+      "aria-label": label,
+      ref,
+      children: [
+        blockPatterns.map((pattern) => /* @__PURE__ */ jsx(
+          BlockPattern,
+          {
+            id: pattern.name,
+            pattern,
+            onClick: handleClickPattern,
+            onHover,
+            isDraggable,
+            showTitlesAsTooltip,
+            category,
+            isSelected: !!activePattern && activePattern === pattern.name
+          },
+          pattern.name
+        )),
+        pagingProps && /* @__PURE__ */ jsx(BlockPatternsPaging, { ...pagingProps })
+      ]
+    }
+  );
 }
-export default forwardRef(BlockPatternsList);
-//# sourceMappingURL=index.js.map
+var block_patterns_list_default = forwardRef(BlockPatternsList);
+export {
+  block_patterns_list_default as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["clsx","cloneBlock","useEffect","useState","forwardRef","useMemo","Composite","VisuallyHidden","Tooltip","__experimentalHStack","HStack","useInstanceId","__","Icon","symbol","BlockPreview","InserterDraggableBlocks","BlockPatternsPaging","INSERTER_PATTERN_TYPES","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","WithToolTip","showTooltip","title","children","text","BlockPattern","id","isDraggable","pattern","onClick","onHover","showTitlesAsTooltip","category","isSelected","isDragging","setIsDragging","blocks","viewportWidth","instanceId","descriptionId","isUserPattern","type","user","patternBlocks","map","block","clonedBlock","attributes","metadata","categories","includes","isEnabled","draggable","onDragStart","onDragEnd","className","event","Item","render","role","description","undefined","syncStatus","onMouseEnter","onMouseLeave","Async","placeholder","BlockPatternPlaceholder","spacing","icon","BlockPatternsList","blockPatterns","onClickPattern","orientation","label","pagingProps","ref","activeCompositeId","setActiveCompositeId","activePattern","setActivePattern","firstCompositeItemId","name","handleClickPattern","activeId","setActiveId"],"sources":["@wordpress/block-editor/src/components/block-patterns-list/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { cloneBlock } from '@wordpress/blocks';\nimport { useEffect, useState, forwardRef, useMemo } from '@wordpress/element';\nimport {\n\tComposite,\n\tVisuallyHidden,\n\tTooltip,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { Icon, symbol } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BlockPreview from '../block-preview';\nimport InserterDraggableBlocks from '../inserter-draggable-blocks';\nimport BlockPatternsPaging from '../block-patterns-paging';\nimport { INSERTER_PATTERN_TYPES } from '../inserter/block-patterns-tab/utils';\n\nconst WithToolTip = ( { showTooltip, title, children } ) => {\n\tif ( showTooltip ) {\n\t\treturn <Tooltip text={ title }>{ children }</Tooltip>;\n\t}\n\treturn <>{ children }</>;\n};\n\nfunction BlockPattern( {\n\tid,\n\tisDraggable,\n\tpattern,\n\tonClick,\n\tonHover,\n\tshowTitlesAsTooltip,\n\tcategory,\n\tisSelected,\n} ) {\n\tconst [ isDragging, setIsDragging ] = useState( false );\n\tconst { blocks, viewportWidth } = pattern;\n\tconst instanceId = useInstanceId( BlockPattern );\n\tconst descriptionId = `block-editor-block-patterns-list__item-description-${ instanceId }`;\n\tconst isUserPattern = pattern.type === INSERTER_PATTERN_TYPES.user;\n\n\t// When we have a selected category and the pattern is draggable, we need to update the\n\t// pattern's categories in metadata to only contain the selected category, and pass this to\n\t// InserterDraggableBlocks component. We do that because we use this information for pattern\n\t// shuffling and it makes more sense to show only the ones from the initially selected category during insertion.\n\tconst patternBlocks = useMemo( () => {\n\t\tif ( ! category || ! isDraggable ) {\n\t\t\treturn blocks;\n\t\t}\n\t\treturn ( blocks ?? [] ).map( ( block ) => {\n\t\t\tconst clonedBlock = cloneBlock( block );\n\t\t\tif (\n\t\t\t\tclonedBlock.attributes.metadata?.categories?.includes(\n\t\t\t\t\tcategory\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tclonedBlock.attributes.metadata.categories = [ category ];\n\t\t\t}\n\t\t\treturn clonedBlock;\n\t\t} );\n\t}, [ blocks, isDraggable, category ] );\n\n\treturn (\n\t\t<InserterDraggableBlocks\n\t\t\tisEnabled={ isDraggable }\n\t\t\tblocks={ patternBlocks }\n\t\t\tpattern={ pattern }\n\t\t>\n\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"block-editor-block-patterns-list__list-item\"\n\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\tonDragStart={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( true );\n\t\t\t\t\t\tif ( onDragStart ) {\n\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\tonDragStart( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tonDragEnd={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( false );\n\t\t\t\t\t\tif ( onDragEnd ) {\n\t\t\t\t\t\t\tonDragEnd( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<WithToolTip\n\t\t\t\t\t\tshowTooltip={ showTitlesAsTooltip && ! isUserPattern }\n\t\t\t\t\t\ttitle={ pattern.title }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\taria-label={ pattern.title }\n\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\tpattern.description\n\t\t\t\t\t\t\t\t\t\t\t? descriptionId\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__list-item-synced':\n\t\t\t\t\t\t\t\t\t\t\t\tpattern.type ===\n\t\t\t\t\t\t\t\t\t\t\t\t\tINSERTER_PATTERN_TYPES.user &&\n\t\t\t\t\t\t\t\t\t\t\t\t! pattern.syncStatus,\n\t\t\t\t\t\t\t\t\t\t\t'is-selected': isSelected,\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\tid={ id }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClick( pattern, blocks );\n\t\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseEnter={ () => {\n\t\t\t\t\t\t\t\tif ( isDragging ) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonHover?.( pattern );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseLeave={ () => onHover?.( null ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BlockPreview.Async\n\t\t\t\t\t\t\t\tplaceholder={ <BlockPatternPlaceholder /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</BlockPreview.Async>\n\t\t\t\t\t\t\t{ ( ! showTitlesAsTooltip || isUserPattern ) && (\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-details\"\n\t\t\t\t\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ isUserPattern && ! pattern.syncStatus && (\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-patterns__pattern-icon-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-icon\"\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ symbol }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-block-patterns-list__item-title\">\n\t\t\t\t\t\t\t\t\t\t{ pattern.title }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t{ !! pattern.description && (\n\t\t\t\t\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t\t\t\t\t{ pattern.description }\n\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Composite.Item>\n\t\t\t\t\t</WithToolTip>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</InserterDraggableBlocks>\n\t);\n}\n\nfunction BlockPatternPlaceholder() {\n\treturn (\n\t\t<div className=\"block-editor-block-patterns-list__item is-placeholder\" />\n\t);\n}\n\nfunction BlockPatternsList(\n\t{\n\t\tisDraggable,\n\t\tblockPatterns,\n\t\tonHover,\n\t\tonClickPattern,\n\t\torientation,\n\t\tlabel = __( 'Block patterns' ),\n\t\tcategory,\n\t\tshowTitlesAsTooltip,\n\t\tpagingProps,\n\t},\n\tref\n) {\n\tconst [ activeCompositeId, setActiveCompositeId ] = useState( undefined );\n\tconst [ activePattern, setActivePattern ] = useState( null ); // State to track active pattern\n\n\tuseEffect( () => {\n\t\t// Reset the active composite item whenever the available patterns change,\n\t\t// to make sure that Composite widget can receive focus correctly when its\n\t\t// composite items change. The first composite item will receive focus.\n\t\tconst firstCompositeItemId = blockPatterns[ 0 ]?.name;\n\t\tsetActiveCompositeId( firstCompositeItemId );\n\t}, [ blockPatterns ] );\n\n\tconst handleClickPattern = ( pattern, blocks ) => {\n\t\tsetActivePattern( pattern.name );\n\t\tonClickPattern( pattern, blocks );\n\t};\n\n\treturn (\n\t\t<Composite\n\t\t\torientation={ orientation }\n\t\t\tactiveId={ activeCompositeId }\n\t\t\tsetActiveId={ setActiveCompositeId }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-block-patterns-list\"\n\t\t\taria-label={ label }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ blockPatterns.map( ( pattern ) => (\n\t\t\t\t<BlockPattern\n\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\tid={ pattern.name }\n\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\tonClick={ handleClickPattern }\n\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\tisDraggable={ isDraggable }\n\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tisSelected={\n\t\t\t\t\t\t!! activePattern && activePattern === pattern.name\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t\t{ pagingProps && <BlockPatternsPaging { ...pagingProps } /> }\n\t\t</Composite>\n\t);\n}\n\nexport default forwardRef( BlockPatternsList );\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/block-patterns-list/index.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { cloneBlock } from '@wordpress/blocks';\nimport { useEffect, useState, forwardRef, useMemo } from '@wordpress/element';\nimport {\n\tComposite,\n\tVisuallyHidden,\n\tTooltip,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { Icon, symbol } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BlockPreview from '../block-preview';\nimport InserterDraggableBlocks from '../inserter-draggable-blocks';\nimport BlockPatternsPaging from '../block-patterns-paging';\nimport { INSERTER_PATTERN_TYPES } from '../inserter/block-patterns-tab/utils';\n\nconst WithToolTip = ( { showTooltip, title, children } ) => {\n\tif ( showTooltip ) {\n\t\treturn <Tooltip text={ title }>{ children }</Tooltip>;\n\t}\n\treturn <>{ children }</>;\n};\n\nfunction BlockPattern( {\n\tid,\n\tisDraggable,\n\tpattern,\n\tonClick,\n\tonHover,\n\tshowTitlesAsTooltip,\n\tcategory,\n\tisSelected,\n} ) {\n\tconst [ isDragging, setIsDragging ] = useState( false );\n\tconst { blocks, viewportWidth } = pattern;\n\tconst instanceId = useInstanceId( BlockPattern );\n\tconst descriptionId = `block-editor-block-patterns-list__item-description-${ instanceId }`;\n\tconst isUserPattern = pattern.type === INSERTER_PATTERN_TYPES.user;\n\n\t// When we have a selected category and the pattern is draggable, we need to update the\n\t// pattern's categories in metadata to only contain the selected category, and pass this to\n\t// InserterDraggableBlocks component. We do that because we use this information for pattern\n\t// shuffling and it makes more sense to show only the ones from the initially selected category during insertion.\n\tconst patternBlocks = useMemo( () => {\n\t\tif ( ! category || ! isDraggable ) {\n\t\t\treturn blocks;\n\t\t}\n\t\treturn ( blocks ?? [] ).map( ( block ) => {\n\t\t\tconst clonedBlock = cloneBlock( block );\n\t\t\tif (\n\t\t\t\tclonedBlock.attributes.metadata?.categories?.includes(\n\t\t\t\t\tcategory\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tclonedBlock.attributes.metadata.categories = [ category ];\n\t\t\t}\n\t\t\treturn clonedBlock;\n\t\t} );\n\t}, [ blocks, isDraggable, category ] );\n\n\treturn (\n\t\t<InserterDraggableBlocks\n\t\t\tisEnabled={ isDraggable }\n\t\t\tblocks={ patternBlocks }\n\t\t\tpattern={ pattern }\n\t\t>\n\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"block-editor-block-patterns-list__list-item\"\n\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\tonDragStart={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( true );\n\t\t\t\t\t\tif ( onDragStart ) {\n\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\tonDragStart( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tonDragEnd={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( false );\n\t\t\t\t\t\tif ( onDragEnd ) {\n\t\t\t\t\t\t\tonDragEnd( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<WithToolTip\n\t\t\t\t\t\tshowTooltip={ showTitlesAsTooltip && ! isUserPattern }\n\t\t\t\t\t\ttitle={ pattern.title }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\taria-label={ pattern.title }\n\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\tpattern.description\n\t\t\t\t\t\t\t\t\t\t\t? descriptionId\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__list-item-synced':\n\t\t\t\t\t\t\t\t\t\t\t\tpattern.type ===\n\t\t\t\t\t\t\t\t\t\t\t\t\tINSERTER_PATTERN_TYPES.user &&\n\t\t\t\t\t\t\t\t\t\t\t\t! pattern.syncStatus,\n\t\t\t\t\t\t\t\t\t\t\t'is-selected': isSelected,\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\tid={ id }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClick( pattern, blocks );\n\t\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseEnter={ () => {\n\t\t\t\t\t\t\t\tif ( isDragging ) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonHover?.( pattern );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseLeave={ () => onHover?.( null ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BlockPreview.Async\n\t\t\t\t\t\t\t\tplaceholder={ <BlockPatternPlaceholder /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</BlockPreview.Async>\n\t\t\t\t\t\t\t{ ( ! showTitlesAsTooltip || isUserPattern ) && (\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-details\"\n\t\t\t\t\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ isUserPattern && ! pattern.syncStatus && (\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-patterns__pattern-icon-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-icon\"\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ symbol }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-block-patterns-list__item-title\">\n\t\t\t\t\t\t\t\t\t\t{ pattern.title }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t{ !! pattern.description && (\n\t\t\t\t\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t\t\t\t\t{ pattern.description }\n\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Composite.Item>\n\t\t\t\t\t</WithToolTip>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</InserterDraggableBlocks>\n\t);\n}\n\nfunction BlockPatternPlaceholder() {\n\treturn (\n\t\t<div className=\"block-editor-block-patterns-list__item is-placeholder\" />\n\t);\n}\n\nfunction BlockPatternsList(\n\t{\n\t\tisDraggable,\n\t\tblockPatterns,\n\t\tonHover,\n\t\tonClickPattern,\n\t\torientation,\n\t\tlabel = __( 'Block patterns' ),\n\t\tcategory,\n\t\tshowTitlesAsTooltip,\n\t\tpagingProps,\n\t},\n\tref\n) {\n\tconst [ activeCompositeId, setActiveCompositeId ] = useState( undefined );\n\tconst [ activePattern, setActivePattern ] = useState( null ); // State to track active pattern\n\n\tuseEffect( () => {\n\t\t// Reset the active composite item whenever the available patterns change,\n\t\t// to make sure that Composite widget can receive focus correctly when its\n\t\t// composite items change. The first composite item will receive focus.\n\t\tconst firstCompositeItemId = blockPatterns[ 0 ]?.name;\n\t\tsetActiveCompositeId( firstCompositeItemId );\n\t}, [ blockPatterns ] );\n\n\tconst handleClickPattern = ( pattern, blocks ) => {\n\t\tsetActivePattern( pattern.name );\n\t\tonClickPattern( pattern, blocks );\n\t};\n\n\treturn (\n\t\t<Composite\n\t\t\torientation={ orientation }\n\t\t\tactiveId={ activeCompositeId }\n\t\t\tsetActiveId={ setActiveCompositeId }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-block-patterns-list\"\n\t\t\taria-label={ label }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ blockPatterns.map( ( pattern ) => (\n\t\t\t\t<BlockPattern\n\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\tid={ pattern.name }\n\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\tonClick={ handleClickPattern }\n\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\tisDraggable={ isDraggable }\n\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tisSelected={\n\t\t\t\t\t\t!! activePattern && activePattern === pattern.name\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t\t{ pagingProps && <BlockPatternsPaging { ...pagingProps } /> }\n\t\t</Composite>\n\t);\n}\n\nexport default forwardRef( BlockPatternsList );\n"],
+  "mappings": "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",
+  "names": []
+}

package/build-module/components/block-patterns-paging/index.js

@@ -1,88 +1,115 @@
-/**
- * WordPress dependencies
- */
-import { __experimentalVStack as VStack, __experimentalHStack as HStack, __experimentalText as Text, Button } from '@wordpress/components';
-import { __, _x, _n, sprintf } from '@wordpress/i18n';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function Pagination({
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  __experimentalVStack as VStack,
+  __experimentalHStack as HStack,
+  __experimentalText as Text,
+  Button
+} from "@wordpress/components";
+import { __, _x, _n, sprintf } from "@wordpress/i18n";
+function Pagination({
   currentPage,
   numPages,
   changePage,
   totalItems
 }) {
-  return /*#__PURE__*/_jsxs(VStack, {
-    className: "block-editor-patterns__grid-pagination-wrapper",
-    children: [/*#__PURE__*/_jsx(Text, {
-      variant: "muted",
-      children: sprintf(
+  return /* @__PURE__ */ jsxs(VStack, { className: "block-editor-patterns__grid-pagination-wrapper", children: [
+    /* @__PURE__ */ jsx(Text, { variant: "muted", children: sprintf(
       // translators: %s: Total number of patterns.
-      _n('%s item', '%s items', totalItems), totalItems)
-    }), numPages > 1 && /*#__PURE__*/_jsxs(HStack, {
-      expanded: false,
-      spacing: 3,
-      justify: "flex-start",
-      className: "block-editor-patterns__grid-pagination",
-      children: [/*#__PURE__*/_jsxs(HStack, {
+      _n("%s item", "%s items", totalItems),
+      totalItems
+    ) }),
+    numPages > 1 && /* @__PURE__ */ jsxs(
+      HStack,
+      {
         expanded: false,
-        spacing: 1,
-        className: "block-editor-patterns__grid-pagination-previous",
-        children: [/*#__PURE__*/_jsx(Button, {
-          variant: "tertiary",
-          onClick: () => changePage(1),
-          disabled: currentPage === 1,
-          "aria-label": __('First page'),
-          size: "compact",
-          accessibleWhenDisabled: true,
-          className: "block-editor-patterns__grid-pagination-button",
-          children: /*#__PURE__*/_jsx("span", {
-            children: "\xAB"
-          })
-        }), /*#__PURE__*/_jsx(Button, {
-          variant: "tertiary",
-          onClick: () => changePage(currentPage - 1),
-          disabled: currentPage === 1,
-          "aria-label": __('Previous page'),
-          size: "compact",
-          accessibleWhenDisabled: true,
-          className: "block-editor-patterns__grid-pagination-button",
-          children: /*#__PURE__*/_jsx("span", {
-            children: "\u2039"
-          })
-        })]
-      }), /*#__PURE__*/_jsx(Text, {
-        variant: "muted",
-        children: sprintf(
-        // translators: 1: Current page number. 2: Total number of pages.
-        _x('%1$s of %2$s', 'paging'), currentPage, numPages)
-      }), /*#__PURE__*/_jsxs(HStack, {
-        expanded: false,
-        spacing: 1,
-        className: "block-editor-patterns__grid-pagination-next",
-        children: [/*#__PURE__*/_jsx(Button, {
-          variant: "tertiary",
-          onClick: () => changePage(currentPage + 1),
-          disabled: currentPage === numPages,
-          "aria-label": __('Next page'),
-          size: "compact",
-          accessibleWhenDisabled: true,
-          className: "block-editor-patterns__grid-pagination-button",
-          children: /*#__PURE__*/_jsx("span", {
-            children: "\u203A"
-          })
-        }), /*#__PURE__*/_jsx(Button, {
-          variant: "tertiary",
-          onClick: () => changePage(numPages),
-          disabled: currentPage === numPages,
-          "aria-label": __('Last page'),
-          size: "compact",
-          accessibleWhenDisabled: true,
-          className: "block-editor-patterns__grid-pagination-button",
-          children: /*#__PURE__*/_jsx("span", {
-            children: "\xBB"
-          })
-        })]
-      })]
-    })]
-  });
+        spacing: 3,
+        justify: "flex-start",
+        className: "block-editor-patterns__grid-pagination",
+        children: [
+          /* @__PURE__ */ jsxs(
+            HStack,
+            {
+              expanded: false,
+              spacing: 1,
+              className: "block-editor-patterns__grid-pagination-previous",
+              children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "tertiary",
+                    onClick: () => changePage(1),
+                    disabled: currentPage === 1,
+                    "aria-label": __("First page"),
+                    size: "compact",
+                    accessibleWhenDisabled: true,
+                    className: "block-editor-patterns__grid-pagination-button",
+                    children: /* @__PURE__ */ jsx("span", { children: "\xAB" })
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "tertiary",
+                    onClick: () => changePage(currentPage - 1),
+                    disabled: currentPage === 1,
+                    "aria-label": __("Previous page"),
+                    size: "compact",
+                    accessibleWhenDisabled: true,
+                    className: "block-editor-patterns__grid-pagination-button",
+                    children: /* @__PURE__ */ jsx("span", { children: "\u2039" })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(Text, { variant: "muted", children: sprintf(
+            // translators: 1: Current page number. 2: Total number of pages.
+            _x("%1$s of %2$s", "paging"),
+            currentPage,
+            numPages
+          ) }),
+          /* @__PURE__ */ jsxs(
+            HStack,
+            {
+              expanded: false,
+              spacing: 1,
+              className: "block-editor-patterns__grid-pagination-next",
+              children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "tertiary",
+                    onClick: () => changePage(currentPage + 1),
+                    disabled: currentPage === numPages,
+                    "aria-label": __("Next page"),
+                    size: "compact",
+                    accessibleWhenDisabled: true,
+                    className: "block-editor-patterns__grid-pagination-button",
+                    children: /* @__PURE__ */ jsx("span", { children: "\u203A" })
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "tertiary",
+                    onClick: () => changePage(numPages),
+                    disabled: currentPage === numPages,
+                    "aria-label": __("Last page"),
+                    size: "compact",
+                    accessibleWhenDisabled: true,
+                    className: "block-editor-patterns__grid-pagination-button",
+                    children: /* @__PURE__ */ jsx("span", { children: "\xBB" })
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    )
+  ] });
 }
-//# sourceMappingURL=index.js.map
+export {
+  Pagination as default
+};
+//# sourceMappingURL=index.js.map