Leverage @wordpress/base-styles admin schemes stylesheet instead of duplicate declarations in various packages

lib/client-assets.php

@@ -268,7 +268,7 @@ function gutenberg_register_packages_styles( $styles ) {
 		$styles,
 		'wp-block-editor',
 		gutenberg_url( 'build/block-editor/style.css' ),
-		array( 'wp-components', 'wp-preferences' ),
+		array( 'wp-admin-schemes', 'wp-components', 'wp-preferences' ),
 		$version
 	);
 	$styles->add_data( 'wp-block-editor', 'rtl', 'replace' );
@@ -286,7 +286,7 @@ function gutenberg_register_packages_styles( $styles ) {
 		$styles,
 		'wp-edit-post',
 		gutenberg_url( 'build/edit-post/style.css' ),
-		array( 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-edit-blocks', 'wp-block-library', 'wp-commands', 'wp-preferences' ),
+		array( 'wp-admin-schemes', 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-edit-blocks', 'wp-block-library', 'wp-commands', 'wp-preferences' ),
 		$version
 	);
 	$styles->add_data( 'wp-edit-post', 'rtl', 'replace' );
@@ -401,7 +401,7 @@ function gutenberg_register_packages_styles( $styles ) {
 		$styles,
 		'wp-list-reusable-blocks',
 		gutenberg_url( 'build/list-reusable-blocks/style.css' ),
-		array( 'wp-components' ),
+		array( 'wp-admin-schemes', 'wp-components' ),
 		$version
 	);
 	$styles->add_data( 'wp-list-reusable-block', 'rtl', 'replace' );
@@ -419,7 +419,7 @@ function gutenberg_register_packages_styles( $styles ) {
 		$styles,
 		'wp-edit-site',
 		gutenberg_url( 'build/edit-site/style.css' ),
-		array( 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-block-library-editor', 'common', 'forms', 'wp-commands', 'wp-preferences' ),
+		array( 'wp-admin-schemes', 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-block-library-editor', 'common', 'forms', 'wp-commands', 'wp-preferences' ),
 		$version
 	);
 	$styles->add_data( 'wp-edit-site', 'rtl', 'replace' );
@@ -428,7 +428,7 @@ function gutenberg_register_packages_styles( $styles ) {
 		$styles,
 		'wp-edit-widgets',
 		gutenberg_url( 'build/edit-widgets/style.css' ),
-		array( 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-edit-blocks', 'wp-patterns', 'wp-widgets', 'wp-preferences' ),
+		array( 'wp-admin-schemes', 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-edit-blocks', 'wp-patterns', 'wp-widgets', 'wp-preferences' ),
 		$version
 	);
 	$styles->add_data( 'wp-edit-widgets', 'rtl', 'replace' );

lib/compat/wordpress-6.8/script-loader.php

@@ -0,0 +1,21 @@
+<?php
+/**
+ * WordPress scripts and styles default loader.
+ *
+ * @package gutenberg
+ */
+
+add_action( 'wp_default_styles', 'gutenberg_register_admin_schemes_stylesheet' );
+
+/**
+ * Register the base styles asset.
+ *
+ * @param WP_Styles $styles WP_Styles instance.
+ */
+function gutenberg_register_admin_schemes_stylesheet( $styles ) {
+
+	$styles->add(
+		'wp-admin-schemes',
+		gutenberg_url( 'build/base-styles/admin-schemes.css' )
+	);
+}

lib/load.php

@@ -104,6 +104,7 @@ function gutenberg_is_experiment_enabled( $name ) {
 require __DIR__ . '/compat/wordpress-6.8/post.php';
 require __DIR__ . '/compat/wordpress-6.8/site-editor.php';
 require __DIR__ . '/compat/wordpress-6.8/class-gutenberg-rest-user-controller.php';
+require __DIR__ . '/compat/wordpress-6.8/script-loader.php';
 
 // Experimental features.
 require __DIR__ . '/experimental/block-editor-settings-mobile.php';

packages/base-styles/README.md

@@ -40,6 +40,10 @@ To make that work with [`sass`](https://www.npmjs.com/package/sass) or [`node-sa
 }
 ```
 
+### CSS Admin Themes
+
+The package also includes a built version of the output generated by the `wordpress-admin-schemes()` mixin which can be used directly in your project. The CSS file is located at `node_modules/@wordpress/base-styles/dist/admin-schemes.css`.
+
 ## Contributing to this package
 
 This is an individual package that's part of the Gutenberg project. The project is organized as a monorepo. It's made up of multiple self-contained software packages, each with a specific purpose. The packages in this monorepo are published to [npm](https://www.npmjs.com/) and used by [WordPress](https://make.wordpress.org/core/) as well as other software projects.

packages/base-styles/package.json

@@ -24,6 +24,7 @@
 		"node": ">=18.12.0",
 		"npm": ">=8.19.2"
 	},
+	"wpScript": true,
 	"publishConfig": {
 		"access": "public"
 	}

packages/base-styles/src/admin-schemes.scss

@@ -0,0 +1 @@
+@include wordpress-admin-schemes();

packages/block-editor/src/content.scss

@@ -12,7 +12,3 @@
 @import "./components/plain-text/content.scss";
 @import "./components/rich-text/content.scss";
 @import "./components/warning/content.scss";
-
-// To do: ideally the iframe does not contain UI, but there's still the block
-// placeholders that will be moved to shadow DOM in the future.
-@include wordpress-admin-schemes();

packages/block-editor/src/style.scss

@@ -62,5 +62,3 @@
 @import "./components/block-toolbar/style.scss";
 @import "./components/inserter/style.scss";
 @import "./components/spacing-sizes-control/style.scss";
-
-@include wordpress-admin-schemes();

packages/edit-post/src/style.scss

@@ -51,5 +51,3 @@ body.js.block-editor-page {
 		height: auto;
 	}
 }
-
-@include wordpress-admin-schemes();

packages/edit-site/src/posts.scss

@@ -10,8 +10,6 @@
 @import "./components/post-list/style.scss";
 @import "./components/resizable-frame/style.scss";
 
-@include wordpress-admin-schemes();
-
 #wpadminbar,
 #adminmenumain {
 	display: none;

packages/edit-site/src/style.scss

@@ -93,5 +93,3 @@ body.js.site-editor-php {
 		top: 0;
 	}
 }
-
-@include wordpress-admin-schemes();

packages/edit-widgets/src/style.scss

@@ -54,5 +54,3 @@ body.js.widgets-php {
 .js .widgets-php .notice {
 	display: none !important;
 }
-
-@include wordpress-admin-schemes();

packages/list-reusable-blocks/src/style.scss

@@ -7,5 +7,3 @@
 	position: relative;
 	top: -3px;
 }
-
-@include wordpress-admin-schemes();