Second batch of backports for WP 5.8 beta 1

lib/block-supports/typography.php

@@ -15,19 +15,26 @@ function gutenberg_register_typography_support( $block_type ) {
 		return;
 	}
 
-	$has_font_size_support       = _wp_array_get( $block_type->supports, array( 'fontSize' ), false );
-	$has_font_style_support      = _wp_array_get( $block_type->supports, array( '__experimentalFontStyle' ), false );
-	$has_font_weight_support     = _wp_array_get( $block_type->supports, array( '__experimentalFontWeight' ), false );
-	$has_line_height_support     = _wp_array_get( $block_type->supports, array( 'lineHeight' ), false );
-	$has_text_decoration_support = _wp_array_get( $block_type->supports, array( '__experimentalTextDecoration' ), false );
-	$has_text_transform_support  = _wp_array_get( $block_type->supports, array( '__experimentalTextTransform' ), false );
-
-	$has_typography_support = $has_font_size_support
-		|| $has_font_weight_support
+	$typography_supports = _wp_array_get( $block_type->supports, array( 'typography' ), false );
+	if ( ! $typography_supports ) {
+		return;
+	}
+
+	$has_font_family_support     = _wp_array_get( $typography_supports, array( '__experimentalFontFamily' ), false );
+	$has_font_size_support       = _wp_array_get( $typography_supports, array( 'fontSize' ), false );
+	$has_font_style_support      = _wp_array_get( $typography_supports, array( '__experimentalFontStyle' ), false );
+	$has_font_weight_support     = _wp_array_get( $typography_supports, array( '__experimentalFontWeight' ), false );
+	$has_line_height_support     = _wp_array_get( $typography_supports, array( 'lineHeight' ), false );
+	$has_text_decoration_support = _wp_array_get( $typography_supports, array( '__experimentalTextDecoration' ), false );
+	$has_text_transform_support  = _wp_array_get( $typography_supports, array( '__experimentalTextTransform' ), false );
+
+	$has_typography_support = $has_font_family_support
+		|| $has_font_size_support
 		|| $has_font_style_support
+		|| $has_font_weight_support
 		|| $has_line_height_support
-		|| $has_text_transform_support
-		|| $has_text_decoration_support;
+		|| $has_text_decoration_support
+		|| $has_text_transform_support;
 
 	if ( ! $block_type->attributes ) {
 		$block_type->attributes = array();
@@ -61,40 +68,41 @@ function gutenberg_apply_typography_support( $block_type, $block_attributes ) {
 		return array();
 	}
 
+	$typography_supports = _wp_array_get( $block_type->supports, array( 'typography' ), false );
+	if ( ! $typography_supports ) {
+		return array();
+	}
+
+	$skip_typography_serialization = _wp_array_get( $typography_supports, array( '__experimentalSkipSerialization' ), false );
+	if ( $skip_typography_serialization ) {
+		return array();
+	}
+
 	$attributes = array();
 	$classes    = array();
 	$styles     = array();
 
-	$has_font_family_support     = _wp_array_get( $block_type->supports, array( '__experimentalFontFamily' ), false );
-	$has_font_style_support      = _wp_array_get( $block_type->supports, array( '__experimentalFontStyle' ), false );
-	$has_font_weight_support     = _wp_array_get( $block_type->supports, array( '__experimentalFontWeight' ), false );
-	$has_font_size_support       = _wp_array_get( $block_type->supports, array( 'fontSize' ), false );
-	$has_line_height_support     = _wp_array_get( $block_type->supports, array( 'lineHeight' ), false );
-	$has_text_decoration_support = _wp_array_get( $block_type->supports, array( '__experimentalTextDecoration' ), false );
-	$has_text_transform_support  = _wp_array_get( $block_type->supports, array( '__experimentalTextTransform' ), false );
-
-	$skip_font_size_support_serialization = _wp_array_get( $block_type->supports, array( '__experimentalSkipFontSizeSerialization' ), false );
-
-	// Covers all typography features _except_ font size.
-	$skip_typography_serialization = _wp_array_get( $block_type->supports, array( '__experimentalSkipTypographySerialization' ), false );
+	$has_font_family_support     = _wp_array_get( $typography_supports, array( '__experimentalFontFamily' ), false );
+	$has_font_size_support       = _wp_array_get( $typography_supports, array( 'fontSize' ), false );
+	$has_font_style_support      = _wp_array_get( $typography_supports, array( '__experimentalFontStyle' ), false );
+	$has_font_weight_support     = _wp_array_get( $typography_supports, array( '__experimentalFontWeight' ), false );
+	$has_line_height_support     = _wp_array_get( $typography_supports, array( 'lineHeight' ), false );
+	$has_text_decoration_support = _wp_array_get( $typography_supports, array( '__experimentalTextDecoration' ), false );
+	$has_text_transform_support  = _wp_array_get( $typography_supports, array( '__experimentalTextTransform' ), false );
 
-	// Font Size.
-	if ( $has_font_size_support && ! $skip_font_size_support_serialization ) {
+	if ( $has_font_size_support ) {
 		$has_named_font_size  = array_key_exists( 'fontSize', $block_attributes );
 		$has_custom_font_size = isset( $block_attributes['style']['typography']['fontSize'] );
 
-		// Apply required class or style.
 		if ( $has_named_font_size ) {
 			$classes[] = sprintf( 'has-%s-font-size', $block_attributes['fontSize'] );
 		} elseif ( $has_custom_font_size ) {
 			$styles[] = sprintf( 'font-size: %s;', $block_attributes['style']['typography']['fontSize'] );
 		}
 	}
 
-	// Font Family.
-	if ( $has_font_family_support && ! $skip_typography_serialization ) {
+	if ( $has_font_family_support ) {
 		$has_font_family = isset( $block_attributes['style']['typography']['fontFamily'] );
-		// Apply required class and style.
 		if ( $has_font_family ) {
 			$font_family = $block_attributes['style']['typography']['fontFamily'];
 			if ( strpos( $font_family, 'var:preset|font-family' ) !== false ) {
@@ -108,43 +116,35 @@ function gutenberg_apply_typography_support( $block_type, $block_attributes ) {
 		}
 	}
 
-	// Font style.
-	if ( $has_font_style_support && ! $skip_typography_serialization ) {
-		// Apply font style.
+	if ( $has_font_style_support ) {
 		$font_style = gutenberg_typography_get_css_variable_inline_style( $block_attributes, 'fontStyle', 'font-style' );
 		if ( $font_style ) {
 			$styles[] = $font_style;
 		}
 	}
 
-	// Font weight.
-	if ( $has_font_weight_support && ! $skip_typography_serialization ) {
-		// Apply font weight.
+	if ( $has_font_weight_support ) {
 		$font_weight = gutenberg_typography_get_css_variable_inline_style( $block_attributes, 'fontWeight', 'font-weight' );
 		if ( $font_weight ) {
 			$styles[] = $font_weight;
 		}
 	}
 
-	// Line Height.
-	if ( $has_line_height_support && ! $skip_typography_serialization ) {
+	if ( $has_line_height_support ) {
 		$has_line_height = isset( $block_attributes['style']['typography']['lineHeight'] );
-		// Add the style (no classes for line-height).
 		if ( $has_line_height ) {
 			$styles[] = sprintf( 'line-height: %s;', $block_attributes['style']['typography']['lineHeight'] );
 		}
 	}
 
-	// Text Decoration.
-	if ( $has_text_decoration_support && ! $skip_typography_serialization ) {
+	if ( $has_text_decoration_support ) {
 		$text_decoration_style = gutenberg_typography_get_css_variable_inline_style( $block_attributes, 'textDecoration', 'text-decoration' );
 		if ( $text_decoration_style ) {
 			$styles[] = $text_decoration_style;
 		}
 	}
 
-	// Text Transform.
-	if ( $has_text_transform_support && ! $skip_typography_serialization ) {
+	if ( $has_text_transform_support ) {
 		$text_transform_style = gutenberg_typography_get_css_variable_inline_style( $block_attributes, 'textTransform', 'text-transform' );
 		if ( $text_transform_style ) {
 			$styles[] = $text_transform_style;

lib/blocks.php

@@ -5,6 +5,24 @@
  * @package gutenberg
  */
 
+/*
+ * Fixes the priority of register_block_core_legacy_widget().
+ *
+ * This hook was incorrectly added to Core with priority 20. #32300 fixes this
+ * but causes block registration warnings in the Gutenberg plugin until the
+ * changes are made in Core.
+ *
+ * This temporary fix can be removed after the changes to
+ * @wordpress/block-library in #32300 have been published to npm and updated in
+ * Core.
+ *
+ * See https://github.com/WordPress/gutenberg/pull/32300.
+ */
+if ( 20 === has_action( 'init', 'register_block_core_legacy_widget' ) ) {
+	remove_action( 'init', 'register_block_core_legacy_widget', 20 );
+	add_action( 'init', 'register_block_core_legacy_widget', 10 );
+}
+
 /**
  * Substitutes the implementation of a core-registered block type, if exists,
  * with the built result from the plugin.
@@ -412,3 +430,41 @@ function gutenberg_block_has_support( $block_type, $feature, $default = false )
 
 	return true === $block_support || is_array( $block_support );
 }
+
+/**
+ * Updates the shape of supports for declaring fontSize and lineHeight.
+ *
+ * @param array $metadata Metadata for registering a block type.
+ * @return array          Metadata for registering a block type with the supports shape updated.
+ */
+function gutenberg_migrate_old_typography_shape( $metadata ) {
+	// Temporarily disable migrations from core blocks until core block.json are updated.
+	if ( isset( $metadata['supports'] ) && false === strpos( $metadata['file'], '/wp-includes/blocks/' ) ) {
+		$typography_keys = array(
+			'__experimentalFontFamily',
+			'__experimentalFontStyle',
+			'__experimentalFontWeight',
+			'__experimentalLetterSpacing',
+			'__experimentalTextDecoration',
+			'__experimentalTextTransform',
+			'fontSize',
+			'lineHeight',
+		);
+		foreach ( $typography_keys as $typography_key ) {
+			$support_for_key = _wp_array_get( $metadata['supports'], array( $typography_key ), null );
+			if ( null !== $support_for_key ) {
+				trigger_error(
+					/* translators: %1$s: Block type, %2$s: typography supports key e.g: fontSize, lineHeight etc... */
+					sprintf( __( 'Block %1$s is declaring %2$s support on block.json under supports.%2$s. %2$s support is now declared under supports.typography.%2$s.', 'gutenberg' ), $metadata['name'], $typography_key ),
+					headers_sent() || WP_DEBUG ? E_USER_WARNING : E_USER_NOTICE
+				);
+				gutenberg_experimental_set( $metadata['supports'], array( 'typography', $typography_key ), $support_for_key );
+				unset( $metadata['supports'][ $typography_key ] );
+			}
+		}
+	}
+	return $metadata;
+}
+
+
+add_filter( 'block_type_metadata', 'gutenberg_migrate_old_typography_shape' );

lib/class-wp-theme-json-gutenberg.php

@@ -663,7 +663,11 @@ private static function compute_preset_classes( $settings, $selector ) {
 			foreach ( $values as $value ) {
 				foreach ( $preset['classes'] as $class ) {
 					$stylesheet .= self::to_ruleset(
-						self::append_to_selector( $selector, '.has-' . $value['slug'] . '-' . $class['class_suffix'] ),
+						// We don't want to use kebabCase here,
+						// see https://github.com/WordPress/gutenberg/issues/32347
+						// However, we need to make sure the generated class
+						// doesn't contain spaces.
+						self::append_to_selector( $selector, '.has-' . preg_replace( '/\s+/', '-', $value['slug'] ) . '-' . $class['class_suffix'] ),
 						array(
 							array(
 								'name'  => $class['property_name'],

lib/class-wp-theme-json-resolver-gutenberg.php

@@ -74,7 +74,7 @@ private static function read_json_file( $file_path ) {
 
 			$json_decoding_error = json_last_error();
 			if ( JSON_ERROR_NONE !== $json_decoding_error ) {
-				error_log( 'Error when decoding file schema: ' . json_last_error_msg() );
+				trigger_error( "Error when decoding a theme.json schema at path $file_path " . json_last_error_msg() );
 				return $config;
 			}
 
@@ -367,7 +367,7 @@ public static function get_user_data() {
 
 			$json_decoding_error = json_last_error();
 			if ( JSON_ERROR_NONE !== $json_decoding_error ) {
-				error_log( 'Error when decoding user schema: ' . json_last_error_msg() );
+				trigger_error( 'Error when decoding a theme.json schema for user data. ' . json_last_error_msg() );
 				return new WP_Theme_JSON_Gutenberg( $config );
 			}
 

lib/init.php

@@ -30,7 +30,10 @@ function gutenberg_menu() {
 		'gutenberg'
 	);
 
-	if ( gutenberg_use_widgets_block_editor() ) {
+	if (
+		gutenberg_use_widgets_block_editor() &&
+		! function_exists( 'wp_use_widgets_block_editor' )
+	) {
 		add_theme_page(
 			__( 'Widgets', 'gutenberg' ),
 			__( 'Widgets', 'gutenberg' ),
@@ -113,7 +116,11 @@ function gutenberg_site_editor_menu() {
  * @param WP_Admin_Bar $wp_admin_bar Core class used to implement the Toolbar API.
  */
 function modify_admin_bar( $wp_admin_bar ) {
-	if ( gutenberg_use_widgets_block_editor() && $wp_admin_bar->get_node( 'widgets' ) !== null ) {
+	if (
+		gutenberg_use_widgets_block_editor() &&
+		! function_exists( 'wp_use_widgets_block_editor' ) &&
+		$wp_admin_bar->get_node( 'widgets' ) !== null
+	) {
 		$wp_admin_bar->add_menu(
 			array(
 				'id'   => 'widgets',
@@ -137,7 +144,10 @@ function modify_welcome_panel() {
 	ob_start();
 	wp_welcome_panel();
 	$welcome_panel = ob_get_clean();
-	if ( gutenberg_use_widgets_block_editor() ) {
+	if (
+		gutenberg_use_widgets_block_editor() &&
+		! function_exists( 'wp_use_widgets_block_editor' )
+	) {
 		echo str_replace(
 			admin_url( 'widgets.php' ),
 			admin_url( 'themes.php?page=gutenberg-widgets' ),

packages/base-styles/_z-index.scss

@@ -114,10 +114,6 @@ $z-layers: (
 	// Show the FSE template previews above the editor and any open block toolbars
 	".edit-site-navigation-panel__preview": 32,
 
-	// Show notices below expanded editor bar
-	// .edit-post-header { z-index: 30 }
-	".components-notice-list": 29,
-
 	// Above the block list and the header.
 	".block-editor-block-list__block-popover": 31,
 

packages/block-editor/README.md

@@ -371,7 +371,7 @@ _Parameters_
 
 _Returns_
 
--   `string`: String with the class corresponding to the fontSize passed. The class is generated by appending 'has-' followed by fontSizeSlug in kebabCase and ending with '-font-size'.
+-   `string`: String with the class corresponding to the fontSize passed. The class is generated by appending 'has-' followed by fontSizeSlug and ending with '-font-size'.
 
 <a name="getFontSizeObjectByValue" href="#getFontSizeObjectByValue">#</a> **getFontSizeObjectByValue**
 

packages/block-editor/src/components/block-list/block.js

@@ -161,6 +161,7 @@ function BlockListBlock( {
 		clientId,
 		className,
 		wrapperProps: omit( wrapperProps, [ 'data-align' ] ),
+		isAligned,
 	};
 	const memoizedValue = useMemo( () => value, Object.values( value ) );
 

packages/block-editor/src/components/block-list/use-block-props/index.js

@@ -58,7 +58,7 @@ const BLOCK_ANIMATION_THRESHOLD = 200;
  * @return {Object} Props to pass to the element to mark as a block.
  */
 export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
-	const { clientId, className, wrapperProps = {} } = useContext(
+	const { clientId, className, wrapperProps = {}, isAligned } = useContext(
 		BlockListBlockContext
 	);
 	const {
@@ -141,7 +141,9 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 		'data-title': blockTitle,
 		className: classnames(
 			// The wp-block className is important for editor styles.
-			'wp-block block-editor-block-list__block',
+			classnames( 'block-editor-block-list__block', {
+				'wp-block': ! isAligned,
+			} ),
 			className,
 			props.className,
 			wrapperProps.className,

packages/block-editor/src/components/block-pattern-setup/use-patterns-setup.js

@@ -14,23 +14,17 @@ function usePatternsSetup( clientId, blockName, filterPatternsFn ) {
 			const {
 				getBlockRootClientId,
 				__experimentalGetPatternsByBlockTypes,
-				__experimentalGetParsedPattern,
 				__experimentalGetAllowedPatterns,
 			} = select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
-			let patterns = [];
 			if ( filterPatternsFn ) {
-				patterns = __experimentalGetAllowedPatterns(
-					rootClientId
-				).filter( filterPatternsFn );
-			} else {
-				patterns = __experimentalGetPatternsByBlockTypes(
-					blockName,
-					rootClientId
+				return __experimentalGetAllowedPatterns( rootClientId ).filter(
+					filterPatternsFn
 				);
 			}
-			return patterns.map( ( { name } ) =>
-				__experimentalGetParsedPattern( name )
+			return __experimentalGetPatternsByBlockTypes(
+				blockName,
+				rootClientId
 			);
 		},
 		[ clientId, blockName, filterPatternsFn ]