diff --git a/docs/reference-guides/block-api/block-supports.md b/docs/reference-guides/block-api/block-supports.md index 60bcd4e852e698..f38bec24ffe83e 100644 --- a/docs/reference-guides/block-api/block-supports.md +++ b/docs/reference-guides/block-api/block-supports.md @@ -519,6 +519,20 @@ supports: { } ``` +## __experimentalLock + +- Type: `boolean` +- Default value: `true` + +A block may want to disable the ability to toggle the lock state. It can be locked/unlocked by a user from the block "Options" dropdown by default. To disable this behavior, set `__experimentalLock` to `false`. + +```js +supports: { + // Remove support for locking UI. + __experimentalLock: false +} +``` + ## spacing - Type: `Object` diff --git a/docs/reference-guides/data/data-core-block-editor.md b/docs/reference-guides/data/data-core-block-editor.md index 798871d54b1e8d..b78aec9ec8754d 100644 --- a/docs/reference-guides/data/data-core-block-editor.md +++ b/docs/reference-guides/data/data-core-block-editor.md @@ -48,6 +48,19 @@ _Returns_ - `boolean`: Whether the given block type is allowed to be inserted. +### canLockBlockType + +Determines if the given block type can be locked/unlocked by a user. + +_Parameters_ + +- _state_ `Object`: Editor state. +- _nameOrType_ `(string|Object)`: Block name or type object. + +_Returns_ + +- `boolean`: Whether a given block type can be locked/unlocked. + ### canMoveBlock Determines if the given block is allowed to be moved. diff --git a/packages/block-editor/src/components/block-lock/menu-item.js b/packages/block-editor/src/components/block-lock/menu-item.js index 0864851aaf18a3..fb860c2f48239c 100644 --- a/packages/block-editor/src/components/block-lock/menu-item.js +++ b/packages/block-editor/src/components/block-lock/menu-item.js @@ -14,18 +14,19 @@ import BlockLockModal from './modal'; import { store as blockEditorStore } from '../../store'; export default function BlockLockMenuItem( { clientId } ) { - const { canLockBlocks, isLocked } = useSelect( + const { canLockBlock, isLocked } = useSelect( ( select ) => { const { canMoveBlock, canRemoveBlock, + canLockBlockType, + getBlockName, getBlockRootClientId, - getSettings, } = select( blockEditorStore ); const rootClientId = getBlockRootClientId( clientId ); return { - canLockBlocks: getSettings().__experimentalCanLockBlocks, + canLockBlock: canLockBlockType( getBlockName( clientId ) ), isLocked: ! canMoveBlock( clientId, rootClientId ) || ! canRemoveBlock( clientId, rootClientId ), @@ -39,7 +40,7 @@ export default function BlockLockMenuItem( { clientId } ) { false ); - if ( ! canLockBlocks ) { + if ( ! canLockBlock ) { return null; } diff --git a/packages/block-editor/src/components/block-lock/toolbar.js b/packages/block-editor/src/components/block-lock/toolbar.js index 1a01498367b623..be025f97e88e7e 100644 --- a/packages/block-editor/src/components/block-lock/toolbar.js +++ b/packages/block-editor/src/components/block-lock/toolbar.js @@ -16,16 +16,19 @@ import { store as blockEditorStore } from '../../store'; export default function BlockLockToolbar( { clientId } ) { const blockInformation = useBlockDisplayInformation( clientId ); - const { canMove, canRemove, canLockBlocks } = useSelect( + const { canMove, canRemove, canLockBlock } = useSelect( ( select ) => { - const { canMoveBlock, canRemoveBlock, getSettings } = select( - blockEditorStore - ); + const { + canMoveBlock, + canRemoveBlock, + canLockBlockType, + getBlockName, + } = select( blockEditorStore ); return { canMove: canMoveBlock( clientId ), canRemove: canRemoveBlock( clientId ), - canLockBlocks: getSettings().__experimentalCanLockBlocks, + canLockBlock: canLockBlockType( getBlockName( clientId ) ), }; }, [ clientId ] @@ -36,7 +39,7 @@ export default function BlockLockToolbar( { clientId } ) { false ); - if ( ! canLockBlocks ) { + if ( ! canLockBlock ) { return null; } @@ -55,6 +58,7 @@ export default function BlockLockToolbar( { clientId } ) { blockInformation.title ) } onClick={ toggleModal } + aria-disabled={ ! canLockBlock } /> { isModalOpen && ( diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js index 7ded7911619439..b67c300b6fdacc 100644 --- a/packages/block-editor/src/store/selectors.js +++ b/packages/block-editor/src/store/selectors.js @@ -1442,6 +1442,23 @@ export function canMoveBlocks( state, clientIds, rootClientId = null ) { ); } +/** + * Determines if the given block type can be locked/unlocked by a user. + * + * @param {Object} state Editor state. + * @param {(string|Object)} nameOrType Block name or type object. + * + * @return {boolean} Whether a given block type can be locked/unlocked. + */ +export function canLockBlockType( state, nameOrType ) { + if ( ! hasBlockSupport( nameOrType, '__experimentalLock', true ) ) { + return false; + } + + // Use block editor settings as the default value. + return !! state.settings?.__experimentalCanLockBlocks; +} + /** * Returns information about how recently and frequently a block has been inserted. *