Block editor: Fix Enter handling for nested blocks (#37453)

docs/reference-guides/data/data-core-block-editor.md

@@ -208,7 +208,6 @@ _Parameters_
 
 -   _state_ `Object`: Editor state.
 -   _clientId_ `string`: Block client ID.
--   _rootClientId_ `?string`: Optional root client ID of block list.
 
 _Returns_
 

packages/block-editor/src/components/block-list/block.js

@@ -259,7 +259,7 @@ const applyWithDispatch = withDispatch( ( dispatch, ownProps, { select } ) => {
 		onInsertBlocksAfter( blocks ) {
 			const { clientId, rootClientId } = ownProps;
 			const { getBlockIndex } = select( blockEditorStore );
-			const index = getBlockIndex( clientId, rootClientId );
+			const index = getBlockIndex( clientId );
 			insertBlocks( blocks, index + 1, rootClientId );
 		},
 		onMerge( forward ) {

packages/block-editor/src/components/block-list/block.native.js

@@ -302,7 +302,7 @@ function getWrapperProps( value, getWrapperPropsFunction ) {
 }
 
 export default compose( [
-	withSelect( ( select, { clientId, rootClientId } ) => {
+	withSelect( ( select, { clientId } ) => {
 		const {
 			getBlockIndex,
 			getSettings,
@@ -314,7 +314,7 @@ export default compose( [
 			hasSelectedInnerBlock,
 		} = select( blockEditorStore );
 
-		const order = getBlockIndex( clientId, rootClientId );
+		const order = getBlockIndex( clientId );
 		const isSelected = isBlockSelected( clientId );
 		const isInnerBlockSelected = hasSelectedInnerBlock( clientId );
 		const block = getBlock( clientId );

packages/block-editor/src/components/block-list/use-block-props/index.js

@@ -75,7 +75,6 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 	} = useSelect(
 		( select ) => {
 			const {
-				getBlockRootClientId,
 				getBlockIndex,
 				getBlockMode,
 				getBlockName,
@@ -91,11 +90,10 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 				isBlockMultiSelected( clientId ) ||
 				isAncestorMultiSelected( clientId );
 			const blockName = getBlockName( clientId );
-			const rootClientId = getBlockRootClientId( clientId );
 			const blockType = getBlockType( blockName );
 
 			return {
-				index: getBlockIndex( clientId, rootClientId ),
+				index: getBlockIndex( clientId ),
 				mode: getBlockMode( clientId ),
 				name: blockName,
 				blockApiVersion: blockType?.apiVersion || 1,

packages/block-editor/src/components/block-list/use-in-between-inserter.js

@@ -144,7 +144,7 @@ export function useInBetweenInserter() {
 					return;
 				}
 
-				const index = getBlockIndex( clientId, rootClientId );
+				const index = getBlockIndex( clientId );
 
 				// Don't show the in-between inserter before the first block in
 				// the list (preserves the original behaviour).

packages/block-editor/src/components/block-mobile-toolbar/block-actions-menu.native.js

@@ -316,11 +316,8 @@ export default compose(
 		const rootClientId = getBlockRootClientId( firstClientId );
 		const blockOrder = getBlockOrder( rootClientId );
 
-		const firstIndex = getBlockIndex( firstClientId, rootClientId );
-		const lastIndex = getBlockIndex(
-			last( normalizedClientIds ),
-			rootClientId
-		);
+		const firstIndex = getBlockIndex( firstClientId );
+		const lastIndex = getBlockIndex( last( normalizedClientIds ) );
 
 		const innerBlocks = getBlocksByClientId( clientIds );
 

packages/block-editor/src/components/block-mover/button.js

@@ -84,13 +84,9 @@ const BlockMoverButton = forwardRef(
 				const normalizedClientIds = castArray( clientIds );
 				const firstClientId = first( normalizedClientIds );
 				const blockRootClientId = getBlockRootClientId( firstClientId );
-				const firstBlockIndex = getBlockIndex(
-					firstClientId,
-					blockRootClientId
-				);
+				const firstBlockIndex = getBlockIndex( firstClientId );
 				const lastBlockIndex = getBlockIndex(
-					last( normalizedClientIds ),
-					blockRootClientId
+					last( normalizedClientIds )
 				);
 				const blockOrder = getBlockOrder( blockRootClientId );
 				const block = getBlock( firstClientId );

packages/block-editor/src/components/block-mover/index.js

@@ -108,11 +108,8 @@ export default withSelect( ( select, { clientIds } ) => {
 	const firstClientId = first( normalizedClientIds );
 	const block = getBlock( firstClientId );
 	const rootClientId = getBlockRootClientId( first( normalizedClientIds ) );
-	const firstIndex = getBlockIndex( firstClientId, rootClientId );
-	const lastIndex = getBlockIndex(
-		last( normalizedClientIds ),
-		rootClientId
-	);
+	const firstIndex = getBlockIndex( firstClientId );
+	const lastIndex = getBlockIndex( last( normalizedClientIds ) );
 	const blockOrder = getBlockOrder( rootClientId );
 	const isFirst = firstIndex === 0;
 	const isLast = lastIndex === blockOrder.length - 1;

packages/block-editor/src/components/block-mover/index.native.js

@@ -138,11 +138,8 @@ export default compose(
 		const firstClientId = first( normalizedClientIds );
 		const rootClientId = getBlockRootClientId( firstClientId );
 		const blockOrder = getBlockOrder( rootClientId );
-		const firstIndex = getBlockIndex( firstClientId, rootClientId );
-		const lastIndex = getBlockIndex(
-			last( normalizedClientIds ),
-			rootClientId
-		);
+		const firstIndex = getBlockIndex( firstClientId );
+		const lastIndex = getBlockIndex( last( normalizedClientIds ) );
 
 		return {
 			firstIndex,

packages/block-editor/src/components/block-tools/block-selection-button.js

@@ -59,7 +59,7 @@ function BlockSelectionButton( { clientId, rootClientId, blockElement } ) {
 				hasBlockMovingClientId,
 				getBlockListSettings,
 			} = select( blockEditorStore );
-			const index = getBlockIndex( clientId, rootClientId );
+			const index = getBlockIndex( clientId );
 			const { name, attributes } = getBlock( clientId );
 			const blockMovingMode = hasBlockMovingClientId();
 			return {
@@ -169,14 +169,8 @@ function BlockSelectionButton( { clientId, rootClientId, blockElement } ) {
 		if ( ( isEnter || isSpace ) && startingBlockClientId ) {
 			const sourceRoot = getBlockRootClientId( startingBlockClientId );
 			const destRoot = getBlockRootClientId( selectedBlockClientId );
-			const sourceBlockIndex = getBlockIndex(
-				startingBlockClientId,
-				sourceRoot
-			);
-			let destinationBlockIndex = getBlockIndex(
-				selectedBlockClientId,
-				destRoot
-			);
+			const sourceBlockIndex = getBlockIndex( startingBlockClientId );
+			let destinationBlockIndex = getBlockIndex( selectedBlockClientId );
 			if (
 				sourceBlockIndex < destinationBlockIndex &&
 				sourceRoot === destRoot

packages/block-editor/src/components/inserter/hooks/use-insertion-point.js

@@ -64,19 +64,12 @@ function useInsertionPoint( {
 				_destinationIndex = insertionIndex;
 			} else if ( clientId ) {
 				// Insert after a specific client ID.
-				_destinationIndex = getBlockIndex(
-					clientId,
-					_destinationRootClientId
-				);
+				_destinationIndex = getBlockIndex( clientId );
 			} else if ( ! isAppender && selectedBlockClientId ) {
 				_destinationRootClientId = getBlockRootClientId(
 					selectedBlockClientId
 				);
-				_destinationIndex =
-					getBlockIndex(
-						selectedBlockClientId,
-						_destinationRootClientId
-					) + 1;
+				_destinationIndex = getBlockIndex( selectedBlockClientId ) + 1;
 			} else {
 				// Insert at the end of the list.
 				_destinationIndex = getBlockOrder( _destinationRootClientId )

packages/block-editor/src/components/inserter/index.js

@@ -265,7 +265,7 @@ export default compose( [
 
 					// If the clientId is defined, we insert at the position of the block.
 					if ( clientId ) {
-						return getBlockIndex( clientId, rootClientId );
+						return getBlockIndex( clientId );
 					}
 
 					// If there a selected block, we insert after the selected block.
@@ -275,7 +275,7 @@ export default compose( [
 						end &&
 						getBlockRootClientId( end ) === rootClientId
 					) {
-						return getBlockIndex( end, rootClientId ) + 1;
+						return getBlockIndex( end ) + 1;
 					}
 
 					// Otherwise, we insert at the end of the current rootClientId

packages/block-editor/src/components/inserter/index.native.js

@@ -343,10 +343,7 @@ export default compose( [
 		const destinationRootClientId = isAnyBlockSelected
 			? getBlockRootClientId( end )
 			: rootClientId;
-		const selectedBlockIndex = getBlockIndex(
-			end,
-			destinationRootClientId
-		);
+		const selectedBlockIndex = getBlockIndex( end );
 		const endOfRootIndex = getBlockOrder( rootClientId ).length;
 		const isSelectedUnmodifiedDefaultBlock = isAnyBlockSelected
 			? isUnmodifiedDefaultBlock( getBlock( end ) )
@@ -364,7 +361,7 @@ export default compose( [
 
 			// If the clientId is defined, we insert at the position of the block.
 			if ( clientId ) {
-				return getBlockIndex( clientId, rootClientId );
+				return getBlockIndex( clientId );
 			}
 
 			// If there is a selected block,

packages/block-editor/src/components/inserter/quick-inserter.js

@@ -56,7 +56,7 @@ export default function QuickInserter( {
 			const { getSettings, getBlockIndex, getBlockCount } = select(
 				blockEditorStore
 			);
-			const index = getBlockIndex( clientId, rootClientId );
+			const index = getBlockIndex( clientId );
 			return {
 				setInserterIsOpened: getSettings()
 					.__experimentalSetIsInserterOpened,

packages/block-editor/src/components/list-view/use-list-view-drop-zone.js

@@ -226,7 +226,7 @@ export default function useListViewDropZone() {
 					return {
 						clientId,
 						rootClientId,
-						blockIndex: getBlockIndex( clientId, rootClientId ),
+						blockIndex: getBlockIndex( clientId ),
 						element: blockElement,
 						isDraggedBlock: isBlockDrag
 							? draggedBlockClientIds.includes( clientId )

packages/block-editor/src/components/use-on-block-drop/index.js

@@ -95,10 +95,7 @@ export function onBlockDrop(
 
 		// If the user is moving a block
 		if ( dropType === 'block' ) {
-			const sourceBlockIndex = getBlockIndex(
-				sourceClientIds[ 0 ],
-				sourceRootClientId
-			);
+			const sourceBlockIndex = getBlockIndex( sourceClientIds[ 0 ] );
 
 			// If the user is dropping to the same position, return early.
 			if (

packages/block-editor/src/store/actions.js

@@ -1169,8 +1169,7 @@ export const duplicateBlocks = ( clientIds, updateSelection = true ) => ( {
 
 	const rootClientId = select.getBlockRootClientId( clientIds[ 0 ] );
 	const lastSelectedIndex = select.getBlockIndex(
-		last( castArray( clientIds ) ),
-		rootClientId
+		last( castArray( clientIds ) )
 	);
 	const clonedBlocks = blocks.map( ( block ) =>
 		__experimentalCloneSanitizedBlock( block )
@@ -1205,7 +1204,7 @@ export const insertBeforeBlock = ( clientId ) => ( { select, dispatch } ) => {
 		return;
 	}
 
-	const firstSelectedIndex = select.getBlockIndex( clientId, rootClientId );
+	const firstSelectedIndex = select.getBlockIndex( clientId );
 	return dispatch.insertDefaultBlock( {}, rootClientId, firstSelectedIndex );
 };
 
@@ -1224,7 +1223,7 @@ export const insertAfterBlock = ( clientId ) => ( { select, dispatch } ) => {
 		return;
 	}
 
-	const firstSelectedIndex = select.getBlockIndex( clientId, rootClientId );
+	const firstSelectedIndex = select.getBlockIndex( clientId );
 	return dispatch.insertDefaultBlock(
 		{},
 		rootClientId,

packages/block-editor/src/store/selectors.js

@@ -892,11 +892,11 @@ export function getBlockOrder( state, rootClientId ) {
  *
  * @param {Object}  state        Editor state.
  * @param {string}  clientId     Block client ID.
- * @param {?string} rootClientId Optional root client ID of block list.
  *
  * @return {number} Index at which block exists in order.
  */
-export function getBlockIndex( state, clientId, rootClientId ) {
+export function getBlockIndex( state, clientId ) {
+	const rootClientId = getBlockRootClientId( state, clientId );
 	return getBlockOrder( state, rootClientId ).indexOf( clientId );
 }
 

packages/block-editor/src/store/test/selectors.js

@@ -1358,7 +1358,7 @@ describe( 'selectors', () => {
 				},
 			};
 
-			expect( getBlockIndex( state, 56, '123' ) ).toBe( 1 );
+			expect( getBlockIndex( state, 56 ) ).toBe( 1 );
 		} );
 	} );
 

packages/block-library/src/group/edit.native.js

@@ -120,7 +120,7 @@ export default compose( [
 			const { innerBlocks } = block;
 			const selectedBlockClientId = getSelectedBlockClientId();
 			const totalInnerBlocks = innerBlocks.length - 1;
-			const blockIndex = getBlockIndex( selectedBlockClientId, clientId );
+			const blockIndex = getBlockIndex( selectedBlockClientId );
 			isLastInnerBlockSelected = totalInnerBlocks === blockIndex;
 		}
 

packages/edit-widgets/src/hooks/use-widget-library-insertion-point.js

@@ -57,7 +57,7 @@ const useWidgetLibraryInsertionPoint = () => {
 
 			return {
 				rootClientId,
-				insertionIndex: getBlockIndex( clientId, rootClientId ) + 1,
+				insertionIndex: getBlockIndex( clientId ) + 1,
 			};
 		},
 		[ firstRootId ]