]*wp-block-group__inner-container(\s|")[^>]*>)((.|\S|\s)*)/';
-
if (
'core/group' !== $block['blockName'] ||
WP_Theme_JSON_Resolver_Gutenberg::theme_has_support() ||
- 1 === preg_match( $group_with_inner_container_regex, $block_content )
+ 1 === preg_match( $group_with_inner_container_regex, $block_content ) ||
+ ( isset( $block['attrs']['layout']['type'] ) && 'default' !== $block['attrs']['layout']['type'] )
) {
return $block_content;
}
@@ -171,7 +171,8 @@ function( $matches ) {
return $updated_content;
}
-// This can be removed when plugin support requires WordPress 5.8.0+.
-if ( ! function_exists( 'wp_restore_group_inner_container' ) ) {
- add_filter( 'render_block', 'gutenberg_restore_group_inner_container', 10, 2 );
+if ( function_exists( 'wp_restore_group_inner_container' ) ) {
+ remove_filter( 'render_block', 'wp_restore_group_inner_container', 10, 2 );
}
+add_filter( 'render_block', 'gutenberg_restore_group_inner_container', 10, 2 );
+
diff --git a/packages/block-library/src/group/edit.js b/packages/block-library/src/group/edit.js
index c82ab09a1709a..f30a7482bc3d8 100644
--- a/packages/block-library/src/group/edit.js
+++ b/packages/block-library/src/group/edit.js
@@ -28,10 +28,12 @@ function GroupEdit( { attributes, setAttributes, clientId } ) {
const defaultLayout = useSetting( 'layout' ) || {};
const { tagName: TagName = 'div', templateLock, layout = {} } = attributes;
const usedLayout = !! layout && layout.inherit ? defaultLayout : layout;
+ const { type = 'default' } = usedLayout;
+ const layoutSupportEnabled = themeSupportsLayout || type !== 'default';
const blockProps = useBlockProps();
const innerBlocksProps = useInnerBlocksProps(
- themeSupportsLayout
+ layoutSupportEnabled
? blockProps
: { className: 'wp-block-group__inner-container' },
{
@@ -39,7 +41,7 @@ function GroupEdit( { attributes, setAttributes, clientId } ) {
renderAppender: hasInnerBlocks
? undefined
: InnerBlocks.ButtonBlockAppender,
- __experimentalLayout: themeSupportsLayout ? usedLayout : undefined,
+ __experimentalLayout: layoutSupportEnabled ? usedLayout : undefined,
}
);
@@ -63,10 +65,10 @@ function GroupEdit( { attributes, setAttributes, clientId } ) {
}
/>
- { themeSupportsLayout &&
}
+ { layoutSupportEnabled &&
}
{ /* Ideally this is not needed but it's there for backward compatibility reason
to keep this div for themes that might rely on its presence */ }
- { ! themeSupportsLayout && (
+ { ! layoutSupportEnabled && (
diff --git a/packages/block-library/src/group/index.js b/packages/block-library/src/group/index.js
index dac9a09b3cb1f..e3b9d887d95f8 100644
--- a/packages/block-library/src/group/index.js
+++ b/packages/block-library/src/group/index.js
@@ -12,6 +12,7 @@ import deprecated from './deprecated';
import edit from './edit';
import metadata from './block.json';
import save from './save';
+import variations from './variations';
const { name } = metadata;
@@ -135,4 +136,5 @@ export const settings = {
edit,
save,
deprecated,
+ variations,
};
diff --git a/packages/block-library/src/group/variations.js b/packages/block-library/src/group/variations.js
new file mode 100644
index 0000000000000..76de042661f38
--- /dev/null
+++ b/packages/block-library/src/group/variations.js
@@ -0,0 +1,18 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+
+const variations = [
+ {
+ name: 'group-row',
+ title: __( 'Row' ),
+ description: __( 'Blocks shown in a row.' ),
+ attributes: { layout: { type: 'flex' } },
+ scope: [ 'inserter' ],
+ isActive: ( blockAttributes ) =>
+ blockAttributes.layout?.type === 'flex',
+ },
+];
+
+export default variations;