@wordpress/block-library 9.40.2-next.v.202602241322.0 → 9.40.2

package/src/navigation-link/shared/test/controls.js

@@ -237,7 +237,7 @@ describe( 'Controls', () => {
 
 			render( <Controls { ...propsWithExternalLink } /> );
 
-			expect( screen.getByText( 'View link' ) ).toBeVisible();
+			expect( screen.getByText( 'View' ) ).toBeVisible();
 		} );
 
 		it( 'shows "View page" for page links', () => {
@@ -253,7 +253,7 @@ describe( 'Controls', () => {
 
 			render( <Controls { ...propsWithPageLink } /> );
 
-			expect( screen.getByText( 'View page' ) ).toBeVisible();
+			expect( screen.getByText( 'View' ) ).toBeVisible();
 		} );
 
 		it( 'shows "View post" for post links', () => {
@@ -269,7 +269,7 @@ describe( 'Controls', () => {
 
 			render( <Controls { ...propsWithPostLink } /> );
 
-			expect( screen.getByText( 'View post' ) ).toBeVisible();
+			expect( screen.getByText( 'View' ) ).toBeVisible();
 		} );
 
 		it( 'shows "View category" for category links', () => {
@@ -285,7 +285,7 @@ describe( 'Controls', () => {
 
 			render( <Controls { ...propsWithCategoryLink } /> );
 
-			expect( screen.getByText( 'View category' ) ).toBeVisible();
+			expect( screen.getByText( 'View' ) ).toBeVisible();
 		} );
 
 		it( 'shows "View link" for custom type links', () => {
@@ -301,7 +301,7 @@ describe( 'Controls', () => {
 
 			render( <Controls { ...propsWithCustomLink } /> );
 
-			expect( screen.getByText( 'View link' ) ).toBeVisible();
+			expect( screen.getByText( 'View' ) ).toBeVisible();
 		} );
 	} );
 } );

package/src/navigation-link/shared/test/use-handle-link-change.test.js

@@ -423,6 +423,51 @@ describe( 'useHandleLinkChange', () => {
 				} )
 			);
 		} );
+
+		it( 'should update text when editing text and changing a bound entity link to a custom URL in the link editing UI', () => {
+			useEntityBinding.mockReturnValue( {
+				hasUrlBinding: true,
+				createBinding: mockCreateBinding,
+				clearBinding: mockClearBinding,
+			} );
+
+			const attributes = {
+				id: 456,
+				url: 'https://example.com/my-page',
+				label: 'My Page',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			const { result } = renderHook( () =>
+				useHandleLinkChange( {
+					clientId,
+					attributes,
+					setAttributes: mockSetAttributes,
+					allowTextUpdate: true,
+				} )
+			);
+
+			const updatedLink = {
+				url: 'https://external-site.com',
+				title: 'Updated Navigation Text',
+			};
+
+			result.current( updatedLink );
+
+			expect( mockClearBinding ).toHaveBeenCalled();
+			expect( mockUpdateBlockAttributes ).toHaveBeenCalledWith(
+				clientId,
+				expect.objectContaining( {
+					url: 'https://external-site.com',
+					kind: 'custom',
+					type: 'custom',
+					id: undefined,
+					label: 'Updated Navigation Text',
+				} )
+			);
+			expect( updateAttributes ).not.toHaveBeenCalled();
+		} );
 	} );
 
 	describe( 'updating existing links', () => {
@@ -503,6 +548,87 @@ describe( 'useHandleLinkChange', () => {
 			);
 		} );
 
+		it( 'should preserve label when changing the link without editing text in the link editing UI', () => {
+			const attributes = {
+				id: 123,
+				url: 'https://example.com/page',
+				label: 'Custom Label',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			const { result } = renderHook( () =>
+				useHandleLinkChange( {
+					clientId,
+					attributes,
+					setAttributes: mockSetAttributes,
+					allowTextUpdate: true,
+				} )
+			);
+
+			const updatedLink = {
+				id: 456,
+				url: 'https://example.com/new-page',
+				title: 'Custom Label',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			result.current( updatedLink );
+
+			expect( updateAttributes ).toHaveBeenCalledWith(
+				expect.not.objectContaining( {
+					title: 'Custom Label',
+				} ),
+				mockSetAttributes,
+				attributes
+			);
+			expect( mockUpdateBlockAttributes ).not.toHaveBeenCalled();
+		} );
+
+		it( 'should include title when editing text and changing the entity link in the link editing UI', () => {
+			const attributes = {
+				id: 123,
+				url: 'https://example.com/page',
+				label: 'Sample Page',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			const { result } = renderHook( () =>
+				useHandleLinkChange( {
+					clientId,
+					attributes,
+					setAttributes: mockSetAttributes,
+					allowTextUpdate: true,
+				} )
+			);
+
+			const updatedLink = {
+				id: 456,
+				url: 'https://example.com/new-page',
+				title: 'Updated Navigation Text',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			result.current( updatedLink );
+
+			expect( updateAttributes ).toHaveBeenCalledWith(
+				expect.objectContaining( {
+					title: 'Updated Navigation Text',
+				} ),
+				mockSetAttributes,
+				attributes
+			);
+			expect( mockUpdateBlockAttributes ).toHaveBeenCalledWith(
+				clientId,
+				{
+					label: 'Updated Navigation Text',
+				}
+			);
+		} );
+
 		it( 'should include title when creating link without existing label', () => {
 			const attributes = {};
 
@@ -606,6 +732,92 @@ describe( 'useHandleLinkChange', () => {
 			);
 		} );
 
+		it( 'should include title when editing text for the same existing entity link', () => {
+			const attributes = {
+				id: 123,
+				url: 'https://example.com/page',
+				label: 'Sample Page',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			const { result } = renderHook( () =>
+				useHandleLinkChange( {
+					clientId,
+					attributes,
+					setAttributes: mockSetAttributes,
+					allowTextUpdate: true,
+				} )
+			);
+
+			const updatedLink = {
+				id: 123,
+				url: 'https://example.com/page',
+				title: 'Updated Sample Page',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			result.current( updatedLink );
+
+			expect( updateAttributes ).toHaveBeenCalledWith(
+				expect.objectContaining( {
+					title: 'Updated Sample Page',
+				} ),
+				mockSetAttributes,
+				attributes
+			);
+			expect( mockUpdateBlockAttributes ).toHaveBeenCalledWith(
+				clientId,
+				{
+					label: 'Updated Sample Page',
+				}
+			);
+		} );
+
+		it( 'should clear text when the inline link editing UI title is emptied', () => {
+			const attributes = {
+				id: 123,
+				url: 'https://example.com/page',
+				label: 'Sample Page',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			const { result } = renderHook( () =>
+				useHandleLinkChange( {
+					clientId,
+					attributes,
+					setAttributes: mockSetAttributes,
+					allowTextUpdate: true,
+				} )
+			);
+
+			const updatedLink = {
+				id: 123,
+				url: 'https://example.com/page',
+				title: '',
+				kind: 'post-type',
+				type: 'page',
+			};
+
+			result.current( updatedLink );
+
+			expect( updateAttributes ).toHaveBeenCalledWith(
+				expect.objectContaining( {
+					title: '',
+				} ),
+				mockSetAttributes,
+				attributes
+			);
+			expect( mockUpdateBlockAttributes ).toHaveBeenCalledWith(
+				clientId,
+				{
+					label: '',
+				}
+			);
+		} );
+
 		it( 'should update custom link to another custom link', () => {
 			updateAttributes.mockImplementation( ( attrs ) => ( {
 				isEntityLink: false,

package/src/navigation-link/shared/test/use-link-preview.test.js

@@ -92,10 +92,28 @@ describe( 'computeDisplayUrl', () => {
 		it( 'should treat same-origin URLs as internal', () => {
 			const result = computeDisplayUrl( {
 				linkUrl: 'https://example.com/my-page',
-				siteUrl: 'https://example.com',
+				homeUrl: 'https://example.com',
 			} );
 			expect( result.isExternal ).toBe( false );
 		} );
+
+		it( 'should treat same-origin URLs as internal when homeUrl includes a path', () => {
+			const result = computeDisplayUrl( {
+				linkUrl: 'https://example.com/my-page',
+				homeUrl: 'https://example.com/blog',
+			} );
+			expect( result.isExternal ).toBe( false );
+			expect( result.displayUrl ).toBe( '/my-page' );
+		} );
+
+		it( 'should treat http and https to same host as internal (compare by host, not origin)', () => {
+			const result = computeDisplayUrl( {
+				linkUrl: 'http://example.com/my-page',
+				homeUrl: 'https://example.com',
+			} );
+			expect( result.isExternal ).toBe( false );
+			expect( result.displayUrl ).toBe( '/my-page' );
+		} );
 	} );
 
 	describe( 'special protocols and edge cases', () => {

package/src/navigation-link/shared/use-handle-link-change.js

@@ -4,6 +4,8 @@
 import { useCallback } from '@wordpress/element';
 import { useDispatch } from '@wordpress/data';
 import { store as blockEditorStore } from '@wordpress/block-editor';
+import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
+import { escapeHTML } from '@wordpress/escape-html';
 
 /**
  * Internal dependencies
@@ -16,13 +18,19 @@ import { useEntityBinding } from './use-entity-binding';
  * Manages the transition between entity links and custom links,
  * including proper binding creation and cleanup.
  *
- * @param {Object}   options               - Configuration options
- * @param {string}   options.clientId      - Block client ID
- * @param {Object}   options.attributes    - Current block attributes
- * @param {Function} options.setAttributes - Standard setAttribute function
+ * @param {Object}   options                 - Configuration options
+ * @param {string}   options.clientId        - Block client ID
+ * @param {Object}   options.attributes      - Current block attributes
+ * @param {Function} options.setAttributes   - Standard setAttribute function
+ * @param {boolean}  options.allowTextUpdate - Whether this control can update the link text
  * @return {Function} Callback function to handle link changes
  */
-export function useHandleLinkChange( { clientId, attributes, setAttributes } ) {
+export function useHandleLinkChange( {
+	clientId,
+	attributes,
+	setAttributes,
+	allowTextUpdate = false,
+} ) {
 	const { updateBlockAttributes } = useDispatch( blockEditorStore );
 	const { hasUrlBinding, createBinding, clearBinding } = useEntityBinding( {
 		clientId,
@@ -42,12 +50,25 @@ export function useHandleLinkChange( { clientId, attributes, setAttributes } ) {
 				id: updatedLink.id,
 			};
 
-			// Only include title when there's no existing label
-			// This preserves user-customized labels when updating links
-			if ( ! attributes.label || attributes.label === '' ) {
+			const currentText = attributes.label
+				? stripHTML( attributes.label )
+				: '';
+			const updatedText = updatedLink.title ?? '';
+			const hasTextUpdate =
+				allowTextUpdate &&
+				updatedLink.title !== undefined &&
+				updatedText !== currentText;
+			const textUpdateAttributes = hasTextUpdate
+				? { label: escapeHTML( updatedText ) }
+				: {};
+
+			if (
+				! attributes.label ||
+				attributes.label === '' ||
+				hasTextUpdate
+			) {
 				attrs.title = updatedLink.title;
 			}
-
 			// Check if transitioning from entity to custom link
 			const willBeCustomLink = ! updatedLink.id && hasUrlBinding;
 
@@ -62,6 +83,7 @@ export function useHandleLinkChange( { clientId, attributes, setAttributes } ) {
 					kind: 'custom',
 					type: 'custom',
 					id: undefined,
+					...textUpdateAttributes,
 				} );
 			} else {
 				// Normal flow for entity links or unbound custom links
@@ -76,10 +98,15 @@ export function useHandleLinkChange( { clientId, attributes, setAttributes } ) {
 				} else {
 					clearBinding();
 				}
+
+				if ( Object.keys( textUpdateAttributes ).length ) {
+					updateBlockAttributes( clientId, textUpdateAttributes );
+				}
 			}
 		},
 		[
 			attributes,
+			allowTextUpdate,
 			clientId,
 			hasUrlBinding,
 			createBinding,

package/src/navigation-link/shared/use-link-preview.js

@@ -31,10 +31,10 @@ function capitalize( str ) {
  *
  * @param {Object} options         - Parameters object
  * @param {string} options.linkUrl - The URL to process
- * @param {string} options.siteUrl - The WordPress site URL (falls back to window.location.origin)
+ * @param {string} options.homeUrl - The WordPress site URL (required for internal/external detection)
  * @return {Object} Object with displayUrl and isExternal flag
  */
-export function computeDisplayUrl( { linkUrl, siteUrl } = {} ) {
+export function computeDisplayUrl( { linkUrl, homeUrl } = {} ) {
 	if ( ! linkUrl ) {
 		return { displayUrl: '', isExternal: false };
 	}
@@ -51,9 +51,10 @@ export function computeDisplayUrl( { linkUrl, siteUrl } = {} ) {
 	// This must happen before trusting the type attribute
 	try {
 		const parsedUrl = new URL( linkUrl );
-		// Use provided siteUrl or fall back to window.location.origin
-		const siteDomain = siteUrl || window.location.origin;
-		if ( parsedUrl.origin === siteDomain ) {
+		// Compare by host (not origin) so http/https to same site both count as internal
+		const siteHost = new URL( homeUrl ).host;
+
+		if ( parsedUrl.host === siteHost ) {
 			// Show only the pathname (and search/hash if present)
 			let path = parsedUrl.pathname + parsedUrl.search + parsedUrl.hash;
 			// Remove trailing slash
@@ -62,12 +63,11 @@ export function computeDisplayUrl( { linkUrl, siteUrl } = {} ) {
 			}
 			displayUrl = path;
 		} else {
-			// Different origin - this is an external link
+			// Different host - this is an external link
 			isExternal = true;
 		}
 	} catch ( e ) {
-		// URL parsing failed - this means it's likely a URL without a protocol (e.g., "www.example.com")
-		// Since we already checked for relative paths and hash links above, treat as external
+		// URL parsing failed - treat as external (e.g. no homeUrl, or URL without protocol)
 		isExternal = true;
 	}
 
@@ -174,13 +174,12 @@ export function useLinkPreview( {
 	hasBinding,
 	isEntityAvailable,
 } ) {
-	// Get the WordPress site URL from settings
-	const siteUrl = useSelect( ( select ) => {
-		const siteEntity = select( coreDataStore ).getEntityRecord(
+	// Get the WordPress homepage URL from settings
+	const homeUrl = useSelect( ( select ) => {
+		return select( coreDataStore ).getEntityRecord(
 			'root',
-			'site'
-		);
-		return siteEntity?.url;
+			'__unstableBase'
+		)?.home;
 	}, [] );
 
 	const title =
@@ -194,7 +193,7 @@ export function useLinkPreview( {
 	// Compute display URL and external flag
 	const { displayUrl, isExternal } = computeDisplayUrl( {
 		linkUrl: url,
-		siteUrl,
+		homeUrl,
 	} );
 
 	const image = useSelect(

package/src/navigation-overlay-close/style.scss

@@ -3,7 +3,7 @@
 	align-items: center;
 	justify-content: center;
 	gap: 0.5em;
-	padding: 0.5em;
+	padding: 0;
 	border: none;
 	background: transparent;
 	cursor: pointer;
@@ -14,8 +14,8 @@
 	}
 
 	svg {
-		width: 1.5em;
-		height: 1.5em;
+		width: 24px;
+		height: 24px;
 		fill: currentColor;
 		display: block;
 		flex-shrink: 0;

package/src/navigation-submenu/edit.js

@@ -35,8 +35,8 @@ import { ItemSubmenuIcon } from './icons';
 import {
 	Controls,
 	LinkUI,
-	updateAttributes,
 	useEntityBinding,
+	useHandleLinkChange,
 	useIsInvalidLink,
 	InvalidDraftDisplay,
 	useEnableLinkStatusValidation,
@@ -92,15 +92,17 @@ export default function NavigationSubmenuEdit( {
 		blockEditingMode !== 'default' ? true : submenuVisibility === 'click';
 
 	// URL binding logic
-	const {
-		clearBinding,
-		createBinding,
-		hasUrlBinding,
-		isBoundEntityAvailable,
-		entityRecord,
-	} = useEntityBinding( {
+	const { hasUrlBinding, isBoundEntityAvailable, entityRecord } =
+		useEntityBinding( {
+			clientId,
+			attributes,
+		} );
+
+	const handleLinkChange = useHandleLinkChange( {
 		clientId,
 		attributes,
+		setAttributes,
+		allowTextUpdate: true,
 	} );
 
 	const { __unstableMarkNextChangeAsNotPersistent, replaceBlock } =
@@ -398,26 +400,7 @@ export default function NavigationSubmenuEdit( {
 								setAttributes( { url: '' } );
 								speak( __( 'Link removed.' ), 'assertive' );
 							} }
-							onChange={ ( updatedValue ) => {
-								// updateAttributes determines the final state and returns metadata
-								const {
-									isEntityLink,
-									attributes: updatedAttributes,
-								} = updateAttributes(
-									updatedValue,
-									setAttributes,
-									attributes
-								);
-
-								// Handle URL binding based on the final computed state
-								// Only create bindings for entity links (posts, pages, taxonomies)
-								// Never create bindings for custom links (manual URLs)
-								if ( isEntityLink ) {
-									createBinding( updatedAttributes );
-								} else {
-									clearBinding();
-								}
-							} }
+							onChange={ handleLinkChange }
 						/>
 					) }
 				</ParentElement>

package/src/nextpage/block.json

@@ -9,7 +9,6 @@
 	"parent": [ "core/post-content" ],
 	"textdomain": "default",
 	"supports": {
-		"anchor": true,
 		"customClassName": false,
 		"className": false,
 		"html": false,

package/src/page-list-item/edit.js

@@ -8,7 +8,6 @@ import clsx from 'clsx';
 import { useBlockProps, useInnerBlocksProps } from '@wordpress/block-editor';
 import { useSelect } from '@wordpress/data';
 import { store as coreStore } from '@wordpress/core-data';
-import { RawHTML } from '@wordpress/element';
 import { safeHTML } from '@wordpress/dom';
 
 /**
@@ -78,9 +77,10 @@ export default function PageListItemEdit( { context, attributes } ) {
 						type="button"
 						className="wp-block-navigation-item__content wp-block-navigation-submenu__toggle"
 						aria-expanded="false"
-					>
-						<RawHTML>{ safeHTML( label ) }</RawHTML>
-					</button>
+						dangerouslySetInnerHTML={ {
+							__html: safeHTML( label ),
+						} }
+					/>
 					<span className="wp-block-page-list__submenu-icon wp-block-navigation__submenu-icon">
 						<ItemSubmenuIcon />
 					</span>
@@ -91,9 +91,10 @@ export default function PageListItemEdit( { context, attributes } ) {
 						'wp-block-navigation-item__content': isNavigationChild,
 					} ) }
 					href={ link }
-				>
-					<RawHTML>{ safeHTML( title ) }</RawHTML>
-				</a>
+					dangerouslySetInnerHTML={ {
+						__html: safeHTML( title ),
+					} }
+				/>
 			) }
 			{ hasChildren && (
 				<>

package/src/paragraph/edit.js

@@ -21,7 +21,7 @@ import {
 	useBlockEditingMode,
 } from '@wordpress/block-editor';
 import { getBlockSupport } from '@wordpress/blocks';
-import { formatLtr } from '@wordpress/icons';
+import { formatLTR } from '@wordpress/icons';
 /**
  * Internal dependencies
  */
@@ -32,7 +32,7 @@ function ParagraphRTLControl( { direction, setDirection } ) {
 	return (
 		isRTL() && (
 			<ToolbarButton
-				icon={ formatLtr }
+				icon={ formatLTR }
 				title={ _x( 'Left to right', 'editor button' ) }
 				isActive={ direction === 'ltr' }
 				onClick={ () => {

package/src/post-featured-image/index.php

@@ -166,8 +166,10 @@ function get_block_core_post_featured_image_overlay_element_markup( $attributes
 	}
 
 	// Apply overlay and gradient classes.
-	$class_names[] = 'has-background-dim';
-	$class_names[] = "has-background-dim-{$attributes['dimRatio']}";
+	if ( $has_dim_background ) {
+		$class_names[] = 'has-background-dim';
+		$class_names[] = "has-background-dim-{$attributes['dimRatio']}";
+	}
 
 	if ( $has_solid_overlay ) {
 		$class_names[] = "has-{$attributes['overlayColor']}-background-color";

package/src/post-navigation-link/block.json

@@ -7,6 +7,9 @@
 	"description": "Displays the next or previous post link that is adjacent to the current post.",
 	"textdomain": "default",
 	"attributes": {
+		"textAlign": {
+			"type": "string"
+		},
 		"type": {
 			"type": "string",
 			"default": "next"
@@ -43,7 +46,6 @@
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,
-			"textAlign": true,
 			"__experimentalFontFamily": true,
 			"__experimentalFontWeight": true,
 			"__experimentalFontStyle": true,