diff --git a/lib/experimental/editor-settings.php b/lib/experimental/editor-settings.php index 03e7d6f1b97e0..c3afb1d3414e7 100644 --- a/lib/experimental/editor-settings.php +++ b/lib/experimental/editor-settings.php @@ -83,6 +83,9 @@ function gutenberg_enable_experiments() { if ( $gutenberg_experiments && array_key_exists( 'gutenberg-color-randomizer', $gutenberg_experiments ) ) { wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableColorRandomizer = true', 'before' ); } + if ( $gutenberg_experiments && array_key_exists( 'gutenberg-group-grid-variation', $gutenberg_experiments ) ) { + wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableGroupGridVariation = true', 'before' ); + } } add_action( 'admin_init', 'gutenberg_enable_experiments' ); diff --git a/lib/experiments-page.php b/lib/experiments-page.php index 0304b851c19e5..0e9fc89aca155 100644 --- a/lib/experiments-page.php +++ b/lib/experiments-page.php @@ -65,6 +65,18 @@ function gutenberg_initialize_experiments_settings() { ) ); + add_settings_field( + 'gutenberg-group-grid-variation', + __( 'Grid variation for Group block ', 'gutenberg' ), + 'gutenberg_display_experiment_field', + 'gutenberg-experiments', + 'gutenberg_experiments_section', + array( + 'label' => __( 'Test the Grid layout type as a new variation of Group block.', 'gutenberg' ), + 'id' => 'gutenberg-group-grid-variation', + ) + ); + register_setting( 'gutenberg-experiments', 'gutenberg-experiments' diff --git a/packages/block-library/src/group/variations.js b/packages/block-library/src/group/variations.js index 8589b7f73fed4..3f5dcc0a45a9e 100644 --- a/packages/block-library/src/group/variations.js +++ b/packages/block-library/src/group/variations.js @@ -42,7 +42,10 @@ const variations = [ blockAttributes.layout?.orientation === 'vertical', icon: stack, }, - { +]; + +if ( window?.__experimentalEnableGroupGridVariation ) { + variations.push( { name: 'group-grid', title: __( 'Grid' ), description: __( 'Arrange blocks in a grid.' ), @@ -51,7 +54,7 @@ const variations = [ isActive: ( blockAttributes ) => blockAttributes.layout?.type === 'grid', icon: grid, - }, -]; + } ); +} export default variations;