diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index 008fecfc8556d..1a6842a080451 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -276,7 +276,7 @@ Gather blocks in a layout container. ([Source](https://github.com/WordPress/gute - **Name:** core/group - **Category:** design - **Supports:** align (full, wide), anchor, ariaLabel, color (background, gradients, link, text), spacing (blockGap, margin, padding), typography (fontSize, lineHeight), ~~html~~ -- **Attributes:** tagName, templateLock +- **Attributes:** layout, tagName, templateLock ## Heading diff --git a/packages/block-library/src/group/block.json b/packages/block-library/src/group/block.json index cef2e700a3fba..9aedb56227369 100644 --- a/packages/block-library/src/group/block.json +++ b/packages/block-library/src/group/block.json @@ -15,6 +15,12 @@ "templateLock": { "type": [ "string", "boolean" ], "enum": [ "all", "insert", false ] + }, + "layout": { + "type": "object", + "default": { + "type": "column" + } } }, "supports": { @@ -64,11 +70,7 @@ "fontSize": true } }, - "__experimentalLayout": { - "default": { - "type": "column" - } - } + "__experimentalLayout": true }, "editorStyle": "wp-block-group-editor", "style": "wp-block-group" diff --git a/packages/block-library/src/group/deprecated.js b/packages/block-library/src/group/deprecated.js index 9df7c6e12ce6e..3d60687393a06 100644 --- a/packages/block-library/src/group/deprecated.js +++ b/packages/block-library/src/group/deprecated.js @@ -109,12 +109,7 @@ const deprecated = [ migrate: ( attributes ) => { const { layout = null } = attributes; if ( ! layout ) { - return { - ...attributes, - layout: { - type: 'default', - }, - }; + return attributes; } if ( layout.inherit || layout.contentSize ) { return { diff --git a/packages/block-library/src/group/edit.js b/packages/block-library/src/group/edit.js index d57f6d91277a2..e31642796db34 100644 --- a/packages/block-library/src/group/edit.js +++ b/packages/block-library/src/group/edit.js @@ -1,7 +1,8 @@ /** * WordPress dependencies */ -import { useSelect } from '@wordpress/data'; +import { useSelect, useDispatch } from '@wordpress/data'; +import { useEffect } from '@wordpress/element'; import { InnerBlocks, useBlockProps, @@ -70,6 +71,16 @@ function GroupEdit( { attributes, setAttributes, clientId } ) { } ); + const { __unstableMarkNextChangeAsNotPersistent } = + useDispatch( blockEditorStore ); + const { type: layoutType = null } = layout; + useEffect( () => { + if ( layoutType ) { + __unstableMarkNextChangeAsNotPersistent(); + setAttributes( { layout: { type: layoutType } } ); + } + }, [ layoutType ] ); + return ( <> diff --git a/packages/block-library/src/group/variations.js b/packages/block-library/src/group/variations.js index bbae57a0031c0..7e3cd18d1862d 100644 --- a/packages/block-library/src/group/variations.js +++ b/packages/block-library/src/group/variations.js @@ -9,12 +9,13 @@ const variations = [ name: 'group', title: __( 'Group' ), description: __( 'Gather blocks in a layout container.' ), - attributes: { layout: { type: 'default' } }, + attributes: { layout: { type: 'column' } }, scope: [ 'transform' ], isActive: ( blockAttributes ) => ! blockAttributes.layout || ! blockAttributes.layout?.type || - blockAttributes.layout?.type === 'default', + blockAttributes.layout?.type === 'default' || + blockAttributes.layout?.type === 'column', icon: group, }, {