Description

I have custom spacing sizes in my theme.json:

{
    "settings": {
        "spacing": {
            "spacingSizes": [
                {
                    "name": "6",
                    "slug": "60",
                    "size": "2rem"
                },
                ...
            ]
        }
    }
}

When I add these custom spacing sizes to a group in the block editor, the frontend displays them as:

<div class="wp-block-group alignwide bricksy-travel-two-column-text has-global-padding is-layout-constrained wp-block-group-is-layout-constrained" style="padding-top:2rem;padding-right:var(--wp--preset--spacing--60);padding-bottom:2rem;padding-left:var(--wp--preset--spacing--60)">

For the top and bottom, it converts them to their actual units, while it keeps the variables from the right and left properties. The order here is dependent on which size I set first in the editor. Sometimes I get the actual units for the left and right. This is a new behavior that I noticed after updating the plugin.

Step-by-step reproduction instructions

1. Update to latest version of Gutenberg.
2. Add custom spacing sizes to theme.json.
3. Add group block in block editor and add padding using custom spacing sizes.
4. See the display on the frontend.

Screenshots, screen recording, code snippet

Environment info

• WordPress 6.2.2
• Gutenberg 16.0.0

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes