Make WordPress Core

Changeset 55255


Ignore:
Timestamp:
02/07/2023 12:40:44 PM (13 months ago)
Author:
jorgefilipecosta
Message:

Block editor: Add frontend block-level settings to the core.

This commit adds block-level settings in the core. Block level settings allow a block to define the preset settings of its nested blocks using the same shape as theme.json.

Props oandregal, Mamaduka, jorgefilipecosta, dmsnell, adamziel.
57651 #57651.

Location:
trunk/src
Files:
1 added
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/class-wp-theme-json.php

    r55216 r55255  
    944944     *                       - `presets`: only the classes for the presets.
    945945     * @param array $origins A list of origins to include. By default it includes VALID_ORIGINS.
     946     * @param array $options An array of options for now used for internal purposes only (may change without notice).
     947     *                       The options currently supported are 'scope' that makes sure all style are scoped to a given selector,
     948     *                       and root_selector which overwrites and forces a given selector to be used on the root node.
    946949     * @return string The resulting stylesheet.
    947950     */
    948     public function get_stylesheet( $types = array( 'variables', 'styles', 'presets' ), $origins = null ) {
     951    public function get_stylesheet( $types = array( 'variables', 'styles', 'presets' ), $origins = null, $options = array() ) {
    949952        if ( null === $origins ) {
    950953            $origins = static::VALID_ORIGINS;
     
    967970        $setting_nodes   = static::get_setting_nodes( $this->theme_json, $blocks_metadata );
    968971
     972        $root_style_key    = array_search( static::ROOT_BLOCK_SELECTOR, array_column( $style_nodes, 'selector' ), true );
     973        $root_settings_key = array_search( static::ROOT_BLOCK_SELECTOR, array_column( $setting_nodes, 'selector' ), true );
     974
     975        if ( ! empty( $options['scope'] ) ) {
     976            foreach ( $setting_nodes as &$node ) {
     977                $node['selector'] = static::scope_selector( $options['scope'], $node['selector'] );
     978            }
     979            foreach ( $style_nodes as &$node ) {
     980                $node['selector'] = static::scope_selector( $options['scope'], $node['selector'] );
     981            }
     982        }
     983
     984        if ( ! empty( $options['root_selector'] ) ) {
     985            if ( false !== $root_settings_key ) {
     986                $setting_nodes[ $root_settings_key ]['selector'] = $options['root_selector'];
     987            }
     988            if ( false !== $root_style_key ) {
     989                $setting_nodes[ $root_style_key ]['selector'] = $options['root_selector'];
     990            }
     991        }
     992
    969993        $stylesheet = '';
    970994
     
    974998
    975999        if ( in_array( 'styles', $types, true ) ) {
    976             $root_block_key = array_search( static::ROOT_BLOCK_SELECTOR, array_column( $style_nodes, 'selector' ), true );
    977 
    978             if ( false !== $root_block_key ) {
    979                 $stylesheet .= $this->get_root_layout_rules( static::ROOT_BLOCK_SELECTOR, $style_nodes[ $root_block_key ] );
     1000            if ( false !== $root_style_key ) {
     1001                $stylesheet .= $this->get_root_layout_rules( $style_nodes[ $root_style_key ]['selector'], $style_nodes[ $root_style_key ] );
    9801002            }
    9811003            $stylesheet .= $this->get_block_classes( $style_nodes );
    9821004        } elseif ( in_array( 'base-layout-styles', $types, true ) ) {
     1005            $root_selector    = static::ROOT_BLOCK_SELECTOR;
     1006            $columns_selector = '.wp-block-columns';
     1007            if ( ! empty( $options['scope'] ) ) {
     1008                $root_selector    = static::scope_selector( $options['scope'], $root_selector );
     1009                $columns_selector = static::scope_selector( $options['scope'], $columns_selector );
     1010            }
     1011            if ( ! empty( $options['root_selector'] ) ) {
     1012                $root_selector = $options['root_selector'];
     1013            }
    9831014            // Base layout styles are provided as part of `styles`, so only output separately if explicitly requested.
    9841015            // For backwards compatibility, the Columns block is explicitly included, to support a different default gap value.
     
    9861017                array(
    9871018                    'path'     => array( 'styles' ),
    988                     'selector' => static::ROOT_BLOCK_SELECTOR,
     1019                    'selector' => $root_selector,
    9891020                ),
    9901021                array(
    9911022                    'path'     => array( 'styles', 'blocks', 'core/columns' ),
    992                     'selector' => '.wp-block-columns',
     1023                    'selector' => $columns_selector,
    9931024                    'name'     => 'core/columns',
    9941025                ),
     
    14911522     * @return string Scoped selector.
    14921523     */
    1493     protected static function scope_selector( $scope, $selector ) {
     1524    public static function scope_selector( $scope, $selector ) {
    14941525        $scopes    = explode( ',', $scope );
    14951526        $selectors = explode( ',', $selector );
     
    14981529        foreach ( $scopes as $outer ) {
    14991530            foreach ( $selectors as $inner ) {
    1500                 $selectors_scoped[] = trim( $outer ) . ' ' . trim( $inner );
    1501             }
    1502         }
    1503 
    1504         return implode( ', ', $selectors_scoped );
     1531                $outer = trim( $outer );
     1532                $inner = trim( $inner );
     1533                if ( ! empty( $outer ) && ! empty( $inner ) ) {
     1534                    $selectors_scoped[] = $outer . ' ' . $inner;
     1535                } elseif ( empty( $outer ) ) {
     1536                    $selectors_scoped[] = $inner;
     1537                } elseif ( empty( $inner ) ) {
     1538                    $selectors_scoped[] = $outer;
     1539                }
     1540            }
     1541        }
     1542
     1543        $result = implode( ', ', $selectors_scoped );
     1544        return $result;
    15051545    }
    15061546
  • trunk/src/wp-settings.php

    r55230 r55255  
    339339require ABSPATH . WPINC . '/block-supports/spacing.php';
    340340require ABSPATH . WPINC . '/block-supports/typography.php';
     341require ABSPATH . WPINC . '/block-supports/settings.php';
    341342require ABSPATH . WPINC . '/style-engine.php';
    342343require ABSPATH . WPINC . '/style-engine/class-wp-style-engine.php';
Note: See TracChangeset for help on using the changeset viewer.