Adds a top level prop for list view to enable and disable block selec…

…tion.
WordPress · Oct 17, 2022 · 79c69c1 · 79c69c1
1 parent 4b930c8
commit 79c69c1
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 2 deletions.
diff --git a/packages/block-editor/src/components/list-view/block.js b/packages/block-editor/src/components/list-view/block.js
@@ -54,6 +54,7 @@ function ListViewBlock( {
 	isExpanded,
 	selectedClientIds,
 	preventAnnouncement,
+	selectBlockInCanvas,
 } ) {
 	const cellRef = useRef( null );
 	const [ isHovered, setIsHovered ] = useState( false );
@@ -245,7 +246,11 @@ function ListViewBlock( {
 					<div className="block-editor-list-view-block__contents-container">
 						<ListViewBlockContents
 							block={ block }
-							onClick={ selectEditorBlock }
+							onClick={
+								selectBlockInCanvas
+									? selectEditorBlock
+									: () => {}
+							}
 							onToggleExpanded={ toggleExpanded }
 							isSelected={ isSelected }
 							position={ position }

diff --git a/packages/block-editor/src/components/list-view/branch.js b/packages/block-editor/src/components/list-view/branch.js
@@ -92,6 +92,7 @@ function ListViewBranch( props ) {
 		isExpanded,
 		parentId,
 		shouldShowInnerBlocks = true,
+		selectBlockInCanvas,
 	} = props;
 
 	const isContentLocked = useSelect(
@@ -174,6 +175,7 @@ function ListViewBranch( props ) {
 								isExpanded={ shouldExpand }
 								listPosition={ nextPosition }
 								selectedClientIds={ selectedClientIds }
+								selectBlockInCanvas={ selectBlockInCanvas }
 							/>
 						) }
 						{ ! showBlock && (

diff --git a/packages/block-editor/src/components/list-view/index.js b/packages/block-editor/src/components/list-view/index.js
@@ -55,10 +55,17 @@ export const BLOCK_LIST_ITEM_HEIGHT = 36;
  * @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 {boolean} props.selectBlockInCanvas      Flag to determine whether the list view should be a block selection mechanism,.
  * @param {Object}  ref                   Forwarded ref
  */
 function ListView(
-	{ id, blocks, showBlockMovers = false, isExpanded = false },
+	{
+		id,
+		blocks,
+		showBlockMovers = false,
+		isExpanded = false,
+		selectBlockInCanvas = true,
+	},
 	ref
 ) {
 	const { clientIdsTree, draggedClientIds, selectedClientIds } =
@@ -199,6 +206,7 @@ function ListView(
 						selectedClientIds={ selectedClientIds }
 						isExpanded={ isExpanded }
 						shouldShowInnerBlocks={ shouldShowInnerBlocks }
+						selectBlockInCanvas={ selectBlockInCanvas }
 					/>
 				</ListViewContext.Provider>
 			</TreeGrid>

diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js
@@ -686,6 +686,7 @@ function Navigation( {
 							<ListView
 								blocks={ innerBlocks }
 								isExpanded={ true }
+								selectBlockInCanvas={ false }
 							/>
 						) }
 					</PanelBody>
@@ -869,6 +870,7 @@ function Navigation( {
 							<ListView
 								blocks={ innerBlocks }
 								isExpanded={ true }
+								selectBlockInCanvas={ false }
 							/>
 						) }
 					</PanelBody>