@wordpress/block-editor 12.9.1-next.5a1d1283.0 → 12.10.1

package/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 ## Unreleased
 
+## 12.10.0 (2023-09-20)
+
+- The Deprecated multiline prop on RichText will now fall back to using multiple
+  rich text instances instead of a single multiline instance. The prop remains
+  deprecated.
+
 ## 12.9.0 (2023-08-31)
 
 ### Enhancements

package/README.md

@@ -33,9 +33,7 @@ function MyEditorComponent() {
 			onChange={ ( blocks ) => updateBlocks( blocks ) }
 		>
 			<BlockTools>
-				<WritingFlow>
-					<BlockList />
-				</WritingFlow>
+				<BlockCanvas height="400px" />
 			</BlockTools>
 		</BlockEditorProvider>
 	);
@@ -118,6 +116,38 @@ _Returns_
 
 -   `WPElement`: Block Breadcrumb.
 
+### BlockCanvas
+
+BlockCanvas component is a component used to display the canvas of the block editor. What we call the canvas is an iframe containing the block list that you can manipulate. The component is also responsible of wiring up all the necessary hooks to enable the keyboard navigation across blocks in the editor and inject content styles into the iframe.
+
+_Usage_
+
+```jsx
+function MyBlockEditor() {
+	const [ blocks, updateBlocks ] = useState( [] );
+	return (
+		<BlockEditorProvider
+			value={ blocks }
+			onInput={ updateBlocks }
+			onChange={ persistBlocks }
+		>
+			<BlockCanvas height="400px" />
+		</BlockEditorProvider>
+	);
+}
+```
+
+_Parameters_
+
+-   _props_ `Object`: Component props.
+-   _props.height_ `string`: Canvas height, defaults to 300px.
+-   _props.styles_ `Array`: Content styles to inject into the iframe.
+-   _props.children_ `WPElement`: Content of the canvas, defaults to the BlockList component.
+
+_Returns_
+
+-   `WPElement`: Block Breadcrumb.
+
 ### BlockColorsStyleSelector
 
 Undocumented declaration.

package/build/components/block-canvas/index.js

@@ -0,0 +1,107 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ExperimentalBlockCanvas = ExperimentalBlockCanvas;
+exports.default = void 0;
+var _element = require("@wordpress/element");
+var _compose = require("@wordpress/compose");
+var _blockList = _interopRequireDefault(require("../block-list"));
+var _editorStyles = _interopRequireDefault(require("../editor-styles"));
+var _iframe = _interopRequireDefault(require("../iframe"));
+var _writingFlow = _interopRequireDefault(require("../writing-flow"));
+var _observeTyping = require("../observe-typing");
+var _copyHandler = require("../copy-handler");
+var _blockSelectionClearer = require("../block-selection-clearer");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+function ExperimentalBlockCanvas({
+  shouldIframe = true,
+  height = '300px',
+  children = (0, _element.createElement)(_blockList.default, null),
+  styles,
+  contentRef: contentRefProp,
+  iframeProps
+}) {
+  const resetTypingRef = (0, _observeTyping.useMouseMoveTypingReset)();
+  const copyHandler = (0, _copyHandler.useClipboardHandler)();
+  const clearerRef = (0, _blockSelectionClearer.useBlockSelectionClearer)();
+  const contentRef = (0, _compose.useMergeRefs)([copyHandler, contentRefProp, clearerRef]);
+  if (!shouldIframe) {
+    return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_editorStyles.default, {
+      styles: styles,
+      scope: ".editor-styles-wrapper"
+    }), (0, _element.createElement)(_writingFlow.default, {
+      ref: contentRef,
+      className: "editor-styles-wrapper",
+      tabIndex: -1,
+      style: {
+        height
+      }
+    }, children));
+  }
+  return (0, _element.createElement)(_iframe.default, {
+    ...iframeProps,
+    ref: resetTypingRef,
+    contentRef: contentRef,
+    style: {
+      width: '100%',
+      height,
+      ...iframeProps?.style
+    },
+    name: "editor-canvas"
+  }, (0, _element.createElement)(_editorStyles.default, {
+    styles: styles
+  }), children);
+}
+
+/**
+ * BlockCanvas component is a component used to display the canvas of the block editor.
+ * What we call the canvas is an iframe containing the block list that you can manipulate.
+ * The component is also responsible of wiring up all the necessary hooks to enable
+ * the keyboard navigation across blocks in the editor and inject content styles into the iframe.
+ *
+ * @example
+ *
+ * ```jsx
+ * function MyBlockEditor() {
+ *   const [ blocks, updateBlocks ] = useState([]);
+ *   return (
+ *     <BlockEditorProvider
+ *       value={ blocks }
+ *       onInput={ updateBlocks }
+ *       onChange={ persistBlocks }
+ *      >
+ *        <BlockCanvas height="400px" />
+ *      </BlockEditorProvider>
+ *    );
+ * }
+ * ```
+ *
+ * @param {Object}    props          Component props.
+ * @param {string}    props.height   Canvas height, defaults to 300px.
+ * @param {Array}     props.styles   Content styles to inject into the iframe.
+ * @param {WPElement} props.children Content of the canvas, defaults to the BlockList component.
+ * @return {WPElement}               Block Breadcrumb.
+ */
+function BlockCanvas({
+  children,
+  height,
+  styles
+}) {
+  return (0, _element.createElement)(ExperimentalBlockCanvas, {
+    height: height,
+    styles: styles
+  }, children);
+}
+var _default = BlockCanvas;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/build/components/block-canvas/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_compose","require","_blockList","_interopRequireDefault","_editorStyles","_iframe","_writingFlow","_observeTyping","_copyHandler","_blockSelectionClearer","ExperimentalBlockCanvas","shouldIframe","height","children","_element","createElement","default","styles","contentRef","contentRefProp","iframeProps","resetTypingRef","useMouseMoveTypingReset","copyHandler","useClipboardHandler","clearerRef","useBlockSelectionClearer","useMergeRefs","Fragment","scope","ref","className","tabIndex","style","width","name","BlockCanvas","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-canvas/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BlockList from '../block-list';\nimport EditorStyles from '../editor-styles';\nimport Iframe from '../iframe';\nimport WritingFlow from '../writing-flow';\nimport { useMouseMoveTypingReset } from '../observe-typing';\nimport { useClipboardHandler } from '../copy-handler';\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\n\nexport function ExperimentalBlockCanvas( {\n\tshouldIframe = true,\n\theight = '300px',\n\tchildren = <BlockList />,\n\tstyles,\n\tcontentRef: contentRefProp,\n\tiframeProps,\n} ) {\n\tconst resetTypingRef = useMouseMoveTypingReset();\n\tconst copyHandler = useClipboardHandler();\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst contentRef = useMergeRefs( [\n\t\tcopyHandler,\n\t\tcontentRefProp,\n\t\tclearerRef,\n\t] );\n\n\tif ( ! shouldIframe ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<EditorStyles\n\t\t\t\t\tstyles={ styles }\n\t\t\t\t\tscope=\".editor-styles-wrapper\"\n\t\t\t\t/>\n\t\t\t\t<WritingFlow\n\t\t\t\t\tref={ contentRef }\n\t\t\t\t\tclassName=\"editor-styles-wrapper\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tstyle={ { height } }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</WritingFlow>\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Iframe\n\t\t\t{ ...iframeProps }\n\t\t\tref={ resetTypingRef }\n\t\t\tcontentRef={ contentRef }\n\t\t\tstyle={ {\n\t\t\t\twidth: '100%',\n\t\t\t\theight,\n\t\t\t\t...iframeProps?.style,\n\t\t\t} }\n\t\t\tname=\"editor-canvas\"\n\t\t>\n\t\t\t<EditorStyles styles={ styles } />\n\t\t\t{ children }\n\t\t</Iframe>\n\t);\n}\n\n/**\n * BlockCanvas component is a component used to display the canvas of the block editor.\n * What we call the canvas is an iframe containing the block list that you can manipulate.\n * The component is also responsible of wiring up all the necessary hooks to enable\n * the keyboard navigation across blocks in the editor and inject content styles into the iframe.\n *\n * @example\n *\n * ```jsx\n * function MyBlockEditor() {\n *   const [ blocks, updateBlocks ] = useState([]);\n *   return (\n *     <BlockEditorProvider\n *       value={ blocks }\n *       onInput={ updateBlocks }\n *       onChange={ persistBlocks }\n *      >\n *        <BlockCanvas height=\"400px\" />\n *      </BlockEditorProvider>\n *    );\n * }\n * ```\n *\n * @param {Object}    props          Component props.\n * @param {string}    props.height   Canvas height, defaults to 300px.\n * @param {Array}     props.styles   Content styles to inject into the iframe.\n * @param {WPElement} props.children Content of the canvas, defaults to the BlockList component.\n * @return {WPElement}               Block Breadcrumb.\n */\nfunction BlockCanvas( { children, height, styles } ) {\n\treturn (\n\t\t<ExperimentalBlockCanvas height={ height } styles={ styles }>\n\t\t\t{ children }\n\t\t</ExperimentalBlockCanvas>\n\t);\n}\n\nexport default BlockCanvas;\n"],"mappings":";;;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,aAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,OAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,YAAA,GAAAH,sBAAA,CAAAF,OAAA;AACA,IAAAM,cAAA,GAAAN,OAAA;AACA,IAAAO,YAAA,GAAAP,OAAA;AACA,IAAAQ,sBAAA,GAAAR,OAAA;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AASO,SAASS,uBAAuBA,CAAE;EACxCC,YAAY,GAAG,IAAI;EACnBC,MAAM,GAAG,OAAO;EAChBC,QAAQ,GAAG,IAAAC,QAAA,CAAAC,aAAA,EAACb,UAAA,CAAAc,OAAS,MAAE,CAAC;EACxBC,MAAM;EACNC,UAAU,EAAEC,cAAc;EAC1BC;AACD,CAAC,EAAG;EACH,MAAMC,cAAc,GAAG,IAAAC,sCAAuB,EAAC,CAAC;EAChD,MAAMC,WAAW,GAAG,IAAAC,gCAAmB,EAAC,CAAC;EACzC,MAAMC,UAAU,GAAG,IAAAC,+CAAwB,EAAC,CAAC;EAC7C,MAAMR,UAAU,GAAG,IAAAS,qBAAY,EAAE,CAChCJ,WAAW,EACXJ,cAAc,EACdM,UAAU,CACT,CAAC;EAEH,IAAK,CAAEd,YAAY,EAAG;IACrB,OACC,IAAAG,QAAA,CAAAC,aAAA,EAAAD,QAAA,CAAAc,QAAA,QACC,IAAAd,QAAA,CAAAC,aAAA,EAACX,aAAA,CAAAY,OAAY;MACZC,MAAM,EAAGA,MAAQ;MACjBY,KAAK,EAAC;IAAwB,CAC9B,CAAC,EACF,IAAAf,QAAA,CAAAC,aAAA,EAACT,YAAA,CAAAU,OAAW;MACXc,GAAG,EAAGZ,UAAY;MAClBa,SAAS,EAAC,uBAAuB;MACjCC,QAAQ,EAAG,CAAC,CAAG;MACfC,KAAK,EAAG;QAAErB;MAAO;IAAG,GAElBC,QACU,CACZ,CAAC;EAEL;EAEA,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACV,OAAA,CAAAW,OAAM;IAAA,GACDI,WAAW;IAChBU,GAAG,EAAGT,cAAgB;IACtBH,UAAU,EAAGA,UAAY;IACzBe,KAAK,EAAG;MACPC,KAAK,EAAE,MAAM;MACbtB,MAAM;MACN,GAAGQ,WAAW,EAAEa;IACjB,CAAG;IACHE,IAAI,EAAC;EAAe,GAEpB,IAAArB,QAAA,CAAAC,aAAA,EAACX,aAAA,CAAAY,OAAY;IAACC,MAAM,EAAGA;EAAQ,CAAE,CAAC,EAChCJ,QACK,CAAC;AAEX;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASuB,WAAWA,CAAE;EAAEvB,QAAQ;EAAED,MAAM;EAAEK;AAAO,CAAC,EAAG;EACpD,OACC,IAAAH,QAAA,CAAAC,aAAA,EAACL,uBAAuB;IAACE,MAAM,EAAGA,MAAQ;IAACK,MAAM,EAAGA;EAAQ,GACzDJ,QACsB,CAAC;AAE5B;AAAC,IAAAwB,QAAA,GAEcD,WAAW;AAAAE,OAAA,CAAAtB,OAAA,GAAAqB,QAAA"}

package/build/components/block-inspector/index.js

@@ -43,7 +43,7 @@ function BlockInspectorLockedBlocks({
       getBlockName,
       getBlockEditingMode
     } = select(_store.store);
-    return getClientIdsOfDescendants([topLevelLockedBlock]).filter(clientId => getBlockName(clientId) !== 'core/list-item' && getBlockEditingMode(clientId) === 'contentOnly');
+    return getClientIdsOfDescendants(topLevelLockedBlock).filter(clientId => getBlockName(clientId) !== 'core/list-item' && getBlockEditingMode(clientId) === 'contentOnly');
   }, [topLevelLockedBlock]);
   const blockInformation = (0, _useBlockDisplayInformation.default)(topLevelLockedBlock);
   return (0, _element.createElement)("div", {
@@ -227,6 +227,9 @@ const BlockInspectorSingleBlock = ({
     label: (0, _i18n.__)('Border')
   }), (0, _element.createElement)(_inspectorControls.default.Slot, {
     group: "styles"
+  }), (0, _element.createElement)(_inspectorControls.default.Slot, {
+    group: "background",
+    label: (0, _i18n.__)('Background')
   }), (0, _element.createElement)(_positionControlsPanel.default, null), (0, _element.createElement)("div", null, (0, _element.createElement)(_advancedControlsPanel.default, null))), (0, _element.createElement)(_skipToSelectedBlock.default, {
     key: "back"
   }));

package/build/components/block-inspector/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_blocks","_components","_data","_skipToSelectedBlock","_interopRequireDefault","_blockCard","_multiSelectionInspector","_blockVariationTransforms","_useBlockDisplayInformation","_store","_blockStyles","_defaultStylePicker","_inspectorControls","_inspectorControlsTabs","_useInspectorControlsTabs","_advancedControlsPanel","_positionControlsPanel","_useBlockInspectorAnimationSettings","_blockInfoSlotFill","_blockQuickNavigation","BlockInspectorLockedBlocks","topLevelLockedBlock","contentClientIds","useSelect","select","getClientIdsOfDescendants","getBlockName","getBlockEditingMode","blockEditorStore","filter","clientId","blockInformation","useBlockDisplayInformation","_element","createElement","className","default","isSynced","blockClientId","Slot","PanelBody","title","__","clientIds","BlockInspector","showNoBlockSelectedMessage","count","selectedBlockName","selectedBlockClientId","blockType","getSelectedBlockClientId","getSelectedBlockCount","__unstableGetContentLockingParent","getTemplateLock","_selectedBlockClientId","_selectedBlockName","_blockType","getBlockType","undefined","availableTabs","useInspectorControlsTabs","name","showTabs","length","blockInspectorAnimationSettings","useBlockInspectorAnimationSettings","tabs","Fragment","group","label","isSelectedBlockUnregistered","getUnregisteredTypeHandlerName","BlockInspectorSingleBlockWrapper","animate","wrapper","children","AnimatedContainer","BlockInspectorSingleBlock","blockName","animationOrigin","enterDirection","__unstableMotion","div","x","opacity","transition","ease","duration","initial","key","hasBlockStyles","getBlockStyles","blocksStore","blockStyles","hasBlockSupport","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-inspector/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tgetBlockType,\n\tgetUnregisteredTypeHandlerName,\n\thasBlockSupport,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { PanelBody, __unstableMotion as motion } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport SkipToSelectedBlock from '../skip-to-selected-block';\nimport BlockCard from '../block-card';\nimport MultiSelectionInspector from '../multi-selection-inspector';\nimport BlockVariationTransforms from '../block-variation-transforms';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport { store as blockEditorStore } from '../../store';\nimport BlockStyles from '../block-styles';\nimport DefaultStylePicker from '../default-style-picker';\nimport { default as InspectorControls } from '../inspector-controls';\nimport { default as InspectorControlsTabs } from '../inspector-controls-tabs';\nimport useInspectorControlsTabs from '../inspector-controls-tabs/use-inspector-controls-tabs';\nimport AdvancedControls from '../inspector-controls-tabs/advanced-controls-panel';\nimport PositionControls from '../inspector-controls-tabs/position-controls-panel';\nimport useBlockInspectorAnimationSettings from './useBlockInspectorAnimationSettings';\nimport BlockInfo from '../block-info-slot-fill';\nimport BlockQuickNavigation from '../block-quick-navigation';\n\nfunction BlockInspectorLockedBlocks( { topLevelLockedBlock } ) {\n\tconst contentClientIds = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetClientIdsOfDescendants,\n\t\t\t\tgetBlockName,\n\t\t\t\tgetBlockEditingMode,\n\t\t\t} = select( blockEditorStore );\n\t\t\treturn getClientIdsOfDescendants( [ topLevelLockedBlock ] ).filter(\n\t\t\t\t( clientId ) =>\n\t\t\t\t\tgetBlockName( clientId ) !== 'core/list-item' &&\n\t\t\t\t\tgetBlockEditingMode( clientId ) === 'contentOnly'\n\t\t\t);\n\t\t},\n\t\t[ topLevelLockedBlock ]\n\t);\n\tconst blockInformation = useBlockDisplayInformation( topLevelLockedBlock );\n\treturn (\n\t\t<div className=\"block-editor-block-inspector\">\n\t\t\t<BlockCard\n\t\t\t\t{ ...blockInformation }\n\t\t\t\tclassName={ blockInformation.isSynced && 'is-synced' }\n\t\t\t/>\n\t\t\t<BlockVariationTransforms blockClientId={ topLevelLockedBlock } />\n\t\t\t<BlockInfo.Slot />\n\t\t\t<PanelBody title={ __( 'Content' ) }>\n\t\t\t\t<BlockQuickNavigation clientIds={ contentClientIds } />\n\t\t\t</PanelBody>\n\t\t</div>\n\t);\n}\n\nconst BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {\n\tconst {\n\t\tcount,\n\t\tselectedBlockName,\n\t\tselectedBlockClientId,\n\t\tblockType,\n\t\ttopLevelLockedBlock,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetSelectedBlockCount,\n\t\t\tgetBlockName,\n\t\t\t__unstableGetContentLockingParent,\n\t\t\tgetTemplateLock,\n\t\t} = select( blockEditorStore );\n\n\t\tconst _selectedBlockClientId = getSelectedBlockClientId();\n\t\tconst _selectedBlockName =\n\t\t\t_selectedBlockClientId && getBlockName( _selectedBlockClientId );\n\t\tconst _blockType =\n\t\t\t_selectedBlockName && getBlockType( _selectedBlockName );\n\n\t\treturn {\n\t\t\tcount: getSelectedBlockCount(),\n\t\t\tselectedBlockClientId: _selectedBlockClientId,\n\t\t\tselectedBlockName: _selectedBlockName,\n\t\t\tblockType: _blockType,\n\t\t\ttopLevelLockedBlock:\n\t\t\t\t__unstableGetContentLockingParent( _selectedBlockClientId ) ||\n\t\t\t\t( getTemplateLock( _selectedBlockClientId ) === 'contentOnly'\n\t\t\t\t\t? _selectedBlockClientId\n\t\t\t\t\t: undefined ),\n\t\t};\n\t}, [] );\n\n\tconst availableTabs = useInspectorControlsTabs( blockType?.name );\n\tconst showTabs = availableTabs?.length > 1;\n\n\t// The block inspector animation settings will be completely\n\t// removed in the future to create an API which allows the block\n\t// inspector to transition between what it\n\t// displays based on the relationship between the selected block\n\t// and its parent, and only enable it if the parent is controlling\n\t// its children blocks.\n\tconst blockInspectorAnimationSettings = useBlockInspectorAnimationSettings(\n\t\tblockType,\n\t\tselectedBlockClientId\n\t);\n\n\tif ( count > 1 ) {\n\t\treturn (\n\t\t\t<div className=\"block-editor-block-inspector\">\n\t\t\t\t<MultiSelectionInspector />\n\t\t\t\t{ showTabs ? (\n\t\t\t\t\t<InspectorControlsTabs tabs={ availableTabs } />\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorControls.Slot />\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"color\"\n\t\t\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\t\t\tclassName=\"color-block-support-panel__inner-wrapper\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"typography\"\n\t\t\t\t\t\t\tlabel={ __( 'Typography' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"dimensions\"\n\t\t\t\t\t\t\tlabel={ __( 'Dimensions' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"border\"\n\t\t\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot group=\"styles\" />\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst isSelectedBlockUnregistered =\n\t\tselectedBlockName === getUnregisteredTypeHandlerName();\n\n\t/*\n\t * If the selected block is of an unregistered type, avoid showing it as an actual selection\n\t * because we want the user to focus on the unregistered block warning, not block settings.\n\t */\n\tif (\n\t\t! blockType ||\n\t\t! selectedBlockClientId ||\n\t\tisSelectedBlockUnregistered\n\t) {\n\t\tif ( showNoBlockSelectedMessage ) {\n\t\t\treturn (\n\t\t\t\t<span className=\"block-editor-block-inspector__no-blocks\">\n\t\t\t\t\t{ __( 'No block selected.' ) }\n\t\t\t\t</span>\n\t\t\t);\n\t\t}\n\t\treturn null;\n\t}\n\tif ( topLevelLockedBlock ) {\n\t\treturn (\n\t\t\t<BlockInspectorLockedBlocks\n\t\t\t\ttopLevelLockedBlock={ topLevelLockedBlock }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<BlockInspectorSingleBlockWrapper\n\t\t\tanimate={ blockInspectorAnimationSettings }\n\t\t\twrapper={ ( children ) => (\n\t\t\t\t<AnimatedContainer\n\t\t\t\t\tblockInspectorAnimationSettings={\n\t\t\t\t\t\tblockInspectorAnimationSettings\n\t\t\t\t\t}\n\t\t\t\t\tselectedBlockClientId={ selectedBlockClientId }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</AnimatedContainer>\n\t\t\t) }\n\t\t>\n\t\t\t<BlockInspectorSingleBlock\n\t\t\t\tclientId={ selectedBlockClientId }\n\t\t\t\tblockName={ blockType.name }\n\t\t\t/>\n\t\t</BlockInspectorSingleBlockWrapper>\n\t);\n};\n\nconst BlockInspectorSingleBlockWrapper = ( { animate, wrapper, children } ) => {\n\treturn animate ? wrapper( children ) : children;\n};\n\nconst AnimatedContainer = ( {\n\tblockInspectorAnimationSettings,\n\tselectedBlockClientId,\n\tchildren,\n} ) => {\n\tconst animationOrigin =\n\t\tblockInspectorAnimationSettings &&\n\t\tblockInspectorAnimationSettings.enterDirection === 'leftToRight'\n\t\t\t? -50\n\t\t\t: 50;\n\n\treturn (\n\t\t<motion.div\n\t\t\tanimate={ {\n\t\t\t\tx: 0,\n\t\t\t\topacity: 1,\n\t\t\t\ttransition: {\n\t\t\t\t\tease: 'easeInOut',\n\t\t\t\t\tduration: 0.14,\n\t\t\t\t},\n\t\t\t} }\n\t\t\tinitial={ {\n\t\t\t\tx: animationOrigin,\n\t\t\t\topacity: 0,\n\t\t\t} }\n\t\t\tkey={ selectedBlockClientId }\n\t\t>\n\t\t\t{ children }\n\t\t</motion.div>\n\t);\n};\n\nconst BlockInspectorSingleBlock = ( { clientId, blockName } ) => {\n\tconst availableTabs = useInspectorControlsTabs( blockName );\n\tconst showTabs = availableTabs?.length > 1;\n\n\tconst hasBlockStyles = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockStyles } = select( blocksStore );\n\t\t\tconst blockStyles = getBlockStyles( blockName );\n\t\t\treturn blockStyles && blockStyles.length > 0;\n\t\t},\n\t\t[ blockName ]\n\t);\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\treturn (\n\t\t<div className=\"block-editor-block-inspector\">\n\t\t\t<BlockCard\n\t\t\t\t{ ...blockInformation }\n\t\t\t\tclassName={ blockInformation.isSynced && 'is-synced' }\n\t\t\t/>\n\t\t\t<BlockVariationTransforms blockClientId={ clientId } />\n\t\t\t<BlockInfo.Slot />\n\t\t\t{ showTabs && (\n\t\t\t\t<InspectorControlsTabs\n\t\t\t\t\thasBlockStyles={ hasBlockStyles }\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tblockName={ blockName }\n\t\t\t\t\ttabs={ availableTabs }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! showTabs && (\n\t\t\t\t<>\n\t\t\t\t\t{ hasBlockStyles && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<PanelBody title={ __( 'Styles' ) }>\n\t\t\t\t\t\t\t\t<BlockStyles clientId={ clientId } />\n\t\t\t\t\t\t\t\t{ hasBlockSupport(\n\t\t\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\t\t\t'defaultStylePicker',\n\t\t\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t\t\t) && (\n\t\t\t\t\t\t\t\t\t<DefaultStylePicker\n\t\t\t\t\t\t\t\t\t\tblockName={ blockName }\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</PanelBody>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t\t<InspectorControls.Slot />\n\t\t\t\t\t<InspectorControls.Slot group=\"list\" />\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"color\"\n\t\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\t\tclassName=\"color-block-support-panel__inner-wrapper\"\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"typography\"\n\t\t\t\t\t\tlabel={ __( 'Typography' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"dimensions\"\n\t\t\t\t\t\tlabel={ __( 'Dimensions' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"border\"\n\t\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot group=\"styles\" />\n\t\t\t\t\t<PositionControls />\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<AdvancedControls />\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t<SkipToSelectedBlock key=\"back\" />\n\t\t</div>\n\t);\n};\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-inspector/README.md\n */\nexport default BlockInspector;\n"],"mappings":"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"}
+{"version":3,"names":["_i18n","require","_blocks","_components","_data","_skipToSelectedBlock","_interopRequireDefault","_blockCard","_multiSelectionInspector","_blockVariationTransforms","_useBlockDisplayInformation","_store","_blockStyles","_defaultStylePicker","_inspectorControls","_inspectorControlsTabs","_useInspectorControlsTabs","_advancedControlsPanel","_positionControlsPanel","_useBlockInspectorAnimationSettings","_blockInfoSlotFill","_blockQuickNavigation","BlockInspectorLockedBlocks","topLevelLockedBlock","contentClientIds","useSelect","select","getClientIdsOfDescendants","getBlockName","getBlockEditingMode","blockEditorStore","filter","clientId","blockInformation","useBlockDisplayInformation","_element","createElement","className","default","isSynced","blockClientId","Slot","PanelBody","title","__","clientIds","BlockInspector","showNoBlockSelectedMessage","count","selectedBlockName","selectedBlockClientId","blockType","getSelectedBlockClientId","getSelectedBlockCount","__unstableGetContentLockingParent","getTemplateLock","_selectedBlockClientId","_selectedBlockName","_blockType","getBlockType","undefined","availableTabs","useInspectorControlsTabs","name","showTabs","length","blockInspectorAnimationSettings","useBlockInspectorAnimationSettings","tabs","Fragment","group","label","isSelectedBlockUnregistered","getUnregisteredTypeHandlerName","BlockInspectorSingleBlockWrapper","animate","wrapper","children","AnimatedContainer","BlockInspectorSingleBlock","blockName","animationOrigin","enterDirection","__unstableMotion","div","x","opacity","transition","ease","duration","initial","key","hasBlockStyles","getBlockStyles","blocksStore","blockStyles","hasBlockSupport","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-inspector/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tgetBlockType,\n\tgetUnregisteredTypeHandlerName,\n\thasBlockSupport,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { PanelBody, __unstableMotion as motion } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport SkipToSelectedBlock from '../skip-to-selected-block';\nimport BlockCard from '../block-card';\nimport MultiSelectionInspector from '../multi-selection-inspector';\nimport BlockVariationTransforms from '../block-variation-transforms';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport { store as blockEditorStore } from '../../store';\nimport BlockStyles from '../block-styles';\nimport DefaultStylePicker from '../default-style-picker';\nimport { default as InspectorControls } from '../inspector-controls';\nimport { default as InspectorControlsTabs } from '../inspector-controls-tabs';\nimport useInspectorControlsTabs from '../inspector-controls-tabs/use-inspector-controls-tabs';\nimport AdvancedControls from '../inspector-controls-tabs/advanced-controls-panel';\nimport PositionControls from '../inspector-controls-tabs/position-controls-panel';\nimport useBlockInspectorAnimationSettings from './useBlockInspectorAnimationSettings';\nimport BlockInfo from '../block-info-slot-fill';\nimport BlockQuickNavigation from '../block-quick-navigation';\n\nfunction BlockInspectorLockedBlocks( { topLevelLockedBlock } ) {\n\tconst contentClientIds = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetClientIdsOfDescendants,\n\t\t\t\tgetBlockName,\n\t\t\t\tgetBlockEditingMode,\n\t\t\t} = select( blockEditorStore );\n\t\t\treturn getClientIdsOfDescendants( topLevelLockedBlock ).filter(\n\t\t\t\t( clientId ) =>\n\t\t\t\t\tgetBlockName( clientId ) !== 'core/list-item' &&\n\t\t\t\t\tgetBlockEditingMode( clientId ) === 'contentOnly'\n\t\t\t);\n\t\t},\n\t\t[ topLevelLockedBlock ]\n\t);\n\tconst blockInformation = useBlockDisplayInformation( topLevelLockedBlock );\n\treturn (\n\t\t<div className=\"block-editor-block-inspector\">\n\t\t\t<BlockCard\n\t\t\t\t{ ...blockInformation }\n\t\t\t\tclassName={ blockInformation.isSynced && 'is-synced' }\n\t\t\t/>\n\t\t\t<BlockVariationTransforms blockClientId={ topLevelLockedBlock } />\n\t\t\t<BlockInfo.Slot />\n\t\t\t<PanelBody title={ __( 'Content' ) }>\n\t\t\t\t<BlockQuickNavigation clientIds={ contentClientIds } />\n\t\t\t</PanelBody>\n\t\t</div>\n\t);\n}\n\nconst BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {\n\tconst {\n\t\tcount,\n\t\tselectedBlockName,\n\t\tselectedBlockClientId,\n\t\tblockType,\n\t\ttopLevelLockedBlock,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetSelectedBlockCount,\n\t\t\tgetBlockName,\n\t\t\t__unstableGetContentLockingParent,\n\t\t\tgetTemplateLock,\n\t\t} = select( blockEditorStore );\n\n\t\tconst _selectedBlockClientId = getSelectedBlockClientId();\n\t\tconst _selectedBlockName =\n\t\t\t_selectedBlockClientId && getBlockName( _selectedBlockClientId );\n\t\tconst _blockType =\n\t\t\t_selectedBlockName && getBlockType( _selectedBlockName );\n\n\t\treturn {\n\t\t\tcount: getSelectedBlockCount(),\n\t\t\tselectedBlockClientId: _selectedBlockClientId,\n\t\t\tselectedBlockName: _selectedBlockName,\n\t\t\tblockType: _blockType,\n\t\t\ttopLevelLockedBlock:\n\t\t\t\t__unstableGetContentLockingParent( _selectedBlockClientId ) ||\n\t\t\t\t( getTemplateLock( _selectedBlockClientId ) === 'contentOnly'\n\t\t\t\t\t? _selectedBlockClientId\n\t\t\t\t\t: undefined ),\n\t\t};\n\t}, [] );\n\n\tconst availableTabs = useInspectorControlsTabs( blockType?.name );\n\tconst showTabs = availableTabs?.length > 1;\n\n\t// The block inspector animation settings will be completely\n\t// removed in the future to create an API which allows the block\n\t// inspector to transition between what it\n\t// displays based on the relationship between the selected block\n\t// and its parent, and only enable it if the parent is controlling\n\t// its children blocks.\n\tconst blockInspectorAnimationSettings = useBlockInspectorAnimationSettings(\n\t\tblockType,\n\t\tselectedBlockClientId\n\t);\n\n\tif ( count > 1 ) {\n\t\treturn (\n\t\t\t<div className=\"block-editor-block-inspector\">\n\t\t\t\t<MultiSelectionInspector />\n\t\t\t\t{ showTabs ? (\n\t\t\t\t\t<InspectorControlsTabs tabs={ availableTabs } />\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorControls.Slot />\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"color\"\n\t\t\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\t\t\tclassName=\"color-block-support-panel__inner-wrapper\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"typography\"\n\t\t\t\t\t\t\tlabel={ __( 'Typography' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"dimensions\"\n\t\t\t\t\t\t\tlabel={ __( 'Dimensions' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\t\tgroup=\"border\"\n\t\t\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InspectorControls.Slot group=\"styles\" />\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst isSelectedBlockUnregistered =\n\t\tselectedBlockName === getUnregisteredTypeHandlerName();\n\n\t/*\n\t * If the selected block is of an unregistered type, avoid showing it as an actual selection\n\t * because we want the user to focus on the unregistered block warning, not block settings.\n\t */\n\tif (\n\t\t! blockType ||\n\t\t! selectedBlockClientId ||\n\t\tisSelectedBlockUnregistered\n\t) {\n\t\tif ( showNoBlockSelectedMessage ) {\n\t\t\treturn (\n\t\t\t\t<span className=\"block-editor-block-inspector__no-blocks\">\n\t\t\t\t\t{ __( 'No block selected.' ) }\n\t\t\t\t</span>\n\t\t\t);\n\t\t}\n\t\treturn null;\n\t}\n\tif ( topLevelLockedBlock ) {\n\t\treturn (\n\t\t\t<BlockInspectorLockedBlocks\n\t\t\t\ttopLevelLockedBlock={ topLevelLockedBlock }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<BlockInspectorSingleBlockWrapper\n\t\t\tanimate={ blockInspectorAnimationSettings }\n\t\t\twrapper={ ( children ) => (\n\t\t\t\t<AnimatedContainer\n\t\t\t\t\tblockInspectorAnimationSettings={\n\t\t\t\t\t\tblockInspectorAnimationSettings\n\t\t\t\t\t}\n\t\t\t\t\tselectedBlockClientId={ selectedBlockClientId }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</AnimatedContainer>\n\t\t\t) }\n\t\t>\n\t\t\t<BlockInspectorSingleBlock\n\t\t\t\tclientId={ selectedBlockClientId }\n\t\t\t\tblockName={ blockType.name }\n\t\t\t/>\n\t\t</BlockInspectorSingleBlockWrapper>\n\t);\n};\n\nconst BlockInspectorSingleBlockWrapper = ( { animate, wrapper, children } ) => {\n\treturn animate ? wrapper( children ) : children;\n};\n\nconst AnimatedContainer = ( {\n\tblockInspectorAnimationSettings,\n\tselectedBlockClientId,\n\tchildren,\n} ) => {\n\tconst animationOrigin =\n\t\tblockInspectorAnimationSettings &&\n\t\tblockInspectorAnimationSettings.enterDirection === 'leftToRight'\n\t\t\t? -50\n\t\t\t: 50;\n\n\treturn (\n\t\t<motion.div\n\t\t\tanimate={ {\n\t\t\t\tx: 0,\n\t\t\t\topacity: 1,\n\t\t\t\ttransition: {\n\t\t\t\t\tease: 'easeInOut',\n\t\t\t\t\tduration: 0.14,\n\t\t\t\t},\n\t\t\t} }\n\t\t\tinitial={ {\n\t\t\t\tx: animationOrigin,\n\t\t\t\topacity: 0,\n\t\t\t} }\n\t\t\tkey={ selectedBlockClientId }\n\t\t>\n\t\t\t{ children }\n\t\t</motion.div>\n\t);\n};\n\nconst BlockInspectorSingleBlock = ( { clientId, blockName } ) => {\n\tconst availableTabs = useInspectorControlsTabs( blockName );\n\tconst showTabs = availableTabs?.length > 1;\n\n\tconst hasBlockStyles = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockStyles } = select( blocksStore );\n\t\t\tconst blockStyles = getBlockStyles( blockName );\n\t\t\treturn blockStyles && blockStyles.length > 0;\n\t\t},\n\t\t[ blockName ]\n\t);\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\treturn (\n\t\t<div className=\"block-editor-block-inspector\">\n\t\t\t<BlockCard\n\t\t\t\t{ ...blockInformation }\n\t\t\t\tclassName={ blockInformation.isSynced && 'is-synced' }\n\t\t\t/>\n\t\t\t<BlockVariationTransforms blockClientId={ clientId } />\n\t\t\t<BlockInfo.Slot />\n\t\t\t{ showTabs && (\n\t\t\t\t<InspectorControlsTabs\n\t\t\t\t\thasBlockStyles={ hasBlockStyles }\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tblockName={ blockName }\n\t\t\t\t\ttabs={ availableTabs }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! showTabs && (\n\t\t\t\t<>\n\t\t\t\t\t{ hasBlockStyles && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<PanelBody title={ __( 'Styles' ) }>\n\t\t\t\t\t\t\t\t<BlockStyles clientId={ clientId } />\n\t\t\t\t\t\t\t\t{ hasBlockSupport(\n\t\t\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\t\t\t'defaultStylePicker',\n\t\t\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t\t\t) && (\n\t\t\t\t\t\t\t\t\t<DefaultStylePicker\n\t\t\t\t\t\t\t\t\t\tblockName={ blockName }\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</PanelBody>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t\t<InspectorControls.Slot />\n\t\t\t\t\t<InspectorControls.Slot group=\"list\" />\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"color\"\n\t\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\t\tclassName=\"color-block-support-panel__inner-wrapper\"\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"typography\"\n\t\t\t\t\t\tlabel={ __( 'Typography' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"dimensions\"\n\t\t\t\t\t\tlabel={ __( 'Dimensions' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"border\"\n\t\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<InspectorControls.Slot group=\"styles\" />\n\t\t\t\t\t<InspectorControls.Slot\n\t\t\t\t\t\tgroup=\"background\"\n\t\t\t\t\t\tlabel={ __( 'Background' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<PositionControls />\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<AdvancedControls />\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t<SkipToSelectedBlock key=\"back\" />\n\t\t</div>\n\t);\n};\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-inspector/README.md\n */\nexport default BlockInspector;\n"],"mappings":"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"}

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

@@ -6,11 +6,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _element = require("@wordpress/element");
+var _classnames = _interopRequireDefault(require("classnames"));
 var _components = require("@wordpress/components");
 var _compose = require("@wordpress/compose");
 var _i18n = require("@wordpress/i18n");
+var _icons = require("@wordpress/icons");
 var _blockPreview = _interopRequireDefault(require("../block-preview"));
 var _inserterDraggableBlocks = _interopRequireDefault(require("../inserter-draggable-blocks"));
+var _blockPatternsPaging = _interopRequireDefault(require("../block-patterns-paging"));
+/**
+ * External dependencies
+ */
+
 /**
  * WordPress dependencies
  */
@@ -71,13 +78,15 @@ function BlockPattern({
       }
     }
   }, (0, _element.createElement)(WithToolTip, {
-    showTooltip: showTooltip,
+    showTooltip: showTooltip && !pattern.id,
     title: pattern.title
   }, (0, _element.createElement)(_components.__unstableCompositeItem, {
     role: "option",
     as: "div",
     ...composite,
-    className: "block-editor-block-patterns-list__item",
+    className: (0, _classnames.default)('block-editor-block-patterns-list__item', {
+      'block-editor-block-patterns-list__list-item-synced': pattern.id && !pattern.syncStatus
+    }),
     onClick: () => {
       onClick(pattern, blocks);
       onHover?.(null);
@@ -94,9 +103,16 @@ function BlockPattern({
   }, (0, _element.createElement)(_blockPreview.default, {
     blocks: blocks,
     viewportWidth: viewportWidth
-  }), !showTooltip && (0, _element.createElement)("div", {
+  }), (0, _element.createElement)(_components.__experimentalHStack, {
+    className: "block-editor-patterns__pattern-details"
+  }, pattern.id && !pattern.syncStatus && (0, _element.createElement)("div", {
+    className: "block-editor-patterns__pattern-icon-wrapper"
+  }, (0, _element.createElement)(_icons.Icon, {
+    className: "block-editor-patterns__pattern-icon",
+    icon: _icons.symbol
+  })), (!showTooltip || pattern.id) && (0, _element.createElement)("div", {
     className: "block-editor-block-patterns-list__item-title"
-  }, pattern.title), !!pattern.description && (0, _element.createElement)(_components.VisuallyHidden, {
+  }, pattern.title)), !!pattern.description && (0, _element.createElement)(_components.VisuallyHidden, {
     id: descriptionId
   }, pattern.description)))));
 }
@@ -113,8 +129,9 @@ function BlockPatternList({
   onClickPattern,
   orientation,
   label = (0, _i18n.__)('Block Patterns'),
-  showTitlesAsTooltip
-}) {
+  showTitlesAsTooltip,
+  pagingProps
+}, ref) {
   const composite = (0, _components.__unstableUseCompositeState)({
     orientation
   });
@@ -122,7 +139,8 @@ function BlockPatternList({
     ...composite,
     role: "listbox",
     className: "block-editor-block-patterns-list",
-    "aria-label": label
+    "aria-label": label,
+    ref: ref
   }, blockPatterns.map(pattern => {
     const isShown = shownPatterns.includes(pattern);
     return isShown ? (0, _element.createElement)(BlockPattern, {
@@ -136,8 +154,10 @@ function BlockPatternList({
     }) : (0, _element.createElement)(BlockPatternPlaceholder, {
       key: pattern.name
     });
+  }), pagingProps && pagingProps.numPages > 1 && (0, _element.createElement)(_blockPatternsPaging.default, {
+    ...pagingProps
   }));
 }
-var _default = BlockPatternList;
+var _default = (0, _element.forwardRef)(BlockPatternList);
 exports.default = _default;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_components","_compose","_i18n","_blockPreview","_interopRequireDefault","_inserterDraggableBlocks","WithToolTip","showTooltip","title","children","createElement","Tooltip","text","Fragment","BlockPattern","isDraggable","pattern","onClick","onHover","composite","isDragging","setIsDragging","useState","blocks","viewportWidth","instanceId","useInstanceId","descriptionId","default","isEnabled","isPattern","draggable","onDragStart","onDragEnd","className","event","__unstableCompositeItem","role","as","onMouseEnter","onMouseLeave","description","undefined","VisuallyHidden","id","BlockPatternPlaceholder","BlockPatternList","blockPatterns","shownPatterns","onClickPattern","orientation","label","__","showTitlesAsTooltip","useCompositeState","__unstableComposite","map","isShown","includes","key","name","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-patterns-list/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\tVisuallyHidden,\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n\t__unstableCompositeItem as CompositeItem,\n\tTooltip,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BlockPreview from '../block-preview';\nimport InserterDraggableBlocks from '../inserter-draggable-blocks';\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\tisDraggable,\n\tpattern,\n\tonClick,\n\tonHover,\n\tcomposite,\n\tshowTooltip,\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\n\treturn (\n\t\t<InserterDraggableBlocks\n\t\t\tisEnabled={ isDraggable }\n\t\t\tblocks={ blocks }\n\t\t\tisPattern={ !! 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={ showTooltip }\n\t\t\t\t\t\ttitle={ pattern.title }\n\t\t\t\t\t>\n\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\tclassName=\"block-editor-block-patterns-list__item\"\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\taria-label={ pattern.title }\n\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\tpattern.description ? descriptionId : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ ! showTooltip && (\n\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{ pattern.title }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\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</CompositeItem>\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 BlockPatternList( {\n\tisDraggable,\n\tblockPatterns,\n\tshownPatterns,\n\tonHover,\n\tonClickPattern,\n\torientation,\n\tlabel = __( 'Block Patterns' ),\n\tshowTitlesAsTooltip,\n} ) {\n\tconst composite = useCompositeState( { orientation } );\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-block-patterns-list\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ blockPatterns.map( ( pattern ) => {\n\t\t\t\tconst isShown = shownPatterns.includes( pattern );\n\t\t\t\treturn isShown ? (\n\t\t\t\t\t<BlockPattern\n\t\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\t\tonClick={ onClickPattern }\n\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\tisDraggable={ isDraggable }\n\t\t\t\t\t\tcomposite={ composite }\n\t\t\t\t\t\tshowTooltip={ showTitlesAsTooltip }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BlockPatternPlaceholder key={ pattern.name } />\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Composite>\n\t);\n}\n\nexport default BlockPatternList;\n"],"mappings":"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"}
+{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_components","_compose","_i18n","_icons","_blockPreview","_inserterDraggableBlocks","_blockPatternsPaging","WithToolTip","showTooltip","title","children","createElement","Tooltip","text","Fragment","BlockPattern","isDraggable","pattern","onClick","onHover","composite","isDragging","setIsDragging","useState","blocks","viewportWidth","instanceId","useInstanceId","descriptionId","default","isEnabled","isPattern","draggable","onDragStart","onDragEnd","className","event","id","__unstableCompositeItem","role","as","classnames","syncStatus","onMouseEnter","onMouseLeave","description","undefined","__experimentalHStack","Icon","icon","symbol","VisuallyHidden","BlockPatternPlaceholder","BlockPatternList","blockPatterns","shownPatterns","onClickPattern","orientation","label","__","showTitlesAsTooltip","pagingProps","ref","useCompositeState","__unstableComposite","map","isShown","includes","key","name","numPages","_default","forwardRef","exports"],"sources":["@wordpress/block-editor/src/components/block-patterns-list/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, forwardRef } from '@wordpress/element';\nimport {\n\tVisuallyHidden,\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n\t__unstableCompositeItem as CompositeItem,\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';\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\tisDraggable,\n\tpattern,\n\tonClick,\n\tonHover,\n\tcomposite,\n\tshowTooltip,\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\n\treturn (\n\t\t<InserterDraggableBlocks\n\t\t\tisEnabled={ isDraggable }\n\t\t\tblocks={ blocks }\n\t\t\tisPattern={ !! 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={ showTooltip && ! pattern.id }\n\t\t\t\t\t\ttitle={ pattern.title }\n\t\t\t\t\t>\n\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__item',\n\t\t\t\t\t\t\t\t{\n\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\tpattern.id && ! pattern.syncStatus,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\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\taria-label={ pattern.title }\n\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\tpattern.description ? descriptionId : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t<HStack className=\"block-editor-patterns__pattern-details\">\n\t\t\t\t\t\t\t\t{ pattern.id && ! pattern.syncStatus && (\n\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<Icon\n\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\ticon={ symbol }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t{ ( ! showTooltip || pattern.id ) && (\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) }\n\t\t\t\t\t\t\t</HStack>\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</CompositeItem>\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 BlockPatternList(\n\t{\n\t\tisDraggable,\n\t\tblockPatterns,\n\t\tshownPatterns,\n\t\tonHover,\n\t\tonClickPattern,\n\t\torientation,\n\t\tlabel = __( 'Block Patterns' ),\n\t\tshowTitlesAsTooltip,\n\t\tpagingProps,\n\t},\n\tref\n) {\n\tconst composite = useCompositeState( { orientation } );\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\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\tconst isShown = shownPatterns.includes( pattern );\n\t\t\t\treturn isShown ? (\n\t\t\t\t\t<BlockPattern\n\t\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\t\tonClick={ onClickPattern }\n\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\tisDraggable={ isDraggable }\n\t\t\t\t\t\tcomposite={ composite }\n\t\t\t\t\t\tshowTooltip={ showTitlesAsTooltip }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BlockPatternPlaceholder key={ pattern.name } />\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ pagingProps && pagingProps.numPages > 1 && (\n\t\t\t\t<BlockPatternsPaging { ...pagingProps } />\n\t\t\t) }\n\t\t</Composite>\n\t);\n}\n\nexport default forwardRef( BlockPatternList );\n"],"mappings":"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"}

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

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Pagination;
+var _element = require("@wordpress/element");
+var _components = require("@wordpress/components");
+var _i18n = require("@wordpress/i18n");
+/**
+ * WordPress dependencies
+ */
+
+function Pagination({
+  currentPage,
+  numPages,
+  changePage,
+  totalItems
+}) {
+  return (0, _element.createElement)(_components.__experimentalVStack, {
+    className: "block-editor-patterns__grid-pagination-wrapper"
+  }, (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  },
+  // translators: %s: Total number of patterns.
+  (0, _i18n.sprintf)(
+  // translators: %s: Total number of patterns.
+  (0, _i18n._n)('%s item', '%s items', totalItems), totalItems)), (0, _element.createElement)(_components.__experimentalHStack, {
+    expanded: false,
+    spacing: 3,
+    justify: "flex-start",
+    className: "block-editor-patterns__grid-pagination"
+  }, (0, _element.createElement)(_components.__experimentalHStack, {
+    expanded: false,
+    spacing: 1,
+    className: "block-editor-patterns__grid-pagination-previous"
+  }, (0, _element.createElement)(_components.Button, {
+    variant: "tertiary",
+    onClick: () => changePage(1),
+    disabled: currentPage === 1,
+    "aria-label": (0, _i18n.__)('First page')
+  }, (0, _element.createElement)("span", null, "\xAB")), (0, _element.createElement)(_components.Button, {
+    variant: "tertiary",
+    onClick: () => changePage(currentPage - 1),
+    disabled: currentPage === 1,
+    "aria-label": (0, _i18n.__)('Previous page')
+  }, (0, _element.createElement)("span", null, "\u2039"))), (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  }, (0, _i18n.sprintf)(
+  // translators: %1$s: Current page number, %2$s: Total number of pages.
+  (0, _i18n._x)('%1$s of %2$s', 'paging'), currentPage, numPages)), (0, _element.createElement)(_components.__experimentalHStack, {
+    expanded: false,
+    spacing: 1,
+    className: "block-editor-patterns__grid-pagination-next"
+  }, (0, _element.createElement)(_components.Button, {
+    variant: "tertiary",
+    onClick: () => changePage(currentPage + 1),
+    disabled: currentPage === numPages,
+    "aria-label": (0, _i18n.__)('Next page')
+  }, (0, _element.createElement)("span", null, "\u203A")), (0, _element.createElement)(_components.Button, {
+    variant: "tertiary",
+    onClick: () => changePage(numPages),
+    disabled: currentPage === numPages,
+    "aria-label": (0, _i18n.__)('Last page'),
+    size: "default"
+  }, (0, _element.createElement)("span", null, "\xBB")))));
+}
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_components","require","_i18n","Pagination","currentPage","numPages","changePage","totalItems","_element","createElement","__experimentalVStack","className","__experimentalText","variant","sprintf","_n","__experimentalHStack","expanded","spacing","justify","Button","onClick","disabled","__","_x","size"],"sources":["@wordpress/block-editor/src/components/block-patterns-paging/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n\tButton,\n} from '@wordpress/components';\nimport { __, _x, _n, sprintf } from '@wordpress/i18n';\n\nexport default function Pagination( {\n\tcurrentPage,\n\tnumPages,\n\tchangePage,\n\ttotalItems,\n} ) {\n\treturn (\n\t\t<VStack className=\"block-editor-patterns__grid-pagination-wrapper\">\n\t\t\t<Text variant=\"muted\">\n\t\t\t\t{\n\t\t\t\t\t// translators: %s: Total number of patterns.\n\t\t\t\t\tsprintf(\n\t\t\t\t\t\t// translators: %s: Total number of patterns.\n\t\t\t\t\t\t_n( '%s item', '%s items', totalItems ),\n\t\t\t\t\t\ttotalItems\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t</Text>\n\t\t\t<HStack\n\t\t\t\texpanded={ false }\n\t\t\t\tspacing={ 3 }\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tclassName=\"block-editor-patterns__grid-pagination\"\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\texpanded={ false }\n\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\tclassName=\"block-editor-patterns__grid-pagination-previous\"\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => changePage( 1 ) }\n\t\t\t\t\t\tdisabled={ currentPage === 1 }\n\t\t\t\t\t\taria-label={ __( 'First page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<span>«</span>\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => changePage( currentPage - 1 ) }\n\t\t\t\t\t\tdisabled={ currentPage === 1 }\n\t\t\t\t\t\taria-label={ __( 'Previous page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<span>‹</span>\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t\t<Text variant=\"muted\">\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t// translators: %1$s: Current page number, %2$s: Total number of pages.\n\t\t\t\t\t\t_x( '%1$s of %2$s', 'paging' ),\n\t\t\t\t\t\tcurrentPage,\n\t\t\t\t\t\tnumPages\n\t\t\t\t\t) }\n\t\t\t\t</Text>\n\t\t\t\t<HStack\n\t\t\t\t\texpanded={ false }\n\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\tclassName=\"block-editor-patterns__grid-pagination-next\"\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => changePage( currentPage + 1 ) }\n\t\t\t\t\t\tdisabled={ currentPage === numPages }\n\t\t\t\t\t\taria-label={ __( 'Next page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<span>›</span>\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => changePage( numPages ) }\n\t\t\t\t\t\tdisabled={ currentPage === numPages }\n\t\t\t\t\t\taria-label={ __( 'Last page' ) }\n\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span>»</span>\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAMA,IAAAC,KAAA,GAAAD,OAAA;AATA;AACA;AACA;;AASe,SAASE,UAAUA,CAAE;EACnCC,WAAW;EACXC,QAAQ;EACRC,UAAU;EACVC;AACD,CAAC,EAAG;EACH,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAU,oBAAM;IAACC,SAAS,EAAC;EAAgD,GACjE,IAAAH,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAY,kBAAI;IAACC,OAAO,EAAC;EAAO;EAEnB;EACA,IAAAC,aAAO;EACN;EACA,IAAAC,QAAE,EAAE,SAAS,EAAE,UAAU,EAAER,UAAW,CAAC,EACvCA,UACD,CAEI,CAAC,EACP,IAAAC,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAgB,oBAAM;IACNC,QAAQ,EAAG,KAAO;IAClBC,OAAO,EAAG,CAAG;IACbC,OAAO,EAAC,YAAY;IACpBR,SAAS,EAAC;EAAwC,GAElD,IAAAH,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAgB,oBAAM;IACNC,QAAQ,EAAG,KAAO;IAClBC,OAAO,EAAG,CAAG;IACbP,SAAS,EAAC;EAAiD,GAE3D,IAAAH,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAoB,MAAM;IACNP,OAAO,EAAC,UAAU;IAClBQ,OAAO,EAAGA,CAAA,KAAMf,UAAU,CAAE,CAAE,CAAG;IACjCgB,QAAQ,EAAGlB,WAAW,KAAK,CAAG;IAC9B,cAAa,IAAAmB,QAAE,EAAE,YAAa;EAAG,GAEjC,IAAAf,QAAA,CAAAC,aAAA,gBAAM,MAAO,CACN,CAAC,EACT,IAAAD,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAoB,MAAM;IACNP,OAAO,EAAC,UAAU;IAClBQ,OAAO,EAAGA,CAAA,KAAMf,UAAU,CAAEF,WAAW,GAAG,CAAE,CAAG;IAC/CkB,QAAQ,EAAGlB,WAAW,KAAK,CAAG;IAC9B,cAAa,IAAAmB,QAAE,EAAE,eAAgB;EAAG,GAEpC,IAAAf,QAAA,CAAAC,aAAA,gBAAM,QAAO,CACN,CACD,CAAC,EACT,IAAAD,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAY,kBAAI;IAACC,OAAO,EAAC;EAAO,GAClB,IAAAC,aAAO;EACR;EACA,IAAAU,QAAE,EAAE,cAAc,EAAE,QAAS,CAAC,EAC9BpB,WAAW,EACXC,QACD,CACK,CAAC,EACP,IAAAG,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAgB,oBAAM;IACNC,QAAQ,EAAG,KAAO;IAClBC,OAAO,EAAG,CAAG;IACbP,SAAS,EAAC;EAA6C,GAEvD,IAAAH,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAoB,MAAM;IACNP,OAAO,EAAC,UAAU;IAClBQ,OAAO,EAAGA,CAAA,KAAMf,UAAU,CAAEF,WAAW,GAAG,CAAE,CAAG;IAC/CkB,QAAQ,EAAGlB,WAAW,KAAKC,QAAU;IACrC,cAAa,IAAAkB,QAAE,EAAE,WAAY;EAAG,GAEhC,IAAAf,QAAA,CAAAC,aAAA,gBAAM,QAAO,CACN,CAAC,EACT,IAAAD,QAAA,CAAAC,aAAA,EAACT,WAAA,CAAAoB,MAAM;IACNP,OAAO,EAAC,UAAU;IAClBQ,OAAO,EAAGA,CAAA,KAAMf,UAAU,CAAED,QAAS,CAAG;IACxCiB,QAAQ,EAAGlB,WAAW,KAAKC,QAAU;IACrC,cAAa,IAAAkB,QAAE,EAAE,WAAY,CAAG;IAChCE,IAAI,EAAC;EAAS,GAEd,IAAAjB,QAAA,CAAAC,aAAA,gBAAM,MAAO,CACN,CACD,CACD,CACD,CAAC;AAEX"}

package/build/components/block-settings-menu/block-settings-dropdown.js

@@ -20,6 +20,7 @@ var _blockHtmlConvertButton = _interopRequireDefault(require("./block-html-conve
 var _blockSettingsMenuFirstItem = _interopRequireDefault(require("./block-settings-menu-first-item"));
 var _blockSettingsMenuControls = _interopRequireDefault(require("../block-settings-menu-controls"));
 var _store = require("../../store");
+var _lockUnlock = require("../../lock-unlock");
 var _utils = require("../block-toolbar/utils");
 /**
  * WordPress dependencies
@@ -46,12 +47,15 @@ function CopyMenuItem({
   }, copyMenuItemLabel);
 }
 function BlockSettingsDropdown({
+  block,
   clientIds,
   __experimentalSelectBlock,
   children,
   __unstableDisplayLocation,
   ...props
 }) {
+  // Get the client id of the current block for this menu, if one is set.
+  const currentClientId = block?.clientId;
   const blockClientIds = Array.isArray(clientIds) ? clientIds : [clientIds];
   const count = blockClientIds.length;
   const firstBlockClientId = blockClientIds[0];
@@ -87,6 +91,10 @@ function BlockSettingsDropdown({
     getBlockOrder,
     getSelectedBlockClientIds
   } = (0, _data.useSelect)(_store.store);
+  const openedBlockSettingsMenu = (0, _data.useSelect)(select => (0, _lockUnlock.unlock)(select(_store.store)).getOpenedBlockSettingsMenu(), []);
+  const {
+    setOpenedBlockSettingsMenu
+  } = (0, _lockUnlock.unlock)((0, _data.useDispatch)(_store.store));
   const shortcuts = (0, _data.useSelect)(select => {
     const {
       getShortcutRepresentation
@@ -138,6 +146,22 @@ function BlockSettingsDropdown({
   // This can occur when the selected block (the parent)
   // displays child blocks within a List View.
   const parentBlockIsSelected = selectedBlockClientIds?.includes(firstParentClientId);
+
+  // When a currentClientId is in use, treat the menu as a controlled component.
+  // This ensures that only one block settings menu is open at a time.
+  // This is a temporary solution to work around an issue with `onFocusOutside`
+  // where it does not allow a dropdown to be closed if focus was never within
+  // the dropdown to begin with. Examples include a user either CMD+Clicking or
+  // right clicking into an inactive window.
+  // See: https://github.com/WordPress/gutenberg/pull/54083
+  const open = !currentClientId ? undefined : openedBlockSettingsMenu === currentClientId || false;
+  const onToggle = (0, _element.useCallback)(localOpen => {
+    if (localOpen && openedBlockSettingsMenu !== currentClientId) {
+      setOpenedBlockSettingsMenu(currentClientId);
+    } else if (!localOpen && openedBlockSettingsMenu && openedBlockSettingsMenu === currentClientId) {
+      setOpenedBlockSettingsMenu(undefined);
+    }
+  }, [currentClientId, openedBlockSettingsMenu, setOpenedBlockSettingsMenu]);
   return (0, _element.createElement)(_blockActions.default, {
     clientIds: clientIds,
     __experimentalUpdateSelection: !__experimentalSelectBlock
@@ -160,6 +184,8 @@ function BlockSettingsDropdown({
     label: (0, _i18n.__)('Options'),
     className: "block-editor-block-settings-menu",
     popoverProps: POPOVER_PROPS,
+    open: open,
+    onToggle: onToggle,
     noIcons: true,
     menuProps: {
       /**
@@ -175,9 +201,11 @@ function BlockSettingsDropdown({
           updateSelectionAfterDuplicate(onDuplicate());
         } else if (isMatch('core/block-editor/insert-after', event) && canInsertDefaultBlock) {
           event.preventDefault();
+          setOpenedBlockSettingsMenu(undefined);
           onInsertAfter();
         } else if (isMatch('core/block-editor/insert-before', event) && canInsertDefaultBlock) {
           event.preventDefault();
+          setOpenedBlockSettingsMenu(undefined);
           onInsertBefore();
         }
       }