Post Title : Migrate to Text-Align Block Support

docs/reference-guides/core-blocks.md

@@ -779,8 +779,8 @@ Displays the title of a post, page, or any other content-type. ([Source](https:/
 
 -	**Name:** core/post-title
 -	**Category:** theme
--	**Supports:** align (full, wide), anchor, color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
--	**Attributes:** isLink, level, levelOptions, linkTarget, rel, textAlign
+-	**Supports:** align (full, wide), anchor, color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight, textAlign), ~~html~~
+-	**Attributes:** isLink, level, levelOptions, linkTarget, rel
 
 ## Preformatted
 

packages/block-library/src/post-title/block.json

@@ -8,9 +8,6 @@
 	"textdomain": "default",
 	"usesContext": [ "postId", "postType", "queryId" ],
 	"attributes": {
-		"textAlign": {
-			"type": "string"
-		},
 		"level": {
 			"type": "number",
 			"default": 2
@@ -58,6 +55,7 @@
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,
+			"textAlign": true,
 			"__experimentalFontFamily": true,
 			"__experimentalFontWeight": true,
 			"__experimentalFontStyle": true,

packages/block-library/src/post-title/deprecated.js

@@ -2,6 +2,91 @@
  * Internal dependencies
  */
 import migrateFontFamily from '../utils/migrate-font-family';
+import migrateTextAlign from '../utils/migrate-text-align';
+
+const v2 = {
+	attributes: {
+		textAlign: {
+			type: 'string',
+		},
+		level: {
+			type: 'number',
+			default: 2,
+		},
+		levelOptions: {
+			type: 'array',
+		},
+		isLink: {
+			type: 'boolean',
+			default: false,
+		},
+		rel: {
+			type: 'string',
+			attribute: 'rel',
+			default: '',
+		},
+		linkTarget: {
+			type: 'string',
+			default: '_self',
+		},
+	},
+	supports: {
+		anchor: true,
+		align: [ 'wide', 'full' ],
+		html: false,
+		color: {
+			gradients: true,
+			link: true,
+			__experimentalDefaultControls: {
+				background: true,
+				text: true,
+				link: true,
+			},
+		},
+		spacing: {
+			padding: true,
+			margin: true,
+		},
+		typography: {
+			fontSize: true,
+			lineHeight: true,
+			__experimentalFontFamily: true,
+			__experimentalTextTransform: true,
+			__experimentalTextDecoration: true,
+			__experimentalFontStyle: true,
+			__experimentalFontWeight: true,
+			__experimentalLetterSpacing: true,
+			__experimentalDefaultControls: {
+				fontSize: true,
+			},
+		},
+		interactivity: {
+			clientNavigation: true,
+		},
+		__experimentalBorder: {
+			radius: true,
+			color: true,
+			width: true,
+			style: true,
+			__experimentalDefaultControls: {
+				radius: true,
+				color: true,
+				width: true,
+				style: true,
+			},
+		},
+	},
+	migrate: migrateTextAlign,
+	isEligible( attributes ) {
+		return (
+			!! attributes.textAlign ||
+			!! attributes.className?.match(
+				/\bhas-text-align-(left|center|right)\b/
+			)
+		);
+	},
+	save: () => null,
+};
 
 const v1 = {
 	attributes: {
@@ -62,4 +147,4 @@ const v1 = {
  *
  * See block-deprecation.md
  */
-export default [ v1 ];
+export default [ v2, v1 ];

packages/block-library/src/post-title/edit.js

@@ -1,13 +1,7 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
 /**
  * WordPress dependencies
  */
 import {
-	AlignmentControl,
 	BlockControls,
 	InspectorControls,
 	useBlockProps,
@@ -34,7 +28,7 @@ import { createInterpolateElement } from '@wordpress/element';
 import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
 
 export default function PostTitleEdit( {
-	attributes: { level, levelOptions, textAlign, isLink, rel, linkTarget },
+	attributes: { level, levelOptions, isLink, rel, linkTarget },
 	setAttributes,
 	context: { postType, postId, queryId },
 	insertBlocksAfter,
@@ -72,11 +66,7 @@ export default function PostTitleEdit( {
 	const onSplitAtEnd = () => {
 		insertBlocksAfter( createBlock( getDefaultBlockName() ) );
 	};
-	const blockProps = useBlockProps( {
-		className: clsx( {
-			[ `has-text-align-${ textAlign }` ]: textAlign,
-		} ),
-	} );
+	const blockProps = useBlockProps();
 	const blockEditingMode = useBlockEditingMode();
 	const dropdownMenuProps = useToolsPanelDropdownMenuProps();
 
@@ -147,12 +137,6 @@ export default function PostTitleEdit( {
 								setAttributes( { level: newLevel } )
 							}
 						/>
-						<AlignmentControl
-							value={ textAlign }
-							onChange={ ( nextAlign ) => {
-								setAttributes( { textAlign: nextAlign } );
-							} }
-						/>
 					</BlockControls>
 					<InspectorControls>
 						<ToolsPanel

test/integration/fixtures/blocks/core__post-title__deprecated-v2.html

@@ -0,0 +1,5 @@
+<!-- wp:post-title {"textAlign":"left"} /-->
+
+<!-- wp:post-title {"textAlign":"center"} /-->
+
+<!-- wp:post-title {"textAlign":"right"} /-->

test/integration/fixtures/blocks/core__post-title__deprecated-v2.json

@@ -0,0 +1,50 @@
+[
+	{
+		"name": "core/post-title",
+		"isValid": true,
+		"attributes": {
+			"level": 2,
+			"isLink": false,
+			"rel": "",
+			"linkTarget": "_self",
+			"style": {
+				"typography": {
+					"textAlign": "left"
+				}
+			}
+		},
+		"innerBlocks": []
+	},
+	{
+		"name": "core/post-title",
+		"isValid": true,
+		"attributes": {
+			"level": 2,
+			"isLink": false,
+			"rel": "",
+			"linkTarget": "_self",
+			"style": {
+				"typography": {
+					"textAlign": "center"
+				}
+			}
+		},
+		"innerBlocks": []
+	},
+	{
+		"name": "core/post-title",
+		"isValid": true,
+		"attributes": {
+			"level": 2,
+			"isLink": false,
+			"rel": "",
+			"linkTarget": "_self",
+			"style": {
+				"typography": {
+					"textAlign": "right"
+				}
+			}
+		},
+		"innerBlocks": []
+	}
+]

test/integration/fixtures/blocks/core__post-title__deprecated-v2.parsed.json

@@ -0,0 +1,43 @@
+[
+	{
+		"blockName": "core/post-title",
+		"attrs": {
+			"textAlign": "left"
+		},
+		"innerBlocks": [],
+		"innerHTML": "",
+		"innerContent": []
+	},
+	{
+		"blockName": null,
+		"attrs": {},
+		"innerBlocks": [],
+		"innerHTML": "\n\n",
+		"innerContent": [ "\n\n" ]
+	},
+	{
+		"blockName": "core/post-title",
+		"attrs": {
+			"textAlign": "center"
+		},
+		"innerBlocks": [],
+		"innerHTML": "",
+		"innerContent": []
+	},
+	{
+		"blockName": null,
+		"attrs": {},
+		"innerBlocks": [],
+		"innerHTML": "\n\n",
+		"innerContent": [ "\n\n" ]
+	},
+	{
+		"blockName": "core/post-title",
+		"attrs": {
+			"textAlign": "right"
+		},
+		"innerBlocks": [],
+		"innerHTML": "",
+		"innerContent": []
+	}
+]

test/integration/fixtures/blocks/core__post-title__deprecated-v2.serialized.html

@@ -0,0 +1,5 @@
+<!-- wp:post-title {"style":{"typography":{"textAlign":"left"}}} /-->
+
+<!-- wp:post-title {"style":{"typography":{"textAlign":"center"}}} /-->
+
+<!-- wp:post-title {"style":{"typography":{"textAlign":"right"}}} /-->