Changeset 58264 for trunk/src/wp-includes/class-wp-theme-json.php

Timestamp:

05/31/2024 05:47:23 AM (6 months ago)

Author:

noisysocks

Message:

Block Themes: Add section styling via extended block style variations

Provide users with the ability to style entire sections of a page without
having to tediously reapply the same sets of styles.

This is done by extending block style variations to apply to nested blocks.

See ​https://github.com/WordPress/gutenberg/pull/57908.

Fixes #61312.
Props aaronrobertshaw, talldanwp, ramonopoly, isabel_brison, andrewserong.

File:

• trunk/src/wp-includes/class-wp-theme-json.php (modified) (12 diffs)

trunk/src/wp-includes/class-wp-theme-json.php

@@ -347 +347 @@
      *              added the `customTemplates` and `templateParts` values.
      * @since 6.3.0 Added the `description` value.
+     * @since 6.6.0 Added `blockTypes` to support block style variation theme.json partials.
      * @var string[]
      */
     const VALID_TOP_LEVEL_KEYS = array(
+        'blockTypes',
         'customTemplates',
         'description',
@@ -824 +826 @@
      * @since 5.9.0 Added the `$valid_block_names` and `$valid_element_name` parameters.
      * @since 6.3.0 Added the `$valid_variations` parameter.
+     * @since 6.6.0 Updated schema to allow extended block style variations.
      *
      * @param array $input               Structure to sanitize.
@@ -882 +885 @@
         $schema_styles_blocks   = array();
         $schema_settings_blocks = array();
+
+        /*
+         * Generate a schema for blocks.
+         * - Block styles can contain `elements` & `variations` definitions.
+         * - Variations definitions cannot be nested.
+         * - Variations can contain styles for inner `blocks`.
+         * - Variation inner `blocks` styles can contain `elements`.
+         *
+         * As each variation needs a `blocks` schema but further nested
+         * inner `blocks`, the overall schema will be generated in multiple passes.
+         */
+        foreach ( $valid_block_names as $block ) {
+            $schema_settings_blocks[ $block ]           = static::VALID_SETTINGS;
+            $schema_styles_blocks[ $block ]             = $styles_non_top_level;
+            $schema_styles_blocks[ $block ]['elements'] = $schema_styles_elements;
+        }
+
+        $block_style_variation_styles             = static::VALID_STYLES;
+        $block_style_variation_styles['blocks']   = $schema_styles_blocks;
+        $block_style_variation_styles['elements'] = $schema_styles_elements;
+
         foreach ( $valid_block_names as $block ) {
             // Build the schema for each block style variation.
@@ -898 +922 @@
             $schema_styles_variations = array();
             if ( ! empty( $style_variation_names ) ) {
-                $schema_styles_variations = array_fill_keys( $style_variation_names, $styles_non_top_level );
-            }
-
-            $schema_settings_blocks[ $block ]             = static::VALID_SETTINGS;
-            $schema_styles_blocks[ $block ]               = $styles_non_top_level;
-            $schema_styles_blocks[ $block ]['elements']   = $schema_styles_elements;
+                $schema_styles_variations = array_fill_keys( $style_variation_names, $block_style_variation_styles );
+            }
+
             $schema_styles_blocks[ $block ]['variations'] = $schema_styles_variations;
         }
@@ -913 +934 @@
         $schema['settings']['blocks']                     = $schema_settings_blocks;
         $schema['settings']['typography']['fontFamilies'] = static::schema_in_root_and_per_origin( static::FONT_FAMILY_SCHEMA );
+
+        /*
+         * Shared block style variations can be registered from the theme.json data so we can't
+         * validate them against pre-registered block style variations.
+         */
+        $schema['styles']['blocks']['variations'] = null;
 
         // Remove anything that's not present in the schema.
@@ -1017 +1044 @@
      * @since 6.1.0 Added `features` key with block support feature level selectors.
      * @since 6.3.0 Refactored and stabilized selectors API.
+     * @since 6.6.0 Updated to include block style variations from the block styles registry.
      *
      * @return array Block metadata.
      */
     protected static function get_blocks_metadata() {
-        $registry = WP_Block_Type_Registry::get_instance();
-        $blocks   = $registry->get_all_registered();
+        $registry       = WP_Block_Type_Registry::get_instance();
+        $blocks         = $registry->get_all_registered();
+        $style_registry = WP_Block_Styles_Registry::get_instance();
 
         // Is there metadata for all currently registered blocks?
         $blocks = array_diff_key( $blocks, static::$blocks_metadata );
         if ( empty( $blocks ) ) {
+            /*
+             * New block styles may have been registered within WP_Block_Styles_Registry.
+             * Update block metadata for any new block style variations.
+             */
+            $registered_styles = $style_registry->get_all_registered();
+            foreach ( static::$blocks_metadata as $block_name => $block_metadata ) {
+                if ( ! empty( $registered_styles[ $block_name ] ) ) {
+                    $style_selectors = $block_metadata['styleVariations'] ?? array();
+
+                    foreach ( $registered_styles[ $block_name ] as $block_style ) {
+                        if ( ! isset( $style_selectors[ $block_style['name'] ] ) ) {
+                            $style_selectors[ $block_style['name'] ] = static::get_block_style_variation_selector( $block_style['name'], $block_metadata['selector'] );
+                        }
+                    }
+
+                    static::$blocks_metadata[ $block_name ]['styleVariations'] = $style_selectors;
+                }
+            }
             return static::$blocks_metadata;
         }
@@ -1061 +1108 @@
 
             // If the block has style variations, append their selectors to the block metadata.
+            $style_selectors = array();
             if ( ! empty( $block_type->styles ) ) {
-                $style_selectors = array();
                 foreach ( $block_type->styles as $style ) {
                     $style_selectors[ $style['name'] ] = static::get_block_style_variation_selector( $style['name'], static::$blocks_metadata[ $block_name ]['selector'] );
                 }
+            }
+
+            // Block style variations can be registered through the WP_Block_Styles_Registry as well as block.json.
+            $registered_styles = $style_registry->get_registered_styles_for_block( $block_name );
+            foreach ( $registered_styles as $style ) {
+                $style_selectors[ $style['name'] ] = static::get_block_style_variation_selector( $style['name'], static::$blocks_metadata[ $block_name ]['selector'] );
+            }
+
+            if ( ! empty( $style_selectors ) ) {
                 static::$blocks_metadata[ $block_name ]['styleVariations'] = $style_selectors;
             }
@@ -1159 +1215 @@
      * @since 5.9.0 Removed the `$type` parameter, added the `$types` and `$origins` parameters.
      * @since 6.3.0 Add fallback layout styles for Post Template when block gap support isn't available.
+     * @since 6.6.0 Added `skip_root_layout_styles` option to omit layout styles if desired.
      *
      * @param string[] $types   Types of styles to load. Will load all by default. It accepts:
@@ -1166 +1223 @@
      * @param string[] $origins A list of origins to include. By default it includes VALID_ORIGINS.
      * @param array    $options An array of options for now used for internal purposes only (may change without notice).
-     *                          The options currently supported are 'scope' that makes sure all style are scoped to a
-     *                          given selector, and root_selector which overwrites and forces a given selector to be
-     *                          used on the root node.
+     *                       The options currently supported are:
+     *                       - 'scope' that makes sure all style are scoped to a given selector
+     *                       - `root_selector` which overwrites and forces a given selector to be used on the root node
+     *                       - `skip_root_layout_styles` which omits root layout styles from the generated stylesheet.
      * @return string The resulting stylesheet.
      */
@@ -1221 +1279 @@
 
         if ( in_array( 'styles', $types, true ) ) {
-            if ( false !== $root_style_key ) {
+            if ( false !== $root_style_key && empty( $options['skip_root_layout_styles'] ) ) {
                 $stylesheet .= $this->get_root_layout_rules( $style_nodes[ $root_style_key ]['selector'], $style_nodes[ $root_style_key ] );
             }
@@ -3115 +3173 @@
      * @since 5.9.0
      * @since 6.3.2 Preserves global styles block variations when securing styles.
+     * @since 6.6.0 Updated to allow variation element styles.
      *
      * @param array $theme_json Structure to sanitize.
@@ -3176 +3235 @@
 
                     $variation_output = static::remove_insecure_styles( $variation_input );
+
+                    // Process a variation's elements and element pseudo selector styles.
+                    if ( isset( $variation_input['elements'] ) ) {
+                        foreach ( $valid_element_names as $element_name ) {
+                            $element_input = $variation_input['elements'][ $element_name ] ?? null;
+                            if ( $element_input ) {
+                                $element_output = static::remove_insecure_styles( $element_input );
+
+                                if ( isset( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element_name ] ) ) {
+                                    foreach ( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element_name ] as $pseudo_selector ) {
+                                        if ( isset( $element_input[ $pseudo_selector ] ) ) {
+                                            $element_output[ $pseudo_selector ] = static::remove_insecure_styles( $element_input[ $pseudo_selector ] );
+                                        }
+                                    }
+                                }
+
+                                if ( ! empty( $element_output ) ) {
+                                    _wp_array_set( $variation_output, array( 'elements', $element_name ), $element_output );
+                                }
+                            }
+                        }
+                    }
+
                     if ( ! empty( $variation_output ) ) {
                         _wp_array_set( $sanitized, $variation['path'], $variation_output );