Changeset 54305

Timestamp:

09/26/2022 09:06:02 AM (2 years ago)

Author:

jorgefilipecosta

Message:

Editor: Fix missing frontend section presets output.

Backports PHP changes in WordPress/gutenberg#42124 to the core. Adds the missing mechanism to output frontend styles of block level presets to the core.

Props mcsf, oandregal, dmsnell, draganescu.
See #56467.

Location:

trunk/src

Files:

• wp-includes/block-supports/settings.php (added)
• wp-includes/class-wp-theme-json.php (modified) (7 diffs)
• wp-settings.php (modified) (1 diff)

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

@@ -774 +774 @@
             }
 
-            // Assign defaults, then overwrite those that the block sets by itself.
+            // Assign defaults, then override those that the block sets by itself.
             // If the block selector is compounded, will append the element to each
             // individual block selector.
@@ -867 +867 @@
      *                       - `variables`: only the CSS Custom Properties for presets & custom ones.
      *                       - `styles`: only the styles section in theme.json.
-     *                       - `presets`: only the classes for the presets.
-     * @param array $origins A list of origins to include. By default it includes VALID_ORIGINS.
+     *                       - `presets`: only the classes for the presets. @param array $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.
      * @return string Stylesheet.
      */
-    public function get_stylesheet( $types = array( 'variables', 'styles', 'presets' ), $origins = null ) {
+    public function get_stylesheet( $types = array( 'variables', 'styles', 'presets' ), $origins = null, $options = array() ) {
         if ( null === $origins ) {
             $origins = static::VALID_ORIGINS;
@@ -892 +894 @@
         $setting_nodes   = static::get_setting_nodes( $this->theme_json, $blocks_metadata );
 
+        $root_style_key    = array_search( static::ROOT_BLOCK_SELECTOR, array_column( $style_nodes, 'selector' ), true );
+        $root_settings_key = array_search( static::ROOT_BLOCK_SELECTOR, array_column( $setting_nodes, 'selector' ), true );
+
+        if ( ! empty( $options['scope'] ) ) {
+            foreach ( $setting_nodes as &$node ) {
+                $node['selector'] = static::scope_selector( $options['scope'], $node['selector'] );
+            }
+            foreach ( $style_nodes as &$node ) {
+                $node['selector'] = static::scope_selector( $options['scope'], $node['selector'] );
+            }
+        }
+
+        if ( ! empty( $options['root_selector'] ) ) {
+            if ( false !== $root_settings_key ) {
+                $setting_nodes[ $root_settings_key ]['selector'] = $options['root_selector'];
+            }
+            if ( false !== $root_style_key ) {
+                $setting_nodes[ $root_style_key ]['selector'] = $options['root_selector'];
+            }
+        }
+
         $stylesheet = '';
 
@@ -899 +922 @@
 
         if ( in_array( 'styles', $types, true ) ) {
-            $root_block_key = array_search( static::ROOT_BLOCK_SELECTOR, array_column( $style_nodes, 'selector' ), true );
-
-            if ( false !== $root_block_key ) {
-                $stylesheet .= $this->get_root_layout_rules( static::ROOT_BLOCK_SELECTOR, $style_nodes[ $root_block_key ] );
+            if ( false !== $root_style_key ) {
+                $stylesheet .= $this->get_root_layout_rules( $style_nodes[ $root_style_key ]['selector'], $style_nodes[ $root_style_key ] );
             }
             $stylesheet .= $this->get_block_classes( $style_nodes );
         } elseif ( in_array( 'base-layout-styles', $types, true ) ) {
+            $root_selector    = static::ROOT_BLOCK_SELECTOR;
+            $columns_selector = '.wp-block-columns';
+            if ( ! empty( $options['scope'] ) ) {
+                $root_selector    = static::scope_selector( $options['scope'], $root_selector );
+                $columns_selector = static::scope_selector( $options['scope'], $columns_selector );
+            }
+            if ( ! empty( $options['root_selector'] ) ) {
+                $root_selector = $options['root_selector'];
+            }
             // Base layout styles are provided as part of `styles`, so only output separately if explicitly requested.
             // For backwards compatibility, the Columns block is explicitly included, to support a different default gap value.
@@ -911 +941 @@
                 array(
                     'path'     => array( 'styles' ),
-                    'selector' => static::ROOT_BLOCK_SELECTOR,
+                    'selector' => $root_selector,
                 ),
                 array(
                     'path'     => array( 'styles', 'blocks', 'core/columns' ),
-                    'selector' => '.wp-block-columns',
+                    'selector' => $columns_selector,
                     'name'     => 'core/columns',
                 ),
@@ -1366 +1396 @@
      * @return string Scoped selector.
      */
-    protected static function scope_selector( $scope, $selector ) {
+    public static function scope_selector( $scope, $selector ) {
         $scopes    = explode( ',', $scope );
         $selectors = explode( ',', $selector );
@@ -1373 +1403 @@
         foreach ( $scopes as $outer ) {
             foreach ( $selectors as $inner ) {
-                $selectors_scoped[] = trim( $outer ) . ' ' . trim( $inner );
-            }
-        }
-
-        return implode( ', ', $selectors_scoped );
+                $outer = trim( $outer );
+                $inner = trim( $inner );
+                if ( ! empty( $outer ) && ! empty( $inner ) ) {
+                    $selectors_scoped[] = $outer . ' ' . $inner;
+                } elseif ( empty( $outer ) ) {
+                    $selectors_scoped[] = $inner;
+                } elseif ( empty( $inner ) ) {
+                    $selectors_scoped[] = $outer;
+                }
+            }
+        }
+
+        $result = implode( ', ', $selectors_scoped );
+        return $result;
     }
 

trunk/src/wp-settings.php

@@ -323 +323 @@
 require ABSPATH . WPINC . '/class-wp-block-supports.php';
 require ABSPATH . WPINC . '/block-supports/utils.php';
+require ABSPATH . WPINC . '/block-supports/settings.php';
 require ABSPATH . WPINC . '/block-supports/align.php';
 require ABSPATH . WPINC . '/block-supports/border.php';