[RNMobile] Native mobile release v1.17.0

.github/PULL_REQUEST_TEMPLATE.md

@@ -20,3 +20,4 @@
 - [ ] My code follows the accessibility standards. <!-- Guidelines: https://make.wordpress.org/core/handbook/best-practices/coding-standards/accessibility-coding-standards/ -->
 - [ ] My code has proper inline documentation. <!-- Guidelines: https://make.wordpress.org/core/handbook/best-practices/inline-documentation-standards/javascript/ -->
 - [ ] I've included developer documentation if appropriate. <!-- Handbook: https://developer.wordpress.org/block-editor/ -->
+- [ ] I've updated all React Native files affected by any refactorings/renamings in this PR. <!-- React Native mobile Gutenberg guidelines: https://github.com/WordPress/gutenberg/blob/master/docs/contributors/native-mobile.md -->.

README.md

@@ -2,7 +2,7 @@
 [![Build Status](https://img.shields.io/travis/com/WordPress/gutenberg/master.svg)](https://travis-ci.com/WordPress/gutenberg)
 [![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org)
 
-![Screenshot of the Gutenberg Editor, editing a post in WordPress](https://cldup.com/H0oKBfpidk.png)
+![Screenshot of the Gutenberg Editor, editing a post in WordPress](https://cldup.com/R84R5fNgrI.png)
 
 This repo is the development hub for the <a href="https://make.wordpress.org/core/2017/01/04/focus-tech-and-design-leads/">editor focus in WordPress Core</a>. `Gutenberg` is the project name.
 
@@ -32,7 +32,6 @@ Here's why we're looking at the whole editing screen, as opposed to just the con
 4. **A fresh look at content creation.** Considering the whole interface lays a solid foundation for the next focus: full site customization.
 5. **Modern tooling.** Looking at the full editor screen also gives WordPress the opportunity to drastically modernize the foundation, and take steps towards a more fluid and JavaScript-powered future that fully leverages the WordPress REST API.
 
-![Writing in Gutenberg 1.6](https://make.wordpress.org/core/files/2017/10/gutenberg-typing-1_6.gif)
 
 ## Blocks
 

docs/contributors/develop.md

@@ -13,3 +13,4 @@ The following resources offer additional information for developers who wish to
 * [Managing Packages](/docs/contributors/managing-packages.md).
 * [Gutenberg Release Process](/docs/contributors/release.md) - a checklist for the different type of releases for Gutenberg project.
 * [Localizing Gutenberg Plugin](/docs/contributors/localizing.md) - a guide on how to translate Gutenberg in your locale or language.
+* [React Native mobile Gutenberg](/docs/contributors/native-mobile.md) - a guide on the React Native based mobile Gutenberg editor.

docs/contributors/document.md

@@ -8,8 +8,8 @@ To add a new documentation page:
 
 1. Create a Markdown file in the [docs](https://github.com/WordPress/gutenberg/tree/master/docs) folder
 2. Add item to the [toc.json](https://github.com/WordPress/gutenberg/blob/master/docs/toc.json) hierarchy
-3. Update manifest.json by running `npm run docs:build`
-4. Commit manifest.json with other files updated
+3. Update `manifest-devhub.json` by running `npm run docs:build`
+4. Commit `manifest-devhub.json` with other files updated
 
 ## Using Links
 

docs/contributors/native-mobile.md

@@ -0,0 +1,6 @@
+# React Native based mobile Gutenberg
+Intertwined with the web codepaths, the Gutenberg repo also includes the [React Native](https://facebook.github.io/react-native/) based mobile tree. The mobile client is packaged and released via the [official WordPress apps](https://wordpress.org/mobile/). Even though the build pipeline is rather different and lives in its own repo for now ([here's the native mobile repo](https://github.com/wordpress-mobile/gutenberg-mobile)), the source code itself is taken directly from this repo and the "web" side codepaths.
+## Native mobile specific files
+The majority of the code shared with native mobile is in the very same JavaScript module and SASS style files. In the cases where the code paths need to diverge, a `.native.js` or `.native.scss` variant of the file is created. In some cases, platform specific files can be also found for Android (`.android.js`) or iOS (`.ios.js`).
+## Mind the mobile
+Our tooling isn't as good yet as we'd like to and it's hard to have a good awareness of those native mobile files. That means that contributors need to manually pay attention to update the native mobile files during code refactorings. For example, renaming a function or a prop should also be performed in the native modules too, otherwise, the mobile client will break. We are in the process of putting some more safeguards in place in PRs, but we're still far from done. Please bear with us and thank you in advance. ❤️🙇‍

docs/designers-developers/developers/block-api/block-registration.md

@@ -1,6 +1,6 @@
 # Block Registration
 
-## `register_block_type`
+## `registerBlockType`
 
 * **Type:** `Function`
 

docs/designers-developers/developers/themes/theme-support.md

@@ -134,6 +134,46 @@ Themes are responsible for creating the classes that apply the colors in differe
 
 The class name is built appending 'has-', followed by the class name _using_ kebab case and ending with the context name.
 
+### Block Gradient Presents
+
+Different blocks have the possibility of selecting from a list of predined of gradients. The block editor provides a default gradient presets, but a theme can overwrite them and provide its own:
+
+```php
+add_theme_support(
+	'__experimental-editor-gradient-presets',
+	array(
+		array(
+			'name'     => __( 'Vivid cyan blue to vivid purple', 'themeLangDomain' ),
+			'gradient' => 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)',
+			'slug'     => 'vivid-cyan-blue-to-vivid-purple'
+		),
+		array(
+			'name'     => __( 'Vivid green cyan to vivid cyan blue', 'themeLangDomain' ),
+			'gradient' => 'linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%)',
+			'slug'     =>  'vivid-green-cyan-to-vivid-cyan-blue',
+		),
+		array(
+			'name'     => __( 'Light green cyan to vivid green cyan', 'themeLangDomain' ),
+			'gradient' => 'linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)',
+			'slug'     => 'light-green-cyan-to-vivid-green-cyan',
+		),
+		array(
+			'name'     => __( 'Luminous vivid amber to luminous vivid orange', 'themeLangDomain' ),
+			'gradient' => 'linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%)',
+			'slug'     => 'luminous-vivid-amber-to-luminous-vivid-orange',
+		),
+		array(
+			'name'     => __( 'Luminous vivid orange to vivid red', 'themeLangDomain' ),
+			'gradient' => 'linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%)',
+			'slug'     => 'luminous-vivid-orange-to-vivid-red',
+		),
+	)
+);
+```
+
+`name` is a human-readable label (demonstrated above) that appears in the tooltip and provides a meaningful description of the gradient to users. It is especially important for those who rely on screen readers or would otherwise have difficulty perceiving the color. `gradient` is a CSS value of a gradient applied to a background-image of the block. Details of valid gradient types can be found in the [mozilla documentation](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients). `slug` is a unique identifier for the gradient and is used to generate the CSS classes used by the block editor.
+
+
 ### Block Font Sizes:
 
 Blocks may allow the user to configure the font sizes they use, e.g., the paragraph block. The block  provides a default set of font sizes, but a theme can overwrite it and provide its own:

docs/manifest-devhub.json

@@ -317,6 +317,12 @@
 		"markdown_source": "../docs/contributors/localizing.md",
 		"parent": "develop"
 	},
+	{
+		"title": "React Native based mobile Gutenberg",
+		"slug": "native-mobile",
+		"markdown_source": "../docs/contributors/native-mobile.md",
+		"parent": "develop"
+	},
 	{
 		"title": "Documentation Contributions",
 		"slug": "document",

docs/toc.json

@@ -59,7 +59,8 @@
 			{ "docs/contributors/scripts.md": [] },
 			{ "docs/contributors/managing-packages.md": [] },
 			{ "docs/contributors/release.md": [] },
-			{ "docs/contributors/localizing.md": [] }
+			{ "docs/contributors/localizing.md": [] },
+			{ "docs/contributors/native-mobile.md": [] }
 		] },
 		{ "docs/contributors/document.md": [
 			{ "docs/contributors/copy-guide.md": [] }

gutenberg.php

@@ -3,7 +3,7 @@
  * Plugin Name: Gutenberg
  * Plugin URI: https://github.com/WordPress/gutenberg
  * Description: Printing since 1440. This is the development plugin for the new block editor in core.
- * Version: 6.8.0-rc.1
+ * Version: 6.8.0
  * Author: Gutenberg Team
  * Text Domain: gutenberg
  *

lib/experiments-page.php

@@ -137,6 +137,12 @@ function gutenberg_experiments_editor_settings( $settings ) {
 		'__experimentalEnableFullSiteEditing'   => gutenberg_is_experiment_enabled( 'gutenberg-full-site-editing' ),
 
 	);
+
+	$gradient_presets = current( (array) get_theme_support( '__experimental-editor-gradient-presets' ) );
+	if ( false !== $gradient_presets ) {
+		$experiments_settings['gradients'] = $gradient_presets;
+	}
+
 	return array_merge( $settings, $experiments_settings );
 }
 add_filter( 'block_editor_settings', 'gutenberg_experiments_editor_settings' );

lib/template-loader.php

@@ -80,7 +80,7 @@ function gutenberg_override_query_template( $template, $type, array $templates =
  * @return string Path to the canvas file to include.
  */
 function gutenberg_find_template( $template_file ) {
-	global $_wp_current_template_post, $_wp_current_template_hierarchy;
+	global $_wp_current_template_content, $_wp_current_template_hierarchy;
 
 	// Bail if no relevant template hierarchy was determined, or if the template file
 	// was overridden another way.
@@ -105,8 +105,56 @@ function gutenberg_find_template( $template_file ) {
 	);
 
 	if ( $template_query->have_posts() ) {
-		$template_posts            = $template_query->get_posts();
-		$_wp_current_template_post = array_shift( $template_posts );
+		$template_posts        = $template_query->get_posts();
+		$current_template_post = array_shift( $template_posts );
+
+		// Build map of template slugs to their priority in the current hierarchy.
+		$slug_priorities = array_flip( $slugs );
+
+		// See if there is a theme block template with higher priority than the resolved template post.
+		$higher_priority_block_template_path     = null;
+		$higher_priority_block_template_priority = PHP_INT_MAX;
+		$block_template_files                    = glob( get_stylesheet_directory() . '/block-templates/*.html', 1 );
+		if ( is_child_theme() ) {
+				$block_template_files = array_merge( $block_template_files, glob( get_template_directory() . '/block-templates/*.html', 1 ) );
+		}
+		foreach ( $block_template_files as $path ) {
+			$theme_block_template_priority = $slug_priorities[ basename( $path, '.html' ) ];
+			if (
+				isset( $theme_block_template_priority ) &&
+				$theme_block_template_priority < $higher_priority_block_template_priority &&
+				$theme_block_template_priority < $slug_priorities[ $current_template_post->post_name ]
+			) {
+				$higher_priority_block_template_path     = $path;
+				$higher_priority_block_template_priority = $theme_block_template_priority;
+			}
+		}
+
+		// If there is, use it instead.
+		if ( isset( $higher_priority_block_template_path ) ) {
+			$post_name             = basename( $path, '.html' );
+			$current_template_post = array(
+				'post_content' => file_get_contents( $higher_priority_block_template_path ),
+				'post_title'   => ucfirst( $post_name ),
+				'post_status'  => 'auto-draft',
+				'post_type'    => 'wp_template',
+				'post_name'    => $post_name,
+			);
+			if ( is_admin() ) {
+				// Only create auto-draft of block template for editing
+				// in admin screens, similarly to how we do it for new
+				// posts in the editor.
+				$current_template_post = get_post(
+					wp_insert_post( $current_template_post )
+				);
+			} else {
+				$current_template_post = new WP_Post(
+					(object) $current_template_post
+				);
+			}
+		}
+
+		$_wp_current_template_content = $current_template_post->post_content;
 	}
 
 	// Add extra hooks for template canvas.
@@ -131,17 +179,15 @@ function gutenberg_render_title_tag() {
  * Renders the markup for the current template.
  */
 function gutenberg_render_the_template() {
-	global $_wp_current_template_post;
+	global $_wp_current_template_content;
 	global $wp_embed;
 
-	if ( ! $_wp_current_template_post || 'wp_template' !== $_wp_current_template_post->post_type ) {
+	if ( ! $_wp_current_template_content ) {
 		echo '<h1>' . esc_html__( 'No matching template found', 'gutenberg' ) . '</h1>';
 		return;
 	}
 
-	$content = $_wp_current_template_post->post_content;
-
-	$content = $wp_embed->run_shortcode( $content );
+	$content = $wp_embed->run_shortcode( $_wp_current_template_content );
 	$content = $wp_embed->autoembed( $content );
 	$content = do_blocks( $content );
 	$content = wptexturize( $content );