diff --git a/packages/block-editor/src/components/block-inspector/index.js b/packages/block-editor/src/components/block-inspector/index.js
index aa2892ca8b616..e49709bb51d10 100644
--- a/packages/block-editor/src/components/block-inspector/index.js
+++ b/packages/block-editor/src/components/block-inspector/index.js
@@ -17,6 +17,7 @@ import { useSelect } from '@wordpress/data';
/**
* Internal dependencies
*/
+import { unlock } from '../../lock-unlock';
import SkipToSelectedBlock from '../skip-to-selected-block';
import BlockCard from '../block-card';
import MultiSelectionInspector, {
@@ -77,6 +78,11 @@ function BlockInspectorContentLockedParent( { clientId } ) {
[ clientId ]
);
const blockInformation = useBlockDisplayInformation( clientId );
+ const contentClientIdsWithControls = useSelect(
+ ( select ) =>
+ unlock( select( blockEditorStore ) ).getContentOnlyControlsBlocks(),
+ []
+ );
return (
{ contentClientIds.length > 0 && (
-
+
) }
diff --git a/packages/block-editor/src/components/block-quick-navigation/index.js b/packages/block-editor/src/components/block-quick-navigation/index.js
index 7a0e7984b83cb..8ed0d1840e583 100644
--- a/packages/block-editor/src/components/block-quick-navigation/index.js
+++ b/packages/block-editor/src/components/block-quick-navigation/index.js
@@ -9,11 +9,13 @@ import {
Flex,
FlexBlock,
FlexItem,
+ Icon,
} from '@wordpress/components';
import {
__experimentalGetBlockLabel,
store as blocksStore,
} from '@wordpress/blocks';
+import { chevronRight } from '@wordpress/icons';
/**
* Internal dependencies
@@ -21,7 +23,10 @@ import {
import { store as blockEditorStore } from '../../store';
import BlockIcon from '../block-icon';
-export default function BlockQuickNavigation( { clientIds } ) {
+export default function BlockQuickNavigation( {
+ clientIds,
+ clientIdsWithControls,
+} ) {
if ( ! clientIds.length ) {
return null;
}
@@ -31,13 +36,14 @@ export default function BlockQuickNavigation( { clientIds } ) {
) ) }
);
}
-function BlockQuickNavigationItem( { clientId } ) {
+function BlockQuickNavigationItem( { clientId, hasControls } ) {
const { name, icon, isSelected } = useSelect(
( select ) => {
const {
@@ -81,6 +87,11 @@ function BlockQuickNavigationItem( { clientId } ) {
{ name }
+ { hasControls && (
+
+
+
+ ) }
);