Port nextpage block to the ReactNative mobile app (#11192)

* Port next page block to native app

* Edit function is extracted from index.js and put into separate files for mobile and web
* New scss is added for mobile

* Fix lint issues

* Fix failing unittest

* Add react-native path to notices package.json

* Make some code review fixes

packages/block-library/src/index.native.js

@@ -13,6 +13,7 @@ import * as heading from './heading';
 import * as more from './more';
 import * as paragraph from './paragraph';
 import * as image from './image';
+import * as nextpage from './nextpage';
 
 export const registerCoreBlocks = () => {
 	[
@@ -21,6 +22,7 @@ export const registerCoreBlocks = () => {
 		code,
 		more,
 		image,
+		nextpage,
 	].forEach( ( { name, settings } ) => {
 		registerBlockType( name, settings );
 	} );

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

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+
+export default function NextPageEdit() {
+	return (
+		<div className="wp-block-nextpage">
+			<span>{ __( 'Page break' ) }</span>
+		</div>
+	);
+}

packages/block-library/src/nextpage/edit.native.js

@@ -0,0 +1,24 @@
+/**
+ * External dependencies
+ */
+import { View, Text } from 'react-native';
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import styles from './editor.scss';
+
+export default function NextPageEdit( { attributes } ) {
+	const { customText = __( 'Page break' ) } = attributes;
+
+	return (
+		<View className={ styles[ 'block-library-nextpage__container' ] }>
+			<Text>{ customText }</Text>
+		</View>
+	);
+}

packages/block-library/src/nextpage/editor.native.scss

@@ -0,0 +1,6 @@
+// @format
+
+.block-library-nextpage__container {
+	align-items: center;
+	padding: 4px 4px 4px 4px;
+}

packages/block-library/src/nextpage/index.js

@@ -5,6 +5,7 @@ import { __ } from '@wordpress/i18n';
 import { RawHTML } from '@wordpress/element';
 import { createBlock } from '@wordpress/blocks';
 import { G, Path, SVG } from '@wordpress/components';
+import edit from './edit';
 
 export const name = 'core/nextpage';
 
@@ -42,13 +43,7 @@ export const settings = {
 		],
 	},
 
-	edit() {
-		return (
-			<div className="wp-block-nextpage">
-				<span>{ __( 'Page break' ) }</span>
-			</div>
-		);
-	},
+	edit,
 
 	save() {
 		return (

packages/notices/package.json

@@ -21,6 +21,7 @@
 		"build-module"
 	],
 	"main": "build/index.js",
+	"react-native": "src/index",
 	"dependencies": {
 		"@babel/runtime": "^7.0.0",
 		"@wordpress/a11y": "file:../a11y",