@wordpress/block-editor 12.14.0 → 12.16.0

package/build-module/components/block-toolbar/index.js

@@ -7,6 +7,7 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
+import { __ } from '@wordpress/i18n';
 import { useSelect } from '@wordpress/data';
 import { useRef } from '@wordpress/element';
 import { useViewportMatch } from '@wordpress/compose';
@@ -28,19 +29,40 @@ import BlockEditVisuallyButton from '../block-edit-visually-button';
 import { useShowHoveredOrFocusedGestures } from './utils';
 import { store as blockEditorStore } from '../../store';
 import __unstableBlockNameContext from './block-name-context';
-const BlockToolbar = ({
-  hideDragHandle
-}) => {
+import NavigableToolbar from '../navigable-toolbar';
+import { useHasAnyBlockControls } from '../block-controls/use-has-block-controls';
+
+/**
+ * Renders the block toolbar.
+ *
+ * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md
+ *
+ * @param {Object}   props                             Components props.
+ * @param {boolean}  props.hideDragHandle              Show or hide the Drag Handle for drag and drop functionality.
+ * @param {boolean}  props.focusOnMount                Focus the toolbar when mounted.
+ * @param {number}   props.__experimentalInitialIndex  The initial index of the toolbar item to focus.
+ * @param {Function} props.__experimentalOnIndexChange Callback function to be called when the index of the focused toolbar item changes.
+ * @param {string}   props.variant                     Style variant of the toolbar, also passed to the Dropdowns rendered from Block Toolbar Buttons.
+ */
+export function PrivateBlockToolbar({
+  hideDragHandle,
+  focusOnMount,
+  __experimentalInitialIndex,
+  __experimentalOnIndexChange,
+  variant = 'unstyled'
+}) {
   const {
+    blockClientId,
     blockClientIds,
+    isDefaultEditingMode,
     blockType,
-    isValid,
-    isVisual,
-    blockEditingMode
+    shouldShowVisualToolbar,
+    showParentSelector
   } = useSelect(select => {
     const {
       getBlockName,
       getBlockMode,
+      getBlockParents,
       getSelectedBlockClientIds,
       isBlockValid,
       getBlockRootClientId,
@@ -49,13 +71,21 @@ const BlockToolbar = ({
     const selectedBlockClientIds = getSelectedBlockClientIds();
     const selectedBlockClientId = selectedBlockClientIds[0];
     const blockRootClientId = getBlockRootClientId(selectedBlockClientId);
+    const parents = getBlockParents(selectedBlockClientId);
+    const firstParentClientId = parents[parents.length - 1];
+    const parentBlockName = getBlockName(firstParentClientId);
+    const parentBlockType = getBlockType(parentBlockName);
+    const _isDefaultEditingMode = getBlockEditingMode(selectedBlockClientId) === 'default';
+    const isValid = selectedBlockClientIds.every(id => isBlockValid(id));
+    const isVisual = selectedBlockClientIds.every(id => getBlockMode(id) === 'visual');
     return {
+      blockClientId: selectedBlockClientId,
       blockClientIds: selectedBlockClientIds,
+      isDefaultEditingMode: _isDefaultEditingMode,
       blockType: selectedBlockClientId && getBlockType(getBlockName(selectedBlockClientId)),
+      shouldShowVisualToolbar: isValid && isVisual,
       rootClientId: blockRootClientId,
-      isValid: selectedBlockClientIds.every(id => isBlockValid(id)),
-      isVisual: selectedBlockClientIds.every(id => getBlockMode(id) === 'visual'),
-      blockEditingMode: getBlockEditingMode(selectedBlockClientId)
+      showParentSelector: parentBlockType && getBlockEditingMode(firstParentClientId) === 'default' && hasBlockSupport(parentBlockType, '__experimentalParentSelector', true) && selectedBlockClientIds.length === 1 && _isDefaultEditingMode
     };
   }, []);
   const toolbarWrapperRef = useRef(null);
@@ -67,24 +97,40 @@ const BlockToolbar = ({
     ref: nodeRef
   });
   const isLargeViewport = !useViewportMatch('medium', '<');
-  if (blockType) {
-    if (!hasBlockSupport(blockType, '__experimentalToolbar', true)) {
-      return null;
-    }
-  }
-  if (blockClientIds.length === 0) {
+  const isToolbarEnabled = blockType && hasBlockSupport(blockType, '__experimentalToolbar', true);
+  const hasAnyBlockControls = useHasAnyBlockControls();
+  if (!isToolbarEnabled || !isDefaultEditingMode && !hasAnyBlockControls) {
     return null;
   }
-  const shouldShowVisualToolbar = isValid && isVisual;
   const isMultiToolbar = blockClientIds.length > 1;
   const isSynced = isReusableBlock(blockType) || isTemplatePart(blockType);
-  const classes = classnames('block-editor-block-toolbar', {
+
+  // Shifts the toolbar to make room for the parent block selector.
+  const classes = classnames('block-editor-block-contextual-toolbar', {
+    'has-parent': showParentSelector
+  });
+  const innerClasses = classnames('block-editor-block-toolbar', {
     'is-synced': isSynced
   });
-  return createElement("div", {
-    className: classes,
-    ref: toolbarWrapperRef
-  }, !isMultiToolbar && isLargeViewport && blockEditingMode === 'default' && createElement(BlockParentSelector, null), (shouldShowVisualToolbar || isMultiToolbar) && blockEditingMode === 'default' && createElement("div", {
+  return createElement(NavigableToolbar, {
+    focusEditorOnEscape: true,
+    className: classes
+    /* translators: accessibility text for the block toolbar */,
+    "aria-label": __('Block tools')
+    // The variant is applied as "toolbar" when undefined, which is the black border style of the dropdown from the toolbar popover.
+    ,
+    variant: variant === 'toolbar' ? undefined : variant,
+    focusOnMount: focusOnMount,
+    __experimentalInitialIndex: __experimentalInitialIndex,
+    __experimentalOnIndexChange: __experimentalOnIndexChange
+    // Resets the index whenever the active block changes so
+    // this is not persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169
+    ,
+    key: blockClientId
+  }, createElement("div", {
+    ref: toolbarWrapperRef,
+    className: innerClasses
+  }, !isMultiToolbar && isLargeViewport && isDefaultEditingMode && createElement(BlockParentSelector, null), (shouldShowVisualToolbar || isMultiToolbar) && isDefaultEditingMode && createElement("div", {
     ref: nodeRef,
     ...showHoveredOrFocusedGestures
   }, createElement(ToolbarGroup, {
@@ -115,13 +161,30 @@ const BlockToolbar = ({
     value: blockType?.name
   }, createElement(__unstableBlockToolbarLastItem.Slot, null))), createElement(BlockEditVisuallyButton, {
     clientIds: blockClientIds
-  }), blockEditingMode === 'default' && createElement(BlockSettingsMenu, {
+  }), isDefaultEditingMode && createElement(BlockSettingsMenu, {
     clientIds: blockClientIds
-  }));
-};
+  })));
+}
 
 /**
+ * Renders the block toolbar.
+ *
  * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md
+ *
+ * @param {Object}  props                Components props.
+ * @param {boolean} props.hideDragHandle Show or hide the Drag Handle for drag and drop functionality.
+ * @param {string}  props.variant        Style variant of the toolbar, also passed to the Dropdowns rendered from Block Toolbar Buttons.
  */
-export default BlockToolbar;
+export default function BlockToolbar({
+  hideDragHandle,
+  variant
+}) {
+  return createElement(PrivateBlockToolbar, {
+    hideDragHandle: hideDragHandle,
+    variant: variant,
+    focusOnMount: undefined,
+    __experimentalInitialIndex: undefined,
+    __experimentalOnIndexChange: undefined
+  });
+}
 //# sourceMappingURL=index.js.map

package/build-module/components/block-toolbar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","useSelect","useRef","useViewportMatch","getBlockType","hasBlockSupport","isReusableBlock","isTemplatePart","ToolbarGroup","BlockMover","BlockParentSelector","BlockSwitcher","BlockControls","__unstableBlockToolbarLastItem","BlockSettingsMenu","BlockLockToolbar","BlockGroupToolbar","BlockEditVisuallyButton","useShowHoveredOrFocusedGestures","store","blockEditorStore","__unstableBlockNameContext","BlockToolbar","hideDragHandle","blockClientIds","blockType","isValid","isVisual","blockEditingMode","select","getBlockName","getBlockMode","getSelectedBlockClientIds","isBlockValid","getBlockRootClientId","getBlockEditingMode","selectedBlockClientIds","selectedBlockClientId","blockRootClientId","rootClientId","every","id","toolbarWrapperRef","nodeRef","showHoveredOrFocusedGestures","ref","isLargeViewport","length","shouldShowVisualToolbar","isMultiToolbar","isSynced","classes","createElement","className","clientIds","clientId","wrapperRef","Fragment","Slot","group","Provider","value","name"],"sources":["@wordpress/block-editor/src/components/block-toolbar/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useRef } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\tgetBlockType,\n\thasBlockSupport,\n\tisReusableBlock,\n\tisTemplatePart,\n} from '@wordpress/blocks';\nimport { ToolbarGroup } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BlockMover from '../block-mover';\nimport BlockParentSelector from '../block-parent-selector';\nimport BlockSwitcher from '../block-switcher';\nimport BlockControls from '../block-controls';\nimport __unstableBlockToolbarLastItem from './block-toolbar-last-item';\nimport BlockSettingsMenu from '../block-settings-menu';\nimport { BlockLockToolbar } from '../block-lock';\nimport { BlockGroupToolbar } from '../convert-to-group-buttons';\nimport BlockEditVisuallyButton from '../block-edit-visually-button';\nimport { useShowHoveredOrFocusedGestures } from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport __unstableBlockNameContext from './block-name-context';\n\nconst BlockToolbar = ( { hideDragHandle } ) => {\n\tconst { blockClientIds, blockType, isValid, isVisual, blockEditingMode } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockName,\n\t\t\t\tgetBlockMode,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\tisBlockValid,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockEditingMode,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\t\t\tconst selectedBlockClientId = selectedBlockClientIds[ 0 ];\n\t\t\tconst blockRootClientId = getBlockRootClientId(\n\t\t\t\tselectedBlockClientId\n\t\t\t);\n\t\t\treturn {\n\t\t\t\tblockClientIds: selectedBlockClientIds,\n\t\t\t\tblockType:\n\t\t\t\t\tselectedBlockClientId &&\n\t\t\t\t\tgetBlockType( getBlockName( selectedBlockClientId ) ),\n\t\t\t\trootClientId: blockRootClientId,\n\t\t\t\tisValid: selectedBlockClientIds.every( ( id ) =>\n\t\t\t\t\tisBlockValid( id )\n\t\t\t\t),\n\t\t\t\tisVisual: selectedBlockClientIds.every(\n\t\t\t\t\t( id ) => getBlockMode( id ) === 'visual'\n\t\t\t\t),\n\t\t\t\tblockEditingMode: getBlockEditingMode( selectedBlockClientId ),\n\t\t\t};\n\t\t}, [] );\n\n\tconst toolbarWrapperRef = useRef( null );\n\n\t// Handles highlighting the current block outline on hover or focus of the\n\t// block type toolbar area.\n\tconst nodeRef = useRef();\n\tconst showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures( {\n\t\tref: nodeRef,\n\t} );\n\n\tconst isLargeViewport = ! useViewportMatch( 'medium', '<' );\n\n\tif ( blockType ) {\n\t\tif ( ! hasBlockSupport( blockType, '__experimentalToolbar', true ) ) {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\tif ( blockClientIds.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst shouldShowVisualToolbar = isValid && isVisual;\n\tconst isMultiToolbar = blockClientIds.length > 1;\n\tconst isSynced =\n\t\tisReusableBlock( blockType ) || isTemplatePart( blockType );\n\n\tconst classes = classnames( 'block-editor-block-toolbar', {\n\t\t'is-synced': isSynced,\n\t} );\n\n\treturn (\n\t\t<div className={ classes } ref={ toolbarWrapperRef }>\n\t\t\t{ ! isMultiToolbar &&\n\t\t\t\tisLargeViewport &&\n\t\t\t\tblockEditingMode === 'default' && <BlockParentSelector /> }\n\t\t\t{ ( shouldShowVisualToolbar || isMultiToolbar ) &&\n\t\t\t\tblockEditingMode === 'default' && (\n\t\t\t\t\t<div ref={ nodeRef } { ...showHoveredOrFocusedGestures }>\n\t\t\t\t\t\t<ToolbarGroup className=\"block-editor-block-toolbar__block-controls\">\n\t\t\t\t\t\t\t<BlockSwitcher clientIds={ blockClientIds } />\n\t\t\t\t\t\t\t{ ! isMultiToolbar && (\n\t\t\t\t\t\t\t\t<BlockLockToolbar\n\t\t\t\t\t\t\t\t\tclientId={ blockClientIds[ 0 ] }\n\t\t\t\t\t\t\t\t\twrapperRef={ toolbarWrapperRef }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<BlockMover\n\t\t\t\t\t\t\t\tclientIds={ blockClientIds }\n\t\t\t\t\t\t\t\thideDragHandle={ hideDragHandle }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</ToolbarGroup>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t{ shouldShowVisualToolbar && isMultiToolbar && (\n\t\t\t\t<BlockGroupToolbar />\n\t\t\t) }\n\t\t\t{ shouldShowVisualToolbar && (\n\t\t\t\t<>\n\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\tgroup=\"parent\"\n\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t/>\n\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\tgroup=\"block\"\n\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t/>\n\t\t\t\t\t<BlockControls.Slot className=\"block-editor-block-toolbar__slot\" />\n\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\tgroup=\"inline\"\n\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t/>\n\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\tgroup=\"other\"\n\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t/>\n\t\t\t\t\t<__unstableBlockNameContext.Provider\n\t\t\t\t\t\tvalue={ blockType?.name }\n\t\t\t\t\t>\n\t\t\t\t\t\t<__unstableBlockToolbarLastItem.Slot />\n\t\t\t\t\t</__unstableBlockNameContext.Provider>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t<BlockEditVisuallyButton clientIds={ blockClientIds } />\n\t\t\t{ blockEditingMode === 'default' && (\n\t\t\t\t<BlockSettingsMenu clientIds={ blockClientIds } />\n\t\t\t) }\n\t\t</div>\n\t);\n};\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md\n */\nexport default BlockToolbar;\n"],"mappings":"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"}
+{"version":3,"names":["classnames","__","useSelect","useRef","useViewportMatch","getBlockType","hasBlockSupport","isReusableBlock","isTemplatePart","ToolbarGroup","BlockMover","BlockParentSelector","BlockSwitcher","BlockControls","__unstableBlockToolbarLastItem","BlockSettingsMenu","BlockLockToolbar","BlockGroupToolbar","BlockEditVisuallyButton","useShowHoveredOrFocusedGestures","store","blockEditorStore","__unstableBlockNameContext","NavigableToolbar","useHasAnyBlockControls","PrivateBlockToolbar","hideDragHandle","focusOnMount","__experimentalInitialIndex","__experimentalOnIndexChange","variant","blockClientId","blockClientIds","isDefaultEditingMode","blockType","shouldShowVisualToolbar","showParentSelector","select","getBlockName","getBlockMode","getBlockParents","getSelectedBlockClientIds","isBlockValid","getBlockRootClientId","getBlockEditingMode","selectedBlockClientIds","selectedBlockClientId","blockRootClientId","parents","firstParentClientId","length","parentBlockName","parentBlockType","_isDefaultEditingMode","isValid","every","id","isVisual","rootClientId","toolbarWrapperRef","nodeRef","showHoveredOrFocusedGestures","ref","isLargeViewport","isToolbarEnabled","hasAnyBlockControls","isMultiToolbar","isSynced","classes","innerClasses","createElement","focusEditorOnEscape","className","undefined","key","clientIds","clientId","wrapperRef","Fragment","Slot","group","Provider","value","name","BlockToolbar"],"sources":["@wordpress/block-editor/src/components/block-toolbar/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { useRef } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\tgetBlockType,\n\thasBlockSupport,\n\tisReusableBlock,\n\tisTemplatePart,\n} from '@wordpress/blocks';\nimport { ToolbarGroup } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BlockMover from '../block-mover';\nimport BlockParentSelector from '../block-parent-selector';\nimport BlockSwitcher from '../block-switcher';\nimport BlockControls from '../block-controls';\nimport __unstableBlockToolbarLastItem from './block-toolbar-last-item';\nimport BlockSettingsMenu from '../block-settings-menu';\nimport { BlockLockToolbar } from '../block-lock';\nimport { BlockGroupToolbar } from '../convert-to-group-buttons';\nimport BlockEditVisuallyButton from '../block-edit-visually-button';\nimport { useShowHoveredOrFocusedGestures } from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport __unstableBlockNameContext from './block-name-context';\nimport NavigableToolbar from '../navigable-toolbar';\nimport { useHasAnyBlockControls } from '../block-controls/use-has-block-controls';\n\n/**\n * Renders the block toolbar.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md\n *\n * @param {Object}   props                             Components props.\n * @param {boolean}  props.hideDragHandle              Show or hide the Drag Handle for drag and drop functionality.\n * @param {boolean}  props.focusOnMount                Focus the toolbar when mounted.\n * @param {number}   props.__experimentalInitialIndex  The initial index of the toolbar item to focus.\n * @param {Function} props.__experimentalOnIndexChange Callback function to be called when the index of the focused toolbar item changes.\n * @param {string}   props.variant                     Style variant of the toolbar, also passed to the Dropdowns rendered from Block Toolbar Buttons.\n */\nexport function PrivateBlockToolbar( {\n\thideDragHandle,\n\tfocusOnMount,\n\t__experimentalInitialIndex,\n\t__experimentalOnIndexChange,\n\tvariant = 'unstyled',\n} ) {\n\tconst {\n\t\tblockClientId,\n\t\tblockClientIds,\n\t\tisDefaultEditingMode,\n\t\tblockType,\n\t\tshouldShowVisualToolbar,\n\t\tshowParentSelector,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetBlockName,\n\t\t\tgetBlockMode,\n\t\t\tgetBlockParents,\n\t\t\tgetSelectedBlockClientIds,\n\t\t\tisBlockValid,\n\t\t\tgetBlockRootClientId,\n\t\t\tgetBlockEditingMode,\n\t\t} = select( blockEditorStore );\n\t\tconst selectedBlockClientIds = getSelectedBlockClientIds();\n\t\tconst selectedBlockClientId = selectedBlockClientIds[ 0 ];\n\t\tconst blockRootClientId = getBlockRootClientId( selectedBlockClientId );\n\t\tconst parents = getBlockParents( selectedBlockClientId );\n\t\tconst firstParentClientId = parents[ parents.length - 1 ];\n\t\tconst parentBlockName = getBlockName( firstParentClientId );\n\t\tconst parentBlockType = getBlockType( parentBlockName );\n\t\tconst _isDefaultEditingMode =\n\t\t\tgetBlockEditingMode( selectedBlockClientId ) === 'default';\n\t\tconst isValid = selectedBlockClientIds.every( ( id ) =>\n\t\t\tisBlockValid( id )\n\t\t);\n\t\tconst isVisual = selectedBlockClientIds.every(\n\t\t\t( id ) => getBlockMode( id ) === 'visual'\n\t\t);\n\t\treturn {\n\t\t\tblockClientId: selectedBlockClientId,\n\t\t\tblockClientIds: selectedBlockClientIds,\n\t\t\tisDefaultEditingMode: _isDefaultEditingMode,\n\t\t\tblockType:\n\t\t\t\tselectedBlockClientId &&\n\t\t\t\tgetBlockType( getBlockName( selectedBlockClientId ) ),\n\n\t\t\tshouldShowVisualToolbar: isValid && isVisual,\n\t\t\trootClientId: blockRootClientId,\n\t\t\tshowParentSelector:\n\t\t\t\tparentBlockType &&\n\t\t\t\tgetBlockEditingMode( firstParentClientId ) === 'default' &&\n\t\t\t\thasBlockSupport(\n\t\t\t\t\tparentBlockType,\n\t\t\t\t\t'__experimentalParentSelector',\n\t\t\t\t\ttrue\n\t\t\t\t) &&\n\t\t\t\tselectedBlockClientIds.length === 1 &&\n\t\t\t\t_isDefaultEditingMode,\n\t\t};\n\t}, [] );\n\n\tconst toolbarWrapperRef = useRef( null );\n\n\t// Handles highlighting the current block outline on hover or focus of the\n\t// block type toolbar area.\n\tconst nodeRef = useRef();\n\tconst showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures( {\n\t\tref: nodeRef,\n\t} );\n\n\tconst isLargeViewport = ! useViewportMatch( 'medium', '<' );\n\n\tconst isToolbarEnabled =\n\t\tblockType &&\n\t\thasBlockSupport( blockType, '__experimentalToolbar', true );\n\tconst hasAnyBlockControls = useHasAnyBlockControls();\n\n\tif (\n\t\t! isToolbarEnabled ||\n\t\t( ! isDefaultEditingMode && ! hasAnyBlockControls )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isMultiToolbar = blockClientIds.length > 1;\n\tconst isSynced =\n\t\tisReusableBlock( blockType ) || isTemplatePart( blockType );\n\n\t// Shifts the toolbar to make room for the parent block selector.\n\tconst classes = classnames( 'block-editor-block-contextual-toolbar', {\n\t\t'has-parent': showParentSelector,\n\t} );\n\n\tconst innerClasses = classnames( 'block-editor-block-toolbar', {\n\t\t'is-synced': isSynced,\n\t} );\n\n\treturn (\n\t\t<NavigableToolbar\n\t\t\tfocusEditorOnEscape\n\t\t\tclassName={ classes }\n\t\t\t/* translators: accessibility text for the block toolbar */\n\t\t\taria-label={ __( 'Block tools' ) }\n\t\t\t// The variant is applied as \"toolbar\" when undefined, which is the black border style of the dropdown from the toolbar popover.\n\t\t\tvariant={ variant === 'toolbar' ? undefined : variant }\n\t\t\tfocusOnMount={ focusOnMount }\n\t\t\t__experimentalInitialIndex={ __experimentalInitialIndex }\n\t\t\t__experimentalOnIndexChange={ __experimentalOnIndexChange }\n\t\t\t// Resets the index whenever the active block changes so\n\t\t\t// this is not persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169\n\t\t\tkey={ blockClientId }\n\t\t>\n\t\t\t<div ref={ toolbarWrapperRef } className={ innerClasses }>\n\t\t\t\t{ ! isMultiToolbar &&\n\t\t\t\t\tisLargeViewport &&\n\t\t\t\t\tisDefaultEditingMode && <BlockParentSelector /> }\n\t\t\t\t{ ( shouldShowVisualToolbar || isMultiToolbar ) &&\n\t\t\t\t\tisDefaultEditingMode && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ nodeRef }\n\t\t\t\t\t\t\t{ ...showHoveredOrFocusedGestures }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ToolbarGroup className=\"block-editor-block-toolbar__block-controls\">\n\t\t\t\t\t\t\t\t<BlockSwitcher clientIds={ blockClientIds } />\n\t\t\t\t\t\t\t\t{ ! isMultiToolbar && (\n\t\t\t\t\t\t\t\t\t<BlockLockToolbar\n\t\t\t\t\t\t\t\t\t\tclientId={ blockClientIds[ 0 ] }\n\t\t\t\t\t\t\t\t\t\twrapperRef={ toolbarWrapperRef }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t<BlockMover\n\t\t\t\t\t\t\t\t\tclientIds={ blockClientIds }\n\t\t\t\t\t\t\t\t\thideDragHandle={ hideDragHandle }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolbarGroup>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t{ shouldShowVisualToolbar && isMultiToolbar && (\n\t\t\t\t\t<BlockGroupToolbar />\n\t\t\t\t) }\n\t\t\t\t{ shouldShowVisualToolbar && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\t\tgroup=\"parent\"\n\t\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\t\tgroup=\"block\"\n\t\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BlockControls.Slot className=\"block-editor-block-toolbar__slot\" />\n\t\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\t\tgroup=\"inline\"\n\t\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BlockControls.Slot\n\t\t\t\t\t\t\tgroup=\"other\"\n\t\t\t\t\t\t\tclassName=\"block-editor-block-toolbar__slot\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<__unstableBlockNameContext.Provider\n\t\t\t\t\t\t\tvalue={ blockType?.name }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<__unstableBlockToolbarLastItem.Slot />\n\t\t\t\t\t\t</__unstableBlockNameContext.Provider>\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t\t<BlockEditVisuallyButton clientIds={ blockClientIds } />\n\t\t\t\t{ isDefaultEditingMode && (\n\t\t\t\t\t<BlockSettingsMenu clientIds={ blockClientIds } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</NavigableToolbar>\n\t);\n}\n\n/**\n * Renders the block toolbar.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-toolbar/README.md\n *\n * @param {Object}  props                Components props.\n * @param {boolean} props.hideDragHandle Show or hide the Drag Handle for drag and drop functionality.\n * @param {string}  props.variant        Style variant of the toolbar, also passed to the Dropdowns rendered from Block Toolbar Buttons.\n */\nexport default function BlockToolbar( { hideDragHandle, variant } ) {\n\treturn (\n\t\t<PrivateBlockToolbar\n\t\t\thideDragHandle={ hideDragHandle }\n\t\t\tvariant={ variant }\n\t\t\tfocusOnMount={ undefined }\n\t\t\t__experimentalInitialIndex={ undefined }\n\t\t\t__experimentalOnIndexChange={ undefined }\n\t\t/>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/block-tools/block-toolbar-breadcrumb.js

@@ -0,0 +1,41 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+
+/**
+ * Internal dependencies
+ */
+import BlockSelectionButton from './block-selection-button';
+import BlockPopover from '../block-popover';
+import useBlockToolbarPopoverProps from './use-block-toolbar-popover-props';
+import useSelectedBlockToolProps from './use-selected-block-tool-props';
+export default function BlockToolbarBreadcrumb({
+  clientId,
+  __unstableContentRef
+}) {
+  const {
+    capturingClientId,
+    isInsertionPointVisible,
+    lastClientId,
+    rootClientId
+  } = useSelectedBlockToolProps(clientId);
+  const popoverProps = useBlockToolbarPopoverProps({
+    contentElement: __unstableContentRef?.current,
+    clientId
+  });
+  return createElement(BlockPopover, {
+    clientId: capturingClientId || clientId,
+    bottomClientId: lastClientId,
+    className: classnames('block-editor-block-list__block-popover', {
+      'is-insertion-point-visible': isInsertionPointVisible
+    }),
+    resize: false,
+    ...popoverProps
+  }, createElement(BlockSelectionButton, {
+    clientId: clientId,
+    rootClientId: rootClientId
+  }));
+}
+//# sourceMappingURL=block-toolbar-breadcrumb.js.map

package/build-module/components/block-tools/block-toolbar-breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classnames","BlockSelectionButton","BlockPopover","useBlockToolbarPopoverProps","useSelectedBlockToolProps","BlockToolbarBreadcrumb","clientId","__unstableContentRef","capturingClientId","isInsertionPointVisible","lastClientId","rootClientId","popoverProps","contentElement","current","createElement","bottomClientId","className","resize"],"sources":["@wordpress/block-editor/src/components/block-tools/block-toolbar-breadcrumb.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * Internal dependencies\n */\nimport BlockSelectionButton from './block-selection-button';\nimport BlockPopover from '../block-popover';\nimport useBlockToolbarPopoverProps from './use-block-toolbar-popover-props';\nimport useSelectedBlockToolProps from './use-selected-block-tool-props';\n\nexport default function BlockToolbarBreadcrumb( {\n\tclientId,\n\t__unstableContentRef,\n} ) {\n\tconst {\n\t\tcapturingClientId,\n\t\tisInsertionPointVisible,\n\t\tlastClientId,\n\t\trootClientId,\n\t} = useSelectedBlockToolProps( clientId );\n\n\tconst popoverProps = useBlockToolbarPopoverProps( {\n\t\tcontentElement: __unstableContentRef?.current,\n\t\tclientId,\n\t} );\n\n\treturn (\n\t\t<BlockPopover\n\t\t\tclientId={ capturingClientId || clientId }\n\t\t\tbottomClientId={ lastClientId }\n\t\t\tclassName={ classnames( 'block-editor-block-list__block-popover', {\n\t\t\t\t'is-insertion-point-visible': isInsertionPointVisible,\n\t\t\t} ) }\n\t\t\tresize={ false }\n\t\t\t{ ...popoverProps }\n\t\t>\n\t\t\t<BlockSelectionButton\n\t\t\t\tclientId={ clientId }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t/>\n\t\t</BlockPopover>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,OAAOC,oBAAoB,MAAM,0BAA0B;AAC3D,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,2BAA2B,MAAM,mCAAmC;AAC3E,OAAOC,yBAAyB,MAAM,iCAAiC;AAEvE,eAAe,SAASC,sBAAsBA,CAAE;EAC/CC,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,MAAM;IACLC,iBAAiB;IACjBC,uBAAuB;IACvBC,YAAY;IACZC;EACD,CAAC,GAAGP,yBAAyB,CAAEE,QAAS,CAAC;EAEzC,MAAMM,YAAY,GAAGT,2BAA2B,CAAE;IACjDU,cAAc,EAAEN,oBAAoB,EAAEO,OAAO;IAC7CR;EACD,CAAE,CAAC;EAEH,OACCS,aAAA,CAACb,YAAY;IACZI,QAAQ,EAAGE,iBAAiB,IAAIF,QAAU;IAC1CU,cAAc,EAAGN,YAAc;IAC/BO,SAAS,EAAGjB,UAAU,CAAE,wCAAwC,EAAE;MACjE,4BAA4B,EAAES;IAC/B,CAAE,CAAG;IACLS,MAAM,EAAG,KAAO;IAAA,GACXN;EAAY,GAEjBG,aAAA,CAACd,oBAAoB;IACpBK,QAAQ,EAAGA,QAAU;IACrBK,YAAY,EAAGA;EAAc,CAC7B,CACY,CAAC;AAEjB"}

package/build-module/components/block-tools/block-toolbar-popover.js

@@ -0,0 +1,76 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+/**
+ * WordPress dependencies
+ */
+import { useDispatch } from '@wordpress/data';
+import { useEffect, useRef } from '@wordpress/element';
+import { useShortcut } from '@wordpress/keyboard-shortcuts';
+/**
+ * Internal dependencies
+ */
+import BlockPopover from '../block-popover';
+import useBlockToolbarPopoverProps from './use-block-toolbar-popover-props';
+import useSelectedBlockToolProps from './use-selected-block-tool-props';
+import { store as blockEditorStore } from '../../store';
+import { PrivateBlockToolbar } from '../block-toolbar';
+export default function BlockToolbarPopover({
+  clientId,
+  isTyping,
+  __unstableContentRef
+}) {
+  const {
+    capturingClientId,
+    isInsertionPointVisible,
+    lastClientId
+  } = useSelectedBlockToolProps(clientId);
+
+  // Stores the active toolbar item index so the block toolbar can return focus
+  // to it when re-mounting.
+  const initialToolbarItemIndexRef = useRef();
+  useEffect(() => {
+    // Resets the index whenever the active block changes so this is not
+    // persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169
+    initialToolbarItemIndexRef.current = undefined;
+  }, [clientId]);
+  const {
+    stopTyping
+  } = useDispatch(blockEditorStore);
+  const isToolbarForced = useRef(false);
+  useShortcut('core/block-editor/focus-toolbar', () => {
+    isToolbarForced.current = true;
+    stopTyping(true);
+  }, {
+    isDisabled: false
+  });
+  useEffect(() => {
+    isToolbarForced.current = false;
+  });
+  const popoverProps = useBlockToolbarPopoverProps({
+    contentElement: __unstableContentRef?.current,
+    clientId
+  });
+  return !isTyping && createElement(BlockPopover, {
+    clientId: capturingClientId || clientId,
+    bottomClientId: lastClientId,
+    className: classnames('block-editor-block-list__block-popover', {
+      'is-insertion-point-visible': isInsertionPointVisible
+    }),
+    resize: false,
+    ...popoverProps
+  }, createElement(PrivateBlockToolbar
+  // If the toolbar is being shown because of being forced
+  // it should focus the toolbar right after the mount.
+  , {
+    focusOnMount: isToolbarForced.current,
+    __experimentalInitialIndex: initialToolbarItemIndexRef.current,
+    __experimentalOnIndexChange: index => {
+      initialToolbarItemIndexRef.current = index;
+    },
+    variant: "toolbar"
+  }));
+}
+//# sourceMappingURL=block-toolbar-popover.js.map

package/build-module/components/block-tools/block-toolbar-popover.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classnames","useDispatch","useEffect","useRef","useShortcut","BlockPopover","useBlockToolbarPopoverProps","useSelectedBlockToolProps","store","blockEditorStore","PrivateBlockToolbar","BlockToolbarPopover","clientId","isTyping","__unstableContentRef","capturingClientId","isInsertionPointVisible","lastClientId","initialToolbarItemIndexRef","current","undefined","stopTyping","isToolbarForced","isDisabled","popoverProps","contentElement","createElement","bottomClientId","className","resize","focusOnMount","__experimentalInitialIndex","__experimentalOnIndexChange","index","variant"],"sources":["@wordpress/block-editor/src/components/block-tools/block-toolbar-popover.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n/**\n * WordPress dependencies\n */\nimport { useDispatch } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { useShortcut } from '@wordpress/keyboard-shortcuts';\n/**\n * Internal dependencies\n */\nimport BlockPopover from '../block-popover';\nimport useBlockToolbarPopoverProps from './use-block-toolbar-popover-props';\nimport useSelectedBlockToolProps from './use-selected-block-tool-props';\nimport { store as blockEditorStore } from '../../store';\nimport { PrivateBlockToolbar } from '../block-toolbar';\n\nexport default function BlockToolbarPopover( {\n\tclientId,\n\tisTyping,\n\t__unstableContentRef,\n} ) {\n\tconst { capturingClientId, isInsertionPointVisible, lastClientId } =\n\t\tuseSelectedBlockToolProps( clientId );\n\n\t// Stores the active toolbar item index so the block toolbar can return focus\n\t// to it when re-mounting.\n\tconst initialToolbarItemIndexRef = useRef();\n\n\tuseEffect( () => {\n\t\t// Resets the index whenever the active block changes so this is not\n\t\t// persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169\n\t\tinitialToolbarItemIndexRef.current = undefined;\n\t}, [ clientId ] );\n\n\tconst { stopTyping } = useDispatch( blockEditorStore );\n\tconst isToolbarForced = useRef( false );\n\n\tuseShortcut(\n\t\t'core/block-editor/focus-toolbar',\n\t\t() => {\n\t\t\tisToolbarForced.current = true;\n\t\t\tstopTyping( true );\n\t\t},\n\t\t{\n\t\t\tisDisabled: false,\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tisToolbarForced.current = false;\n\t} );\n\n\tconst popoverProps = useBlockToolbarPopoverProps( {\n\t\tcontentElement: __unstableContentRef?.current,\n\t\tclientId,\n\t} );\n\n\treturn (\n\t\t! isTyping && (\n\t\t\t<BlockPopover\n\t\t\t\tclientId={ capturingClientId || clientId }\n\t\t\t\tbottomClientId={ lastClientId }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'block-editor-block-list__block-popover',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-insertion-point-visible': isInsertionPointVisible,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\tresize={ false }\n\t\t\t\t{ ...popoverProps }\n\t\t\t>\n\t\t\t\t<PrivateBlockToolbar\n\t\t\t\t\t// If the toolbar is being shown because of being forced\n\t\t\t\t\t// it should focus the toolbar right after the mount.\n\t\t\t\t\tfocusOnMount={ isToolbarForced.current }\n\t\t\t\t\t__experimentalInitialIndex={\n\t\t\t\t\t\tinitialToolbarItemIndexRef.current\n\t\t\t\t\t}\n\t\t\t\t\t__experimentalOnIndexChange={ ( index ) => {\n\t\t\t\t\t\tinitialToolbarItemIndexRef.current = index;\n\t\t\t\t\t} }\n\t\t\t\t\tvariant=\"toolbar\"\n\t\t\t\t/>\n\t\t\t</BlockPopover>\n\t\t)\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;AACnC;AACA;AACA;AACA,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,SAASC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AACtD,SAASC,WAAW,QAAQ,+BAA+B;AAC3D;AACA;AACA;AACA,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,2BAA2B,MAAM,mCAAmC;AAC3E,OAAOC,yBAAyB,MAAM,iCAAiC;AACvE,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,SAASC,mBAAmB,QAAQ,kBAAkB;AAEtD,eAAe,SAASC,mBAAmBA,CAAE;EAC5CC,QAAQ;EACRC,QAAQ;EACRC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC,iBAAiB;IAAEC,uBAAuB;IAAEC;EAAa,CAAC,GACjEV,yBAAyB,CAAEK,QAAS,CAAC;;EAEtC;EACA;EACA,MAAMM,0BAA0B,GAAGf,MAAM,CAAC,CAAC;EAE3CD,SAAS,CAAE,MAAM;IAChB;IACA;IACAgB,0BAA0B,CAACC,OAAO,GAAGC,SAAS;EAC/C,CAAC,EAAE,CAAER,QAAQ,CAAG,CAAC;EAEjB,MAAM;IAAES;EAAW,CAAC,GAAGpB,WAAW,CAAEQ,gBAAiB,CAAC;EACtD,MAAMa,eAAe,GAAGnB,MAAM,CAAE,KAAM,CAAC;EAEvCC,WAAW,CACV,iCAAiC,EACjC,MAAM;IACLkB,eAAe,CAACH,OAAO,GAAG,IAAI;IAC9BE,UAAU,CAAE,IAAK,CAAC;EACnB,CAAC,EACD;IACCE,UAAU,EAAE;EACb,CACD,CAAC;EAEDrB,SAAS,CAAE,MAAM;IAChBoB,eAAe,CAACH,OAAO,GAAG,KAAK;EAChC,CAAE,CAAC;EAEH,MAAMK,YAAY,GAAGlB,2BAA2B,CAAE;IACjDmB,cAAc,EAAEX,oBAAoB,EAAEK,OAAO;IAC7CP;EACD,CAAE,CAAC;EAEH,OACC,CAAEC,QAAQ,IACTa,aAAA,CAACrB,YAAY;IACZO,QAAQ,EAAGG,iBAAiB,IAAIH,QAAU;IAC1Ce,cAAc,EAAGV,YAAc;IAC/BW,SAAS,EAAG5B,UAAU,CACrB,wCAAwC,EACxC;MACC,4BAA4B,EAAEgB;IAC/B,CACD,CAAG;IACHa,MAAM,EAAG,KAAO;IAAA,GACXL;EAAY,GAEjBE,aAAA,CAAChB;EACA;EACA;EAAA;IACAoB,YAAY,EAAGR,eAAe,CAACH,OAAS;IACxCY,0BAA0B,EACzBb,0BAA0B,CAACC,OAC3B;IACDa,2BAA2B,EAAKC,KAAK,IAAM;MAC1Cf,0BAA0B,CAACC,OAAO,GAAGc,KAAK;IAC3C,CAAG;IACHC,OAAO,EAAC;EAAS,CACjB,CACY,CACd;AAEH"}

package/build-module/components/block-tools/index.js

@@ -3,7 +3,6 @@ import { createElement } from "react";
  * WordPress dependencies
  */
 import { useSelect, useDispatch } from '@wordpress/data';
-import { useViewportMatch } from '@wordpress/compose';
 import { Popover } from '@wordpress/components';
 import { __unstableUseShortcutEventMatch as useShortcutEventMatch } from '@wordpress/keyboard-shortcuts';
 import { useRef } from '@wordpress/element';
@@ -14,9 +13,9 @@ import { isUnmodifiedDefaultBlock } from '@wordpress/blocks';
  */
 import EmptyBlockInserter from './empty-block-inserter';
 import { InsertionPointOpenRef, default as InsertionPoint } from './insertion-point';
-import SelectedBlockTools from './selected-block-tools';
+import BlockToolbarPopover from './block-toolbar-popover';
+import BlockToolbarBreadcrumb from './block-toolbar-breadcrumb';
 import { store as blockEditorStore } from '../../store';
-import BlockContextualToolbar from './block-contextual-toolbar';
 import usePopoverScroll from '../block-popover/use-popover-scroll';
 import ZoomOutModeInserters from './zoom-out-mode-inserters';
 function selector(select) {
@@ -25,6 +24,7 @@ function selector(select) {
     getFirstMultiSelectedBlockClientId,
     getBlock,
     getSettings,
+    hasMultiSelection,
     __unstableGetEditorMode,
     isTyping
   } = select(blockEditorStore);
@@ -33,16 +33,25 @@ function selector(select) {
     name = '',
     attributes = {}
   } = getBlock(clientId) || {};
+  const editorMode = __unstableGetEditorMode();
+  const hasSelectedBlock = clientId && name;
+  const isEmptyDefaultBlock = isUnmodifiedDefaultBlock({
+    name,
+    attributes
+  });
+  const _showEmptyBlockSideInserter = clientId && !isTyping() && editorMode === 'edit' && isUnmodifiedDefaultBlock({
+    name,
+    attributes
+  });
+  const maybeShowBreadcrumb = hasSelectedBlock && !hasMultiSelection() && (editorMode === 'navigation' || editorMode === 'zoom-out');
   return {
     clientId,
     hasFixedToolbar: getSettings().hasFixedToolbar,
-    hasSelectedBlock: clientId && name,
     isTyping: isTyping(),
-    isZoomOutMode: __unstableGetEditorMode() === 'zoom-out',
-    showEmptyBlockSideInserter: clientId && !isTyping() && __unstableGetEditorMode() === 'edit' && isUnmodifiedDefaultBlock({
-      name,
-      attributes
-    })
+    isZoomOutMode: editorMode === 'zoom-out',
+    showEmptyBlockSideInserter: _showEmptyBlockSideInserter,
+    showBreadcrumb: !_showEmptyBlockSideInserter && maybeShowBreadcrumb,
+    showBlockToolbar: !getSettings().hasFixedToolbar && !_showEmptyBlockSideInserter && hasSelectedBlock && !isEmptyDefaultBlock && !maybeShowBreadcrumb
   };
 }
 
@@ -60,14 +69,14 @@ export default function BlockTools({
   __unstableContentRef,
   ...props
 }) {
-  const isLargeViewport = useViewportMatch('medium');
   const {
     clientId,
     hasFixedToolbar,
-    hasSelectedBlock,
     isTyping,
     isZoomOutMode,
-    showEmptyBlockSideInserter
+    showEmptyBlockSideInserter,
+    showBreadcrumb,
+    showBlockToolbar
   } = useSelect(selector, []);
   const isMatch = useShortcutEventMatch();
   const {
@@ -152,12 +161,6 @@ export default function BlockTools({
   }
   const blockToolbarRef = usePopoverScroll(__unstableContentRef);
   const blockToolbarAfterRef = usePopoverScroll(__unstableContentRef);
-
-  // Conditions for fixed toolbar
-  // 1. Not zoom out mode
-  // 2. It's a large viewport. If it's a smaller viewport, let the floating toolbar handle it as it already has styles attached to make it render that way.
-  // 3. Fixed toolbar is enabled
-  const isTopToolbar = !isZoomOutMode && hasFixedToolbar && isLargeViewport;
   return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
     createElement("div", {
@@ -167,17 +170,17 @@ export default function BlockTools({
       value: useRef(false)
     }, !isTyping && createElement(InsertionPoint, {
       __unstableContentRef: __unstableContentRef
-    }), !isLargeViewport &&
-    // Small viewports always get a fixed toolbar
-    createElement(BlockContextualToolbar, {
-      isFixed: true
     }), showEmptyBlockSideInserter && createElement(EmptyBlockInserter, {
       __unstableContentRef: __unstableContentRef,
       clientId: clientId
-    }), !showEmptyBlockSideInserter && hasSelectedBlock && createElement(SelectedBlockTools, {
+    }), showBlockToolbar && createElement(BlockToolbarPopover, {
+      __unstableContentRef: __unstableContentRef,
+      clientId: clientId,
+      isTyping: isTyping
+    }), showBreadcrumb && createElement(BlockToolbarBreadcrumb, {
       __unstableContentRef: __unstableContentRef,
       clientId: clientId
-    }), !isTopToolbar && createElement(Popover.Slot, {
+    }), !isZoomOutMode && !hasFixedToolbar && createElement(Popover.Slot, {
       name: "block-toolbar",
       ref: blockToolbarRef
     }), children, createElement(Popover.Slot, {

package/build-module/components/block-tools/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["useSelect","useDispatch","useViewportMatch","Popover","__unstableUseShortcutEventMatch","useShortcutEventMatch","useRef","isUnmodifiedDefaultBlock","EmptyBlockInserter","InsertionPointOpenRef","default","InsertionPoint","SelectedBlockTools","store","blockEditorStore","BlockContextualToolbar","usePopoverScroll","ZoomOutModeInserters","selector","select","getSelectedBlockClientId","getFirstMultiSelectedBlockClientId","getBlock","getSettings","__unstableGetEditorMode","isTyping","clientId","name","attributes","hasFixedToolbar","hasSelectedBlock","isZoomOutMode","showEmptyBlockSideInserter","BlockTools","children","__unstableContentRef","props","isLargeViewport","isMatch","getSelectedBlockClientIds","getBlockRootClientId","duplicateBlocks","removeBlocks","insertAfterBlock","insertBeforeBlock","clearSelectedBlock","selectBlock","moveBlocksUp","moveBlocksDown","onKeyDown","event","defaultPrevented","clientIds","length","preventDefault","rootClientId","target","closest","ownerDocument","defaultView","getSelection","removeAllRanges","current","focus","blockToolbarRef","blockToolbarAfterRef","isTopToolbar","createElement","Provider","value","isFixed","Slot","ref"],"sources":["@wordpress/block-editor/src/components/block-tools/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { Popover } from '@wordpress/components';\nimport { __unstableUseShortcutEventMatch as useShortcutEventMatch } from '@wordpress/keyboard-shortcuts';\nimport { useRef } from '@wordpress/element';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport EmptyBlockInserter from './empty-block-inserter';\nimport {\n\tInsertionPointOpenRef,\n\tdefault as InsertionPoint,\n} from './insertion-point';\nimport SelectedBlockTools from './selected-block-tools';\nimport { store as blockEditorStore } from '../../store';\nimport BlockContextualToolbar from './block-contextual-toolbar';\nimport usePopoverScroll from '../block-popover/use-popover-scroll';\nimport ZoomOutModeInserters from './zoom-out-mode-inserters';\n\nfunction selector( select ) {\n\tconst {\n\t\tgetSelectedBlockClientId,\n\t\tgetFirstMultiSelectedBlockClientId,\n\t\tgetBlock,\n\t\tgetSettings,\n\t\t__unstableGetEditorMode,\n\t\tisTyping,\n\t} = select( blockEditorStore );\n\n\tconst clientId =\n\t\tgetSelectedBlockClientId() || getFirstMultiSelectedBlockClientId();\n\n\tconst { name = '', attributes = {} } = getBlock( clientId ) || {};\n\n\treturn {\n\t\tclientId,\n\t\thasFixedToolbar: getSettings().hasFixedToolbar,\n\t\thasSelectedBlock: clientId && name,\n\t\tisTyping: isTyping(),\n\t\tisZoomOutMode: __unstableGetEditorMode() === 'zoom-out',\n\t\tshowEmptyBlockSideInserter:\n\t\t\tclientId &&\n\t\t\t! isTyping() &&\n\t\t\t__unstableGetEditorMode() === 'edit' &&\n\t\t\tisUnmodifiedDefaultBlock( { name, attributes } ),\n\t};\n}\n\n/**\n * Renders block tools (the block toolbar, select/navigation mode toolbar, the\n * insertion point and a slot for the inline rich text toolbar). Must be wrapped\n * around the block content and editor styles wrapper or iframe.\n *\n * @param {Object} $0                      Props.\n * @param {Object} $0.children             The block content and style container.\n * @param {Object} $0.__unstableContentRef Ref holding the content scroll container.\n */\nexport default function BlockTools( {\n\tchildren,\n\t__unstableContentRef,\n\t...props\n} ) {\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst {\n\t\tclientId,\n\t\thasFixedToolbar,\n\t\thasSelectedBlock,\n\t\tisTyping,\n\t\tisZoomOutMode,\n\t\tshowEmptyBlockSideInserter,\n\t} = useSelect( selector, [] );\n\tconst isMatch = useShortcutEventMatch();\n\tconst { getSelectedBlockClientIds, getBlockRootClientId } =\n\t\tuseSelect( blockEditorStore );\n\tconst {\n\t\tduplicateBlocks,\n\t\tremoveBlocks,\n\t\tinsertAfterBlock,\n\t\tinsertBeforeBlock,\n\t\tclearSelectedBlock,\n\t\tselectBlock,\n\t\tmoveBlocksUp,\n\t\tmoveBlocksDown,\n\t} = useDispatch( blockEditorStore );\n\n\tfunction onKeyDown( event ) {\n\t\tif ( event.defaultPrevented ) return;\n\n\t\tif ( isMatch( 'core/block-editor/move-up', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst rootClientId = getBlockRootClientId( clientIds[ 0 ] );\n\t\t\t\tmoveBlocksUp( clientIds, rootClientId );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/move-down', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst rootClientId = getBlockRootClientId( clientIds[ 0 ] );\n\t\t\t\tmoveBlocksDown( clientIds, rootClientId );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/duplicate', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tduplicateBlocks( clientIds );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/remove', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tremoveBlocks( clientIds );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/insert-after', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tinsertAfterBlock( clientIds[ clientIds.length - 1 ] );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/insert-before', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tinsertBeforeBlock( clientIds[ 0 ] );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/unselect', event ) ) {\n\t\t\tif ( event.target.closest( '[role=toolbar]' ) ) {\n\t\t\t\t// This shouldn't be necessary, but we have a combination of a few things all combining to create a situation where:\n\t\t\t\t// - Because the block toolbar uses createPortal to populate the block toolbar fills, we can't rely on the React event bubbling to hit the onKeyDown listener for the block toolbar\n\t\t\t\t// - Since we can't use the React tree, we use the DOM tree which _should_ handle the event bubbling correctly from a `createPortal` element.\n\t\t\t\t// - This bubbles via the React tree, which hits this `unselect` escape keypress before the block toolbar DOM event listener has access to it.\n\t\t\t\t// An alternative would be to remove the addEventListener on the navigableToolbar and use this event to handle it directly right here. That feels hacky too though.\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\t// If there is more than one block selected, select the first\n\t\t\t\t// block so that focus is directed back to the beginning of the selection.\n\t\t\t\t// In effect, to the user this feels like deselecting the multi-selection.\n\t\t\t\tif ( clientIds.length > 1 ) {\n\t\t\t\t\tselectBlock( clientIds[ 0 ] );\n\t\t\t\t} else {\n\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t}\n\t\t\t\tevent.target.ownerDocument.defaultView\n\t\t\t\t\t.getSelection()\n\t\t\t\t\t.removeAllRanges();\n\t\t\t\t__unstableContentRef?.current.focus();\n\t\t\t}\n\t\t}\n\t}\n\n\tconst blockToolbarRef = usePopoverScroll( __unstableContentRef );\n\tconst blockToolbarAfterRef = usePopoverScroll( __unstableContentRef );\n\n\t// Conditions for fixed toolbar\n\t// 1. Not zoom out mode\n\t// 2. It's a large viewport. If it's a smaller viewport, let the floating toolbar handle it as it already has styles attached to make it render that way.\n\t// 3. Fixed toolbar is enabled\n\tconst isTopToolbar = ! isZoomOutMode && hasFixedToolbar && isLargeViewport;\n\n\treturn (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div { ...props } onKeyDown={ onKeyDown }>\n\t\t\t<InsertionPointOpenRef.Provider value={ useRef( false ) }>\n\t\t\t\t{ ! isTyping && (\n\t\t\t\t\t<InsertionPoint\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ /* If there is no slot available, such as in the standalone block editor, render within the editor */ }\n\n\t\t\t\t{ ! isLargeViewport && ( // Small viewports always get a fixed toolbar\n\t\t\t\t\t<BlockContextualToolbar isFixed />\n\t\t\t\t) }\n\n\t\t\t\t{ showEmptyBlockSideInserter && (\n\t\t\t\t\t<EmptyBlockInserter\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ /* Even if the toolbar is fixed, the block popover is still\n\t\t\t\t\tneeded for navigation and zoom-out mode. */ }\n\t\t\t\t{ ! showEmptyBlockSideInserter && hasSelectedBlock && (\n\t\t\t\t\t<SelectedBlockTools\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ /* Used for the inline rich text toolbar. */ }\n\t\t\t\t{ ! isTopToolbar && (\n\t\t\t\t\t<Popover.Slot\n\t\t\t\t\t\tname=\"block-toolbar\"\n\t\t\t\t\t\tref={ blockToolbarRef }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t\t{ /* Used for inline rich text popovers. */ }\n\t\t\t\t<Popover.Slot\n\t\t\t\t\tname=\"__unstable-block-tools-after\"\n\t\t\t\t\tref={ blockToolbarAfterRef }\n\t\t\t\t/>\n\t\t\t\t{ isZoomOutMode && (\n\t\t\t\t\t<ZoomOutModeInserters\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</InsertionPointOpenRef.Provider>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["useSelect","useDispatch","Popover","__unstableUseShortcutEventMatch","useShortcutEventMatch","useRef","isUnmodifiedDefaultBlock","EmptyBlockInserter","InsertionPointOpenRef","default","InsertionPoint","BlockToolbarPopover","BlockToolbarBreadcrumb","store","blockEditorStore","usePopoverScroll","ZoomOutModeInserters","selector","select","getSelectedBlockClientId","getFirstMultiSelectedBlockClientId","getBlock","getSettings","hasMultiSelection","__unstableGetEditorMode","isTyping","clientId","name","attributes","editorMode","hasSelectedBlock","isEmptyDefaultBlock","_showEmptyBlockSideInserter","maybeShowBreadcrumb","hasFixedToolbar","isZoomOutMode","showEmptyBlockSideInserter","showBreadcrumb","showBlockToolbar","BlockTools","children","__unstableContentRef","props","isMatch","getSelectedBlockClientIds","getBlockRootClientId","duplicateBlocks","removeBlocks","insertAfterBlock","insertBeforeBlock","clearSelectedBlock","selectBlock","moveBlocksUp","moveBlocksDown","onKeyDown","event","defaultPrevented","clientIds","length","preventDefault","rootClientId","target","closest","ownerDocument","defaultView","getSelection","removeAllRanges","current","focus","blockToolbarRef","blockToolbarAfterRef","createElement","Provider","value","Slot","ref"],"sources":["@wordpress/block-editor/src/components/block-tools/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Popover } from '@wordpress/components';\nimport { __unstableUseShortcutEventMatch as useShortcutEventMatch } from '@wordpress/keyboard-shortcuts';\nimport { useRef } from '@wordpress/element';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport EmptyBlockInserter from './empty-block-inserter';\nimport {\n\tInsertionPointOpenRef,\n\tdefault as InsertionPoint,\n} from './insertion-point';\nimport BlockToolbarPopover from './block-toolbar-popover';\nimport BlockToolbarBreadcrumb from './block-toolbar-breadcrumb';\nimport { store as blockEditorStore } from '../../store';\nimport usePopoverScroll from '../block-popover/use-popover-scroll';\nimport ZoomOutModeInserters from './zoom-out-mode-inserters';\n\nfunction selector( select ) {\n\tconst {\n\t\tgetSelectedBlockClientId,\n\t\tgetFirstMultiSelectedBlockClientId,\n\t\tgetBlock,\n\t\tgetSettings,\n\t\thasMultiSelection,\n\t\t__unstableGetEditorMode,\n\t\tisTyping,\n\t} = select( blockEditorStore );\n\n\tconst clientId =\n\t\tgetSelectedBlockClientId() || getFirstMultiSelectedBlockClientId();\n\n\tconst { name = '', attributes = {} } = getBlock( clientId ) || {};\n\tconst editorMode = __unstableGetEditorMode();\n\tconst hasSelectedBlock = clientId && name;\n\tconst isEmptyDefaultBlock = isUnmodifiedDefaultBlock( {\n\t\tname,\n\t\tattributes,\n\t} );\n\tconst _showEmptyBlockSideInserter =\n\t\tclientId &&\n\t\t! isTyping() &&\n\t\teditorMode === 'edit' &&\n\t\tisUnmodifiedDefaultBlock( { name, attributes } );\n\tconst maybeShowBreadcrumb =\n\t\thasSelectedBlock &&\n\t\t! hasMultiSelection() &&\n\t\t( editorMode === 'navigation' || editorMode === 'zoom-out' );\n\n\treturn {\n\t\tclientId,\n\t\thasFixedToolbar: getSettings().hasFixedToolbar,\n\t\tisTyping: isTyping(),\n\t\tisZoomOutMode: editorMode === 'zoom-out',\n\t\tshowEmptyBlockSideInserter: _showEmptyBlockSideInserter,\n\t\tshowBreadcrumb: ! _showEmptyBlockSideInserter && maybeShowBreadcrumb,\n\t\tshowBlockToolbar:\n\t\t\t! getSettings().hasFixedToolbar &&\n\t\t\t! _showEmptyBlockSideInserter &&\n\t\t\thasSelectedBlock &&\n\t\t\t! isEmptyDefaultBlock &&\n\t\t\t! maybeShowBreadcrumb,\n\t};\n}\n\n/**\n * Renders block tools (the block toolbar, select/navigation mode toolbar, the\n * insertion point and a slot for the inline rich text toolbar). Must be wrapped\n * around the block content and editor styles wrapper or iframe.\n *\n * @param {Object} $0                      Props.\n * @param {Object} $0.children             The block content and style container.\n * @param {Object} $0.__unstableContentRef Ref holding the content scroll container.\n */\nexport default function BlockTools( {\n\tchildren,\n\t__unstableContentRef,\n\t...props\n} ) {\n\tconst {\n\t\tclientId,\n\t\thasFixedToolbar,\n\t\tisTyping,\n\t\tisZoomOutMode,\n\t\tshowEmptyBlockSideInserter,\n\t\tshowBreadcrumb,\n\t\tshowBlockToolbar,\n\t} = useSelect( selector, [] );\n\tconst isMatch = useShortcutEventMatch();\n\tconst { getSelectedBlockClientIds, getBlockRootClientId } =\n\t\tuseSelect( blockEditorStore );\n\tconst {\n\t\tduplicateBlocks,\n\t\tremoveBlocks,\n\t\tinsertAfterBlock,\n\t\tinsertBeforeBlock,\n\t\tclearSelectedBlock,\n\t\tselectBlock,\n\t\tmoveBlocksUp,\n\t\tmoveBlocksDown,\n\t} = useDispatch( blockEditorStore );\n\n\tfunction onKeyDown( event ) {\n\t\tif ( event.defaultPrevented ) return;\n\n\t\tif ( isMatch( 'core/block-editor/move-up', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst rootClientId = getBlockRootClientId( clientIds[ 0 ] );\n\t\t\t\tmoveBlocksUp( clientIds, rootClientId );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/move-down', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst rootClientId = getBlockRootClientId( clientIds[ 0 ] );\n\t\t\t\tmoveBlocksDown( clientIds, rootClientId );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/duplicate', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tduplicateBlocks( clientIds );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/remove', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tremoveBlocks( clientIds );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/insert-after', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tinsertAfterBlock( clientIds[ clientIds.length - 1 ] );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/insert-before', event ) ) {\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tinsertBeforeBlock( clientIds[ 0 ] );\n\t\t\t}\n\t\t} else if ( isMatch( 'core/block-editor/unselect', event ) ) {\n\t\t\tif ( event.target.closest( '[role=toolbar]' ) ) {\n\t\t\t\t// This shouldn't be necessary, but we have a combination of a few things all combining to create a situation where:\n\t\t\t\t// - Because the block toolbar uses createPortal to populate the block toolbar fills, we can't rely on the React event bubbling to hit the onKeyDown listener for the block toolbar\n\t\t\t\t// - Since we can't use the React tree, we use the DOM tree which _should_ handle the event bubbling correctly from a `createPortal` element.\n\t\t\t\t// - This bubbles via the React tree, which hits this `unselect` escape keypress before the block toolbar DOM event listener has access to it.\n\t\t\t\t// An alternative would be to remove the addEventListener on the navigableToolbar and use this event to handle it directly right here. That feels hacky too though.\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst clientIds = getSelectedBlockClientIds();\n\t\t\tif ( clientIds.length ) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\t// If there is more than one block selected, select the first\n\t\t\t\t// block so that focus is directed back to the beginning of the selection.\n\t\t\t\t// In effect, to the user this feels like deselecting the multi-selection.\n\t\t\t\tif ( clientIds.length > 1 ) {\n\t\t\t\t\tselectBlock( clientIds[ 0 ] );\n\t\t\t\t} else {\n\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t}\n\t\t\t\tevent.target.ownerDocument.defaultView\n\t\t\t\t\t.getSelection()\n\t\t\t\t\t.removeAllRanges();\n\t\t\t\t__unstableContentRef?.current.focus();\n\t\t\t}\n\t\t}\n\t}\n\n\tconst blockToolbarRef = usePopoverScroll( __unstableContentRef );\n\tconst blockToolbarAfterRef = usePopoverScroll( __unstableContentRef );\n\n\treturn (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div { ...props } onKeyDown={ onKeyDown }>\n\t\t\t<InsertionPointOpenRef.Provider value={ useRef( false ) }>\n\t\t\t\t{ ! isTyping && (\n\t\t\t\t\t<InsertionPoint\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ showEmptyBlockSideInserter && (\n\t\t\t\t\t<EmptyBlockInserter\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ showBlockToolbar && (\n\t\t\t\t\t<BlockToolbarPopover\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t\tisTyping={ isTyping }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ showBreadcrumb && (\n\t\t\t\t\t<BlockToolbarBreadcrumb\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ /* Used for the inline rich text toolbar. Until this toolbar is combined into BlockToolbar, someone implementing their own BlockToolbar will also need to use this to see the image caption toolbar. */ }\n\t\t\t\t{ ! isZoomOutMode && ! hasFixedToolbar && (\n\t\t\t\t\t<Popover.Slot\n\t\t\t\t\t\tname=\"block-toolbar\"\n\t\t\t\t\t\tref={ blockToolbarRef }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t\t{ /* Used for inline rich text popovers. */ }\n\t\t\t\t<Popover.Slot\n\t\t\t\t\tname=\"__unstable-block-tools-after\"\n\t\t\t\t\tref={ blockToolbarAfterRef }\n\t\t\t\t/>\n\t\t\t\t{ isZoomOutMode && (\n\t\t\t\t\t<ZoomOutModeInserters\n\t\t\t\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</InsertionPointOpenRef.Provider>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}

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

@@ -3,6 +3,7 @@ import { createElement } from "react";
  * WordPress dependencies
  */
 import { getBlockMenuDefaultClassName } from '@wordpress/blocks';
+import { useInstanceId } from '@wordpress/compose';
 
 /**
  * Internal dependencies
@@ -24,8 +25,10 @@ function BlockTypesList({
   label,
   isDraggable = true
 }) {
+  const className = 'block-editor-block-types-list';
+  const listId = useInstanceId(BlockTypesList, className);
   return createElement(InserterListboxGroup, {
-    className: "block-editor-block-types-list",
+    className: className,
     "aria-label": label
   }, chunk(items, 3).map((row, i) => createElement(InserterListboxRow, {
     key: i
@@ -36,7 +39,8 @@ function BlockTypesList({
     onSelect: onSelect,
     onHover: onHover,
     isDraggable: isDraggable && !item.isDisabled,
-    isFirst: i === 0 && j === 0
+    isFirst: i === 0 && j === 0,
+    rowId: `${listId}-${i}`
   })))), children);
 }
 export default BlockTypesList;

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

@@ -1 +1 @@
-{"version":3,"names":["getBlockMenuDefaultClassName","InserterListItem","InserterListboxGroup","InserterListboxRow","chunk","array","size","chunks","i","j","length","push","slice","BlockTypesList","items","onSelect","onHover","children","label","isDraggable","createElement","className","map","row","key","item","id","isDisabled","isFirst"],"sources":["@wordpress/block-editor/src/components/block-types-list/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockMenuDefaultClassName } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport InserterListItem from '../inserter-list-item';\nimport { InserterListboxGroup, InserterListboxRow } from '../inserter-listbox';\n\nfunction chunk( array, size ) {\n\tconst chunks = [];\n\tfor ( let i = 0, j = array.length; i < j; i += size ) {\n\t\tchunks.push( array.slice( i, i + size ) );\n\t}\n\treturn chunks;\n}\n\nfunction BlockTypesList( {\n\titems = [],\n\tonSelect,\n\tonHover = () => {},\n\tchildren,\n\tlabel,\n\tisDraggable = true,\n} ) {\n\treturn (\n\t\t<InserterListboxGroup\n\t\t\tclassName=\"block-editor-block-types-list\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ chunk( items, 3 ).map( ( row, i ) => (\n\t\t\t\t<InserterListboxRow key={ i }>\n\t\t\t\t\t{ row.map( ( item, j ) => (\n\t\t\t\t\t\t<InserterListItem\n\t\t\t\t\t\t\tkey={ item.id }\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tclassName={ getBlockMenuDefaultClassName(\n\t\t\t\t\t\t\t\titem.id\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\t\tisDraggable={ isDraggable && ! item.isDisabled }\n\t\t\t\t\t\t\tisFirst={ i === 0 && j === 0 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</InserterListboxRow>\n\t\t\t) ) }\n\t\t\t{ children }\n\t\t</InserterListboxGroup>\n\t);\n}\n\nexport default BlockTypesList;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,4BAA4B,QAAQ,mBAAmB;;AAEhE;AACA;AACA;AACA,OAAOC,gBAAgB,MAAM,uBAAuB;AACpD,SAASC,oBAAoB,EAAEC,kBAAkB,QAAQ,qBAAqB;AAE9E,SAASC,KAAKA,CAAEC,KAAK,EAAEC,IAAI,EAAG;EAC7B,MAAMC,MAAM,GAAG,EAAE;EACjB,KAAM,IAAIC,CAAC,GAAG,CAAC,EAAEC,CAAC,GAAGJ,KAAK,CAACK,MAAM,EAAEF,CAAC,GAAGC,CAAC,EAAED,CAAC,IAAIF,IAAI,EAAG;IACrDC,MAAM,CAACI,IAAI,CAAEN,KAAK,CAACO,KAAK,CAAEJ,CAAC,EAAEA,CAAC,GAAGF,IAAK,CAAE,CAAC;EAC1C;EACA,OAAOC,MAAM;AACd;AAEA,SAASM,cAAcA,CAAE;EACxBC,KAAK,GAAG,EAAE;EACVC,QAAQ;EACRC,OAAO,GAAGA,CAAA,KAAM,CAAC,CAAC;EAClBC,QAAQ;EACRC,KAAK;EACLC,WAAW,GAAG;AACf,CAAC,EAAG;EACH,OACCC,aAAA,CAAClB,oBAAoB;IACpBmB,SAAS,EAAC,+BAA+B;IACzC,cAAaH;EAAO,GAElBd,KAAK,CAAEU,KAAK,EAAE,CAAE,CAAC,CAACQ,GAAG,CAAE,CAAEC,GAAG,EAAEf,CAAC,KAChCY,aAAA,CAACjB,kBAAkB;IAACqB,GAAG,EAAGhB;EAAG,GAC1Be,GAAG,CAACD,GAAG,CAAE,CAAEG,IAAI,EAAEhB,CAAC,KACnBW,aAAA,CAACnB,gBAAgB;IAChBuB,GAAG,EAAGC,IAAI,CAACC,EAAI;IACfD,IAAI,EAAGA,IAAM;IACbJ,SAAS,EAAGrB,4BAA4B,CACvCyB,IAAI,CAACC,EACN,CAAG;IACHX,QAAQ,EAAGA,QAAU;IACrBC,OAAO,EAAGA,OAAS;IACnBG,WAAW,EAAGA,WAAW,IAAI,CAAEM,IAAI,CAACE,UAAY;IAChDC,OAAO,EAAGpB,CAAC,KAAK,CAAC,IAAIC,CAAC,KAAK;EAAG,CAC9B,CACA,CACiB,CACnB,CAAC,EACDQ,QACmB,CAAC;AAEzB;AAEA,eAAeJ,cAAc"}
+{"version":3,"names":["getBlockMenuDefaultClassName","useInstanceId","InserterListItem","InserterListboxGroup","InserterListboxRow","chunk","array","size","chunks","i","j","length","push","slice","BlockTypesList","items","onSelect","onHover","children","label","isDraggable","className","listId","createElement","map","row","key","item","id","isDisabled","isFirst","rowId"],"sources":["@wordpress/block-editor/src/components/block-types-list/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockMenuDefaultClassName } from '@wordpress/blocks';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport InserterListItem from '../inserter-list-item';\nimport { InserterListboxGroup, InserterListboxRow } from '../inserter-listbox';\n\nfunction chunk( array, size ) {\n\tconst chunks = [];\n\tfor ( let i = 0, j = array.length; i < j; i += size ) {\n\t\tchunks.push( array.slice( i, i + size ) );\n\t}\n\treturn chunks;\n}\n\nfunction BlockTypesList( {\n\titems = [],\n\tonSelect,\n\tonHover = () => {},\n\tchildren,\n\tlabel,\n\tisDraggable = true,\n} ) {\n\tconst className = 'block-editor-block-types-list';\n\tconst listId = useInstanceId( BlockTypesList, className );\n\treturn (\n\t\t<InserterListboxGroup className={ className } aria-label={ label }>\n\t\t\t{ chunk( items, 3 ).map( ( row, i ) => (\n\t\t\t\t<InserterListboxRow key={ i }>\n\t\t\t\t\t{ row.map( ( item, j ) => (\n\t\t\t\t\t\t<InserterListItem\n\t\t\t\t\t\t\tkey={ item.id }\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tclassName={ getBlockMenuDefaultClassName(\n\t\t\t\t\t\t\t\titem.id\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\t\tisDraggable={ isDraggable && ! item.isDisabled }\n\t\t\t\t\t\t\tisFirst={ i === 0 && j === 0 }\n\t\t\t\t\t\t\trowId={ `${ listId }-${ i }` }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</InserterListboxRow>\n\t\t\t) ) }\n\t\t\t{ children }\n\t\t</InserterListboxGroup>\n\t);\n}\n\nexport default BlockTypesList;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,4BAA4B,QAAQ,mBAAmB;AAChE,SAASC,aAAa,QAAQ,oBAAoB;;AAElD;AACA;AACA;AACA,OAAOC,gBAAgB,MAAM,uBAAuB;AACpD,SAASC,oBAAoB,EAAEC,kBAAkB,QAAQ,qBAAqB;AAE9E,SAASC,KAAKA,CAAEC,KAAK,EAAEC,IAAI,EAAG;EAC7B,MAAMC,MAAM,GAAG,EAAE;EACjB,KAAM,IAAIC,CAAC,GAAG,CAAC,EAAEC,CAAC,GAAGJ,KAAK,CAACK,MAAM,EAAEF,CAAC,GAAGC,CAAC,EAAED,CAAC,IAAIF,IAAI,EAAG;IACrDC,MAAM,CAACI,IAAI,CAAEN,KAAK,CAACO,KAAK,CAAEJ,CAAC,EAAEA,CAAC,GAAGF,IAAK,CAAE,CAAC;EAC1C;EACA,OAAOC,MAAM;AACd;AAEA,SAASM,cAAcA,CAAE;EACxBC,KAAK,GAAG,EAAE;EACVC,QAAQ;EACRC,OAAO,GAAGA,CAAA,KAAM,CAAC,CAAC;EAClBC,QAAQ;EACRC,KAAK;EACLC,WAAW,GAAG;AACf,CAAC,EAAG;EACH,MAAMC,SAAS,GAAG,+BAA+B;EACjD,MAAMC,MAAM,GAAGrB,aAAa,CAAEa,cAAc,EAAEO,SAAU,CAAC;EACzD,OACCE,aAAA,CAACpB,oBAAoB;IAACkB,SAAS,EAAGA,SAAW;IAAC,cAAaF;EAAO,GAC/Dd,KAAK,CAAEU,KAAK,EAAE,CAAE,CAAC,CAACS,GAAG,CAAE,CAAEC,GAAG,EAAEhB,CAAC,KAChCc,aAAA,CAACnB,kBAAkB;IAACsB,GAAG,EAAGjB;EAAG,GAC1BgB,GAAG,CAACD,GAAG,CAAE,CAAEG,IAAI,EAAEjB,CAAC,KACnBa,aAAA,CAACrB,gBAAgB;IAChBwB,GAAG,EAAGC,IAAI,CAACC,EAAI;IACfD,IAAI,EAAGA,IAAM;IACbN,SAAS,EAAGrB,4BAA4B,CACvC2B,IAAI,CAACC,EACN,CAAG;IACHZ,QAAQ,EAAGA,QAAU;IACrBC,OAAO,EAAGA,OAAS;IACnBG,WAAW,EAAGA,WAAW,IAAI,CAAEO,IAAI,CAACE,UAAY;IAChDC,OAAO,EAAGrB,CAAC,KAAK,CAAC,IAAIC,CAAC,KAAK,CAAG;IAC9BqB,KAAK,EAAI,GAAGT,MAAQ,IAAIb,CAAG;EAAG,CAC9B,CACA,CACiB,CACnB,CAAC,EACDS,QACmB,CAAC;AAEzB;AAEA,eAAeJ,cAAc"}

package/build-module/components/block-types-list/index.native.js

@@ -8,13 +8,14 @@ import { Dimensions, FlatList, SectionList, StyleSheet, Text, TouchableWithoutFe
  * WordPress dependencies
  */
 import { useState, useEffect } from '@wordpress/element';
-import { BottomSheet, Gradient, InserterButton } from '@wordpress/components';
+import { BottomSheet, Gradient } from '@wordpress/components';
 import { usePreferredColorScheme, usePreferredColorSchemeStyle } from '@wordpress/compose';
 
 /**
  * Internal dependencies
  */
 import styles from './style.scss';
+import InserterButton from '../inserter-button';
 const MIN_COL_NUM = 3;
 export default function BlockTypesList({
   name,