From 851e2a051b5c7a14669b83b83c1f9bd4b1e0bd86 Mon Sep 17 00:00:00 2001
From: Gerardo Pacheco <gerardo.pacheco@automattic.com>
Date: Wed, 12 Jun 2024 17:00:29 +0200
Subject: [PATCH] [Mobile] Improve List block onSplit to avoid hiding the
 keyboard on enter (#62446)

* Native RichText - Add __unstableUseSplitSelection prop

* Native List block - Use __unstableUseSplitSelection prop and remove custom onSplit and onReplace functionality

* Update changelog

* Fix changelog after fixing conflict

Co-authored-by: geriux <geriux@git.wordpress.org>
Co-authored-by: twstokes <twstokes@git.wordpress.org>
Co-authored-by: fluiddot <carlosgprim@git.wordpress.org>
---
 .../src/components/rich-text/index.native.js  |  4 ++++
 .../src/list-item/edit.native.js              | 24 ++-----------------
 packages/react-native-editor/CHANGELOG.md     |  1 +
 3 files changed, 7 insertions(+), 22 deletions(-)

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 2697f5fdf154b..9390c71bdcf0b 100644
--- a/packages/block-editor/src/components/rich-text/index.native.js
+++ b/packages/block-editor/src/components/rich-text/index.native.js
@@ -80,6 +80,7 @@ export function RichTextWrapper(
 		unstableOnFocus,
 		__unstableAllowPrefixTransformations,
 		// Native props.
+		__unstableUseSplitSelection,
 		__unstableMobileNoFocusOnMount,
 		deleteEnter,
 		placeholderTextColor,
@@ -178,6 +179,7 @@ export function RichTextWrapper(
 		exitFormattedText,
 		selectionChange,
 		__unstableMarkAutomaticChange,
+		__unstableSplitSelection,
 		clearSelectedBlock,
 	} = useDispatch( blockEditorStore );
 	const adjustedAllowedFormats = getAllowedFormats( {
@@ -345,6 +347,8 @@ export function RichTextWrapper(
 				}
 			} else if ( canSplit ) {
 				splitValue( value );
+			} else if ( __unstableUseSplitSelection ) {
+				__unstableSplitSelection();
 			} else if ( canSplitAtEnd ) {
 				onSplitAtEnd();
 			} else if (
diff --git a/packages/block-library/src/list-item/edit.native.js b/packages/block-library/src/list-item/edit.native.js
index 89f7bd0ace0b7..2367529242ded 100644
--- a/packages/block-library/src/list-item/edit.native.js
+++ b/packages/block-library/src/list-item/edit.native.js
@@ -21,8 +21,7 @@ import { useState, useCallback, useRef } from '@wordpress/element';
 /**
  * Internal dependencies
  */
-import { useSplit, useMerge, useEnter } from './hooks';
-import { convertToListItems } from './utils';
+import { useMerge, useEnter } from './hooks';
 import { IndentUI } from './edit.js';
 import styles from './style.scss';
 import ListStyleType from './list-style-type';
@@ -32,7 +31,6 @@ const OPACITY = '9e';
 export default function ListItemEdit( {
 	attributes,
 	setAttributes,
-	onReplace,
 	clientId,
 	style,
 	mergeBlocks,
@@ -118,24 +116,7 @@ export default function ListItemEdit( {
 
 	const preventDefault = useRef( false );
 	const { onEnter } = useEnter( { content, clientId }, preventDefault );
-	const onSplit = useSplit( clientId );
 	const onMerge = useMerge( clientId, mergeBlocks );
-	const onSplitList = useCallback(
-		( value ) => {
-			if ( ! preventDefault.current ) {
-				return onSplit( value );
-			}
-		},
-		[ clientId, onSplit ]
-	);
-	const onReplaceList = useCallback(
-		( blocks, ...args ) => {
-			if ( ! preventDefault.current ) {
-				onReplace( convertToListItems( blocks ), ...args );
-			}
-		},
-		[ clientId, onReplace, convertToListItems ]
-	);
 	const onLayout = useCallback( ( { nativeEvent } ) => {
 		setContentWidth( ( prevState ) => {
 			const { width } = nativeEvent.layout;
@@ -166,6 +147,7 @@ export default function ListItemEdit( {
 					onLayout={ onLayout }
 				>
 					<RichText
+						__unstableUseSplitSelection
 						identifier="content"
 						tagName="p"
 						onChange={ ( nextContent ) =>
@@ -176,9 +158,7 @@ export default function ListItemEdit( {
 						placeholderTextColor={
 							defaultPlaceholderTextColorWithOpacity
 						}
-						onSplit={ onSplitList }
 						onMerge={ onMerge }
-						onReplace={ onReplaceList }
 						onEnter={ onEnter }
 						style={ styleWithPlaceholderOpacity }
 						deleteEnter
diff --git a/packages/react-native-editor/CHANGELOG.md b/packages/react-native-editor/CHANGELOG.md
index d0f9d10f2fe68..1a923d19dab25 100644
--- a/packages/react-native-editor/CHANGELOG.md
+++ b/packages/react-native-editor/CHANGELOG.md
@@ -11,6 +11,7 @@ For each user feature we should also add a importance categorization label  to i
 
 ## Unreleased
 -   [internal] Fix Inserter items list filtering [#62334]
+-   [*] Prevent hiding the keyboard when creating new list items [#62446]
 
 ## 1.120.0
 -   [*] Prevent deleting content when backspacing in the first Paragraph block [#62069]