diff --git a/packages/block-editor/src/components/block-tools/zoom-out-mode-inserters.js b/packages/block-editor/src/components/block-tools/zoom-out-mode-inserters.js index bb044f9479c024..d15ee34714f5de 100644 --- a/packages/block-editor/src/components/block-tools/zoom-out-mode-inserters.js +++ b/packages/block-editor/src/components/block-tools/zoom-out-mode-inserters.js @@ -10,7 +10,7 @@ import { useEffect, useState } from '@wordpress/element'; import BlockPopoverInbetween from '../block-popover/inbetween'; import ZoomOutModeInserterButton from './zoom-out-mode-inserter-button'; import { store as blockEditorStore } from '../../store'; -import { unlock } from '../../lock-unlock'; +import { sectionRootClientIdKey } from '../../store/private-keys'; function ZoomOutModeInserters() { const [ isReady, setIsReady ] = useState( false ); @@ -33,7 +33,7 @@ function ZoomOutModeInserters() { getHoveredBlockClientId, isBlockInsertionPointVisible, } = select( blockEditorStore ); - const { sectionRootClientId: root } = unlock( getSettings() ); + const { [ sectionRootClientIdKey ]: root } = getSettings(); return { hasSelection: !! getSelectionStart().clientId, blockInsertionPoint: getBlockInsertionPoint(), diff --git a/packages/block-editor/src/components/inner-blocks/index.js b/packages/block-editor/src/components/inner-blocks/index.js index c8db9f8cebf905..9702044aeca6b0 100644 --- a/packages/block-editor/src/components/inner-blocks/index.js +++ b/packages/block-editor/src/components/inner-blocks/index.js @@ -30,6 +30,7 @@ import useBlockSync from '../provider/use-block-sync'; import { store as blockEditorStore } from '../../store'; import useBlockDropZone from '../use-block-drop-zone'; import { unlock } from '../../lock-unlock'; +import { sectionRootClientIdKey } from '../../store/private-keys'; const EMPTY_OBJECT = {}; @@ -225,7 +226,8 @@ export function useInnerBlocksProps( props = {}, options = {} ) { // In zoom out mode, we want to disable the drop zone for the sections. // The inner blocks belonging to the section drop zone is // already disabled by the blocks themselves being disabled. - const { sectionRootClientId } = unlock( getSettings() ); + const { [ sectionRootClientIdKey ]: sectionRootClientId } = + getSettings(); _isDropZoneDisabled = clientId !== sectionRootClientId; } diff --git a/packages/block-editor/src/components/use-block-drop-zone/index.js b/packages/block-editor/src/components/use-block-drop-zone/index.js index 8115fe8f72a647..fb25368239a011 100644 --- a/packages/block-editor/src/components/use-block-drop-zone/index.js +++ b/packages/block-editor/src/components/use-block-drop-zone/index.js @@ -24,6 +24,7 @@ import { } from '../../utils/math'; import { store as blockEditorStore } from '../../store'; import { unlock } from '../../lock-unlock'; +import { sectionRootClientIdKey } from '../../store/private-keys'; const THRESHOLD_DISTANCE = 30; const MINIMUM_HEIGHT_FOR_THRESHOLD = 120; @@ -360,7 +361,8 @@ export default function useBlockDropZone( { return; } - const { sectionRootClientId } = unlock( getSettings() ); + const { [ sectionRootClientIdKey ]: sectionRootClientId } = + getSettings(); // In Zoom Out mode, if the target is not the section root provided by settings then // do not allow dropping as the drop target is not within the root (that which is diff --git a/packages/block-editor/src/private-apis.js b/packages/block-editor/src/private-apis.js index 788bb2bef56efa..404c94940058ad 100644 --- a/packages/block-editor/src/private-apis.js +++ b/packages/block-editor/src/private-apis.js @@ -38,6 +38,7 @@ import { reusableBlocksSelectKey, globalStylesDataKey, globalStylesLinksDataKey, + sectionRootClientIdKey, } from './store/private-keys'; import { requiresWrapperOnCopy } from './components/writing-flow/utils'; import { PrivateRichText } from './components/rich-text/'; @@ -94,4 +95,5 @@ lock( privateApis, { __unstableBlockStyleVariationOverridesWithConfig, setBackgroundStyleDefaults, useBlockBindingsUtils, + sectionRootClientIdKey, } ); diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index 319398667293e4..ebd310b3de9d3f 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -35,7 +35,8 @@ import { privateRemoveBlocks, } from './private-actions'; import { STORE_NAME } from './constants'; -import { unlock } from '../lock-unlock'; + +import { sectionRootClientIdKey } from './private-keys'; /** @typedef {import('../components/use-on-block-drop/types').WPDropOperation} WPDropOperation */ @@ -1674,9 +1675,10 @@ export const __unstableSetEditorMode = // When switching to zoom-out mode, we need to select the parent section if ( mode === 'zoom-out' ) { const firstSelectedClientId = select.getBlockSelectionStart(); - const { sectionRootClientId } = unlock( - registry.select( STORE_NAME ).getSettings() - ); + const { [ sectionRootClientIdKey ]: sectionRootClientId } = registry + .select( STORE_NAME ) + .getSettings(); + if ( firstSelectedClientId ) { let sectionClientId; diff --git a/packages/block-editor/src/store/private-keys.js b/packages/block-editor/src/store/private-keys.js index 00fac5531b9c3f..e24b4a6264e72f 100644 --- a/packages/block-editor/src/store/private-keys.js +++ b/packages/block-editor/src/store/private-keys.js @@ -2,3 +2,4 @@ export const globalStylesDataKey = Symbol( 'globalStylesDataKey' ); export const globalStylesLinksDataKey = Symbol( 'globalStylesLinks' ); export const selectBlockPatternsKey = Symbol( 'selectBlockPatternsKey' ); export const reusableBlocksSelectKey = Symbol( 'reusableBlocksSelect' ); +export const sectionRootClientIdKey = Symbol( 'sectionRootClientIdKey' ); diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js index b30a719d21fd4d..2a840392fbffed 100644 --- a/packages/block-editor/src/store/selectors.js +++ b/packages/block-editor/src/store/selectors.js @@ -39,6 +39,8 @@ import { getTemporarilyEditingFocusModeToRevert, } from './private-selectors'; +import { sectionRootClientIdKey } from './private-keys'; + /** * A block selection object. * @@ -2058,9 +2060,10 @@ export const getInserterItems = createRegistrySelector( ( select ) => if ( ! item.rootClientId ) { let sectionRootClientId; try { - sectionRootClientId = unlock( - getSettings( state ) - ).sectionRootClientId; + sectionRootClientId = + getSettings( state )[ + sectionRootClientIdKey + ]; } catch ( e ) {} if ( sectionRootClientId && @@ -2838,7 +2841,8 @@ export function __unstableHasActiveBlockOverlayActive( state, clientId ) { // In zoom-out mode, the block overlay is always active for section level blocks. if ( editorMode === 'zoom-out' ) { - const { sectionRootClientId } = unlock( getSettings( state ) ); + const { [ sectionRootClientIdKey ]: sectionRootClientId } = + getSettings( state ); if ( sectionRootClientId ) { const sectionClientIds = getBlockOrder( state, @@ -2931,7 +2935,9 @@ export const getBlockEditingMode = createRegistrySelector( // sections. const editorMode = __unstableGetEditorMode( state ); if ( editorMode === 'zoom-out' ) { - const { sectionRootClientId } = unlock( getSettings( state ) ); + const { [ sectionRootClientIdKey ]: sectionRootClientId } = + getSettings( state ); + if ( clientId === '' /* ROOT_CONTAINER_CLIENT_ID */ ) { return sectionRootClientId ? 'disabled' : 'contentOnly'; } diff --git a/packages/editor/src/components/inserter-sidebar/index.js b/packages/editor/src/components/inserter-sidebar/index.js index bf613b5c8c001a..3e54fec6cc06b8 100644 --- a/packages/editor/src/components/inserter-sidebar/index.js +++ b/packages/editor/src/components/inserter-sidebar/index.js @@ -18,7 +18,9 @@ import { store as interfaceStore } from '@wordpress/interface'; import { unlock } from '../../lock-unlock'; import { store as editorStore } from '../../store'; -const { PrivateInserterLibrary } = unlock( blockEditorPrivateApis ); +const { PrivateInserterLibrary, sectionRootClientIdKey } = unlock( + blockEditorPrivateApis +); export default function InserterSidebar() { const { @@ -44,7 +46,8 @@ export default function InserterSidebar() { const { getActiveComplementaryArea } = select( interfaceStore ); const getBlockSectionRootClientId = () => { if ( __unstableGetEditorMode() === 'zoom-out' ) { - const { sectionRootClientId } = unlock( getSettings() ); + const { [ sectionRootClientIdKey ]: sectionRootClientId } = + getSettings(); if ( sectionRootClientId ) { return sectionRootClientId; } diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js index 6aa2763cf9db06..69e544be99d0ee 100644 --- a/packages/editor/src/components/provider/use-block-editor-settings.js +++ b/packages/editor/src/components/provider/use-block-editor-settings.js @@ -23,7 +23,7 @@ import { import inserterMediaCategories from '../media-categories'; import { mediaUpload } from '../../utils'; import { store as editorStore } from '../../store'; -import { lock, unlock } from '../../lock-unlock'; +import { unlock } from '../../lock-unlock'; import { useGlobalStylesContext } from '../global-styles-provider'; const EMPTY_BLOCKS_LIST = []; @@ -74,7 +74,6 @@ const BLOCK_EDITOR_SETTINGS = [ 'postContentAttributes', 'postsPerPage', 'readOnly', - 'sectionRootClientId', 'styles', 'titlePlaceholder', 'supportsLayout', @@ -90,6 +89,7 @@ const { globalStylesLinksDataKey, selectBlockPatternsKey, reusableBlocksSelectKey, + sectionRootClientIdKey, } = unlock( privateApis ); /** @@ -325,10 +325,9 @@ function useBlockEditorSettings( settings, postType, postId, renderingMode ) { ? [ [ 'core/navigation', {}, [] ] ] : settings.template, __experimentalSetIsInserterOpened: setIsInserterOpened, + [ sectionRootClientIdKey ]: sectionRootClientId, }; - lock( blockEditorSettings, { - sectionRootClientId, - } ); + return blockEditorSettings; }, [ allowedBlockTypes,