@wordpress/editor 14.40.2-next.v.202602241322.0 → 14.40.2

package/src/components/post-last-revision/index.js

@@ -5,6 +5,7 @@ import { sprintf, __ } from '@wordpress/i18n';
 import { Button } from '@wordpress/components';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { backup } from '@wordpress/icons';
+import { addQueryArgs } from '@wordpress/url';
 
 /**
  * Internal dependencies
@@ -16,11 +17,16 @@ import { unlock } from '../../lock-unlock';
 
 function usePostLastRevisionInfo() {
 	return useSelect( ( select ) => {
-		const { getCurrentPostLastRevisionId, getCurrentPostRevisionsCount } =
-			select( editorStore );
+		const {
+			getCurrentPostLastRevisionId,
+			getCurrentPostRevisionsCount,
+			getEditorSettings,
+		} = select( editorStore );
 		return {
 			lastRevisionId: getCurrentPostLastRevisionId(),
 			revisionsCount: getCurrentPostRevisionsCount(),
+			disableVisualRevisions:
+				!! getEditorSettings().disableVisualRevisions,
 		};
 	}, [] );
 }
@@ -31,14 +37,23 @@ function usePostLastRevisionInfo() {
  * @return {React.ReactNode} The rendered component.
  */
 function PostLastRevision() {
-	const { lastRevisionId, revisionsCount } = usePostLastRevisionInfo();
+	const { lastRevisionId, revisionsCount, disableVisualRevisions } =
+		usePostLastRevisionInfo();
 	const { setCurrentRevisionId } = unlock( useDispatch( editorStore ) );
 
+	const buttonProps = disableVisualRevisions
+		? {
+				href: addQueryArgs( 'revision.php', {
+					revision: lastRevisionId,
+				} ),
+		  }
+		: { onClick: () => setCurrentRevisionId( lastRevisionId ) };
+
 	return (
 		<PostLastRevisionCheck>
 			<Button
 				__next40pxDefaultSize
-				onClick={ () => setCurrentRevisionId( lastRevisionId ) }
+				{ ...buttonProps }
 				className="editor-post-last-revision__title"
 				icon={ backup }
 				iconPosition="right"
@@ -53,16 +68,30 @@ function PostLastRevision() {
 }
 
 export function PrivatePostLastRevision() {
-	const { lastRevisionId, revisionsCount } = usePostLastRevisionInfo();
+	const { lastRevisionId, revisionsCount, disableVisualRevisions } =
+		usePostLastRevisionInfo();
 	const { setCurrentRevisionId } = unlock( useDispatch( editorStore ) );
 
+	const buttonProps = disableVisualRevisions
+		? {
+				href: addQueryArgs( 'revision.php', {
+					revision: lastRevisionId,
+				} ),
+		  }
+		: { onClick: () => setCurrentRevisionId( lastRevisionId ) };
+
 	return (
 		<PostLastRevisionCheck>
 			<PostPanelRow label={ __( 'Revisions' ) }>
 				<Button
-					onClick={ () => setCurrentRevisionId( lastRevisionId ) }
+					{ ...buttonProps }
 					className="editor-private-post-last-revision__button"
 					text={ revisionsCount }
+					aria-label={ sprintf(
+						/* translators: %s: number of revisions. */
+						__( 'Open revisions screen: %s revisions' ),
+						revisionsCount
+					) }
 					variant="tertiary"
 					size="compact"
 				/>

package/src/components/post-last-revision/style.scss

@@ -32,6 +32,3 @@
 	}
 }
 
-.editor-private-post-last-revision__button {
-	display: inline-block;
-}

package/src/components/post-locked-modal/index.js

@@ -15,12 +15,52 @@ import { useEffect, createInterpolateElement } from '@wordpress/element';
 import { addAction, removeAction } from '@wordpress/hooks';
 import { useInstanceId } from '@wordpress/compose';
 import { store as coreStore } from '@wordpress/core-data';
+import { unlock } from '../../lock-unlock';
+import { DOCUMENT_SIZE_LIMIT_EXCEEDED } from '../../utils/sync-error-messages';
 
 /**
  * Internal dependencies
  */
 import { store as editorStore } from '../../store';
 
+function CollaborationContext() {
+	const { isCollaborationSupported, syncConnectionStatus } = useSelect(
+		( select ) => {
+			const {
+				isCollaborationSupported: isSupported,
+				getSyncConnectionStatus,
+			} = unlock( select( coreStore ) );
+			return {
+				isCollaborationSupported: isSupported(),
+				syncConnectionStatus: getSyncConnectionStatus(),
+			};
+		},
+		[]
+	);
+
+	if ( isCollaborationSupported ) {
+		return null;
+	}
+
+	if ( DOCUMENT_SIZE_LIMIT_EXCEEDED === syncConnectionStatus?.error?.code ) {
+		return (
+			<p>
+				{ __(
+					'Because this post is too large for real-time collaboration, only one person can edit at a time.'
+				) }
+			</p>
+		);
+	}
+
+	return (
+		<p>
+			{ __(
+				'Because this post uses plugins that aren’t compatible with real-time collaboration, only one person can edit at a time.'
+			) }
+		</p>
+	);
+}
+
 function PostLockedModal() {
 	const instanceId = useInstanceId( PostLockedModal );
 	const hookName = 'core/editor/post-locked-modal-' + instanceId;
@@ -37,7 +77,6 @@ function PostLockedModal() {
 		previewLink,
 	} = useSelect( ( select ) => {
 		const {
-			isCollaborationEnabledForCurrentPost,
 			isPostLocked,
 			isPostLockTakeover,
 			getPostLockUser,
@@ -46,7 +85,8 @@ function PostLockedModal() {
 			getEditedPostAttribute,
 			getEditedPostPreviewLink,
 			getEditorSettings,
-		} = select( editorStore );
+			isCollaborationEnabledForCurrentPost,
+		} = unlock( select( editorStore ) );
 		const { getPostType } = select( coreStore );
 		return {
 			isCollaborationEnabled: isCollaborationEnabledForCurrentPost(),
@@ -197,29 +237,32 @@ function PostLockedModal() {
 				) }
 				<div>
 					{ !! isTakeover && (
-						<p>
-							{ createInterpolateElement(
-								userDisplayName
-									? sprintf(
-											/* translators: %s: user's display name */
-											__(
-												'<strong>%s</strong> now has editing control of this post (<PreviewLink />). Don’t worry, your changes up to this moment have been saved.'
-											),
-											userDisplayName
-									  )
-									: __(
-											'Another user now has editing control of this post (<PreviewLink />). Don’t worry, your changes up to this moment have been saved.'
-									  ),
-								{
-									strong: <strong />,
-									PreviewLink: (
-										<ExternalLink href={ previewLink }>
-											{ __( 'preview' ) }
-										</ExternalLink>
-									),
-								}
-							) }
-						</p>
+						<>
+							<p>
+								{ createInterpolateElement(
+									userDisplayName
+										? sprintf(
+												/* translators: %s: user's display name */
+												__(
+													'<strong>%s</strong> now has editing control of this post (<PreviewLink />). Don’t worry, your changes up to this moment have been saved.'
+												),
+												userDisplayName
+										  )
+										: __(
+												'Another user now has editing control of this post (<PreviewLink />). Don’t worry, your changes up to this moment have been saved.'
+										  ),
+									{
+										strong: <strong />,
+										PreviewLink: (
+											<ExternalLink href={ previewLink }>
+												{ __( 'preview' ) }
+											</ExternalLink>
+										),
+									}
+								) }
+							</p>
+							<CollaborationContext />
+						</>
 					) }
 					{ ! isTakeover && (
 						<>
@@ -246,6 +289,7 @@ function PostLockedModal() {
 									}
 								) }
 							</p>
+							<CollaborationContext />
 							<p>
 								{ __(
 									'If you take over, the other user will lose editing control to the post, but their changes will be saved.'

package/src/components/post-panel-row/style.scss

@@ -16,6 +16,7 @@
 	padding: 6px 0; // Matches button to ensure alignment
 	line-height: $grid-unit-05 * 5;
 	hyphens: auto;
+	word-break: break-word;
 }
 
 .editor-post-panel__row-control {

package/src/components/post-revisions-preview/block-diff.js

@@ -29,8 +29,35 @@ import { unlock } from '../../lock-unlock';
 const { parseRawBlock } = unlock( blocksPrivateApis );
 
 /**
- * Calculate text similarity using word diff (semantically meaningful).
- * Returns ratio of unchanged words to total words.
+ * Safely stringifies a value for display and comparison.
+ *
+ * @param {*} value The value to stringify.
+ * @return {string} The stringified value.
+ */
+function stringifyValue( value ) {
+	if ( value === null || value === undefined ) {
+		return '';
+	}
+	if ( typeof value === 'object' ) {
+		return JSON.stringify( value, null, 2 );
+	}
+	return String( value );
+}
+
+/**
+ * Calculate text similarity using word-set overlap.
+ *
+ * Uses a variant of the Jaccard index (https://en.wikipedia.org/wiki/Jaccard_index)
+ * called the overlap coefficient (https://en.wikipedia.org/wiki/Overlap_coefficient)
+ * where we divide by the larger set size rather than the union. This ensures that
+ * a small edit to a long paragraph scores high — the few changed words don't
+ * dilute the score.
+ *
+ * This replaces the previous diffWords-based similarity which was O(n*m) per pair.
+ * The word-set approach is O(n) where n is the number of words.
+ *
+ * Words are extracted using Intl.Segmenter for proper multilingual support
+ * (CJK, Thai, etc.) rather than splitting on whitespace.
  *
  * @param {string} text1 First text to compare.
  * @param {string} text2 Second text to compare.
@@ -44,17 +71,53 @@ function textSimilarity( text1, text2 ) {
 		return 0;
 	}
 
-	const changes = diffWords( text1, text2 );
-	const unchanged = changes
-		.filter( ( c ) => ! c.added && ! c.removed )
-		.reduce( ( sum, c ) => sum + c.value.length, 0 );
-	const total = Math.max( text1.length, text2.length );
-	return total > 0 ? unchanged / total : 0;
+	const segmenter = new Intl.Segmenter( undefined, {
+		granularity: 'word',
+	} );
+	// Safari's Intl.Segmenter returns isWordLike: false for numeric segments,
+	// so fall back to a Unicode-aware regex for letters and numbers.
+	const wordLikeRegex = /[\p{L}\p{N}]/u;
+	const getWords = ( text ) => {
+		const words = [];
+		for ( const { segment, isWordLike } of segmenter.segment( text ) ) {
+			if ( isWordLike || wordLikeRegex.test( segment ) ) {
+				words.push( segment );
+			}
+		}
+		return words;
+	};
+	const words1 = getWords( text1 );
+	const words2 = getWords( text2 );
+
+	if ( words1.length === 0 && words2.length === 0 ) {
+		return 1;
+	}
+
+	const set1 = new Set( words1 );
+	let intersection = 0;
+	for ( const word of words2 ) {
+		if ( set1.has( word ) ) {
+			intersection++;
+		}
+	}
+
+	const total = Math.max( words1.length, words2.length );
+	return total > 0 ? intersection / total : 0;
 }
 
 /**
  * Post-process diff result to pair similar removed/added blocks as modifications.
- * This catches modifications that LCS missed due to content changes.
+ *
+ * After LCS diffing, a block whose content changed appears as a separate "removed"
+ * and "added" entry (since the full block signature differs). This function detects
+ * such pairs and merges them into a single "modified" block with inline diff.
+ *
+ * Two pairing strategies are used:
+ * 1. When exactly one block of a given type was removed and one was added,
+ *    they are paired directly — no ambiguity, no similarity check needed.
+ * 2. When multiple candidates exist, textSimilarity (overlap coefficient) is
+ *    used to find the best match. Blocks must share at least 50% of their
+ *    words to be paired, preventing unrelated paragraphs from being merged.
  *
  * @param {Array} blocks Raw blocks with diff status.
  * @return {Array} Blocks with similar pairs converted to modifications.
@@ -65,7 +128,7 @@ function pairSimilarBlocks( blocks ) {
 
 	// Separate blocks by status, tracking original indices.
 	blocks.forEach( ( block, index ) => {
-		const status = block.__revisionDiffStatus;
+		const status = block.__revisionDiffStatus?.status;
 		if ( status === 'removed' ) {
 			removed.push( { block, index } );
 		} else if ( status === 'added' ) {
@@ -78,62 +141,139 @@ function pairSimilarBlocks( blocks ) {
 		return blocks;
 	}
 
-	const pairedRemoved = new Set(); // Indices of removed blocks that were paired.
-	const modifications = new Map(); // Map from added block index to modified block.
-	const SIMILARITY_THRESHOLD = 0.3;
+	const pairedRemoved = new Set(); // Indices of removed blocks filtered out.
+	const pairedAdded = new Set(); // Indices of added blocks filtered out.
+	const modifications = new Map(); // Index → modified block.
+	const SIMILARITY_THRESHOLD = 0.5;
+
+	// Group candidates by block name for efficient lookup.
+	const addedByName = new Map();
+	for ( const add of added ) {
+		const name = add.block.blockName;
+		if ( ! addedByName.has( name ) ) {
+			addedByName.set( name, [] );
+		}
+		addedByName.get( name ).push( add );
+	}
+	const removedByName = new Map();
+	for ( const rem of removed ) {
+		const name = rem.block.blockName;
+		if ( ! removedByName.has( name ) ) {
+			removedByName.set( name, [] );
+		}
+		removedByName.get( name ).push( rem );
+	}
 
 	// For each removed block, find best matching added block.
+	// Track the highest added index paired so far — new pairings must
+	// not go backwards, or the removed/added text order would break.
+	let maxPairedAddedIndex = -1;
+
 	for ( const rem of removed ) {
-		let bestMatch = null;
-		let bestScore = 0;
+		const candidates = addedByName.get( rem.block.blockName ) || [];
+		const sameNameRemoved = removedByName.get( rem.block.blockName ) || [];
+		const unpaired = candidates.filter(
+			( add ) =>
+				! modifications.has( add.index ) &&
+				add.index > maxPairedAddedIndex
+		);
 
-		for ( const add of added ) {
-			if ( modifications.has( add.index ) ) {
-				continue;
-			}
-			if ( add.block.blockName !== rem.block.blockName ) {
-				continue;
-			}
+		if ( unpaired.length === 0 ) {
+			continue;
+		}
 
-			const score = textSimilarity(
-				rem.block.innerHTML || '',
-				add.block.innerHTML || ''
-			);
-			// If content is identical (score=1), only pair if attrs differ.
-			// Otherwise identical blocks are just position swaps, not modifications.
+		let bestMatch = null;
+
+		// If there's exactly one removed and one added of this type,
+		// pair them directly — no ambiguity, no similarity check needed.
+		if ( sameNameRemoved.length === 1 && unpaired.length === 1 ) {
+			const add = unpaired[ 0 ];
 			const attrsMatch =
 				JSON.stringify( rem.block.attrs ) ===
 				JSON.stringify( add.block.attrs );
-			if (
-				score > bestScore &&
-				score > SIMILARITY_THRESHOLD &&
-				( score < 1 || ! attrsMatch )
-			) {
-				bestScore = score;
+			// Only skip pairing if both content and attrs are identical
+			// (position swap, not a modification).
+			const contentMatch =
+				( rem.block.innerHTML || '' ) === ( add.block.innerHTML || '' );
+			if ( ! contentMatch || ! attrsMatch ) {
 				bestMatch = add;
 			}
+		} else {
+			// Multiple candidates — use similarity to find best match.
+			let bestScore = 0;
+			for ( const add of unpaired ) {
+				const score = textSimilarity(
+					rem.block.innerHTML || '',
+					add.block.innerHTML || ''
+				);
+				// Skip identical blocks (score=1 with same attrs) — those
+				// are position swaps, not modifications. They should show
+				// as separate removed + added, not as a no-op "modified".
+				const attrsMatch =
+					JSON.stringify( rem.block.attrs ) ===
+					JSON.stringify( add.block.attrs );
+				if (
+					score > bestScore &&
+					score > SIMILARITY_THRESHOLD &&
+					( score < 1 || ! attrsMatch )
+				) {
+					bestScore = score;
+					bestMatch = add;
+				}
+			}
 		}
 
 		if ( bestMatch ) {
-			pairedRemoved.add( rem.index );
+			maxPairedAddedIndex = bestMatch.index;
 
-			// Create modified block with previous content stored.
-			modifications.set( bestMatch.index, {
+			const modifiedBlock = {
 				...bestMatch.block,
-				__revisionDiffStatus: 'modified',
+				__revisionDiffStatus: { status: 'modified' },
 				__previousRawBlock: rem.block,
-			} );
+			};
+
+			// Decide where to place the modified block by checking
+			// what's between the removed and added positions.
+			// If there are unpaired added blocks between them,
+			// placing at the removed position would put the modified
+			// block before content that comes before it in the
+			// current revision — so use the added position.
+			// Otherwise, use the removed position to keep the
+			// previous revision's order intact.
+			const lo = Math.min( rem.index, bestMatch.index );
+			const hi = Math.max( rem.index, bestMatch.index );
+			let hasAddedBetween = false;
+			for ( let i = lo + 1; i < hi; i++ ) {
+				if (
+					blocks[ i ].__revisionDiffStatus?.status === 'added' &&
+					! pairedAdded.has( i )
+				) {
+					hasAddedBetween = true;
+					break;
+				}
+			}
+
+			if ( hasAddedBetween ) {
+				// Use the added position — don't jump before
+				// current-revision content.
+				modifications.set( bestMatch.index, modifiedBlock );
+				pairedRemoved.add( rem.index );
+			} else {
+				// Use the removed position — keep the previous
+				// revision's reading order.
+				modifications.set( rem.index, modifiedBlock );
+				pairedAdded.add( bestMatch.index );
+			}
 		}
 	}
 
-	// Rebuild result: filter out paired removed, replace paired added with modified.
+	// Rebuild result: replace modification targets, filter out
+	// their paired counterparts.
 	return blocks
 		.map( ( block, index ) => {
-			// Skip paired removed blocks.
-			if ( pairedRemoved.has( index ) ) {
+			if ( pairedRemoved.has( index ) || pairedAdded.has( index ) ) {
 				return null;
 			}
-			// Replace paired added blocks with modified version.
 			if ( modifications.has( index ) ) {
 				return modifications.get( index );
 			}
@@ -176,14 +316,14 @@ function diffRawBlocks( currentRaw, previousRaw ) {
 			for ( let i = 0; i < part.count; i++ ) {
 				result.push( {
 					...currentRaw[ currIdx++ ],
-					__revisionDiffStatus: 'added',
+					__revisionDiffStatus: { status: 'added' },
 				} );
 			}
 		} else if ( part.removed ) {
 			for ( let i = 0; i < part.count; i++ ) {
 				result.push( {
 					...previousRaw[ prevIdx++ ],
-					__revisionDiffStatus: 'removed',
+					__revisionDiffStatus: { status: 'removed' },
 				} );
 			}
 		} else {
@@ -481,26 +621,28 @@ function applyRichTextDiff( currentRichText, previousRichText ) {
 }
 
 /**
- * Apply rich text diff to all rich-text attributes of a block.
- * Compares each rich-text attribute between current and previous parsed blocks.
+ * Apply diffs to a modified block's attributes.
+ * - Rich-text attributes: applies inline diff formatting (ins/del marks).
+ * - Other attributes: computes word-level diffs for the sidebar panel.
  *
  * @param {Object} currentBlock  Current parsed block.
  * @param {Object} previousBlock Previous parsed block.
+ * @param {Object} diffStatus    The __revisionDiffStatus object to attach changedAttributes to.
  */
-function applyRichTextDiffToBlock( currentBlock, previousBlock ) {
+function applyDiffToBlock( currentBlock, previousBlock, diffStatus ) {
 	const blockType = getBlockType( currentBlock.name );
 	if ( ! blockType ) {
 		return;
 	}
 
-	// Find rich-text attributes and compare
+	const changedAttributes = {};
+
 	for ( const [ attrName, attrDef ] of Object.entries(
 		blockType.attributes
 	) ) {
 		if ( attrDef.source === 'rich-text' ) {
 			const currentRichText = currentBlock.attributes[ attrName ];
 			const previousRichText = previousBlock.attributes[ attrName ];
-
 			if (
 				currentRichText instanceof RichTextData &&
 				previousRichText instanceof RichTextData
@@ -510,8 +652,22 @@ function applyRichTextDiffToBlock( currentBlock, previousBlock ) {
 					previousRichText
 				);
 			}
+		} else {
+			const currStr = stringifyValue(
+				currentBlock.attributes[ attrName ]
+			);
+			const prevStr = stringifyValue(
+				previousBlock.attributes[ attrName ]
+			);
+			if ( currStr !== prevStr ) {
+				changedAttributes[ attrName ] = diffWords( prevStr, currStr );
+			}
 		}
 	}
+
+	if ( Object.keys( changedAttributes ).length > 0 ) {
+		diffStatus.changedAttributes = changedAttributes;
+	}
 }
 
 /**
@@ -525,18 +681,25 @@ function applyRichTextDiffToBlock( currentBlock, previousBlock ) {
 function applyDiffRecursively( parsedBlock, rawBlock ) {
 	// Copy diff status from raw block to parsed block.
 	if ( rawBlock.__revisionDiffStatus ) {
-		parsedBlock.__revisionDiffStatus = rawBlock.__revisionDiffStatus;
-	}
-
-	// Apply rich text diff if this block is modified and has a previous raw block.
-	if (
-		rawBlock.__revisionDiffStatus === 'modified' &&
-		rawBlock.__previousRawBlock
-	) {
-		const previousParsed = parseRawBlock( rawBlock.__previousRawBlock );
-		if ( previousParsed ) {
-			applyRichTextDiffToBlock( parsedBlock, previousParsed );
+		// Apply diffs if this block is modified and has a previous raw block.
+		if (
+			rawBlock.__revisionDiffStatus.status === 'modified' &&
+			rawBlock.__previousRawBlock
+		) {
+			const previousParsed = parseRawBlock( rawBlock.__previousRawBlock );
+			if ( previousParsed ) {
+				applyDiffToBlock(
+					parsedBlock,
+					previousParsed,
+					rawBlock.__revisionDiffStatus
+				);
+			}
 		}
+
+		parsedBlock.__revisionDiffStatus = rawBlock.__revisionDiffStatus;
+		// Also store in attributes so it survives block-editor store normalization.
+		parsedBlock.attributes.__revisionDiffStatus =
+			rawBlock.__revisionDiffStatus;
 	}
 
 	// Recursively process inner blocks.

package/src/components/post-revisions-preview/diff-markers.js

@@ -15,6 +15,7 @@ import {
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
+import { Tooltip } from '@wordpress/components';
 
 /**
  * Internal dependencies
@@ -32,10 +33,10 @@ const { useBlockElementRef } = unlock( blockEditorPrivateApis );
 function collectDiffBlocks( blocks ) {
 	const result = [];
 	for ( const block of blocks ) {
-		if ( block.__revisionDiffStatus ) {
+		if ( block.__revisionDiffStatus?.status ) {
 			result.push( {
 				clientId: block.clientId,
-				status: block.__revisionDiffStatus,
+				status: block.__revisionDiffStatus.status,
 			} );
 		}
 		if ( block.innerBlocks?.length ) {
@@ -97,15 +98,17 @@ function DiffMarkerButton( { clientId, status, subscribe } ) {
 	}
 
 	return (
-		<button
-			className={ `revision-diff-marker is-${ status }` }
-			style={ {
-				top: `${ position.top }%`,
-				height: `${ Math.max( position.height, 0.5 ) }%`,
-			} }
-			onClick={ () => blockRef.current?.focus() }
-			aria-label={ STATUS_LABELS[ status ] }
-		/>
+		<Tooltip text={ STATUS_LABELS[ status ] }>
+			<button
+				className={ `revision-diff-marker is-${ status }` }
+				style={ {
+					top: `${ position.top }%`,
+					height: `${ Math.max( position.height, 0.5 ) }%`,
+				} }
+				onClick={ () => blockRef.current?.focus() }
+				aria-label={ STATUS_LABELS[ status ] }
+			/>
+		</Tooltip>
 	);
 }
 
@@ -145,7 +148,7 @@ export function useDiffMarkers() {
 			key="diff-markers"
 			className="revision-diff-markers"
 			role="navigation"
-			aria-label={ __( 'Diff markers' ) }
+			aria-label={ __( 'Document changes' ) }
 		>
 			{ isMounted &&
 				diffBlocks.map( ( { clientId, status } ) => (