@wordpress/edit-site 5.11.0 → 5.12.1

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "5.11.0",
+	"version": "5.12.1",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -27,48 +27,55 @@
 	"react-native": "src/index",
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.34.0",
-		"@wordpress/api-fetch": "^6.31.0",
-		"@wordpress/block-editor": "^12.2.0",
-		"@wordpress/block-library": "^8.11.0",
-		"@wordpress/blocks": "^12.11.0",
-		"@wordpress/commands": "^0.5.0",
-		"@wordpress/components": "^25.0.0",
-		"@wordpress/compose": "^6.11.0",
-		"@wordpress/core-commands": "^0.3.0",
-		"@wordpress/core-data": "^6.11.0",
-		"@wordpress/data": "^9.4.0",
-		"@wordpress/date": "^4.34.0",
-		"@wordpress/deprecated": "^3.34.0",
-		"@wordpress/dom": "^3.34.0",
-		"@wordpress/editor": "^13.11.0",
-		"@wordpress/element": "^5.11.0",
-		"@wordpress/hooks": "^3.34.0",
-		"@wordpress/html-entities": "^3.34.0",
-		"@wordpress/i18n": "^4.34.0",
-		"@wordpress/icons": "^9.25.0",
-		"@wordpress/interface": "^5.11.0",
-		"@wordpress/keyboard-shortcuts": "^4.11.0",
-		"@wordpress/keycodes": "^3.34.0",
-		"@wordpress/media-utils": "^4.25.0",
-		"@wordpress/notices": "^4.2.0",
-		"@wordpress/plugins": "^6.2.0",
-		"@wordpress/preferences": "^3.11.0",
-		"@wordpress/private-apis": "^0.16.0",
-		"@wordpress/reusable-blocks": "^4.11.0",
-		"@wordpress/router": "^0.3.0",
-		"@wordpress/style-engine": "^1.17.0",
-		"@wordpress/url": "^3.35.0",
-		"@wordpress/viewport": "^5.11.0",
-		"@wordpress/widgets": "^3.11.0",
+		"@wordpress/a11y": "^3.35.1",
+		"@wordpress/api-fetch": "^6.32.1",
+		"@wordpress/block-editor": "^12.3.1",
+		"@wordpress/block-library": "^8.12.1",
+		"@wordpress/blocks": "^12.12.1",
+		"@wordpress/commands": "^0.6.1",
+		"@wordpress/components": "^25.1.1",
+		"@wordpress/compose": "^6.12.1",
+		"@wordpress/core-commands": "^0.4.1",
+		"@wordpress/core-data": "^6.12.1",
+		"@wordpress/data": "^9.5.1",
+		"@wordpress/date": "^4.35.1",
+		"@wordpress/deprecated": "^3.35.1",
+		"@wordpress/dom": "^3.35.1",
+		"@wordpress/editor": "^13.12.1",
+		"@wordpress/element": "^5.12.1",
+		"@wordpress/escape-html": "^2.35.1",
+		"@wordpress/hooks": "^3.35.1",
+		"@wordpress/html-entities": "^3.35.1",
+		"@wordpress/i18n": "^4.35.1",
+		"@wordpress/icons": "^9.26.1",
+		"@wordpress/interface": "^5.12.1",
+		"@wordpress/keyboard-shortcuts": "^4.12.1",
+		"@wordpress/keycodes": "^3.35.1",
+		"@wordpress/media-utils": "^4.26.1",
+		"@wordpress/notices": "^4.3.1",
+		"@wordpress/plugins": "^6.3.1",
+		"@wordpress/preferences": "^3.12.1",
+		"@wordpress/primitives": "^3.33.1",
+		"@wordpress/private-apis": "^0.17.1",
+		"@wordpress/reusable-blocks": "^4.12.1",
+		"@wordpress/router": "^0.4.1",
+		"@wordpress/style-engine": "^1.18.1",
+		"@wordpress/url": "^3.36.1",
+		"@wordpress/viewport": "^5.12.1",
+		"@wordpress/widgets": "^3.12.1",
+		"@wordpress/wordcount": "^3.35.1",
+		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.9.2",
+		"deepmerge": "^4.3.0",
 		"downloadjs": "^1.4.7",
 		"fast-deep-equal": "^3.1.3",
+		"is-plain-object": "^5.0.0",
 		"lodash": "^4.17.21",
 		"memize": "^2.1.0",
 		"react-autosize-textarea": "^7.1.0",
-		"rememo": "^4.0.2"
+		"rememo": "^4.0.2",
+		"remove-accents": "^0.4.2"
 	},
 	"peerDependencies": {
 		"react": "^18.0.0",
@@ -77,5 +84,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "c7c79cb11b677adcbf06cf5f8cfb6c5ec1699f19"
+	"gitHead": "ce5639111c30763dbdf07f40eeb136ea6030ecf1"
 }

package/src/components/add-new-page/index.js

@@ -0,0 +1,105 @@
+/**
+ * External dependencies
+ */
+import { kebabCase } from 'lodash';
+
+/**
+ * WordPress dependencies
+ */
+import {
+	Button,
+	Modal,
+	__experimentalHStack as HStack,
+	__experimentalVStack as VStack,
+	TextControl,
+} from '@wordpress/components';
+import { __, sprintf } from '@wordpress/i18n';
+import { useDispatch } from '@wordpress/data';
+import { useState } from '@wordpress/element';
+import { store as coreStore } from '@wordpress/core-data';
+import { store as noticesStore } from '@wordpress/notices';
+
+export default function AddNewPageModal( { onSave, onClose } ) {
+	const [ isCreatingPage, setIsCreatingPage ] = useState( false );
+	const [ title, setTitle ] = useState( '' );
+
+	const { saveEntityRecord } = useDispatch( coreStore );
+	const { createErrorNotice, createSuccessNotice } =
+		useDispatch( noticesStore );
+
+	async function createPage( event ) {
+		event.preventDefault();
+
+		if ( isCreatingPage ) {
+			return;
+		}
+		setIsCreatingPage( true );
+		try {
+			const newPage = await saveEntityRecord(
+				'postType',
+				'page',
+				{
+					status: 'draft',
+					title,
+					slug: kebabCase( title || __( 'No title' ) ),
+				},
+				{ throwOnError: true }
+			);
+
+			onSave( newPage );
+
+			createSuccessNotice(
+				sprintf(
+					// translators: %s: Title of the created template e.g: "Category".
+					__( '"%s" successfully created.' ),
+					newPage.title?.rendered || title
+				),
+				{
+					type: 'snackbar',
+				}
+			);
+		} catch ( error ) {
+			const errorMessage =
+				error.message && error.code !== 'unknown_error'
+					? error.message
+					: __( 'An error occurred while creating the page.' );
+
+			createErrorNotice( errorMessage, {
+				type: 'snackbar',
+			} );
+		} finally {
+			setIsCreatingPage( false );
+		}
+	}
+
+	return (
+		<Modal title={ __( 'Draft a new page' ) } onRequestClose={ onClose }>
+			<form onSubmit={ createPage }>
+				<VStack spacing={ 3 }>
+					<TextControl
+						/* eslint-disable jsx-a11y/no-autofocus */
+						autoFocus
+						/* eslint-enable jsx-a11y/no-autofocus */
+						label={ __( 'Page title' ) }
+						onChange={ setTitle }
+						placeholder={ __( 'No title' ) }
+						value={ title }
+					/>
+					<HStack spacing={ 2 } justify="end">
+						<Button variant="tertiary" onClick={ onClose }>
+							{ __( 'Cancel' ) }
+						</Button>
+						<Button
+							variant="primary"
+							type="submit"
+							isBusy={ isCreatingPage }
+							aria-disabled={ isCreatingPage }
+						>
+							{ __( 'Create draft' ) }
+						</Button>
+					</HStack>
+				</VStack>
+			</form>
+		</Modal>
+	);
+}

package/src/components/add-new-pattern/index.js

@@ -0,0 +1,94 @@
+/**
+ * WordPress dependencies
+ */
+import { DropdownMenu } from '@wordpress/components';
+import { useState } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+import { plus, header, file } from '@wordpress/icons';
+import { privateApis as routerPrivateApis } from '@wordpress/router';
+
+/**
+ * Internal dependencies
+ */
+import CreatePatternModal from '../create-pattern-modal';
+import CreateTemplatePartModal from '../create-template-part-modal';
+import { unlock } from '../../lock-unlock';
+import SidebarButton from '../sidebar-button';
+
+const { useHistory } = unlock( routerPrivateApis );
+
+export default function AddNewPattern() {
+	const history = useHistory();
+	const [ showPatternModal, setShowPatternModal ] = useState( false );
+	const [ showTemplatePartModal, setShowTemplatePartModal ] =
+		useState( false );
+
+	function handleCreatePattern( { pattern, categoryId } ) {
+		setShowPatternModal( false );
+
+		history.push( {
+			postId: pattern.id,
+			postType: 'wp_block',
+			categoryType: 'wp_block',
+			categoryId,
+			canvas: 'edit',
+		} );
+	}
+
+	function handleCreateTemplatePart( templatePart ) {
+		setShowTemplatePartModal( false );
+
+		// Navigate to the created template part editor.
+		history.push( {
+			postId: templatePart.id,
+			postType: 'wp_template_part',
+			canvas: 'edit',
+		} );
+	}
+
+	function handleError() {
+		setShowPatternModal( false );
+		setShowTemplatePartModal( false );
+	}
+
+	return (
+		<>
+			<DropdownMenu
+				controls={ [
+					{
+						icon: header,
+						onClick: () => setShowTemplatePartModal( true ),
+						title: 'Create a template part',
+					},
+					{
+						icon: file,
+						onClick: () => setShowPatternModal( true ),
+						title: 'Create a pattern',
+					},
+				] }
+				icon={
+					<SidebarButton
+						icon={ plus }
+						label={ __( 'Create a pattern' ) }
+					/>
+				}
+				label="Create a pattern."
+			/>
+			{ showPatternModal && (
+				<CreatePatternModal
+					closeModal={ () => setShowPatternModal( false ) }
+					onCreate={ handleCreatePattern }
+					onError={ handleError }
+				/>
+			) }
+			{ showTemplatePartModal && (
+				<CreateTemplatePartModal
+					closeModal={ () => setShowTemplatePartModal( false ) }
+					blocks={ [] }
+					onCreate={ handleCreateTemplatePart }
+					onError={ handleError }
+				/>
+			) }
+		</>
+	);
+}

package/src/components/add-new-template/add-custom-template-modal-content.js

@@ -15,13 +15,13 @@ import {
 	__unstableUseCompositeState as useCompositeState,
 	__unstableCompositeItem as CompositeItem,
 } from '@wordpress/components';
-import { useDebounce } from '@wordpress/compose';
 import { useEntityRecords } from '@wordpress/core-data';
 import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
  */
+import useDebouncedInput from '../../utils/use-debounced-input';
 import { mapToIHasNameAndId } from './utils';
 
 const EMPTY_ARRAY = [];
@@ -73,18 +73,6 @@ function SuggestionListItem( {
 	);
 }
 
-function useDebouncedInput() {
-	const [ input, setInput ] = useState( '' );
-	const [ debounced, setter ] = useState( '' );
-	const setDebounced = useDebounce( setter, 250 );
-	useEffect( () => {
-		if ( debounced !== input ) {
-			setDebounced( input );
-		}
-	}, [ debounced, input ] );
-	return [ input, setInput, debounced ];
-}
-
 function useSearchSuggestions( entityForSuggestions, search ) {
 	const { config } = entityForSuggestions;
 	const query = useMemo(

package/src/components/add-new-template/index.js

@@ -8,7 +8,6 @@ import { store as coreStore } from '@wordpress/core-data';
  * Internal dependencies
  */
 import NewTemplate from './new-template';
-import NewTemplatePart from './new-template-part';
 
 export default function AddNewTemplate( {
 	templateType = 'wp_template',
@@ -25,8 +24,6 @@ export default function AddNewTemplate( {
 
 	if ( templateType === 'wp_template' ) {
 		return <NewTemplate { ...props } postType={ postType } />;
-	} else if ( templateType === 'wp_template_part' ) {
-		return <NewTemplatePart { ...props } postType={ postType } />;
 	}
 
 	return null;

package/src/components/add-new-template/new-template.js

@@ -13,6 +13,7 @@ import {
 	__experimentalText as Text,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
+import { decodeEntities } from '@wordpress/html-entities';
 import { useState } from '@wordpress/element';
 import { useDispatch } from '@wordpress/data';
 import { store as coreStore } from '@wordpress/core-data';
@@ -36,7 +37,7 @@ import {
 import AddCustomGenericTemplateModalContent from './add-custom-generic-template-modal-content';
 import TemplateActionsLoadingScreen from './template-actions-loading-screen';
 import { store as editSiteStore } from '../../store';
-import { unlock } from '../../private-apis';
+import { unlock } from '../../lock-unlock';
 
 const { useHistory } = unlock( routerPrivateApis );
 
@@ -51,7 +52,6 @@ const DEFAULT_TEMPLATE_SLUGS = [
 	'category',
 	'date',
 	'tag',
-	'taxonomy',
 	'search',
 	'404',
 ];
@@ -140,7 +140,7 @@ export default function NewTemplate( {
 				sprintf(
 					// translators: %s: Title of the created template e.g: "Category".
 					__( '"%s" successfully created.' ),
-					newTemplate.title?.rendered || title
+					decodeEntities( newTemplate.title?.rendered || title )
 				),
 				{
 					type: 'snackbar',

package/src/components/app/index.js

@@ -15,7 +15,7 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
  */
 import Layout from '../layout';
 import { GlobalStylesProvider } from '../global-styles/global-styles-provider';
-import { unlock } from '../../private-apis';
+import { unlock } from '../../lock-unlock';
 
 const { RouterProvider } = unlock( routerPrivateApis );
 

package/src/components/block-editor/back-button.js

@@ -9,7 +9,7 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
 /**
  * Internal dependencies
  */
-import { unlock } from '../../private-apis';
+import { unlock } from '../../lock-unlock';
 
 const { useLocation, useHistory } = unlock( routerPrivateApis );
 
@@ -17,9 +17,12 @@ function BackButton() {
 	const location = useLocation();
 	const history = useHistory();
 	const isTemplatePart = location.params.postType === 'wp_template_part';
+	const isNavigationMenu = location.params.postType === 'wp_navigation';
 	const previousTemplateId = location.state?.fromTemplateId;
 
-	if ( ! isTemplatePart || ! previousTemplateId ) {
+	const isFocusMode = isTemplatePart || isNavigationMenu;
+
+	if ( ! isFocusMode || ! previousTemplateId ) {
 		return null;
 	}
 

package/src/components/block-editor/constants.js

@@ -0,0 +1 @@
+export const FOCUSABLE_ENTITIES = [ 'wp_template_part', 'wp_navigation' ];

package/src/components/block-editor/editor-canvas.js

@@ -21,7 +21,7 @@ import { __ } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
-import { unlock } from '../../private-apis';
+import { unlock } from '../../lock-unlock';
 import { store as editSiteStore } from '../../store';
 
 function EditorCanvas( { enableResizing, settings, children, ...props } ) {

package/src/components/block-editor/get-block-editor-provider.js

@@ -0,0 +1,29 @@
+/**
+ * Internal dependencies
+ */
+import DefaultBlockEditor from './providers/default-block-editor-provider';
+import NavigationBlockEditor from './providers/navigation-block-editor-provider';
+
+/**
+ * Factory to isolate choosing the appropriate block editor
+ * component to handle a given entity type.
+ *
+ * @param {string} entityType the entity type being edited
+ * @return {JSX.Element} the block editor component to use.
+ */
+export default function getBlockEditorProvider( entityType ) {
+	let Provider = null;
+
+	switch ( entityType ) {
+		case 'wp_navigation':
+			Provider = NavigationBlockEditor;
+			break;
+		case 'wp_template':
+		case 'wp_template_part':
+		default:
+			Provider = DefaultBlockEditor;
+			break;
+	}
+
+	return Provider;
+}