prep build 02/14

bph · Feb 14, 2024 · 384a35a · 384a35a
2 parents fc23582 + 8cc54ee
commit 384a35a
Show file tree

Hide file tree

Showing 118 changed files with 1,461 additions and 2,382 deletions.
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
@@ -15,10 +15,6 @@
 # Blocks
 /packages/block-library                         @ajitbohra
 /packages/block-library/src/gallery             @geriux
-/packages/block-library/src/navigation          @tellthemachines
-/packages/block-library/src/navigation-link     @tellthemachines
-/packages/block-library/src/navigation-submenu  @tellthemachines
-/packages/block-library/src/page-list           @tellthemachines
 /packages/block-library/src/comment-template    @michalczaplinski
 /packages/block-library/src/comments            @michalczaplinski
 /packages/block-library/src/table-of-contents   @ZebulanStanphill
@@ -34,6 +30,8 @@
 /packages/annotations                           @atimmer
 /packages/autop
 /packages/block-editor                          @ellatrix
+/packages/block-editor/src/hooks                @tellthemachines
+/packages/block-editor/src/layouts              @tellthemachines
 /packages/block-serialization-spec-parser       @dmsnell
 /packages/block-serialization-default-parser    @dmsnell
 /packages/blocks
@@ -49,9 +47,9 @@
 /packages/block-editor/src/components/link-control  @getdave
 
 # Widgets
-/packages/edit-widgets                          @draganescu @talldan @noisysocks @tellthemachines @adamziel @kevin940726
-/packages/customize-widgets                     @noisysocks
-/packages/widgets                               @noisysocks
+/packages/edit-widgets                          @draganescu @talldan @adamziel @kevin940726
+/packages/customize-widgets
+/packages/widgets
 
 # Full Site Editing
 /packages/edit-site
@@ -136,6 +134,8 @@
 
 # PHP
 /lib                                            @spacedmonkey
+/lib/block-supports/layout.php                  @tellthemachines
+/lib/class-wp-theme-json-gutenberg.php          @tellthemachines
 /lib/compat/*/html-api                          @dmsnell
 /lib/experimental/rest-api.php                  @timothybjacobs
 /lib/experimental/class-wp-rest-*               @timothybjacobs

diff --git a/.wp-env.json b/.wp-env.json
@@ -9,8 +9,8 @@
 				"wp-content/mu-plugins": "./packages/e2e-tests/mu-plugins",
 				"wp-content/plugins/gutenberg-test-plugins": "./packages/e2e-tests/plugins",
 				"wp-content/themes/gutenberg-test-themes": "./test/gutenberg-test-themes",
-				"wp-content/themes/gutenberg-test-themes/twentytwentyone": "https://downloads.wordpress.org/theme/twentytwentyone.1.7.zip",
-				"wp-content/themes/gutenberg-test-themes/twentytwentythree": "https://downloads.wordpress.org/theme/twentytwentythree.1.0.zip",
+				"wp-content/themes/gutenberg-test-themes/twentytwentyone": "https://downloads.wordpress.org/theme/twentytwentyone.2.1.zip",
+				"wp-content/themes/gutenberg-test-themes/twentytwentythree": "https://downloads.wordpress.org/theme/twentytwentythree.1.3.zip",
 				"wp-content/themes/gutenberg-test-themes/twentytwentyfour": "https://downloads.wordpress.org/theme/twentytwentyfour.1.0.zip"
 			}
 		}

diff --git a/docs/reference-guides/block-api/block-supports.md b/docs/reference-guides/block-api/block-supports.md
@@ -414,20 +414,6 @@ supports: {
 }
 ```
 
-## defaultStylePicker
-
--   Type: `boolean`
--   Default value: `true`
-
-When the style picker is shown, the user can set a default style for a block type based on the block's currently active style. If you prefer not to make this option available, set this property to `false`.
-
-```js
-supports: {
-	// Remove the Default Style picker.
-	defaultStylePicker: false
-}
-```
-
 ## dimensions
 
 _**Note:** Since WordPress 6.2._

diff --git a/docs/reference-guides/data/data-core-blocks.md b/docs/reference-guides/data/data-core-blocks.md
@@ -504,54 +504,6 @@ _Returns_
 
 -   `string?`: Name of the block for handling the grouping of blocks.
 
-### getHookedBlocks
-
-Returns the hooked blocks for a given anchor block.
-
-Given an anchor block name, returns an object whose keys are relative positions, and whose values are arrays of block names that are hooked to the anchor block at that relative position.
-
-_Usage_
-
-```js
-import { store as blocksStore } from '@wordpress/blocks';
-import { useSelect } from '@wordpress/data';
-
-const ExampleComponent = () => {
-	const hookedBlockNames = useSelect(
-		( select ) =>
-			select( blocksStore ).getHookedBlocks( 'core/navigation' ),
-		[]
-	);
-
-	return (
-		<ul>
-			{ Object.keys( hookedBlockNames ).length &&
-				Object.keys( hookedBlockNames ).map( ( relativePosition ) => (
-					<li key={ relativePosition }>
-						{ relativePosition }>
-						<ul>
-							{ hookedBlockNames[ relativePosition ].map(
-								( hookedBlock ) => (
-									<li key={ hookedBlock }>{ hookedBlock }</li>
-								)
-							) }
-						</ul>
-					</li>
-				) ) }
-		</ul>
-	);
-};
-```
-
-_Parameters_
-
--   _state_ `Object`: Data state.
--   _blockName_ `string`: Anchor block type name.
-
-_Returns_
-
--   `Object`: Lists of hooked block names for each relative position.
-
 ### getUnregisteredFallbackBlockName
 
 Returns the name of the block for handling unregistered blocks.

diff --git a/docs/reference-guides/data/data-core-edit-post.md b/docs/reference-guides/data/data-core-edit-post.md
@@ -536,11 +536,8 @@ _Returns_
 
 ### updatePreferredStyleVariations
 
-Returns an action object used in signaling that a style should be auto-applied when a block is created.
-
-_Parameters_
+> **Deprecated**
 
--   _blockName_ `string`: Name of the block.
--   _blockStyle_ `?string`: Name of the style that should be auto applied. If undefined, the "auto apply" setting of the block is removed.
+Returns an action object used in signaling that a style should be auto-applied when a block is created.
 
 <!-- END TOKEN(Autogenerated actions|../../../packages/edit-post/src/store/actions.js) -->
diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php
@@ -476,7 +476,10 @@ function gutenberg_get_layout_style( $selector, $layout, $has_block_gap_support
 
 			$layout_styles[] = array(
 				'selector'     => $selector,
-				'declarations' => array( 'grid-template-columns' => 'repeat(auto-fill, minmax(min(' . $minimum_column_width . ', 100%), 1fr))' ),
+				'declarations' => array(
+					'grid-template-columns' => 'repeat(auto-fill, minmax(min(' . $minimum_column_width . ', 100%), 1fr))',
+					'container-type'        => 'inline-size',
+				),
 			);
 		}
 
@@ -557,44 +560,95 @@ function gutenberg_incremental_id_per_prefix( $prefix = '' ) {
 function gutenberg_render_layout_support_flag( $block_content, $block ) {
 	$block_type            = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
 	$block_supports_layout = block_has_support( $block_type, array( 'layout' ), false ) || block_has_support( $block_type, array( '__experimentalLayout' ), false );
-	$layout_from_parent    = $block['attrs']['style']['layout']['selfStretch'] ?? null;
+	// If there is any value in style -> layout, the block has a child layout.
+	$child_layout = $block['attrs']['style']['layout'] ?? null;
 
-	if ( ! $block_supports_layout && ! $layout_from_parent ) {
+	if ( ! $block_supports_layout && ! $child_layout ) {
 		return $block_content;
 	}
 
-	$outer_class_names = array();
+	$outer_class_names         = array();
+	$container_content_class   = wp_unique_id( 'wp-container-content-' );
+	$child_layout_declarations = array();
+	$child_layout_styles       = array();
 
-	if ( 'fixed' === $layout_from_parent || 'fill' === $layout_from_parent ) {
-		$container_content_class = wp_unique_id( 'wp-container-content-' );
+	$self_stretch = isset( $block['attrs']['style']['layout']['selfStretch'] ) ? $block['attrs']['style']['layout']['selfStretch'] : null;
 
-		$child_layout_styles = array();
+	if ( 'fixed' === $self_stretch && isset( $block['attrs']['style']['layout']['flexSize'] ) ) {
+		$child_layout_declarations['flex-basis'] = $block['attrs']['style']['layout']['flexSize'];
+		$child_layout_declarations['box-sizing'] = 'border-box';
+	} elseif ( 'fill' === $self_stretch ) {
+		$child_layout_declarations['flex-grow'] = '1';
+	}
 
-		if ( 'fixed' === $layout_from_parent && isset( $block['attrs']['style']['layout']['flexSize'] ) ) {
-			$child_layout_styles[] = array(
-				'selector'     => ".$container_content_class",
-				'declarations' => array(
-					'flex-basis' => $block['attrs']['style']['layout']['flexSize'],
-					'box-sizing' => 'border-box',
-				),
-			);
-		} elseif ( 'fill' === $layout_from_parent ) {
-			$child_layout_styles[] = array(
-				'selector'     => ".$container_content_class",
-				'declarations' => array(
-					'flex-grow' => '1',
-				),
-			);
+	if ( isset( $block['attrs']['style']['layout']['columnSpan'] ) ) {
+		$column_span                              = $block['attrs']['style']['layout']['columnSpan'];
+		$child_layout_declarations['grid-column'] = "span $column_span";
+	}
+	if ( isset( $block['attrs']['style']['layout']['rowSpan'] ) ) {
+		$row_span                              = $block['attrs']['style']['layout']['rowSpan'];
+		$child_layout_declarations['grid-row'] = "span $row_span";
+	}
+	$child_layout_styles[] = array(
+		'selector'     => ".$container_content_class",
+		'declarations' => $child_layout_declarations,
+	);
+
+	/**
+	 * If columnSpan is set, and the parent grid is responsive, i.e. if it has a minimumColumnWidth set,
+	 * the columnSpan should be removed on small grids.
+	 */
+	if ( isset( $block['attrs']['style']['layout']['columnSpan'] ) && isset( $block['attrs']['style']['layout']['parentColumnWidth'] ) ) {
+		$column_span_number  = floatval( $block['attrs']['style']['layout']['columnSpan'] );
+		$parent_column_width = $block['attrs']['style']['layout']['parentColumnWidth'];
+		$parent_column_value = floatval( $parent_column_width );
+		$parent_column_unit  = explode( $parent_column_value, $parent_column_width );
+		/**
+		 * If there is no unit, the width has somehow been mangled so we reset both unit and value
+		 * to defaults.
+		 * Additionally, the unit should be one of px, rem or em, so that also needs to be checked.
+		 */
+		if ( count( $parent_column_unit ) <= 1 ) {
+			$parent_column_unit  = 'rem';
+			$parent_column_value = 12;
+		} else {
+			$parent_column_unit = $parent_column_unit[1];
+
+			if ( ! in_array( $parent_column_unit, array( 'px', 'rem', 'em' ), true ) ) {
+				$parent_column_unit = 'rem';
+			}
 		}
 
-		gutenberg_style_engine_get_stylesheet_from_css_rules(
-			$child_layout_styles,
-			array(
-				'context'  => 'block-supports',
-				'prettify' => false,
-			)
+		/**
+		 * A default gap value is used for this computation because custom gap values may not be
+		 * viable to use in the computation of the container query value.
+		 */
+		$default_gap_value     = 'px' === $parent_column_unit ? 24 : 1.5;
+		$container_query_value = $column_span_number * $parent_column_value + ( $column_span_number - 1 ) * $default_gap_value;
+		$container_query_value = $container_query_value . $parent_column_unit;
+
+		$child_layout_styles[] = array(
+			'rules_group'  => "@container (max-width: $container_query_value )",
+			'selector'     => ".$container_content_class",
+			'declarations' => array(
+				'grid-column' => '1/-1',
+			),
 		);
+	}
+
+	/**
+	 * Add to the style engine store to enqueue and render layout styles.
+	 * Return styles here just to check if any exist.
+	 */
+	$child_css = gutenberg_style_engine_get_stylesheet_from_css_rules(
+		$child_layout_styles,
+		array(
+			'context'  => 'block-supports',
+			'prettify' => false,
+		)
+	);
 
+	if ( $child_css ) {
 		$outer_class_names[] = $container_content_class;
 	}
 

diff --git a/lib/experimental/kses.php b/lib/experimental/kses.php
@@ -87,3 +87,17 @@ function allow_filter_in_styles( $allow_css, $css_test_string ) {
 	}
 }
 add_filter( 'safecss_filter_attr_allow_css', 'allow_filter_in_styles', 10, 2 );
+
+/**
+ * Update allowed inline style attributes list.
+ *
+ * @param string[] $attrs Array of allowed CSS attributes.
+ * @return string[] CSS attributes.
+ */
+function gutenberg_safe_grid_attrs( $attrs ) {
+	$attrs[] = 'grid-column';
+	$attrs[] = 'grid-row';
+	$attrs[] = 'container-type';
+	return $attrs;
+}
+add_filter( 'safe_style_css', 'gutenberg_safe_grid_attrs' );