diff --git a/packages/block-editor/src/components/rich-text/index.js b/packages/block-editor/src/components/rich-text/index.js index b3919feb052ef7..ba86551d500c82 100644 --- a/packages/block-editor/src/components/rich-text/index.js +++ b/packages/block-editor/src/components/rich-text/index.js @@ -306,7 +306,9 @@ function RichTextWrapper( toHTMLString( { value: before, multilineTag, - } ) + } ), + // Set true to not recreate the original block + true ) ); lastPastedBlockIndex += 1; diff --git a/packages/block-library/src/heading/edit.js b/packages/block-library/src/heading/edit.js index f798d8501b3e13..92ca7b29e44815 100644 --- a/packages/block-library/src/heading/edit.js +++ b/packages/block-library/src/heading/edit.js @@ -16,6 +16,8 @@ import { } from '@wordpress/block-editor'; import { ToolbarGroup } from '@wordpress/components'; +import { useSelect } from '@wordpress/data'; + /** * Internal dependencies */ @@ -27,8 +29,14 @@ function HeadingEdit( { mergeBlocks, onReplace, mergedStyle, + clientId, } ) { const { textAlign, content, level, placeholder } = attributes; + const block = useSelect( + ( select ) => select( 'core/block-editor' ).getBlock( clientId ), + [] + ); + const tagName = 'h' + level; const blockProps = useBlockProps( { className: classnames( { @@ -61,7 +69,17 @@ function HeadingEdit( { value={ content } onChange={ ( value ) => setAttributes( { content: value } ) } onMerge={ mergeBlocks } - onSplit={ ( value ) => { + onSplit={ ( value, keepId ) => { + if ( keepId ) { + return { + ...block, + attributes: { + ...block.attributes, + content: value || '', + }, + }; + } + if ( ! value ) { return createBlock( 'core/paragraph' ); } diff --git a/packages/block-library/src/paragraph/edit.js b/packages/block-library/src/paragraph/edit.js index 54650eeab792e3..c865d03fc1c231 100644 --- a/packages/block-library/src/paragraph/edit.js +++ b/packages/block-library/src/paragraph/edit.js @@ -72,6 +72,7 @@ function ParagraphBlock( { onReplace, onRemove, setAttributes, + clientId, } ) { const { align, @@ -85,10 +86,14 @@ function ParagraphBlock( { const isDropCapFeatureEnabled = useEditorFeature( 'typography.dropCap' ); const ref = useRef(); const inlineFontSize = style?.fontSize; - const size = useSelect( + const { size, block } = useSelect( ( select ) => { - const { fontSizes } = select( 'core/block-editor' ).getSettings(); - return getFontSize( fontSizes, fontSize, inlineFontSize ).size; + const { getBlock, getSettings } = select( 'core/block-editor' ); + const { fontSizes } = getSettings(); + return { + size: getFontSize( fontSizes, fontSize, inlineFontSize ).size, + block: getBlock( clientId ), + }; }, [ fontSize, inlineFontSize ] ); @@ -147,7 +152,16 @@ function ParagraphBlock( { onChange={ ( newContent ) => setAttributes( { content: newContent } ) } - onSplit={ ( value ) => { + onSplit={ ( value, keepId ) => { + if ( keepId ) { + return { + ...block, + attributes: { + ...block.attributes, + content: value || '', + }, + }; + } if ( ! value ) { return createBlock( name ); } diff --git a/packages/block-library/src/paragraph/edit.native.js b/packages/block-library/src/paragraph/edit.native.js index 69ddf8ee4df44b..737eeea770cdc8 100644 --- a/packages/block-library/src/paragraph/edit.native.js +++ b/packages/block-library/src/paragraph/edit.native.js @@ -19,11 +19,15 @@ function ParagraphBlock( { setAttributes, mergedStyle, style, + clientId, } ) { - const isRTL = useSelect( ( select ) => { - return !! select( 'core/block-editor' ).getSettings().isRTL; + const { isRTL, block } = useSelect( ( select ) => { + const { getBlock, getSettings } = select( 'core/block-editor' ); + return { + isRTL: !! getSettings().isRTL, + block: getBlock( clientId ), + }; }, [] ); - const { align, content, placeholder } = attributes; const styles = { @@ -53,7 +57,16 @@ function ParagraphBlock( { content: nextContent, } ); } } - onSplit={ ( value ) => { + onSplit={ ( value, keepId ) => { + if ( keepId ) { + return { + ...block, + attributes: { + ...block.attributes, + content: value || '', + }, + }; + } if ( ! value ) { return createBlock( name ); } diff --git a/packages/rich-text/src/component/index.native.js b/packages/rich-text/src/component/index.native.js index 2d3f3819dbac13..83a55c834344ed 100644 --- a/packages/rich-text/src/component/index.native.js +++ b/packages/rich-text/src/component/index.native.js @@ -7,7 +7,7 @@ * WordPress dependencies */ import RCTAztecView from '@wordpress/react-native-aztec'; -import { View, Platform } from 'react-native'; +import { View, Platform, InteractionManager } from 'react-native'; import { showUserSuggestions, showXpostSuggestions, @@ -730,8 +730,8 @@ export class RichText extends Component { } componentWillUnmount() { - if ( this._editor.isFocused() ) { - this._editor.blur(); + if ( this._editor?.isFocused() ) { + this._editor?.blur(); } } @@ -745,7 +745,7 @@ export class RichText extends Component { const { __unstableIsSelected: prevIsSelected } = prevProps; if ( isSelected && ! prevIsSelected ) { - this._editor.focus(); + this._editor?.focus(); // Update selection props explicitly when component is selected as Aztec won't call onSelectionChange // if its internal value hasn't change. When created, default value is 0, 0 this.onSelectionChange( @@ -753,7 +753,9 @@ export class RichText extends Component { this.props.selectionEnd || 0 ); } else if ( ! isSelected && prevIsSelected ) { - this._editor.blur(); + InteractionManager.runAfterInteractions( () => { + this._editor?.blur(); + } ); } }