WordPress.org
Get WordPress

Make WordPress Core

Changeset 61619


Ignore:
Timestamp:
02/12/2026 05:06:08 AM (5 days ago)
Author:
ramonopoly
Message:

Block Supports: Add width to dimensions supports

This PR introduces dimensions.width to the list of available block supports.

This block support enables, in the future, the removal of the custom width and height controls in blocks such as Button, Column and many others in favor of customizations via block supports.

Props aaronrobertshaw, andrewserong, ramonopoly, welcher, mamaduka, wildworks, youknowriad, isabel_brison.

Fixes #64200.

Location:
trunk
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/block-supports/dimensions.php

    r61430 r61619  
    5252 */
    5353function wp_apply_dimensions_support( $block_type, $block_attributes ) {
     54    $attributes = array();
     55
    5456    if ( wp_should_skip_block_supports_serialization( $block_type, 'dimensions' ) ) {
    55         return array();
     57        return $attributes;
    5658    }
    5759
    58     $attributes = array();
    59 
    60     // Width support to be added in near future.
    61 
    62     $has_min_height_support = block_has_support( $block_type, array( 'dimensions', 'minHeight' ), false );
    63     $block_styles           = $block_attributes['style'] ?? null;
     60    $block_styles = $block_attributes['style'] ?? null;
    6461
    6562    if ( ! $block_styles ) {
    … …  
    6764    }
    6865
    69     $skip_min_height                      = wp_should_skip_block_supports_serialization( $block_type, 'dimensions', 'minHeight' );
    70     $dimensions_block_styles              = array();
    71     $dimensions_block_styles['minHeight'] = null;
    72     if ( $has_min_height_support && ! $skip_min_height ) {
    73         $dimensions_block_styles['minHeight'] = $block_styles['dimensions']['minHeight'] ?? null;
     66    $dimensions_block_styles = array();
     67    $supported_features      = array( 'minHeight', 'width' );
     68
     69    foreach ( $supported_features as $feature ) {
     70        $has_support        = block_has_support( $block_type, array( 'dimensions', $feature ), false );
     71        $skip_serialization = wp_should_skip_block_supports_serialization( $block_type, 'dimensions', $feature );
     72
     73        $dimensions_block_styles[ $feature ] = null;
     74
     75        if ( $has_support && ! $skip_serialization ) {
     76            $dimensions_block_styles[ $feature ] = $block_styles['dimensions'][ $feature ] ?? null;
     77        }
    7478    }
     79
    7580    $styles = wp_style_engine_get_styles( array( 'dimensions' => $dimensions_block_styles ) );
    7681

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

    r61618 r61619  
    238238     * @since 6.6.0 Added `background-[image|position|repeat|size]` properties.
    239239     * @since 6.7.0 Added `background-attachment` property.
     240     * @since 7.0.0 Added `dimensions.width`.
    240241     * @var array
    241242     */
    … …  
    302303        'filter'                            => array( 'filter', 'duotone' ),
    303304        'box-shadow'                        => array( 'shadow' ),
     305        'width'                             => array( 'dimensions', 'width' ),
    304306        'writing-mode'                      => array( 'typography', 'writingMode' ),
    305307    );
    … …  
    397399     * @since 6.9.0 Added support for `border.radiusSizes`.
    398400     * @since 7.0.0 Added type markers to the schema for boolean values.
     401     *              Added support for `dimensions.width`.
    399402     * @var array
    400403     */
    … …  
    436439            'defaultAspectRatios' => null,
    437440            'minHeight'           => null,
     441            'width'               => null,
    438442        ),
    439443        'layout'                        => array(
    … …  
    529533     * @since 6.5.0 Added support for `dimensions.aspectRatio`.
    530534     * @since 6.6.0 Added `background` sub properties to top-level only.
     535     * @since 7.0.0 Added support for `dimensions.width`.
    531536     * @var array
    532537     */
    … …  
    557562            'aspectRatio' => null,
    558563            'minHeight'   => null,
     564            'width'       => null,
    559565        ),
    560566        'filter'     => array(
    … …  
    656662     *
    657663     * @since 6.1.0
     664     * @since 7.0.0 Added support for `dimensions`.
    658665     * @var string[]
    659666     */
    … …  
    661668        '__experimentalBorder' => 'border',
    662669        'color'                => 'color',
     670        'dimensions'           => 'dimensions',
    663671        'spacing'              => 'spacing',
    664672        'typography'           => 'typography',
    … …  
    765773     * @since 6.4.0 Added `background.backgroundImage`.
    766774     * @since 6.5.0 Added `background.backgroundSize` and `dimensions.aspectRatio`.
     775     * @since 7.0.0 Added `dimensions.width`.
    767776     * @var array
    768777     */
    … …  
    780789        array( 'dimensions', 'aspectRatio' ),
    781790        array( 'dimensions', 'minHeight' ),
     791        array( 'dimensions', 'width' ),
    782792        array( 'position', 'sticky' ),
    783793        array( 'spacing', 'blockGap' ),

  • trunk/src/wp-includes/style-engine/class-wp-style-engine.php

    r60892 r61619  
    220220                ),
    221221            ),
     222            'width'       => array(
     223                'property_keys' => array(
     224                    'default' => 'width',
     225                ),
     226                'path'          => array( 'dimensions', 'width' ),
     227            ),
    222228        ),
    223229        'spacing'    => array(

  • trunk/tests/phpunit/tests/block-supports/wpApplyDimensionsSupport.php

    r55175 r61619  
    101101        );
    102102    }
     103
     104    /**
     105     * Tests that width block support works as expected.
     106     *
     107     * @ticket 64200
     108     *
     109     * @covers ::wp_apply_dimensions_support
     110     *
     111     * @dataProvider data_width_block_support
     112     *
     113     * @param string $block_name The test block name to register.
     114     * @param mixed  $dimensions The dimensions block support settings.
     115     * @param mixed  $expected   The expected results.
     116     */
     117    public function test_width_block_support( $block_name, $dimensions, $expected ) {
     118        $this->test_block_name = $block_name;
     119        register_block_type(
     120            $this->test_block_name,
     121            array(
     122                'api_version' => 2,
     123                'attributes'  => array(
     124                    'style' => array(
     125                        'type' => 'object',
     126                    ),
     127                ),
     128                'supports'    => array(
     129                    'dimensions' => $dimensions,
     130                ),
     131            )
     132        );
     133        $registry    = WP_Block_Type_Registry::get_instance();
     134        $block_type  = $registry->get_registered( $this->test_block_name );
     135        $block_attrs = array(
     136            'style' => array(
     137                'dimensions' => array(
     138                    'width' => '300px',
     139                ),
     140            ),
     141        );
     142
     143        $actual = wp_apply_dimensions_support( $block_type, $block_attrs );
     144
     145        $this->assertSame( $expected, $actual );
     146    }
     147
     148    /**
     149     * Data provider.
     150     *
     151     * @return array
     152     */
     153    public function data_width_block_support() {
     154        return array(
     155            'style is applied' => array(
     156                'block_name' => 'test/width-style-is-applied',
     157                'dimensions' => array(
     158                    'width' => true,
     159                ),
     160                'expected'   => array(
     161                    'style' => 'width:300px;',
     162                ),
     163            ),
     164            'style output is skipped when individual feature serialization is skipped' => array(
     165                'block_name' => 'test/width-with-individual-skipped-serialization-block-supports',
     166                'dimensions' => array(
     167                    'width'                           => true,
     168                    '__experimentalSkipSerialization' => array( 'width' ),
     169                ),
     170                'expected'   => array(),
     171            ),
     172        );
     173    }
    103174}

  • trunk/tests/phpunit/tests/theme/wpThemeJson.php

    r61618 r61619  
    282282                'aspectRatio' => true,
    283283                'minHeight'   => true,
     284                'width'       => true,
    284285            ),
    285286            'position'   => array(
    … …  
    321322                        'aspectRatio' => true,
    322323                        'minHeight'   => true,
     324                        'width'       => true,
    323325                    ),
    324326                    'position'   => array(
Note: See TracChangeset for help on using the changeset viewer.