diff --git a/packages/block-editor/src/components/rich-text/index.native.js b/packages/block-editor/src/components/rich-text/index.native.js index 1430702991dbd..d9fc545e8fa9f 100644 --- a/packages/block-editor/src/components/rich-text/index.native.js +++ b/packages/block-editor/src/components/rich-text/index.native.js @@ -531,10 +531,18 @@ export class RichText extends Component { onFocus() { this.isTouched = true; - if ( this.props.onFocus ) { - this.props.onFocus(); + const { unstableOnFocus } = this.props; + + if ( unstableOnFocus ) { + unstableOnFocus(); } + // We know for certain that on focus, the old selection is invalid. It + // will be recalculated on `selectionchange`. + const index = undefined; + + this.props.onSelectionChange( index, index ); + this.lastAztecEventType = 'focus'; } @@ -657,7 +665,9 @@ export class RichText extends Component { } if ( ! this.comesFromAztec ) { - if ( nextProps.selectionStart !== this.props.selectionStart && + if ( ( typeof nextProps.selectionStart !== 'undefined' ) && + ( typeof nextProps.selectionEnd !== 'undefined' ) && + nextProps.selectionStart !== this.props.selectionStart && nextProps.selectionStart !== this.selectionStart && nextProps.isSelected ) { this.needsSelectionUpdate = true; @@ -681,7 +691,7 @@ export class RichText extends Component { componentWillUnmount() { if ( this._editor.isFocused() ) { - this._editor.blur(); + // this._editor.blur(); } } @@ -695,7 +705,7 @@ export class RichText extends Component { // 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( this.props.selectionStart || 0, this.props.selectionEnd || 0 ); - } else if ( ! this.props.isSelected && prevProps.isSelected && this.isIOS ) { + } else if ( ! this.props.isSelected && prevProps.isSelected ) { this._editor.blur(); } } @@ -810,7 +820,6 @@ export class RichText extends Component { onContentSizeChange={ this.onContentSizeChange } onCaretVerticalPositionChange={ this.props.onCaretVerticalPositionChange } onSelectionChange={ this.onSelectionChangeFromAztec } - isSelected={ isSelected } blockType={ { tag: tagName } } color={ 'black' } maxImagesWidth={ 200 } @@ -836,15 +845,10 @@ RichText.defaultProps = { const RichTextContainer = compose( [ withInstanceId, - withBlockEditContext( ( { clientId, onFocus, onCaretVerticalPositionChange, isSelected }, ownProps ) => { - // ownProps.onFocus needs precedence over the block edit context - if ( ownProps.onFocus !== undefined ) { - onFocus = ownProps.onFocus; - } + withBlockEditContext( ( { clientId, onCaretVerticalPositionChange, isSelected }, ownProps ) => { return { clientId, blockIsSelected: ownProps.isSelected !== undefined ? ownProps.isSelected : isSelected, - onFocus, onCaretVerticalPositionChange, }; } ), diff --git a/packages/block-library/src/heading/edit.native.js b/packages/block-library/src/heading/edit.native.js index e7d295402c92e..1f409356b12a1 100644 --- a/packages/block-library/src/heading/edit.native.js +++ b/packages/block-library/src/heading/edit.native.js @@ -39,13 +39,10 @@ const HeadingEdit = ( { identifier="content" tagName={ 'h' + attributes.level } value={ attributes.content } - isSelected={ isSelected } style={ { ...style, minHeight: styles[ 'wp-block-heading' ].minHeight, } } - onFocus={ onFocus } // always assign onFocus as a props - onBlur={ onBlur } // always assign onBlur as a props onChange={ ( value ) => setAttributes( { content: value } ) } onMerge={ mergeBlocks } onSplit={ ( value ) => { diff --git a/packages/block-library/src/image/edit.native.js b/packages/block-library/src/image/edit.native.js index 61a0adf3635ce..cb0cc5a930263 100644 --- a/packages/block-library/src/image/edit.native.js +++ b/packages/block-library/src/image/edit.native.js @@ -361,7 +361,7 @@ class ImageEdit extends React.Component { placeholder={ __( 'Write caption…' ) } value={ caption } onChange={ ( newCaption ) => setAttributes( { caption: newCaption } ) } - onFocus={ this.onFocusCaption } + unstableOnFocus={ this.onFocusCaption } onBlur={ this.props.onBlur } // always assign onBlur as props isSelected={ this.state.isCaptionSelected } __unstableMobileNoFocusOnMount diff --git a/packages/block-library/src/paragraph/edit.native.js b/packages/block-library/src/paragraph/edit.native.js index 717677658e5a1..6dbcaf8a1459d 100644 --- a/packages/block-library/src/paragraph/edit.native.js +++ b/packages/block-library/src/paragraph/edit.native.js @@ -57,9 +57,6 @@ class ParagraphEdit extends Component { identifier="content" tagName="p" value={ content } - isSelected={ this.props.isSelected } - onFocus={ this.props.onFocus } // always assign onFocus as a props - onBlur={ this.props.onBlur } // always assign onBlur as a props deleteEnter={ true } style={ style } onChange={ ( nextContent ) => { diff --git a/packages/editor/src/components/post-title/index.native.js b/packages/editor/src/components/post-title/index.native.js index 07e6fe1be2c6c..c895abcbebc10 100644 --- a/packages/editor/src/components/post-title/index.native.js +++ b/packages/editor/src/components/post-title/index.native.js @@ -89,7 +89,7 @@ class PostTitle extends Component {