[RNMobile] update mobile to not use ListEdit (#17070)

* [RNMobile] update mobile to not use ListEdit

This update is in response to changes made on the web side in #15113
that were causing a crash on mobile.

* Extract list block logic not shared with mobile to separate component

* Improve name of AdditionalSettings component

packages/block-editor/src/components/rich-text/index.native.js

@@ -20,20 +20,19 @@ import Autocomplete from '../autocomplete';
 import BlockFormatControls from '../block-format-controls';
 import FormatToolbar from './format-toolbar';
 import { withBlockEditContext } from '../block-edit/context';
-import { ListEdit } from './list-edit';
 
 const wrapperClasses = 'editor-rich-text block-editor-rich-text';
 const classes = 'editor-rich-text__editable block-editor-rich-text__editable';
 
 function RichTextWraper( {
+	children,
 	tagName,
 	value: originalValue,
 	onChange: originalOnChange,
 	selectionStart,
 	selectionEnd,
 	onSelectionChange,
 	multiline,
-	onTagNameChange,
 	inlineToolbar,
 	wrapperClassName,
 	className,
@@ -86,14 +85,7 @@ function RichTextWraper( {
 		>
 			{ ( { isSelected, value, onChange } ) =>
 				<View>
-					{ isSelected && multiline === 'li' && (
-						<ListEdit
-							onTagNameChange={ onTagNameChange }
-							tagName={ tagName }
-							value={ value }
-							onChange={ onChange }
-						/>
-					) }
+					{ children && children( { value, onChange } ) }
 					{ isSelected && ! inlineToolbar && (
 						<BlockFormatControls>
 							<FormatToolbar />

packages/block-library/src/list/edit.js

@@ -7,13 +7,9 @@ import {
 	RichText,
 	BlockControls,
 	RichTextShortcut,
-	InspectorControls,
 } from '@wordpress/block-editor';
 import {
 	Toolbar,
-	TextControl,
-	PanelBody,
-	ToggleControl,
 } from '@wordpress/components';
 import {
 	__unstableIndentListItems as indentListItems,
@@ -27,6 +23,7 @@ import {
  * Internal dependencies
  */
 import { name } from './';
+import OrderedListSettings from './ordered-list-settings';
 
 export default function ListEdit( {
 	attributes,
@@ -141,36 +138,12 @@ export default function ListEdit( {
 		>
 			{ controls }
 		</RichText>
-		{ ordered &&
-			<InspectorControls>
-				<PanelBody title={ __( 'Ordered List Settings' ) }>
-					<TextControl
-						label={ __( 'Start Value' ) }
-						type="number"
-						onChange={ ( value ) => {
-							const int = parseInt( value, 10 );
-
-							setAttributes( {
-								// It should be possible to unset the value,
-								// e.g. with an empty string.
-								start: isNaN( int ) ? undefined : int,
-							} );
-						} }
-						value={ Number.isInteger( start ) ? start.toString( 10 ) : '' }
-						step="1"
-					/>
-					<ToggleControl
-						label={ __( 'Reverse List Numbering' ) }
-						checked={ reversed || false }
-						onChange={ ( value ) => {
-							setAttributes( {
-								// Unset the attribute if not reversed.
-								reversed: value || undefined,
-							} );
-						} }
-					/>
-				</PanelBody>
-			</InspectorControls>
-		}
+		{ ordered && (
+			<OrderedListSettings
+				setAttributes={ setAttributes }
+				ordered={ ordered }
+				reversed={ reversed }
+				start={ start }
+			/> ) }
 	</>;
 }

packages/block-library/src/list/ordered-list-settings.js

@@ -0,0 +1,43 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { InspectorControls } from '@wordpress/block-editor';
+import {
+	TextControl,
+	PanelBody,
+	ToggleControl,
+} from '@wordpress/components';
+
+const OrderedListSettings = ( { setAttributes, reversed, start } ) => (
+	<InspectorControls>
+		<PanelBody title={ __( 'Ordered List Settings' ) }>
+			<TextControl
+				label={ __( 'Start Value' ) }
+				type="number"
+				onChange={ ( value ) => {
+					const int = parseInt( value, 10 );
+
+					setAttributes( {
+						// It should be possible to unset the value,
+						// e.g. with an empty string.
+						start: isNaN( int ) ? undefined : int,
+					} );
+				} }
+				value={ Number.isInteger( start ) ? start.toString( 10 ) : '' }
+				step="1"
+			/>
+			<ToggleControl
+				label={ __( 'Reverse List Numbering' ) }
+				checked={ reversed || false }
+				onChange={ ( value ) => {
+					setAttributes( {
+						// Unset the attribute if not reversed.
+						reversed: value || undefined,
+					} );
+				} }
+			/>
+		</PanelBody>
+	</InspectorControls> );
+
+export default OrderedListSettings;

packages/block-library/src/list/ordered-list-settings.native.js

@@ -0,0 +1,3 @@
+// Mobile has no additional list settings at this time, so render nothing
+const AdditionalSettings = () => null;
+export default AdditionalSettings;