diff --git a/packages/block-editor/src/private-apis.js b/packages/block-editor/src/private-apis.js index 7205bef5798ec..98dd326a3ebb3 100644 --- a/packages/block-editor/src/private-apis.js +++ b/packages/block-editor/src/private-apis.js @@ -32,6 +32,7 @@ import { usesContextKey } from './components/rich-text/format-edit'; import { ExperimentalBlockCanvas } from './components/block-canvas'; import { getDuotoneFilter } from './components/duotone/utils'; import { useFlashEditableBlocks } from './components/use-flash-editable-blocks'; +import { useZoomOutModeExit } from './components/block-list/use-block-props/use-zoom-out-mode-exit'; import { selectBlockPatternsKey, reusableBlocksSelectKey, @@ -78,6 +79,7 @@ lock( privateApis, { TextAlignmentControl, usesContextKey, useFlashEditableBlocks, + useZoomOutModeExit, globalStylesDataKey, globalStylesLinksDataKey, selectBlockPatternsKey, diff --git a/packages/editor/src/components/visual-editor/edit-template-blocks-notification.js b/packages/editor/src/components/visual-editor/edit-template-blocks-notification.js index 3ccbe79127c01..bacf1beb1abec 100644 --- a/packages/editor/src/components/visual-editor/edit-template-blocks-notification.js +++ b/packages/editor/src/components/visual-editor/edit-template-blocks-notification.js @@ -61,7 +61,11 @@ export default function EditTemplateBlocksNotification( { contentRef } ) { ) { return; } - setIsDialogOpen( true ); + + if ( ! event.defaultPrevented ) { + event.preventDefault(); + setIsDialogOpen( true ); + } }; const canvas = contentRef.current; diff --git a/packages/editor/src/components/visual-editor/index.js b/packages/editor/src/components/visual-editor/index.js index 4b41ca0146b5b..1528538c7ef2b 100644 --- a/packages/editor/src/components/visual-editor/index.js +++ b/packages/editor/src/components/visual-editor/index.js @@ -48,6 +48,7 @@ const { useLayoutStyles, ExperimentalBlockCanvas: BlockCanvas, useFlashEditableBlocks, + useZoomOutModeExit, } = unlock( blockEditorPrivateApis ); /** @@ -335,6 +336,7 @@ function VisualEditor( { useSelectNearestEditableBlock( { isEnabled: renderingMode === 'template-locked', } ), + useZoomOutModeExit(), ] ); const zoomOutProps =