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

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/editor",
-	"version": "14.40.1",
+	"version": "14.40.2-next.v.202602241322.0+bce7cff88",
 	"description": "Enhanced block editor for WordPress posts.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -61,48 +61,48 @@
 	],
 	"dependencies": {
 		"@floating-ui/react-dom": "2.0.8",
-		"@wordpress/a11y": "^4.40.0",
-		"@wordpress/api-fetch": "^7.40.0",
-		"@wordpress/base-styles": "^6.16.0",
-		"@wordpress/blob": "^4.40.0",
-		"@wordpress/block-editor": "^15.13.1",
-		"@wordpress/block-serialization-default-parser": "^5.40.0",
-		"@wordpress/blocks": "^15.13.0",
-		"@wordpress/commands": "^1.40.0",
-		"@wordpress/components": "^32.2.0",
-		"@wordpress/compose": "^7.40.0",
-		"@wordpress/core-data": "^7.40.1",
-		"@wordpress/data": "^10.40.0",
-		"@wordpress/dataviews": "^12.0.0",
-		"@wordpress/date": "^5.40.0",
-		"@wordpress/deprecated": "^4.40.0",
-		"@wordpress/dom": "^4.40.0",
-		"@wordpress/element": "^6.40.0",
-		"@wordpress/fields": "^0.32.1",
-		"@wordpress/global-styles-engine": "^1.7.0",
-		"@wordpress/global-styles-ui": "^1.7.1",
-		"@wordpress/hooks": "^4.40.0",
-		"@wordpress/html-entities": "^4.40.0",
-		"@wordpress/i18n": "^6.13.0",
-		"@wordpress/icons": "^11.7.0",
-		"@wordpress/interface": "^9.25.0",
-		"@wordpress/keyboard-shortcuts": "^5.40.0",
-		"@wordpress/keycodes": "^4.40.0",
-		"@wordpress/media-editor": "^0.3.0",
-		"@wordpress/media-fields": "^0.5.1",
-		"@wordpress/media-utils": "^5.40.1",
-		"@wordpress/notices": "^5.40.0",
-		"@wordpress/patterns": "^2.40.1",
-		"@wordpress/plugins": "^7.40.0",
-		"@wordpress/preferences": "^4.40.0",
-		"@wordpress/private-apis": "^1.40.0",
-		"@wordpress/reusable-blocks": "^5.40.1",
-		"@wordpress/rich-text": "^7.40.0",
-		"@wordpress/server-side-render": "^6.16.0",
-		"@wordpress/upload-media": "^0.25.1",
-		"@wordpress/url": "^4.40.0",
-		"@wordpress/warning": "^3.40.0",
-		"@wordpress/wordcount": "^4.40.0",
+		"@wordpress/a11y": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/api-fetch": "^7.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/base-styles": "^6.16.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/blob": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/block-editor": "^15.13.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/block-serialization-default-parser": "^5.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/blocks": "^15.13.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/commands": "^1.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/components": "^32.3.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/compose": "^7.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/core-data": "^7.40.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/data": "^10.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/dataviews": "^12.1.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/date": "^5.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/deprecated": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/dom": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/element": "^6.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/fields": "^0.32.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/global-styles-engine": "^1.7.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/global-styles-ui": "^1.7.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/hooks": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/html-entities": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/i18n": "^6.13.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/icons": "^11.7.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/interface": "^9.25.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/keyboard-shortcuts": "^5.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/keycodes": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/media-editor": "^0.3.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/media-fields": "^0.5.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/media-utils": "^5.40.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/notices": "^5.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/patterns": "^2.40.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/plugins": "^7.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/preferences": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/private-apis": "^1.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/reusable-blocks": "^5.40.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/rich-text": "^7.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/server-side-render": "^6.16.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/upload-media": "^0.25.2-next.v.202602241322.0+bce7cff88",
+		"@wordpress/url": "^4.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/warning": "^3.40.1-next.v.202602241322.0+bce7cff88",
+		"@wordpress/wordcount": "^4.40.1-next.v.202602241322.0+bce7cff88",
 		"change-case": "^4.1.2",
 		"client-zip": "^2.4.5",
 		"clsx": "^2.1.1",
@@ -124,5 +124,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "398c509dbbdcdb525d17e968edd83da33a0a7bde"
+	"gitHead": "943dde7f0b600ce238726c36284bc9f70ce0ffa4"
 }

package/src/components/collaborators-overlay/use-block-highlighting.ts

@@ -4,7 +4,6 @@
 import {
 	privateApis as coreDataPrivateApis,
 	SelectionType,
-	type SelectionWholeBlock,
 } from '@wordpress/core-data';
 import { useEffect, useRef } from '@wordpress/element';
 
@@ -14,7 +13,8 @@ import { useEffect, useRef } from '@wordpress/element';
 import { unlock } from '../../lock-unlock';
 import { getAvatarBorderColor } from '../collab-sidebar/utils';
 
-const { useActiveCollaborators } = unlock( coreDataPrivateApis );
+const { useActiveCollaborators, useResolvedSelection } =
+	unlock( coreDataPrivateApis );
 
 /**
  * Custom hook for highlighting selected blocks in the editor
@@ -32,6 +32,10 @@ export function useBlockHighlighting(
 		postId ?? null,
 		postType ?? null
 	);
+	const resolveSelection = useResolvedSelection(
+		postId ?? null,
+		postType ?? null
+	);
 
 	// Draw block highlights
 	useEffect( () => {
@@ -66,11 +70,16 @@ export function useBlockHighlighting(
 				const shouldDrawUser = ! userState.isMe;
 
 				if ( isWholeBlockSelected && shouldDrawUser ) {
-					const selection = userState.editorState
-						?.selection as unknown as SelectionWholeBlock;
+					const { localClientId } = resolveSelection(
+						userState.editorState?.selection
+					);
+
+					if ( ! localClientId ) {
+						return null;
+					}
 
 					return {
-						blockId: selection.blockId,
+						blockId: localClientId,
 						color: getAvatarBorderColor(
 							userState.collaboratorInfo.id
 						),
@@ -112,7 +121,7 @@ export function useBlockHighlighting(
 				highlightedBlockIds.current.add( blockId );
 			}
 		} );
-	}, [ userStates, blockEditorDocument ] );
+	}, [ userStates, blockEditorDocument, resolveSelection ] );
 }
 
 const getBlockElementById = (

package/src/components/collaborators-overlay/use-render-cursors.ts

@@ -1,6 +1,5 @@
 import {
 	privateApis as coreDataPrivateApis,
-	type SelectionCursor,
 	SelectionType,
 } from '@wordpress/core-data';
 import { useEffect, useMemo, useState } from '@wordpress/element';
@@ -9,7 +8,7 @@ import { unlock } from '../../lock-unlock';
 import { getAvatarUrl } from './get-avatar-url';
 import { getAvatarBorderColor } from '../collab-sidebar/utils';
 
-const { useActiveCollaborators, useGetAbsolutePositionIndex } =
+const { useActiveCollaborators, useResolvedSelection } =
 	unlock( coreDataPrivateApis );
 
 export interface CursorData {
@@ -41,7 +40,7 @@ export function useRenderCursors(
 		postId ?? null,
 		postType ?? null
 	);
-	const getAbsolutePositionIndex = useGetAbsolutePositionIndex(
+	const resolveSelection = useResolvedSelection(
 		postId ?? null,
 		postType ?? null
 	);
@@ -85,40 +84,32 @@ export function useRenderCursors(
 				} else if ( selection.type === SelectionType.WholeBlock ) {
 					// Don't draw a cursor for a whole block selection.
 				} else if ( selection.type === SelectionType.Cursor ) {
-					coords = getCursorPosition(
-						getAbsolutePositionIndex( selection ),
-						selection.blockId,
-						blockEditorDocument,
-						overlayElement
-					);
-				} else if (
-					selection.type === SelectionType.SelectionInOneBlock
-				) {
-					const selectionAsCursor: SelectionCursor = {
-						type: SelectionType.Cursor,
-						blockId: selection.blockId,
-						cursorPosition: selection.cursorStartPosition,
-					};
-					coords = getCursorPosition(
-						getAbsolutePositionIndex( selectionAsCursor ),
-						selectionAsCursor.blockId,
-						blockEditorDocument,
-						overlayElement
-					);
+					const { textIndex, localClientId } =
+						resolveSelection( selection );
+					if ( localClientId ) {
+						coords = getCursorPosition(
+							textIndex,
+							localClientId,
+							blockEditorDocument,
+							overlayElement
+						);
+					}
 				} else if (
+					selection.type === SelectionType.SelectionInOneBlock ||
 					selection.type === SelectionType.SelectionInMultipleBlocks
 				) {
-					const selectionAsCursor: SelectionCursor = {
+					const { textIndex, localClientId } = resolveSelection( {
 						type: SelectionType.Cursor,
-						blockId: selection.blockStartId,
 						cursorPosition: selection.cursorStartPosition,
-					};
-					coords = getCursorPosition(
-						getAbsolutePositionIndex( selectionAsCursor ),
-						selectionAsCursor.blockId,
-						blockEditorDocument,
-						overlayElement
-					);
+					} );
+					if ( localClientId ) {
+						coords = getCursorPosition(
+							textIndex,
+							localClientId,
+							blockEditorDocument,
+							overlayElement
+						);
+					}
 				}
 
 				if ( coords ) {
@@ -134,12 +125,7 @@ export function useRenderCursors(
 
 			setCursorPositions( results );
 		},
-		[
-			blockEditorDocument,
-			getAbsolutePositionIndex,
-			overlayElement,
-			sortedUsers,
-		]
+		[ blockEditorDocument, resolveSelection, overlayElement, sortedUsers ]
 	);
 
 	useEffect( computeCursors, [ computeCursors ] );

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

@@ -152,10 +152,8 @@ function PostLockedModal() {
 	}
 
 	// Avoid sending the modal if sync is supported, but retain functionality around locks etc.
-	if ( globalThis.IS_GUTENBERG_PLUGIN ) {
-		if ( isCollaborationEnabled ) {
-			return null;
-		}
+	if ( isCollaborationEnabled ) {
+		return null;
 	}
 
 	const userDisplayName = user.name;

package/src/components/preferences-modal/index.js

@@ -298,7 +298,7 @@ function PreferencesModalContents( { extraSections = {} } ) {
 						</>
 					),
 				},
-				window.__experimentalMediaProcessing && {
+				window.__clientSideMediaProcessing && {
 					name: 'media',
 					tabLabel: __( 'Media' ),
 					content: (

package/src/components/provider/use-upload-save-lock.js

@@ -16,19 +16,20 @@ const LOCK_NAME = 'upload-in-progress';
  * A hook that locks post saving and autosaving while media uploads are in progress.
  * This prevents users from publishing or saving while files are still uploading.
  *
- * Only active when the experimental media processing feature is enabled.
+ * Only active when client-side media processing is enabled.
  */
 export default function useUploadSaveLock() {
-	const isExperimentEnabled = window.__experimentalMediaProcessing;
+	const isClientSideMediaProcessingEnabled =
+		window.__clientSideMediaProcessing;
 
 	const isUploading = useSelect(
 		( select ) => {
-			if ( ! isExperimentEnabled ) {
+			if ( ! isClientSideMediaProcessingEnabled ) {
 				return false;
 			}
 			return select( uploadStore ).isUploading();
 		},
-		[ isExperimentEnabled ]
+		[ isClientSideMediaProcessingEnabled ]
 	);
 
 	const {
@@ -39,7 +40,7 @@ export default function useUploadSaveLock() {
 	} = useDispatch( editorStore );
 
 	useEffect( () => {
-		if ( ! isExperimentEnabled ) {
+		if ( ! isClientSideMediaProcessingEnabled ) {
 			return;
 		}
 
@@ -56,7 +57,7 @@ export default function useUploadSaveLock() {
 			unlockPostAutosaving( LOCK_NAME );
 		};
 	}, [
-		isExperimentEnabled,
+		isClientSideMediaProcessingEnabled,
 		isUploading,
 		lockPostSaving,
 		unlockPostSaving,

package/src/components/visual-editor/index.js

@@ -334,6 +334,8 @@ function VisualEditor( {
 		// Disable resizing in zoomed-out mode.
 		! isZoomedOut;
 
+	const isNavigationPreview = postType === NAVIGATION_POST_TYPE && isPreview;
+
 	// Calculate the minimum height including scroll offset to fit all notes.
 	const calculatedMinHeight = useMemo( () => {
 		if ( ! localRef.current ) {
@@ -352,6 +354,8 @@ function VisualEditor( {
 		! isPreview && renderingMode === 'post-only' && ! isDesignPostType
 	);
 
+	const centerContentCSS = `display:flex;align-items:center;justify-content:center;`;
+
 	const iframeStyles = useMemo( () => {
 		return [
 			...( styles ?? [] ),
@@ -366,19 +370,32 @@ function VisualEditor( {
 				}}.is-root-container{display:flow-root;${
 					// Some themes will have `min-height: 100vh` for the root container,
 					// which isn't a requirement in auto resize mode.
-					enableResizing ? 'min-height:0!important;' : ''
+					enableResizing || isNavigationPreview
+						? 'min-height:0!important;'
+						: ''
 				}}
 				${ paddingStyle ? paddingStyle : '' }
 				${
 					enableResizing
-						? `.block-editor-iframe__html{background:var(--wp-editor-canvas-background);display:flex;align-items:center;justify-content:center;min-height:100vh;}.block-editor-iframe__body{width:100%;}`
+						? `.block-editor-iframe__html{background:var(--wp-editor-canvas-background);min-height:100vh;${ centerContentCSS }}.block-editor-iframe__body{width:100%;}`
+						: ''
+				}${
+					isNavigationPreview
+						? `.block-editor-iframe__body{${ centerContentCSS }}`
 						: ''
 				}`,
-				// The CSS above centers the body content vertically when resizing is enabled and applies a background
+				// The CSS for enableResizing centers the body content vertically when resizing is enabled and applies a background
 				// color to the iframe HTML element to match the background color of the editor canvas.
+				// The CSS for isNavigationPreview centers the body content vertically and horizontally when the navigation is in preview mode.
 			},
 		];
-	}, [ styles, enableResizing, calculatedMinHeight, paddingStyle ] );
+	}, [
+		styles,
+		enableResizing,
+		isNavigationPreview,
+		calculatedMinHeight,
+		paddingStyle,
+	] );
 
 	const typewriterRef = useTypewriter();
 	contentRef = useMergeRefs( [

package/src/utils/media-upload/index.js

@@ -62,6 +62,9 @@ export default function mediaUpload( {
 			? currentPost.id
 			: currentPost?.wp_id;
 	const setSaveLock = () => {
+		if ( window.__clientSideMediaProcessing ) {
+			return; // Skip - handled by useUploadSaveLock in editor provider
+		}
 		lockPostSaving( lockKey );
 		lockPostAutosaving( lockKey );
 		imageIsUploading = true;
@@ -69,6 +72,9 @@ export default function mediaUpload( {
 
 	const postData = currentPostId ? { post: currentPostId } : {};
 	const clearSaveLock = () => {
+		if ( window.__clientSideMediaProcessing ) {
+			return; // Skip - handled by useUploadSaveLock in editor provider
+		}
 		unlockPostSaving( lockKey );
 		unlockPostAutosaving( lockKey );
 		imageIsUploading = false;
@@ -80,7 +86,7 @@ export default function mediaUpload( {
 		onFileChange: ( file ) => {
 			// When client-side media processing is enabled, save locking
 			// is handled by useUploadSaveLock in the editor provider.
-			if ( ! window.__experimentalMediaProcessing ) {
+			if ( ! window.__clientSideMediaProcessing ) {
 				if ( ! imageIsUploading ) {
 					setSaveLock();
 				} else {
@@ -111,7 +117,7 @@ export default function mediaUpload( {
 		},
 		maxUploadFileSize,
 		onError: ( { message } ) => {
-			if ( ! window.__experimentalMediaProcessing ) {
+			if ( ! window.__clientSideMediaProcessing ) {
 				clearSaveLock();
 			}
 			onError( message );