Layout blockGap: Try using classnames to support block-level gap in t…

…heme.json

Try implementing partially in editor

Try adding block classname to the container class to deal with specificity, remove fallback gap

Add fallback gap styles rendered at root

Move changes to theme.json class 'up' to 6-1 file

Fix rendering block-level blockGap set in the block's attributes in the post editor

Implement changes in site editor / global styles comparable to PHP changes

Try moving some of the layout definitions to theme.json

Move layout style generation to a separate function

Implement theme.json definitions approach in the site editor, ensure styles load correctly in the post editor

Remove class duplication, use classname stored in theme.json instead of hard-coded classname

Support split row/column values at the block level, and include output of the legacy CSS variable for backwards compatibility

Ensure CSS variable is only output if gap support is opted-in

Tweak tests

Whitespace fix

Update test

Remove duplication block class from server-rendered output, update snapshot

Fix failing PHP test

Attempt to fix PHP test again

Manually fix snapshot

Fix PHP linting issue

Linting

Reorganise rules in theme.json

Remove dead code

Render base styles and only output container classes and styles if unique values are generated

Move blockGap styles in global styles to a separate getLayoutStyles function

Move layout_definitions up so that it's always available to base styles

Linting fixes

Update test snapshot

Add baseStyles output to global styles

Remove test snapshot

Update layout supports to return a CSS string instead of a component, add check that string is non-empty before outputting container classnames and style tags

Update flex layout to only output styles if unique values are set

Fix is-root-container styling in post editor

Update flex/flow layouts to look up layout definitions to generate gap styling

Move blockGap JS logic to a shared utility function, add tests

Add test in case layoutDefinitions is undefined

Add minimal tests that flex and flow layouts that don't contain non-default values return empty strings

Fix rebase in 6-1.php file

Consolidate JS layout classnames generation

Further consolidate classname generation

Implement outputting non-default layout gap for classic themes

Update fallback gap logic so that block themes that opt-out of blockGap but opt-in to wp-block-styles still get flex layout gap styles

Fix Columns fallback gap styles in classic themes

Ensure base layout styles are available in the editor for classic themes

Fix root gap value

Fix linting issues

Fix linting issue

Add a phpunit test for outputting layout styles based on layout definitions in theme.json

Add additional tests, ensure base styles are still output so that alignments continue to function

Remove todo items

Add layout selector regex, css declaration check

Add additional logical margin properties to allow list

Fix flex-wrap rule in JS version of flex layout

Co-authored-by: Ramon <[email protected]>

Rename default_layout to global_layout_settings

Rename blockGapStyles to spacingStyles

Fix rebase issues

Fix linting issues

Fix linting again

lib/load.php

@@ -76,6 +76,7 @@ function gutenberg_is_experiment_enabled( $name ) {
 require __DIR__ . '/compat/wordpress-6.0/client-assets.php';
 
 // WordPress 6.1 compat.
+require __DIR__ . '/compat/wordpress-6.1/block-editor-settings.php';
 require __DIR__ . '/compat/wordpress-6.1/blocks.php';
 require __DIR__ . '/compat/wordpress-6.1/block-editor-settings.php';
 require __DIR__ . '/compat/wordpress-6.1/persisted-preferences.php';