diff --git a/packages/block-editor/src/components/off-canvas-editor/block-contents.js b/packages/block-editor/src/components/off-canvas-editor/block-contents.js
index 77922df8441ea0..3d4bd0d3c00dbe 100644
--- a/packages/block-editor/src/components/off-canvas-editor/block-contents.js
+++ b/packages/block-editor/src/components/off-canvas-editor/block-contents.js
@@ -19,6 +19,7 @@ import { store as blockEditorStore } from '../../store';
import { updateAttributes } from './update-attributes';
import { LinkUI } from './link-ui';
import { useInsertedBlock } from './use-inserted-block';
+import { useListViewContext } from './context';
const BLOCKS_WITH_LINK_UI_SUPPORT = [
'core/navigation-link',
@@ -43,6 +44,7 @@ const ListViewBlockContents = forwardRef(
) => {
const { clientId } = block;
const [ isLinkUIOpen, setIsLinkUIOpen ] = useState();
+ const { enableDragAndDrop } = useListViewContext();
const {
blockMovingClientId,
selectedBlockInBlockEditor,
@@ -124,26 +126,44 @@ const ListViewBlockContents = forwardRef(
onCancel={ () => setIsLinkUIOpen( false ) }
/>
) }
-
- { ( { draggable, onDragStart, onDragEnd } ) => (
-
- ) }
-
+ { enableDragAndDrop && (
+
+ { ( { draggable, onDragStart, onDragEnd } ) => (
+
+ ) }
+
+ ) }
+ { ! enableDragAndDrop && (
+
+ ) }
>
);
}
diff --git a/packages/block-editor/src/components/off-canvas-editor/block.js b/packages/block-editor/src/components/off-canvas-editor/block.js
index aa47b9d8bebea6..c3f7406ed0df00 100644
--- a/packages/block-editor/src/components/off-canvas-editor/block.js
+++ b/packages/block-editor/src/components/off-canvas-editor/block.js
@@ -307,39 +307,40 @@ function ListViewBlock( {
>
) }
- { showBlockActions && (
- <>
-
- { ( { ref, tabIndex, onFocus } ) => (
- <>
-
- >
- ) }
-
- >
- ) }
+ { showBlockActions ||
+ ( MoreMenuComponent === false && (
+ <>
+
+ { ( { ref, tabIndex, onFocus } ) => (
+ <>
+
+ >
+ ) }
+
+ >
+ ) ) }
);
}
diff --git a/packages/block-editor/src/components/off-canvas-editor/index.js b/packages/block-editor/src/components/off-canvas-editor/index.js
index b0f18c56176967..708559c5f710ad 100644
--- a/packages/block-editor/src/components/off-canvas-editor/index.js
+++ b/packages/block-editor/src/components/off-canvas-editor/index.js
@@ -54,17 +54,18 @@ export const BLOCK_LIST_ITEM_HEIGHT = 36;
/**
* Show a hierarchical list of blocks.
*
- * @param {Object} props Components props.
- * @param {string} props.id An HTML element id for the root element of ListView.
- * @param {string} props.parentClientId The client id of the parent block.
- * @param {Array} props.blocks Custom subset of block client IDs to be used instead of the default hierarchy.
- * @param {boolean} props.showBlockMovers Flag to enable block movers
- * @param {boolean} props.isExpanded Flag to determine whether nested levels are expanded by default.
- * @param {Object} props.LeafMoreMenu Optional more menu substitution.
- * @param {string} props.description Optional accessible description for the tree grid component.
- * @param {string} props.onSelect Optional callback to be invoked when a block is selected.
- * @param {string} props.showAppender Flag to show or hide the block appender.
- * @param {Object} ref Forwarded ref
+ * @param {Object} props Components props.
+ * @param {string} props.id An HTML element id for the root element of ListView.
+ * @param {string} props.parentClientId The client id of the parent block.
+ * @param {Array} props.blocks Custom subset of block client IDs to be used instead of the default hierarchy.
+ * @param {boolean} props.showBlockMovers Flag to enable block movers
+ * @param {boolean} props.isExpanded Flag to determine whether nested levels are expanded by default.
+ * @param {Object} props.LeafMoreMenu Optional more menu substitution.
+ * @param {boolean} props.enableDragAndDrop Flag to enable drag and drop.
+ * @param {string} props.description Optional accessible description for the tree grid component.
+ * @param {string} props.onSelect Optional callback to be invoked when a block is selected.
+ * @param {string} props.showAppender Flag to show or hide the block appender.
+ * @param {Object} ref Forwarded ref
*/
function OffCanvasEditor(
{
@@ -75,6 +76,7 @@ function OffCanvasEditor(
isExpanded = false,
showAppender = true,
LeafMoreMenu,
+ enableDragAndDrop = true,
description = __( 'Block navigation structure' ),
onSelect,
},
@@ -200,6 +202,7 @@ function OffCanvasEditor(
expand,
collapse,
LeafMoreMenu,
+ enableDragAndDrop,
} ),
[
isMounted.current,
diff --git a/packages/edit-site/src/components/sidebar-navigation-item/style.scss b/packages/edit-site/src/components/sidebar-navigation-item/style.scss
index 04c11aa57f5a1f..57034632c626cf 100644
--- a/packages/edit-site/src/components/sidebar-navigation-item/style.scss
+++ b/packages/edit-site/src/components/sidebar-navigation-item/style.scss
@@ -15,6 +15,6 @@
}
.edit-site-sidebar-navigation-screen__content .block-editor-list-view-block-select-button {
- cursor: grab;
+ cursor: pointer;
padding: $grid-unit-10;
}
diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js
index ccc0b92a211ba2..9291afe7012179 100644
--- a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js
+++ b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js
@@ -20,10 +20,32 @@ import { NavigationMenuLoader } from './loader';
export default function NavigationMenuContent( { rootClientId, onSelect } ) {
const { clientIdsTree, isLoading } = useSelect(
( select ) => {
- const { __unstableGetClientIdsTree, areInnerBlocksControlled } =
- select( blockEditorStore );
+ const {
+ __unstableGetClientIdsTree,
+ areInnerBlocksControlled,
+ getBlocksByClientId,
+ } = select( blockEditorStore );
+
+ const filterLinksOnly = ( tree ) => {
+ if ( tree.innerBlocks && tree.innerBlocks.length > 0 ) {
+ tree.innerBlocks = filterLinksOnly( tree.innerBlocks );
+ }
+ tree = tree.filter( ( item ) => {
+ const block = getBlocksByClientId( item.clientId )[ 0 ];
+ return (
+ block.name === 'core/navigation-link' ||
+ block.name === 'core/navigation-submenu' ||
+ block.name === 'core/page-list' ||
+ block.name === 'core/page-list-item'
+ );
+ } );
+ return tree;
+ };
+ const _clientIdsTree = filterLinksOnly(
+ __unstableGetClientIdsTree( rootClientId )
+ );
return {
- clientIdsTree: __unstableGetClientIdsTree( rootClientId ),
+ clientIdsTree: _clientIdsTree,
// This is a small hack to wait for the navigation block
// to actually load its inner blocks.
@@ -35,7 +57,7 @@ export default function NavigationMenuContent( { rootClientId, onSelect } ) {
const { replaceBlock, __unstableMarkNextChangeAsNotPersistent } =
useDispatch( blockEditorStore );
- const { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis );
+ const { OffCanvasEditor } = unlock( blockEditorPrivateApis );
const offCanvasOnselect = useCallback(
( block ) => {
@@ -64,8 +86,9 @@ export default function NavigationMenuContent( { rootClientId, onSelect } ) {
) }