diff --git a/packages/block-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js b/packages/block-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js index 01cc462e507ec..19b778ca8fccf 100644 --- a/packages/block-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js +++ b/packages/block-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js @@ -10,6 +10,7 @@ import { useRefEffect } from '@wordpress/compose'; * Internal dependencies */ import { store as blockEditorStore } from '../../../store'; +import { unlock } from '../../../lock-unlock'; /** * Adds block behaviour: @@ -20,9 +21,18 @@ import { store as blockEditorStore } from '../../../store'; * @param {string} clientId Block client ID. */ export function useEventHandlers( { clientId, isSelected } ) { - const { getBlockRootClientId, getBlockIndex } = - useSelect( blockEditorStore ); - const { insertAfterBlock, removeBlock } = useDispatch( blockEditorStore ); + const { + getBlockRootClientId, + getBlockIndex, + isZoomOut, + __unstableGetEditorMode, + } = unlock( useSelect( blockEditorStore ) ); + const { + insertAfterBlock, + removeBlock, + __unstableSetEditorMode, + resetZoomLevel, + } = unlock( useDispatch( blockEditorStore ) ); return useRefEffect( ( node ) => { @@ -56,7 +66,14 @@ export function useEventHandlers( { clientId, isSelected } ) { event.preventDefault(); - if ( keyCode === ENTER ) { + if ( + keyCode === ENTER && + __unstableGetEditorMode() === 'zoom-out' && + isZoomOut() + ) { + __unstableSetEditorMode( 'edit' ); + resetZoomLevel(); + } else if ( keyCode === ENTER ) { insertAfterBlock( clientId ); } else { removeBlock( clientId ); @@ -88,6 +105,10 @@ export function useEventHandlers( { clientId, isSelected } ) { getBlockIndex, insertAfterBlock, removeBlock, + __unstableGetEditorMode, + __unstableSetEditorMode, + isZoomOut, + resetZoomLevel, ] ); } diff --git a/packages/block-editor/src/components/block-tools/zoom-out-toolbar.js b/packages/block-editor/src/components/block-tools/zoom-out-toolbar.js index 2c0ed6b26651f..c830eeb249eef 100644 --- a/packages/block-editor/src/components/block-tools/zoom-out-toolbar.js +++ b/packages/block-editor/src/components/block-tools/zoom-out-toolbar.js @@ -6,7 +6,7 @@ import clsx from 'clsx'; /** * WordPress dependencies */ -import { dragHandle, trash, edit } from '@wordpress/icons'; +import { dragHandle, trash } from '@wordpress/icons'; import { Button, ToolbarButton } from '@wordpress/components'; import { useSelect, useDispatch } from '@wordpress/data'; import { store as blocksStore } from '@wordpress/blocks'; @@ -20,7 +20,6 @@ import BlockDraggable from '../block-draggable'; import BlockMover from '../block-mover'; import Shuffle from '../block-toolbar/shuffle'; import NavigableToolbar from '../navigable-toolbar'; -import { unlock } from '../../lock-unlock'; export default function ZoomOutToolbar( { clientId, __unstableContentRef } ) { const selected = useSelect( @@ -82,12 +81,9 @@ export default function ZoomOutToolbar( { clientId, __unstableContentRef } ) { isPrevBlockTemplatePart, canRemove, canMove, - setIsInserterOpened, } = selected; - const { removeBlock, __unstableSetEditorMode, resetZoomLevel } = unlock( - useDispatch( blockEditorStore ) - ); + const { removeBlock } = useDispatch( blockEditorStore ); const classNames = clsx( 'zoom-out-toolbar', { 'is-block-moving-mode': !! blockMovingMode, @@ -135,23 +131,6 @@ export default function ZoomOutToolbar( { clientId, __unstableContentRef } ) { ) } - { ! isBlockTemplatePart && ( - { - // Setting may be undefined. - if ( typeof setIsInserterOpened === 'function' ) { - setIsInserterOpened( false ); - } - __unstableSetEditorMode( 'edit' ); - resetZoomLevel(); - __unstableContentRef.current?.focus(); - } } - /> - ) } - { canRemove && ! isBlockTemplatePart && (