@wordpress/editor 14.16.0 → 14.17.1

package/src/components/post-featured-image/style.scss

@@ -78,12 +78,14 @@
 
 .editor-post-featured-image__actions {
 	&:not(.editor-post-featured-image__actions-missing-image) {
-		@include reduce-motion("transition");
 		bottom: 0;
 		opacity: 0; // Use opacity instead of visibility so that the buttons remain in the tab order.
 		padding: $grid-unit-10;
 		position: absolute;
-		transition: opacity 50ms ease-out;
+
+		@media not (prefers-reduced-motion) {
+			transition: opacity 50ms ease-out;
+		}
 
 		.editor-post-featured-image__action {
 			backdrop-filter: blur(16px) saturate(180%);

package/src/components/post-pending-status/check.js

@@ -13,10 +13,10 @@ import { store as editorStore } from '../../store';
  * If the post is already published or the user doesn't have the
  * capability to publish, it returns null.
  *
- * @param {Object}             props          Component properties.
- * @param {React.ReactElement} props.children Children to be rendered.
+ * @param {Object}          props          Component properties.
+ * @param {React.ReactNode} props.children Children to be rendered.
  *
- * @return {React.ReactElement} The rendered child elements or null if the post is already published or the user doesn't have the capability to publish.
+ * @return {React.ReactNode} The rendered child elements or null if the post is already published or the user doesn't have the capability to publish.
  */
 export function PostPendingStatusCheck( { children } ) {
 	const { hasPublishAction, isPublished } = useSelect( ( select ) => {

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

@@ -210,9 +210,11 @@
 		left: auto;
 		width: $sidebar-width + $border-width;
 		border-left: $border-width solid $gray-300;
-		transform: translateX(+100%);
-		animation: editor-post-publish-panel__slide-in-animation 0.1s forwards;
-		@include reduce-motion("animation");
+
+		@media not (prefers-reduced-motion) {
+			transform: translateX(+100%);
+			animation: editor-post-publish-panel__slide-in-animation 0.1s forwards;
+		}
 
 		body.is-fullscreen-mode & {
 			top: 0;

package/src/components/post-schedule/check.js

@@ -11,10 +11,10 @@ import { store as editorStore } from '../../store';
 /**
  * Wrapper component that renders its children only if post has a publish action.
  *
- * @param {Object}             props          Props.
- * @param {React.ReactElement} props.children Children to be rendered.
+ * @param {Object}          props          Props.
+ * @param {React.ReactNode} props.children Children to be rendered.
  *
- * @return {React.ReactElement} - The component to be rendered or null if there is no publish action.
+ * @return {React.ReactNode} - The component to be rendered or null if there is no publish action.
  */
 export default function PostScheduleCheck( { children } ) {
 	const hasPublishAction = useSelect( ( select ) => {

package/src/components/post-sticky/check.js

@@ -11,10 +11,10 @@ import { store as editorStore } from '../../store';
 /**
  * Wrapper component that renders its children only if post has a sticky action.
  *
- * @param {Object}             props          Props.
- * @param {React.ReactElement} props.children Children to be rendered.
+ * @param {Object}          props          Props.
+ * @param {React.ReactNode} props.children Children to be rendered.
  *
- * @return {React.ReactElement} The component to be rendered or null if post type is not 'post' or hasStickyAction is false.
+ * @return {React.ReactNode} The component to be rendered or null if post type is not 'post' or hasStickyAction is false.
  */
 export default function PostStickyCheck( { children } ) {
 	const { hasStickyAction, postType } = useSelect( ( select ) => {

package/src/components/post-taxonomies/check.js

@@ -15,7 +15,7 @@ import { store as editorStore } from '../../store';
  * @param {Object}          props          The component props.
  * @param {React.ReactNode} props.children The children components to render.
  *
- * @return {React.ReactElement} The rendered children components or null if the current post type has no taxonomies.
+ * @return {React.ReactNode} The rendered children components or null if the current post type has no taxonomies.
  */
 export default function PostTaxonomiesCheck( { children } ) {
 	const hasTaxonomies = useSelect( ( select ) => {

package/src/components/post-text-editor/style.scss

@@ -10,8 +10,10 @@ textarea.editor-post-text-editor {
 	font-family: $editor-html-font;
 	line-height: 2.4;
 	min-height: 200px;
-	transition: border 0.1s ease-out, box-shadow 0.1s linear;
-	@include reduce-motion("transition");
+
+	@media not (prefers-reduced-motion) {
+		transition: border 0.1s ease-out, box-shadow 0.1s linear;
+	}
 
 	// Same padding as title.
 	padding: $grid-unit-20;

package/src/components/post-trash/check.js

@@ -13,10 +13,10 @@ import { GLOBAL_POST_TYPES } from '../../store/constants';
 /**
  * Wrapper component that renders its children only if the post can be trashed.
  *
- * @param {Object}             props          The component props.
- * @param {React.ReactElement} props.children The child components.
+ * @param {Object}          props          The component props.
+ * @param {React.ReactNode} props.children The child components.
  *
- * @return {React.ReactElement | null} The rendered child components or null if the post can't be trashed.
+ * @return {React.ReactNode} The rendered child components or null if the post can't be trashed.
  */
 export default function PostTrashCheck( { children } ) {
 	const { canTrashPost } = useSelect( ( select ) => {

package/src/components/post-type-support-check/index.js

@@ -13,13 +13,13 @@ import { store as editorStore } from '../../store';
  * A component which renders its own children only if the current editor post
  * type supports one of the given `supportKeys` prop.
  *
- * @param {Object}             props             Props.
- * @param {React.ReactElement} props.children    Children to be rendered if post
- *                                               type supports.
- * @param {(string|string[])}  props.supportKeys String or string array of keys
- *                                               to test.
+ * @param {Object}            props             Props.
+ * @param {React.ReactNode}   props.children    Children to be rendered if post
+ *                                              type supports.
+ * @param {(string|string[])} props.supportKeys String or string array of keys
+ *                                              to test.
  *
- * @return {React.ReactElement} The component to be rendered.
+ * @return {React.ReactNode} The component to be rendered.
  */
 function PostTypeSupportCheck( { children, supportKeys } ) {
 	const postType = useSelect( ( select ) => {

package/src/components/post-url/check.js

@@ -12,10 +12,10 @@ import { store as editorStore } from '../../store';
 /**
  * Check if the post URL is valid and visible.
  *
- * @param {Object}             props          The component props.
- * @param {React.ReactElement} props.children The child components.
+ * @param {Object}          props          The component props.
+ * @param {React.ReactNode} props.children The child components.
  *
- * @return {React.ReactElement} The child components if the post URL is valid and visible, otherwise null.
+ * @return {React.ReactNode} The child components if the post URL is valid and visible, otherwise null.
  */
 export default function PostURLCheck( { children } ) {
 	const isVisible = useSelect( ( select ) => {

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

@@ -250,7 +250,7 @@ function PreferencesModalContents( { extraSections = {} } ) {
 									scope="core"
 									featureName="keepCaretInsideBlock"
 									help={ __(
-										'Keeps the text cursor within the block boundaries, aiding users with screen readers by preventing unintentional cursor movement outside the block.'
+										'Keeps the text cursor within blocks while navigating with arrow keys, preventing it from moving to other blocks and enhancing accessibility for keyboard users.'
 									) }
 									label={ __(
 										'Contain text cursor inside block'

package/src/components/provider/index.js

@@ -198,8 +198,8 @@ export const ExperimentalEditorProvider = withRegistryProvider(
 
 				const _defaultMode = Array.isArray( postTypeSupports?.editor )
 					? postTypeSupports.editor.find(
-							( features ) => 'default_mode' in features
-					  )?.default_mode
+							( features ) => 'default-mode' in features
+					  )?.[ 'default-mode' ]
 					: undefined;
 				const hasDefaultMode = RENDERING_MODES.includes( _defaultMode );
 

package/src/components/start-page-options/index.js

@@ -12,13 +12,8 @@ import { store as interfaceStore } from '@wordpress/interface';
 import { store as editorStore } from '../../store';
 
 export default function StartPageOptions() {
-	const { postId, shouldEnable } = useSelect( ( select ) => {
-		const {
-			isEditedPostDirty,
-			isEditedPostEmpty,
-			getCurrentPostId,
-			getCurrentPostType,
-		} = select( editorStore );
+	const { postId, enabled } = useSelect( ( select ) => {
+		const { getCurrentPostId, getCurrentPostType } = select( editorStore );
 		const preferencesModalActive =
 			select( interfaceStore ).isModalActive( 'editor/preferences' );
 		const choosePatternModalEnabled = select( preferencesStore ).get(
@@ -27,24 +22,37 @@ export default function StartPageOptions() {
 		);
 		return {
 			postId: getCurrentPostId(),
-			shouldEnable:
+			enabled:
 				choosePatternModalEnabled &&
 				! preferencesModalActive &&
-				! isEditedPostDirty() &&
-				isEditedPostEmpty() &&
 				'page' === getCurrentPostType(),
 		};
 	}, [] );
+	const { isEditedPostDirty, isEditedPostEmpty } = useSelect( editorStore );
 	const { setIsInserterOpened } = useDispatch( editorStore );
 
 	useEffect( () => {
-		if ( shouldEnable ) {
+		if ( ! enabled ) {
+			return;
+		}
+
+		const isFreshPage = ! isEditedPostDirty() && isEditedPostEmpty();
+		if ( isFreshPage ) {
 			setIsInserterOpened( {
 				tab: 'patterns',
 				category: 'core/starter-content',
 			} );
 		}
-	}, [ postId, shouldEnable, setIsInserterOpened ] );
+
+		// Note: The `postId` ensures the effect re-runs when pages are switched without remounting the component.
+		// Examples: changing pages in the List View, creating a new page via Command Palette.
+	}, [
+		postId,
+		enabled,
+		setIsInserterOpened,
+		isEditedPostDirty,
+		isEditedPostEmpty,
+	] );
 
 	return null;
 }

package/src/components/theme-support-check/index.js

@@ -12,11 +12,11 @@ import { store as editorStore } from '../../store';
 /**
  * Checks if the current theme supports specific features and renders the children if supported.
  *
- * @param {Object}             props             The component props.
- * @param {React.ReactElement} props.children    The children to render if the theme supports the specified features.
- * @param {string|string[]}    props.supportKeys The key(s) of the theme support(s) to check.
+ * @param {Object}          props             The component props.
+ * @param {React.ReactNode} props.children    The children to render if the theme supports the specified features.
+ * @param {string|string[]} props.supportKeys The key(s) of the theme support(s) to check.
  *
- * @return {React.ReactElement} The rendered children if the theme supports the specified features, otherwise null.
+ * @return {React.ReactNode} The rendered children if the theme supports the specified features, otherwise null.
  */
 export default function ThemeSupportCheck( { children, supportKeys } ) {
 	const { postType, themeSupports } = useSelect( ( select ) => {

package/src/private-apis.js

@@ -23,7 +23,11 @@ import {
 	mergeBaseAndUserConfigs,
 	GlobalStylesProvider,
 } from './components/global-styles-provider';
-import { CreateTemplatePartModal } from '@wordpress/fields';
+import {
+	CreateTemplatePartModal,
+	patternTitleField,
+	templateTitleField,
+} from '@wordpress/fields';
 import { registerCoreBlockBindingsSources } from './bindings/api';
 import { getTemplateInfo } from './utils/get-template-info';
 
@@ -32,6 +36,8 @@ const { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;
 export const privateApis = {};
 lock( privateApis, {
 	CreateTemplatePartModal,
+	patternTitleField,
+	templateTitleField,
 	BackButton,
 	EntitiesSavedStatesExtensible,
 	Editor,

package/src/store/selectors.js

@@ -1220,10 +1220,10 @@ export const isEditorPanelOpened = createRegistrySelector(
 /**
  * Returns the current selection start.
  *
+ * @deprecated since Gutenberg 10.0.0.
+ *
  * @param {Object} state
  * @return {WPBlockSelection} The selection start.
- *
- * @deprecated since Gutenberg 10.0.0.
  */
 export function getEditorSelectionStart( state ) {
 	deprecated( "select('core/editor').getEditorSelectionStart", {
@@ -1236,10 +1236,10 @@ export function getEditorSelectionStart( state ) {
 /**
  * Returns the current selection end.
  *
+ * @deprecated since Gutenberg 10.0.0.
+ *
  * @param {Object} state
  * @return {WPBlockSelection} The selection end.
- *
- * @deprecated since Gutenberg 10.0.0.
  */
 export function getEditorSelectionEnd( state ) {
 	deprecated( "select('core/editor').getEditorSelectionStart", {