@wordpress/block-library 9.41.1-next.v.202603161435.0 → 9.42.0

package/src/post-date/deprecated.js

@@ -7,6 +7,84 @@ import clsx from 'clsx';
  * Internal dependencies
  */
 import migrateFontFamily from '../utils/migrate-font-family';
+import migrateTextAlign from '../utils/migrate-text-align';
+
+const v4 = {
+	attributes: {
+		datetime: {
+			type: 'string',
+			role: 'content',
+		},
+		textAlign: {
+			type: 'string',
+		},
+		format: {
+			type: 'string',
+		},
+		isLink: {
+			type: 'boolean',
+			default: false,
+			role: 'content',
+		},
+	},
+	supports: {
+		anchor: true,
+		html: false,
+		color: {
+			gradients: true,
+			link: true,
+			__experimentalDefaultControls: {
+				background: true,
+				text: true,
+				link: true,
+			},
+		},
+		spacing: {
+			margin: true,
+			padding: true,
+		},
+		typography: {
+			fontSize: true,
+			lineHeight: true,
+			__experimentalFontFamily: true,
+			__experimentalFontWeight: true,
+			__experimentalFontStyle: true,
+			__experimentalTextTransform: true,
+			__experimentalTextDecoration: 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,
+			},
+		},
+	},
+	save() {
+		return null;
+	},
+	migrate: migrateTextAlign,
+	isEligible( attributes ) {
+		return (
+			!! attributes.textAlign ||
+			!! attributes.className?.match(
+				/\bhas-text-align-(left|center|right)\b/
+			)
+		);
+	},
+};
 
 const v3 = {
 	attributes: {
@@ -87,7 +165,7 @@ const v3 = {
 		...otherAttributes
 	} ) {
 		// Change the block bindings source argument name from "key" to "field".
-		return {
+		return migrateTextAlign( {
 			metadata: {
 				bindings: {
 					datetime: {
@@ -99,7 +177,7 @@ const v3 = {
 				...otherMetadata,
 			},
 			...otherAttributes,
-		};
+		} );
 	},
 	isEligible( attributes ) {
 		return (
@@ -184,7 +262,7 @@ const v2 = {
 				);
 			}
 
-			return {
+			return migrateTextAlign( {
 				...otherAttributes,
 				className,
 				metadata: {
@@ -196,7 +274,7 @@ const v2 = {
 						},
 					},
 				},
-			};
+			} );
 		}
 	},
 	isEligible( attributes ) {
@@ -240,7 +318,9 @@ const v1 = {
 	save() {
 		return null;
 	},
-	migrate: migrateFontFamily,
+	migrate( attributes ) {
+		return migrateTextAlign( migrateFontFamily( attributes ) );
+	},
 	isEligible( { style } ) {
 		return style?.typography?.fontFamily;
 	},
@@ -254,4 +334,4 @@ const v1 = {
  *
  * See block-deprecation.md
  */
-export default [ v3, v2, v1 ];
+export default [ v4, v3, v2, v1 ];

package/src/post-date/edit.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
 /**
  * WordPress dependencies
  */
@@ -14,7 +9,6 @@ import {
 	getSettings as getDateSettings,
 } from '@wordpress/date';
 import {
-	AlignmentControl,
 	BlockControls,
 	InspectorControls,
 	store as blockEditorStore,
@@ -41,19 +35,18 @@ import { store as blocksStore } from '@wordpress/blocks';
  * Internal dependencies
  */
 import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
+import useDeprecatedTextAlign from '../utils/deprecated-text-align-attributes';
 
-export default function PostDateEdit( {
-	attributes,
-	context: { postType: postTypeSlug, queryId },
-	setAttributes,
-	name,
-} ) {
-	const { datetime, textAlign, format, isLink } = attributes;
-	const blockProps = useBlockProps( {
-		className: clsx( {
-			[ `has-text-align-${ textAlign }` ]: textAlign,
-		} ),
-	} );
+export default function PostDateEdit( props ) {
+	const {
+		attributes,
+		context: { postType: postTypeSlug, queryId },
+		setAttributes,
+		name,
+	} = props;
+	useDeprecatedTextAlign( props );
+	const { datetime, format, isLink } = attributes;
+	const blockProps = useBlockProps();
 	const dropdownMenuProps = useToolsPanelDropdownMenuProps();
 
 	// Use internal state instead of a ref to make sure that the component
@@ -126,71 +119,61 @@ export default function PostDateEdit( {
 	}
 	return (
 		<>
-			{ ( blockEditingMode === 'default' ||
-				! isDescendentOfQueryLoop ) && (
-				<BlockControls group="block">
-					<AlignmentControl
-						value={ textAlign }
-						onChange={ ( nextAlign ) => {
-							setAttributes( { textAlign: nextAlign } );
-						} }
-					/>
-
-					{ activeBlockVariationName !== 'post-date-modified' &&
-						( ! isDescendentOfQueryLoop ||
-							! activeBlockVariationName ) && (
-							<ToolbarGroup>
-								<Dropdown
-									popoverProps={ popoverProps }
-									renderContent={ ( { onClose } ) => (
-										<PublishDateTimePicker
-											title={
-												activeBlockVariationName ===
-												'post-date'
-													? __( 'Publish Date' )
-													: __( 'Date' )
-											}
-											currentDate={ datetime }
-											onChange={ ( newDatetime ) =>
-												setAttributes( {
-													datetime: newDatetime,
-												} )
-											}
-											is12Hour={ is12HourFormat(
-												siteTimeFormat
-											) }
-											onClose={ onClose }
-											dateOrder={
-												/* translators: Order of day, month, and year. Available formats are 'dmy', 'mdy', and 'ymd'. */
-												_x( 'dmy', 'date order' )
-											}
+			{ ( blockEditingMode === 'default' || ! isDescendentOfQueryLoop ) &&
+				activeBlockVariationName !== 'post-date-modified' &&
+				( ! isDescendentOfQueryLoop || ! activeBlockVariationName ) && (
+					<BlockControls group="block">
+						<ToolbarGroup>
+							<Dropdown
+								popoverProps={ popoverProps }
+								renderContent={ ( { onClose } ) => (
+									<PublishDateTimePicker
+										title={
+											activeBlockVariationName ===
+											'post-date'
+												? __( 'Publish Date' )
+												: __( 'Date' )
+										}
+										currentDate={ datetime }
+										onChange={ ( newDatetime ) =>
+											setAttributes( {
+												datetime: newDatetime,
+											} )
+										}
+										is12Hour={ is12HourFormat(
+											siteTimeFormat
+										) }
+										onClose={ onClose }
+										dateOrder={
+											/* translators: Order of day, month, and year. Available formats are 'dmy', 'mdy', and 'ymd'. */
+											_x( 'dmy', 'date order' )
+										}
+									/>
+								) }
+								renderToggle={ ( { isOpen, onToggle } ) => {
+									const openOnArrowDown = ( event ) => {
+										if (
+											! isOpen &&
+											event.keyCode === DOWN
+										) {
+											event.preventDefault();
+											onToggle();
+										}
+									};
+									return (
+										<ToolbarButton
+											aria-expanded={ isOpen }
+											icon={ pencil }
+											title={ __( 'Change Date' ) }
+											onClick={ onToggle }
+											onKeyDown={ openOnArrowDown }
 										/>
-									) }
-									renderToggle={ ( { isOpen, onToggle } ) => {
-										const openOnArrowDown = ( event ) => {
-											if (
-												! isOpen &&
-												event.keyCode === DOWN
-											) {
-												event.preventDefault();
-												onToggle();
-											}
-										};
-										return (
-											<ToolbarButton
-												aria-expanded={ isOpen }
-												icon={ pencil }
-												title={ __( 'Change Date' ) }
-												onClick={ onToggle }
-												onKeyDown={ openOnArrowDown }
-											/>
-										);
-									} }
-								/>
-							</ToolbarGroup>
-						) }
-				</BlockControls>
-			) }
+									);
+								} }
+							/>
+						</ToolbarGroup>
+					</BlockControls>
+				) }
 
 			<InspectorControls>
 				<ToolsPanel

package/src/site-title/index.js

@@ -20,7 +20,11 @@ export const settings = {
 	example: {
 		viewportWidth: 350,
 		attributes: {
-			textAlign: 'center',
+			style: {
+				typography: {
+					textAlign: 'center',
+				},
+			},
 		},
 	},
 	edit,