Site global styles

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

@@ -56,6 +56,7 @@ class WP_Theme_JSON_Gutenberg {
 		'default',
 		'blocks',
 		'theme',
+		'site',
 		'custom',
 	);
 

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

@@ -29,6 +29,7 @@ class WP_Theme_JSON_Resolver_Gutenberg {
 		'core'   => array(),
 		'blocks' => array(),
 		'theme'  => array(),
+		'site'   => array(),
 		'user'   => array(),
 	);
 
@@ -64,6 +65,14 @@ class WP_Theme_JSON_Resolver_Gutenberg {
 	 */
 	protected static $user = null;
 
+	/**
+	 * Container for data coming from the site.
+	 *
+	 * @since 6.3.0
+	 * @var WP_Theme_JSON
+	 */
+	protected static $site = null;
+
 	/**
 	 * Stores the ID of the custom post type
 	 * that holds the user data.
@@ -73,6 +82,15 @@ class WP_Theme_JSON_Resolver_Gutenberg {
 	 */
 	protected static $user_custom_post_type_id = null;
 
+	/**
+	 * Stores the ID of the custom post type
+	 * that holds the site data.
+	 *
+	 * @since 6.3.0
+	 * @var int
+	 */
+	protected static $site_custom_post_type_id = null;
+
 	/**
 	 * Container to keep loaded i18n schema for `theme.json`.
 	 *
@@ -478,6 +496,60 @@ public static function get_user_data_from_wp_global_styles( $theme, $create_post
 		return $user_cpt;
 	}
 
+	public static function get_site_data_from_wp_global_styles( $create_post = false, $post_status_filter = array( 'publish' ) ) {
+		$theme = wp_get_theme();
+
+		/*
+		 * Bail early if the theme does not support a theme.json.
+		 *
+		 * Since wp_theme_has_theme_json only supports the active
+		 * theme, the extra condition for whether $theme is the active theme is
+		 * present here.
+		 */
+		if ( $theme->get_stylesheet() === get_stylesheet() && ! wp_theme_has_theme_json() ) {
+			return array();
+		}
+
+		$site_cpt         = array();
+		$post_type_filter = 'wp_global_styles';
+		$post_name        = 'wp-global-styles-site';
+		$args             = array(
+			'posts_per_page'         => 1,
+			'orderby'                => 'date',
+			'order'                  => 'desc',
+			'post_type'              => $post_type_filter,
+			'post_status'            => $post_status_filter,
+			'ignore_sticky_posts'    => true,
+			'no_found_rows'          => true,
+			'update_post_meta_cache' => false,
+			'update_post_term_cache' => false,
+			'name'                   => $post_name,
+		);
+
+		$global_style_query = new WP_Query();
+		$recent_posts       = $global_style_query->query( $args );
+		if ( count( $recent_posts ) === 1 ) {
+			$site_cpt = get_object_vars( $recent_posts[0] );
+		} elseif ( $create_post ) {
+			$cpt_post_id = wp_insert_post(
+				array(
+					'post_content' => '{"version": ' . WP_Theme_JSON_Gutenberg::LATEST_SCHEMA . ', "isGlobalStylesUserThemeJSON": true }',
+					'post_status'  => 'publish',
+					'post_title'   => 'Custom Styles Site', // Do not make string translatable, see https://core.trac.wordpress.org/ticket/54518.
+					'post_type'    => $post_type_filter,
+					'post_name'    => $post_name,
+				),
+				true
+			);
+			if ( ! is_wp_error( $cpt_post_id ) ) {
+				$site_cpt = get_object_vars( get_post( $cpt_post_id ) );
+			}
+		}
+
+		return $site_cpt;
+
+	}
+
 	/**
 	 * Returns the user's origin config.
 	 *
@@ -531,6 +603,52 @@ public static function get_user_data() {
 		return static::$user;
 	}
 
+	public static function get_site_data() {
+		if ( null !== static::$site && static::has_same_registered_blocks( 'site' ) ) {
+			return static::$site;
+		}
+
+		$config   = array();
+		$site_cpt = static::get_site_data_from_wp_global_styles();
+
+		if ( array_key_exists( 'post_content', $site_cpt ) ) {
+			$decoded_data = json_decode( $site_cpt['post_content'], true );
+
+			$json_decoding_error = json_last_error();
+			if ( JSON_ERROR_NONE !== $json_decoding_error ) {
+				trigger_error( 'Error when decoding a theme.json schema for site data. ' . json_last_error_msg() );
+				/**
+				 * Filters the data provided by the user for global styles & settings.
+				 *
+				 * @since 6.1.0
+				 *
+				 * @param WP_Theme_JSON_Data Class to access and update the underlying data.
+				 */
+				$theme_json = apply_filters( 'wp_theme_json_data_user', new WP_Theme_JSON_Data_Gutenberg( $config, 'site' ) );
+				$config     = $theme_json->get_data();
+				return new WP_Theme_JSON_Gutenberg( $config, 'site' );
+			}
+
+			// Very important to verify that the flag isGlobalStylesUserThemeJSON is true.
+			// If it's not true then the content was not escaped and is not safe.
+			if (
+				is_array( $decoded_data ) &&
+				isset( $decoded_data['isGlobalStylesUserThemeJSON'] ) &&
+				$decoded_data['isGlobalStylesUserThemeJSON']
+			) {
+				unset( $decoded_data['isGlobalStylesUserThemeJSON'] );
+				$config = $decoded_data;
+			}
+		}
+
+		/** This filter is documented in wp-includes/class-wp-theme-json-resolver.php */
+		$theme_json   = apply_filters( 'wp_theme_json_data_user', new WP_Theme_JSON_Data_Gutenberg( $config, 'site' ) );
+		$config       = $theme_json->get_data();
+		static::$site = new WP_Theme_JSON_Gutenberg( $config, 'site' );
+
+		return static::$site;
+	}
+
 	/**
 	 * Returns the data merged from multiple origins.
 	 *
@@ -588,7 +706,7 @@ public static function get_merged_data( $origin = 'custom' ) {
 			$result->set_spacing_sizes();
 			return $result;
 		}
-
+		$result->merge( static::get_site_data() );
 		$result->merge( static::get_user_data() );
 		$result->set_spacing_sizes();
 		return $result;
@@ -607,7 +725,7 @@ public static function get_user_global_styles_post_id() {
 			return static::$user_custom_post_type_id;
 		}
 
-		$user_cpt = static::get_user_data_from_wp_global_styles( wp_get_theme(), true );
+		$user_cpt = static::get_user_data_from_wp_global_styles( wp_get_theme() );
 
 		if ( array_key_exists( 'ID', $user_cpt ) ) {
 			static::$user_custom_post_type_id = $user_cpt['ID'];
@@ -616,6 +734,20 @@ public static function get_user_global_styles_post_id() {
 		return static::$user_custom_post_type_id;
 	}
 
+	public static function get_site_global_styles_post_id() {
+		if ( null !== static::$site_custom_post_type_id ) {
+			return static::$site_custom_post_type_id;
+		}
+
+		$site_cpt = static::get_site_data_from_wp_global_styles( true );
+
+		if ( array_key_exists( 'ID', $site_cpt ) ) {
+			static::$site_custom_post_type_id = $site_cpt['ID'];
+		}
+
+		return static::$site_custom_post_type_id;
+	}
+
 	/**
 	 * Determines whether the active theme has a theme.json file.
 	 *
@@ -670,6 +802,7 @@ public static function clean_cached_data() {
 		);
 		static::$theme                    = null;
 		static::$user                     = null;
+		static::$site                     = null;
 		static::$user_custom_post_type_id = null;
 		static::$i18n_schema              = null;
 	}

lib/compat/wordpress-6.3/class-gutenberg-rest-global-styles-controller-6-3.php

@@ -10,6 +10,36 @@
  * Base Global Styles REST API Controller.
  */
 class Gutenberg_REST_Global_Styles_Controller_6_3 extends Gutenberg_REST_Global_Styles_Controller_6_2 {
+
+	/**
+	 * Registers the controllers routes.
+	 *
+	 * @return void
+	 */
+	public function register_routes() {
+		parent::register_routes();
+
+		register_rest_route(
+			$this->namespace,
+			'/' . $this->rest_base,
+			array(
+				array(
+					'methods'             => WP_REST_Server::READABLE,
+					'callback'            => array( $this, 'get_site_item' ),
+					'permission_callback' => array( $this, 'get_theme_items_permissions_check' ),
+				),
+			)
+		);
+
+	}
+
+	public function get_site_item() {
+		$active_global_styles_site_id = WP_Theme_JSON_Resolver_Gutenberg::get_site_global_styles_post_id();
+		$active_global_styles_site    = get_post( $active_global_styles_site_id );
+		$active_global_styles_site    = $this->prepare_item_for_response( $active_global_styles_site, new WP_REST_Request() );
+		return $active_global_styles_site;
+	}
+
 	/**
 	 * Revision controller.
 	 *

packages/block-editor/src/components/global-styles/context.js

@@ -5,9 +5,11 @@ import { createContext } from '@wordpress/element';
 
 export const DEFAULT_GLOBAL_STYLES_CONTEXT = {
 	user: {},
+	site: {},
 	base: {},
 	merged: {},
 	setUserConfig: () => {},
+	setSiteConfig: () => {},
 };
 
 export const GlobalStylesContext = createContext(

packages/block-editor/src/components/global-styles/hooks.js

@@ -74,19 +74,24 @@ const VALID_SETTINGS = [
 ];
 
 export const useGlobalStylesReset = () => {
-	const { user: config, setUserConfig } = useContext( GlobalStylesContext );
+	const {
+		user: config,
+		setUserConfig,
+		setSiteConfig,
+	} = useContext( GlobalStylesContext );
 	const canReset = !! config && ! fastDeepEqual( config, EMPTY_CONFIG );
 	return [
 		canReset,
-		useCallback(
-			() => setUserConfig( () => EMPTY_CONFIG ),
-			[ setUserConfig ]
-		),
+		useCallback( () => {
+			setUserConfig( () => EMPTY_CONFIG );
+			setSiteConfig( () => EMPTY_CONFIG );
+		}, [ setUserConfig ] ),
 	];
 };
 
 export function useGlobalSetting( propertyPath, blockName, source = 'all' ) {
-	const { setUserConfig, ...configs } = useContext( GlobalStylesContext );
+	const { setUserConfig, setSiteConfig, ...configs } =
+		useContext( GlobalStylesContext );
 
 	const appendedBlockPath = blockName ? '.blocks.' + blockName : '';
 	const appendedPropertyPath = propertyPath ? '.' + propertyPath : '';
@@ -128,13 +133,14 @@ export function useGlobalSetting( propertyPath, blockName, source = 'all' ) {
 		appendedBlockPath,
 	] );
 
+	const setConfig = source === 'site' ? setSiteConfig : setUserConfig;
 	const setSetting = ( newValue ) => {
-		setUserConfig( ( currentConfig ) => {
+		setConfig( ( currentConfig ) => {
 			// Deep clone `currentConfig` to avoid mutating it later.
-			const newUserConfig = JSON.parse( JSON.stringify( currentConfig ) );
-			set( newUserConfig, contextualPath, newValue );
+			const newConfig = JSON.parse( JSON.stringify( currentConfig ) );
+			set( newConfig, contextualPath, newValue );
 
-			return newUserConfig;
+			return newConfig;
 		} );
 	};
 
@@ -151,15 +157,18 @@ export function useGlobalStyle(
 		merged: mergedConfig,
 		base: baseConfig,
 		user: userConfig,
+		site: siteConfig,
 		setUserConfig,
+		setSiteConfig,
 	} = useContext( GlobalStylesContext );
 	const appendedPath = path ? '.' + path : '';
 	const finalPath = ! blockName
 		? `styles${ appendedPath }`
 		: `styles.blocks.${ blockName }${ appendedPath }`;
 
 	const setStyle = ( newValue ) => {
-		setUserConfig( ( currentConfig ) => {
+		const setConfig = source === 'site' ? setSiteConfig : setUserConfig;
+		setConfig( ( currentConfig ) => {
 			// Deep clone `currentConfig` to avoid mutating it later.
 			const newUserConfig = JSON.parse( JSON.stringify( currentConfig ) );
 			set(
@@ -196,6 +205,12 @@ export function useGlobalStyle(
 				? getValueFromVariable( mergedConfig, blockName, rawResult )
 				: rawResult;
 			break;
+		case 'site':
+			rawResult = get( siteConfig, finalPath );
+			result = shouldDecodeEncode
+				? getValueFromVariable( mergedConfig, blockName, rawResult )
+				: rawResult;
+			break;
 		case 'base':
 			rawResult = get( baseConfig, finalPath );
 			result = shouldDecodeEncode

packages/core-data/src/actions.js

@@ -149,6 +149,15 @@ export function __experimentalReceiveCurrentGlobalStylesId(
 	};
 }
 
+export function __experimentalReceiveCurrentSiteGlobalStylesId(
+	currentSiteGlobalStylesId
+) {
+	return {
+		type: 'RECEIVE_CURRENT_SITE_GLOBAL_STYLES_ID',
+		id: currentSiteGlobalStylesId,
+	};
+}
+
 /**
  * Returns an action object used in signalling that the theme base global styles have been received
  * Ignored from documentation as it's internal to the data store.

packages/core-data/src/entities.js

@@ -150,6 +150,14 @@ export const rootEntitiesConfig = [
 		plural: 'globalStylesVariations', // Should be different than name.
 		getTitle: ( record ) => record?.title?.rendered || record?.title,
 	},
+	{
+		label: __( 'Global Styles Site' ),
+		name: 'siteGlobalStyles',
+		kind: 'root',
+		baseURL: '/wp/v2/global-styles',
+		baseURLParams: { context: 'edit' },
+		getTitle: ( record ) => record?.title?.rendered || record?.title,
+	},
 	{
 		label: __( 'Themes' ),
 		name: 'theme',

packages/core-data/src/reducer.js

@@ -163,6 +163,15 @@ export function themeBaseGlobalStyles( state = {}, action ) {
 	return state;
 }
 
+export function currentSiteGlobalStylesId( state = undefined, action ) {
+	switch ( action.type ) {
+		case 'RECEIVE_CURRENT_SITE_GLOBAL_STYLES_ID':
+			return action.id;
+	}
+
+	return state;
+}
+
 /**
  * Reducer managing the theme global styles variations.
  *
@@ -647,6 +656,7 @@ export default combineReducers( {
 	users,
 	currentTheme,
 	currentGlobalStylesId,
+	currentSiteGlobalStylesId,
 	currentUser,
 	themeGlobalStyleVariations,
 	themeBaseGlobalStyles,