prep build 1/31

.github/PULL_REQUEST_TEMPLATE.md

@@ -2,6 +2,9 @@
 https://github.com/WordPress/gutenberg/blob/trunk/CONTRIBUTING.md -->
 
 ## What?
+<!-- Link this PR to its associated issue with an appropriate keyword: Closes, See, Follow up to, etc. -->
+Closes <!-- #ISSUE-NUMBER or URL -->
+
 <!-- In a few words, what is the PR actually doing? -->
 
 ## Why?

backport-changelog/6.8/8212.md

@@ -0,0 +1,3 @@
+https://github.com/WordPress/wordpress-develop/pull/8212
+
+* https://github.com/WordPress/gutenberg/pull/68926

bin/generate-php-sync-issue.mjs

@@ -156,17 +156,6 @@ async function main() {
 	fs.writeFileSync( nodePath.join( __dirname, 'issueContent.md' ), content );
 }
 
-/**
- * Checks if the first date is after the second date.
- *
- * @param {string} date1 - The first date.
- * @param {string} date2 - The second date.
- * @return {boolean} - Returns true if the first date is after the second date, false otherwise.
- */
-function isAfter( date1, date2 ) {
-	return new Date( date1 ) > new Date( date2 );
-}
-
 function validateDate( sinceArg ) {
 	const sinceDate = new Date( sinceArg );
 	const maxPreviousDate = new Date();

docs/reference-guides/core-blocks.md

@@ -78,7 +78,7 @@ Display a list of all terms of a given taxonomy. ([Source](https://github.com/Wo
 
 -	**Name:** core/categories
 -	**Category:** widgets
--	**Supports:** align, interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+-	**Supports:** align, color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
 -	**Attributes:** displayAsDropdown, label, showEmpty, showHierarchy, showLabel, showOnlyTopLevel, showPostCounts, taxonomy
 
 ## Code

lib/compat/wordpress-6.8/blocks.php

@@ -5,14 +5,79 @@
  * @package gutenberg
  */
 
-function gutenberg_apply_block_hooks_to_post_content( $content ) {
-	// The `the_content` filter does not provide the post that the content is coming from.
-	// However, we can infer it by calling `get_post()`, which will return the current post
-	// if no post ID is provided.
-	return apply_block_hooks_to_content( $content, get_post(), 'insert_hooked_blocks' );
+if ( ! function_exists( 'apply_block_hooks_to_content_from_post_object' ) ) {
+	/**
+	 * Run the Block Hooks algorithm on a post object's content.
+	 *
+	 * This function is different from `apply_block_hooks_to_content` in that
+	 * it takes ignored hooked block information from the post's metadata into
+	 * account. This ensures that any blocks hooked as first or last child
+	 * of the block that corresponds to the post type are handled correctly.
+	 *
+	 * @since 6.8.0
+	 * @access private
+	 *
+	 * @param string       $content  Serialized content.
+	 * @param WP_Post|null $post     A post object that the content belongs to. If set to `null`,
+	 *                               `get_post()` will be called to use the current post as context.
+	 *                               Default: `null`.
+	 * @param callable     $callback A function that will be called for each block to generate
+	 *                               the markup for a given list of blocks that are hooked to it.
+	 *                               Default: 'insert_hooked_blocks'.
+	 * @return string The serialized markup.
+	 */
+	function apply_block_hooks_to_content_from_post_object( $content, WP_Post $post = null, $callback = 'insert_hooked_blocks' ) {
+		// Default to the current post if no context is provided.
+		if ( null === $post ) {
+			$post = get_post();
+		}
+
+		if ( ! $post instanceof WP_Post ) {
+			return apply_block_hooks_to_content( $content, $post, $callback );
+		}
+
+		$attributes = array();
+
+		// If context is a post object, `ignoredHookedBlocks` information is stored in its post meta.
+		$ignored_hooked_blocks = get_post_meta( $post->ID, '_wp_ignored_hooked_blocks', true );
+		if ( ! empty( $ignored_hooked_blocks ) ) {
+			$ignored_hooked_blocks  = json_decode( $ignored_hooked_blocks, true );
+			$attributes['metadata'] = array(
+				'ignoredHookedBlocks' => $ignored_hooked_blocks,
+			);
+		}
+
+		// We need to wrap the content in a temporary wrapper block with that metadata
+		// so the Block Hooks algorithm can insert blocks that are hooked as first or last child
+		// of the wrapper block.
+		// To that end, we need to determine the wrapper block type based on the post type.
+		if ( 'wp_navigation' === $post->post_type ) {
+			$wrapper_block_type = 'core/navigation';
+		} elseif ( 'wp_block' === $post->post_type ) {
+			$wrapper_block_type = 'core/block';
+		} else {
+			$wrapper_block_type = 'core/post-content';
+		}
+
+		$content = get_comment_delimited_block_content(
+			$wrapper_block_type,
+			$attributes,
+			$content
+		);
+
+		// Apply Block Hooks.
+		$content = apply_block_hooks_to_content( $content, $post, $callback );
+
+		// Finally, we need to remove the temporary wrapper block.
+		$content = remove_serialized_parent_block( $content );
+
+		return $content;
+	}
+	// We need to apply this filter before `do_blocks` (which is hooked to `the_content` at priority 9).
+	add_filter( 'the_content', 'apply_block_hooks_to_content_from_post_object', 8 );
+	// Remove apply_block_hooks_to_content filter (previously added in Core).
+	remove_filter( 'the_content', 'apply_block_hooks_to_content', 8 );
 }
-// We need to apply this filter before `do_blocks` (which is hooked to `the_content` at priority 9).
-add_filter( 'the_content', 'gutenberg_apply_block_hooks_to_post_content', 8 );
 
 /**
  * Hooks into the REST API response for the Posts endpoint and adds the first and last inner blocks.
@@ -29,57 +94,32 @@ function gutenberg_insert_hooked_blocks_into_rest_response( $response, $post ) {
 		return $response;
 	}
 
-	$attributes            = array();
-	$ignored_hooked_blocks = get_post_meta( $post->ID, '_wp_ignored_hooked_blocks', true );
-	if ( ! empty( $ignored_hooked_blocks ) ) {
-		$ignored_hooked_blocks  = json_decode( $ignored_hooked_blocks, true );
-		$attributes['metadata'] = array(
-			'ignoredHookedBlocks' => $ignored_hooked_blocks,
-		);
-	}
-
-	if ( 'wp_navigation' === $post->post_type ) {
-		$wrapper_block_type = 'core/navigation';
-	} elseif ( 'wp_block' === $post->post_type ) {
-		$wrapper_block_type = 'core/block';
-	} else {
-		$wrapper_block_type = 'core/post-content';
-	}
-
-	$content = get_comment_delimited_block_content(
-		$wrapper_block_type,
-		$attributes,
-		$response->data['content']['raw']
-	);
-
-	$content = apply_block_hooks_to_content(
-		$content,
+	$response->data['content']['raw'] = apply_block_hooks_to_content_from_post_object(
+		$response->data['content']['raw'],
 		$post,
 		'insert_hooked_blocks_and_set_ignored_hooked_blocks_metadata'
 	);
 
-	// Remove mock block wrapper.
-	$content = remove_serialized_parent_block( $content );
-
-	$response->data['content']['raw'] = $content;
-
 	// If the rendered content was previously empty, we leave it like that.
 	if ( empty( $response->data['content']['rendered'] ) ) {
 		return $response;
 	}
 
 	// No need to inject hooked blocks twice.
-	$priority = has_filter( 'the_content', 'apply_block_hooks_to_content' );
+	$priority = has_filter( 'the_content', 'apply_block_hooks_to_content_from_post_object' );
 	if ( false !== $priority ) {
-		remove_filter( 'the_content', 'apply_block_hooks_to_content', $priority );
+		remove_filter( 'the_content', 'apply_block_hooks_to_content_from_post_object', $priority );
 	}
 
 	/** This filter is documented in wp-includes/post-template.php */
-	$response->data['content']['rendered'] = apply_filters( 'the_content', $content );
+	$response->data['content']['rendered'] = apply_filters(
+		'the_content',
+		$response->data['content']['raw']
+	);
 
 	// Add back the filter.
 	if ( false !== $priority ) {
-		add_filter( 'the_content', 'apply_block_hooks_to_content', $priority );
+		add_filter( 'the_content', 'apply_block_hooks_to_content_from_post_object', $priority );
 	}
 
 	return $response;

package.json

@@ -181,7 +181,7 @@
 		"build": "npm run build:packages && wp-scripts build",
 		"build:analyze-bundles": "npm run build -- --webpack-bundle-analyzer",
 		"build:package-types": "node ./bin/packages/validate-typescript-version.js && ( tsc --build || ( echo 'tsc failed. Try cleaning up first: `npm run clean:package-types`'; exit 1 ) ) && node ./bin/packages/check-build-type-declaration-files.js",
-		"build:profile-types": "rimraf ./ts-traces && npm run clean:package-types && node ./bin/packages/validate-typescript-version.js && ( tsc --build --extendedDiagnostics --generateTrace ./ts-traces || ( echo 'tsc failed.'; exit 1 ) ) && node ./bin/packages/check-build-type-declaration-files.js && npx --yes @typescript/analyze-trace ts-traces > ts-traces/analysis.txt && echo $'\n\nDone! Build traces saved to ts-traces/ directory.\nTrace analysis saved to ts-traces/analysis.txt.'",
+		"build:profile-types": "rimraf ./ts-traces && npm run clean:package-types && node ./bin/packages/validate-typescript-version.js && ( tsc --build --extendedDiagnostics --generateTrace ./ts-traces || ( echo 'tsc failed.'; exit 1 ) ) && node ./bin/packages/check-build-type-declaration-files.js && npx --yes @typescript/analyze-trace ts-traces > ts-traces/analysis.txt && node -p \"'\\n\\nDone! Build traces saved to ts-traces/ directory.\\nTrace analysis saved to ts-traces/analysis.txt.'\"",
 		"prebuild:packages": "npm run clean:packages && npm run --if-present --workspaces build",
 		"build:packages": "npm run --silent build:package-types && node ./bin/packages/build.js",
 		"postbuild:packages": " npm run --if-present --workspaces build:wp",

packages/block-editor/src/components/block-canvas/style.scss

@@ -4,7 +4,8 @@ iframe[name="editor-canvas"] {
 	height: 100%;
 	display: block;
 	// Handles transitions between device previews
-	transition: all 400ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
-	@include reduce-motion("transition");
+	@media not ( prefers-reduced-motion ) {
+		transition: all 400ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
+	}
 	background-color: $gray-300;
 }

packages/block-editor/src/components/block-draggable/style.scss

@@ -59,7 +59,9 @@
 	justify-content: center;
 	align-items: center;
 	background-color: transparent;
-	transition: all 0.1s linear 0.1s;
+	@media not ( prefers-reduced-motion ) {
+		transition: all 0.1s linear 0.1s;
+	}
 
 	.block-editor-block-draggable-chip__disabled-icon {
 		width: $grid-unit-50 * 0.5;

packages/block-editor/src/components/block-list/content.scss

@@ -58,10 +58,12 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection="true"] .b
 			background: var(--wp-admin-theme-color);
 			opacity: 0.4;
 
-			// Animate.
-			animation: selection-overlay__fade-in-animation 0.1s ease-out;
-			animation-fill-mode: forwards;
-			@include reduce-motion("animation");
+			@media not ( prefers-reduced-motion ) {
+
+				// Animate.
+				animation: selection-overlay__fade-in-animation 0.1s ease-out;
+				animation-fill-mode: forwards;
+			}
 
 			// Show outline in high contrast mode.
 			outline: 2px solid transparent;
@@ -271,8 +273,9 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection="true"] .b
 // Spotlight mode. Fade out blocks unless they contain a selected block.
 .is-focus-mode .block-editor-block-list__block:not(.has-child-selected) {
 	opacity: 0.2;
-	transition: opacity 0.1s linear;
-	@include reduce-motion("transition");
+	@media not ( prefers-reduced-motion ) {
+		transition: opacity 0.1s linear;
+	}
 
 	// Nested blocks should never be faded. If the parent block is already faded
 	// out, it shouldn't be faded out more. If the parent block in not faded
@@ -339,9 +342,10 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection="true"] .b
 // Hide the appender that sits at the end of block lists, when inside a nested block,
 // unless the block itself, or a parent, is selected.
 .wp-block .block-list-appender .block-editor-inserter__toggle {
-	animation: block-editor-inserter__toggle__fade-in-animation 0.1s ease;
-	animation-fill-mode: forwards;
-	@include reduce-motion("animation");
+	@media not ( prefers-reduced-motion ) {
+		animation: block-editor-inserter__toggle__fade-in-animation 0.1s ease;
+		animation-fill-mode: forwards;
+	}
 }
 
 .block-editor-block-list__block:not(.is-selected):not(.has-child-selected) .block-editor-default-block-appender {
@@ -367,8 +371,9 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection="true"] .b
 	font-family: $editor-html-font;
 	font-size: $text-editor-font-size;
 	line-height: 1.5;
-	transition: padding 0.2s linear;
-	@include reduce-motion("transition");
+	@media not ( prefers-reduced-motion ) {
+		transition: padding 0.2s linear;
+	}
 
 	&:focus {
 		box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
@@ -400,7 +405,9 @@ _::-webkit-full-page-media, _:future, :root [data-has-multi-selection="true"] .b
 	// Additional -1px is required to avoid sub pixel rounding errors allowing background to show.
 	margin-left: -1px;
 	margin-right: -1px;
-	transition: background-color 0.3s ease;
+	@media not ( prefers-reduced-motion ) {
+		transition: background-color 0.3s ease;
+	}
 	display: flex;
 	align-items: center;
 	justify-content: center;

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

@@ -19,6 +19,7 @@ import {
 	useCallback,
 	useEffect,
 } from '@wordpress/element';
+import { getDefaultBlockName } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -171,13 +172,13 @@ function Items( {
 			const {
 				getSettings,
 				getBlockOrder,
-				getSelectedBlockClientId,
 				getSelectedBlockClientIds,
 				__unstableGetVisibleBlocks,
 				getTemplateLock,
 				getBlockEditingMode,
 				isSectionBlock,
 				isZoomOut: _isZoomOut,
+				canInsertBlockType,
 			} = unlock( select( blockEditorStore ) );
 
 			const _order = getBlockOrder( rootClientId );
@@ -190,10 +191,20 @@ function Items( {
 				};
 			}
 
-			const selectedBlockClientId = getSelectedBlockClientId();
+			const selectedBlockClientIds = getSelectedBlockClientIds();
+			const selectedBlockClientId = selectedBlockClientIds[ 0 ];
+			const showRootAppender =
+				! rootClientId &&
+				! selectedBlockClientId &&
+				( ! _order.length ||
+					! canInsertBlockType(
+						getDefaultBlockName(),
+						rootClientId
+					) );
+
 			return {
 				order: _order,
-				selectedBlocks: getSelectedBlockClientIds(),
+				selectedBlocks: selectedBlockClientIds,
 				visibleBlocks: __unstableGetVisibleBlocks(),
 				isZoomOut: _isZoomOut(),
 				shouldRenderAppender:
@@ -203,10 +214,8 @@ function Items( {
 					hasAppender &&
 					! _isZoomOut() &&
 					( hasCustomAppender ||
-						rootClientId === selectedBlockClientId ||
-						( ! rootClientId &&
-							! selectedBlockClientId &&
-							! _order.length ) ),
+						showRootAppender ||
+						rootClientId === selectedBlockClientId ),
 			};
 		},
 		[ rootClientId, hasAppender, hasCustomAppender ]

packages/block-editor/src/components/block-mover/style.scss

@@ -87,10 +87,11 @@
 		right: $grid-unit-10;
 		z-index: -1;
 
-		// Animate in.
-		animation: components-button__appear-animation 0.1s ease;
-		animation-fill-mode: forwards;
-		@include reduce-motion("animation");
+		@media not ( prefers-reduced-motion ) {
+			// Animate in.
+			animation: components-button__appear-animation 0.1s ease;
+			animation-fill-mode: forwards;
+		}
 	}
 
 	// Don't show the focus inherited by the Button component.

packages/block-editor/src/components/block-pattern-setup/style.scss

@@ -130,7 +130,9 @@
 				background-color: $white;
 				margin: auto;
 				padding: 0;
-				transition: transform 0.5s, z-index 0.5s;
+				@media not ( prefers-reduced-motion ) {
+					transition: transform 0.5s, z-index 0.5s;
+				}
 				z-index: z-index(".block-editor-block-pattern-setup .pattern-slide");
 
 				&.active-slide {

packages/block-editor/src/components/block-patterns-list/style.scss

@@ -44,9 +44,9 @@
 			outline: $border-width solid rgba($black, 0.1);
 			outline-offset: -$border-width;
 			border-radius: $radius-medium;
-
-			transition: outline 0.1s linear;
-			@include reduce-motion("transition");
+			@media not ( prefers-reduced-motion ) {
+				transition: outline 0.1s linear;
+			}
 		}
 	}