diff --git a/packages/block-editor/src/components/rich-text/index.js b/packages/block-editor/src/components/rich-text/index.js index d88f78d445887..3f77f233ea868 100644 --- a/packages/block-editor/src/components/rich-text/index.js +++ b/packages/block-editor/src/components/rich-text/index.js @@ -109,7 +109,6 @@ export function RichTextWrapper( __unstableDisableFormats: disableFormats, disableLineBreaks, __unstableAllowPrefixTransformations, - disableEditing, ...props }, forwardedRef @@ -148,7 +147,7 @@ export function RichTextWrapper( } // Disable Rich Text editing if block bindings specify that. - let disableBoundBlocks = false; + let shouldDisableEditing = false; if ( blockBindings && blockName in BLOCK_BINDINGS_ALLOWED_BLOCKS ) { const blockTypeAttributes = getBlockType( blockName ).attributes; const { getBlockBindingsSource } = unlock( @@ -164,7 +163,7 @@ export function RichTextWrapper( 'rich-text' && getBlockBindingsSource( args.source )?.lockAttributesEditing ) { - disableBoundBlocks = true; + shouldDisableEditing = true; break; } } @@ -174,10 +173,10 @@ export function RichTextWrapper( selectionStart: isSelected ? selectionStart.offset : undefined, selectionEnd: isSelected ? selectionEnd.offset : undefined, isSelected, - disableBoundBlocks, + shouldDisableEditing, }; }; - const { selectionStart, selectionEnd, isSelected, disableBoundBlocks } = + const { selectionStart, selectionEnd, isSelected, shouldDisableEditing } = useSelect( selector, [ clientId, identifier, @@ -185,8 +184,6 @@ export function RichTextWrapper( isBlockSelected, ] ); - const shouldDisableEditing = disableEditing || disableBoundBlocks; - const { getSelectionStart, getSelectionEnd, getBlockRootClientId } = useSelect( blockEditorStore ); const { selectionChange } = useDispatch( blockEditorStore ); @@ -361,6 +358,7 @@ export function RichTextWrapper( aria-multiline={ ! disableLineBreaks } aria-label={ placeholder } aria-readonly={ shouldDisableEditing } + contentEditable={ ! shouldDisableEditing } { ...props } { ...autocompleteProps } ref={ useMergeRefs( [ @@ -415,7 +413,6 @@ export function RichTextWrapper( useFirefoxCompat(), anchorRef, ] ) } - contentEditable={ ! shouldDisableEditing } suppressContentEditableWarning={ true } className={ classnames( 'block-editor-rich-text__editable', diff --git a/packages/block-library/src/image/image.js b/packages/block-library/src/image/image.js index a616b18ad7f6e..0b17573d1f057 100644 --- a/packages/block-library/src/image/image.js +++ b/packages/block-library/src/image/image.js @@ -801,7 +801,8 @@ export default function Image( { insertBlocksAfter={ insertBlocksAfter } label={ __( 'Image caption text' ) } showToolbarButton={ isSingleSelected && hasNonContentControls } - disableEditing={ lockCaption } + contentEditable={ ! lockCaption } + aria-readonly={ lockCaption } /> ); diff --git a/packages/block-library/src/utils/caption.js b/packages/block-library/src/utils/caption.js index eb36bb71b0f95..e8df5d5195741 100644 --- a/packages/block-library/src/utils/caption.js +++ b/packages/block-library/src/utils/caption.js @@ -28,7 +28,7 @@ export function Caption( { label = __( 'Caption text' ), showToolbarButton = true, className, - disableEditing, + ...props } ) { const caption = attributes[ key ]; const prevCaption = usePrevious( caption ); @@ -102,7 +102,7 @@ export function Caption( { createBlock( getDefaultBlockName() ) ) } - disableEditing={ disableEditing } + { ...props } /> ) }