@wordpress/edit-site 6.18.0 → 6.19.0

package/build-style/style-rtl.css

@@ -448,7 +448,6 @@
   color: rgba(30, 30, 30, 0.62);
 }
 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
-  opacity: 1;
   color: rgba(30, 30, 30, 0.62);
 }
 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:-ms-input-placeholder {
@@ -1000,6 +999,7 @@ div.dataviews-view-list {
 .dataviews-view-table td.dataviews-view-table__checkbox-column,
 .dataviews-view-table th.dataviews-view-table__checkbox-column {
   padding-left: 0;
+  width: 1%;
 }
 .dataviews-view-table tr {
   border-top: 1px solid #f0f0f0;
@@ -1012,9 +1012,7 @@ div.dataviews-view-list {
   padding-right: 48px;
 }
 .dataviews-view-table tr td:first-child .dataviews-view-table-header-button,
-.dataviews-view-table tr td:first-child .dataviews-view-table-header,
-.dataviews-view-table tr th:first-child .dataviews-view-table-header-button,
-.dataviews-view-table tr th:first-child .dataviews-view-table-header {
+.dataviews-view-table tr th:first-child .dataviews-view-table-header-button {
   margin-right: -8px;
 }
 .dataviews-view-table tr td:last-child,
@@ -2547,6 +2545,9 @@ fieldset.fields-controls__featured-image .fields-controls__featured-image-remove
 .edit-site-layout__mobile .edit-site-sidebar__screen-wrapper {
   padding: 0;
 }
+.edit-site-layout__mobile .edit-site-sidebar-navigation-screen__main {
+  padding: 0 12px;
+}
 
 .edit-site-layout__canvas-container {
   position: relative;
@@ -2725,10 +2726,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   }
 }
 
-.edit-site-layout__area__404 {
-  margin: 16px;
-}
-
 .edit-site .components-editor-notices__snackbar {
   position: fixed;
   left: 0;
@@ -2773,7 +2770,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   contain: content;
 }
 
-@keyframes _gbjfm_slide-from-right {
+@keyframes _xk1qy_slide-from-right {
   from {
     transform: translateX(-50px);
     opacity: 0;
@@ -2783,7 +2780,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
     opacity: 1;
   }
 }
-@keyframes _gbjfm_slide-from-left {
+@keyframes _xk1qy_slide-from-left {
   from {
     transform: translateX(50px);
     opacity: 0;
@@ -2839,10 +2836,10 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   }
 }
 .edit-site-sidebar__screen-wrapper.slide-from-left {
-  animation-name: _gbjfm_slide-from-left;
+  animation-name: _xk1qy_slide-from-left;
 }
 .edit-site-sidebar__screen-wrapper.slide-from-right {
-  animation-name: _gbjfm_slide-from-right;
+  animation-name: _xk1qy_slide-from-right;
 }
 
 .edit-site-sidebar-button {

package/build-style/style.css

@@ -448,7 +448,6 @@
   color: rgba(30, 30, 30, 0.62);
 }
 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
-  opacity: 1;
   color: rgba(30, 30, 30, 0.62);
 }
 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:-ms-input-placeholder {
@@ -1000,6 +999,7 @@ div.dataviews-view-list {
 .dataviews-view-table td.dataviews-view-table__checkbox-column,
 .dataviews-view-table th.dataviews-view-table__checkbox-column {
   padding-right: 0;
+  width: 1%;
 }
 .dataviews-view-table tr {
   border-top: 1px solid #f0f0f0;
@@ -1012,9 +1012,7 @@ div.dataviews-view-list {
   padding-left: 48px;
 }
 .dataviews-view-table tr td:first-child .dataviews-view-table-header-button,
-.dataviews-view-table tr td:first-child .dataviews-view-table-header,
-.dataviews-view-table tr th:first-child .dataviews-view-table-header-button,
-.dataviews-view-table tr th:first-child .dataviews-view-table-header {
+.dataviews-view-table tr th:first-child .dataviews-view-table-header-button {
   margin-left: -8px;
 }
 .dataviews-view-table tr td:last-child,
@@ -2548,6 +2546,9 @@ fieldset.fields-controls__featured-image .fields-controls__featured-image-remove
 .edit-site-layout__mobile .edit-site-sidebar__screen-wrapper {
   padding: 0;
 }
+.edit-site-layout__mobile .edit-site-sidebar-navigation-screen__main {
+  padding: 0 12px;
+}
 
 .edit-site-layout__canvas-container {
   position: relative;
@@ -2726,10 +2727,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   }
 }
 
-.edit-site-layout__area__404 {
-  margin: 16px;
-}
-
 .edit-site .components-editor-notices__snackbar {
   position: fixed;
   right: 0;
@@ -2774,7 +2771,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   contain: content;
 }
 
-@keyframes _gbjfm_slide-from-right {
+@keyframes _xk1qy_slide-from-right {
   from {
     transform: translateX(50px);
     opacity: 0;
@@ -2784,7 +2781,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
     opacity: 1;
   }
 }
-@keyframes _gbjfm_slide-from-left {
+@keyframes _xk1qy_slide-from-left {
   from {
     transform: translateX(-50px);
     opacity: 0;
@@ -2840,10 +2837,10 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
   }
 }
 .edit-site-sidebar__screen-wrapper.slide-from-left {
-  animation-name: _gbjfm_slide-from-left;
+  animation-name: _xk1qy_slide-from-left;
 }
 .edit-site-sidebar__screen-wrapper.slide-from-right {
-  animation-name: _gbjfm_slide-from-right;
+  animation-name: _xk1qy_slide-from-right;
 }
 
 .edit-site-sidebar-button {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "6.18.0",
+	"version": "6.19.0",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -30,46 +30,46 @@
 	"dependencies": {
 		"@babel/runtime": "7.25.7",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^4.18.0",
-		"@wordpress/api-fetch": "^7.18.0",
-		"@wordpress/blob": "^4.18.0",
-		"@wordpress/block-editor": "^14.13.0",
-		"@wordpress/block-library": "^9.18.0",
-		"@wordpress/blocks": "^14.7.0",
-		"@wordpress/commands": "^1.18.0",
-		"@wordpress/components": "^29.4.0",
-		"@wordpress/compose": "^7.18.0",
-		"@wordpress/core-commands": "^1.18.0",
-		"@wordpress/core-data": "^7.18.0",
-		"@wordpress/data": "^10.18.0",
-		"@wordpress/dataviews": "^4.14.0",
-		"@wordpress/date": "^5.18.0",
-		"@wordpress/deprecated": "^4.18.0",
-		"@wordpress/dom": "^4.18.0",
-		"@wordpress/editor": "^14.18.0",
-		"@wordpress/element": "^6.18.0",
-		"@wordpress/escape-html": "^3.18.0",
-		"@wordpress/fields": "^0.10.0",
-		"@wordpress/hooks": "^4.18.0",
-		"@wordpress/html-entities": "^4.18.0",
-		"@wordpress/i18n": "^5.18.0",
-		"@wordpress/icons": "^10.18.0",
-		"@wordpress/keyboard-shortcuts": "^5.18.0",
-		"@wordpress/keycodes": "^4.18.0",
-		"@wordpress/media-utils": "^5.18.0",
-		"@wordpress/notices": "^5.18.0",
-		"@wordpress/patterns": "^2.18.0",
-		"@wordpress/plugins": "^7.18.0",
-		"@wordpress/preferences": "^4.18.0",
-		"@wordpress/primitives": "^4.18.0",
-		"@wordpress/private-apis": "^1.18.0",
-		"@wordpress/reusable-blocks": "^5.18.0",
-		"@wordpress/router": "^1.18.0",
-		"@wordpress/style-engine": "^2.18.0",
-		"@wordpress/url": "^4.18.0",
-		"@wordpress/viewport": "^6.18.0",
-		"@wordpress/widgets": "^4.18.0",
-		"@wordpress/wordcount": "^4.18.0",
+		"@wordpress/a11y": "^4.19.0",
+		"@wordpress/api-fetch": "^7.19.0",
+		"@wordpress/blob": "^4.19.0",
+		"@wordpress/block-editor": "^14.14.0",
+		"@wordpress/block-library": "^9.19.0",
+		"@wordpress/blocks": "^14.8.0",
+		"@wordpress/commands": "^1.19.0",
+		"@wordpress/components": "^29.5.0",
+		"@wordpress/compose": "^7.19.0",
+		"@wordpress/core-commands": "^1.19.0",
+		"@wordpress/core-data": "^7.19.0",
+		"@wordpress/data": "^10.19.0",
+		"@wordpress/dataviews": "^4.15.0",
+		"@wordpress/date": "^5.19.0",
+		"@wordpress/deprecated": "^4.19.0",
+		"@wordpress/dom": "^4.19.0",
+		"@wordpress/editor": "^14.19.0",
+		"@wordpress/element": "^6.19.0",
+		"@wordpress/escape-html": "^3.19.0",
+		"@wordpress/fields": "^0.11.0",
+		"@wordpress/hooks": "^4.19.0",
+		"@wordpress/html-entities": "^4.19.0",
+		"@wordpress/i18n": "^5.19.0",
+		"@wordpress/icons": "^10.19.0",
+		"@wordpress/keyboard-shortcuts": "^5.19.0",
+		"@wordpress/keycodes": "^4.19.0",
+		"@wordpress/media-utils": "^5.19.0",
+		"@wordpress/notices": "^5.19.0",
+		"@wordpress/patterns": "^2.19.0",
+		"@wordpress/plugins": "^7.19.0",
+		"@wordpress/preferences": "^4.19.0",
+		"@wordpress/primitives": "^4.19.0",
+		"@wordpress/private-apis": "^1.19.0",
+		"@wordpress/reusable-blocks": "^5.19.0",
+		"@wordpress/router": "^1.19.0",
+		"@wordpress/style-engine": "^2.19.0",
+		"@wordpress/url": "^4.19.0",
+		"@wordpress/viewport": "^6.19.0",
+		"@wordpress/widgets": "^4.19.0",
+		"@wordpress/wordcount": "^4.19.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.9.2",
@@ -84,5 +84,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "afe4fb333177642180ac020f1030c5685eab7183"
+	"gitHead": "d6b0b20fa927b110140dc7fdd906a7e0bf662004"
 }

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

@@ -51,6 +51,7 @@ function AddCustomGenericTemplateModalContent( { onClose, createTemplate } ) {
 					placeholder={ defaultTitle }
 					disabled={ isBusy }
 					help={ __(
+						// eslint-disable-next-line no-restricted-syntax -- 'sidebar' is a common web design term for layouts
 						'Describe the template, e.g. "Post with sidebar". A custom template can be manually applied to any post or page.'
 					) }
 				/>

package/src/components/layout/style.scss

@@ -68,6 +68,10 @@
 	.edit-site-sidebar__screen-wrapper {
 		padding: 0;
 	}
+
+	.edit-site-sidebar-navigation-screen__main {
+		padding: 0 $grid-unit-15;
+	}
 }
 
 .edit-site-layout__canvas-container {
@@ -262,10 +266,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
 	}
 }
 
-.edit-site-layout__area__404 {
-	margin: $canvas-padding;
-}
-
 .edit-site .components-editor-notices__snackbar {
 	position: fixed;
 	right: 0;

package/src/components/save-panel/index.js

@@ -31,7 +31,11 @@ const { EntitiesSavedStatesExtensible, NavigableRegion } =
 	unlock( privateApis );
 const { useLocation } = unlock( routerPrivateApis );
 
-const EntitiesSavedStatesForPreview = ( { onClose, renderDialog } ) => {
+const EntitiesSavedStatesForPreview = ( {
+	onClose,
+	renderDialog,
+	variant,
+} ) => {
 	const isDirtyProps = useEntitiesSavedStatesIsDirty();
 	let activateSaveLabel;
 	if ( isDirtyProps.isDirty ) {
@@ -76,22 +80,28 @@ const EntitiesSavedStatesForPreview = ( { onClose, renderDialog } ) => {
 				saveEnabled: true,
 				saveLabel: activateSaveLabel,
 				renderDialog,
+				variant,
 			} }
 		/>
 	);
 };
 
-const _EntitiesSavedStates = ( { onClose, renderDialog } ) => {
+const _EntitiesSavedStates = ( { onClose, renderDialog, variant } ) => {
 	if ( isPreviewingTheme() ) {
 		return (
 			<EntitiesSavedStatesForPreview
 				onClose={ onClose }
 				renderDialog={ renderDialog }
+				variant={ variant }
 			/>
 		);
 	}
 	return (
-		<EntitiesSavedStates close={ onClose } renderDialog={ renderDialog } />
+		<EntitiesSavedStates
+			close={ onClose }
+			renderDialog={ renderDialog }
+			variant={ variant }
+		/>
 	);
 };
 
@@ -130,12 +140,10 @@ export default function SavePanel() {
 			<Modal
 				className="edit-site-save-panel__modal"
 				onRequestClose={ onClose }
-				__experimentalHideHeader
-				contentLabel={ __(
-					'Save site, content, and template changes'
-				) }
+				title={ __( 'Review changes' ) }
+				size="small"
 			>
-				<_EntitiesSavedStates onClose={ onClose } />
+				<_EntitiesSavedStates onClose={ onClose } variant="inline" />
 			</Modal>
 		) : null;
 	}

package/src/components/sidebar-navigation-screen/index.js

@@ -122,9 +122,9 @@ export default function SidebarNavigationScreen( {
 				</HStack>
 				<div className="edit-site-sidebar-navigation-screen__content">
 					{ description && (
-						<p className="edit-site-sidebar-navigation-screen__description">
+						<div className="edit-site-sidebar-navigation-screen__description">
 							{ description }
-						</p>
+						</div>
 					) }
 					{ content }
 				</div>

package/src/components/site-editor-routes/navigation-item.js

@@ -6,7 +6,6 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
 /**
  * Internal dependencies
  */
-import { NAVIGATION_POST_TYPE } from '../../utils/constants';
 import Editor from '../editor';
 import SidebarNavigationScreenNavigationMenu from '../sidebar-navigation-screen-navigation-menu';
 import { unlock } from '../../lock-unlock';
@@ -20,9 +19,7 @@ function MobileNavigationItemView() {
 	return canvas === 'edit' ? (
 		<Editor />
 	) : (
-		<SidebarNavigationScreenNavigationMenu
-			backPath={ { postType: NAVIGATION_POST_TYPE } }
-		/>
+		<SidebarNavigationScreenNavigationMenu backPath="/navigation" />
 	);
 }
 

package/src/components/site-editor-routes/notfound.js

@@ -6,8 +6,19 @@ import { __ } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
+import { Notice, __experimentalSpacer as Spacer } from '@wordpress/components';
 import SidebarNavigationScreenMain from '../sidebar-navigation-screen-main';
 
+function NotFoundError() {
+	return (
+		<Notice status="error" isDismissible={ false }>
+			{ __(
+				'The requested page could not be found. Please check the URL.'
+			) }
+		</Notice>
+	);
+}
+
 export const notFoundRoute = {
 	name: 'notfound',
 	path: '*',
@@ -15,13 +26,13 @@ export const notFoundRoute = {
 		sidebar: <SidebarNavigationScreenMain />,
 		mobile: (
 			<SidebarNavigationScreenMain
-				customDescription={ __( '404 (Not Found)' ) }
+				customDescription={ <NotFoundError /> }
 			/>
 		),
 		content: (
-			<p className="edit-site-layout__area__404">
-				{ __( '404 (Not Found)' ) }
-			</p>
+			<Spacer padding={ 2 }>
+				<NotFoundError />
+			</Spacer>
 		),
 	},
 };

package/src/components/site-editor-routes/patterns.js

@@ -1,8 +1,27 @@
+/**
+ * WordPress dependencies
+ */
+import { privateApis as routerPrivateApis } from '@wordpress/router';
+
 /**
  * Internal dependencies
  */
 import SidebarNavigationScreenPatterns from '../sidebar-navigation-screen-patterns';
 import PagePatterns from '../page-patterns';
+import { unlock } from '../../lock-unlock';
+
+const { useLocation } = unlock( routerPrivateApis );
+
+function MobilePatternsView() {
+	const { query = {} } = useLocation();
+	const { categoryId } = query;
+
+	return !! categoryId ? (
+		<PagePatterns />
+	) : (
+		<SidebarNavigationScreenPatterns backPath="/" />
+	);
+}
 
 export const patternsRoute = {
 	name: 'patterns',
@@ -10,6 +29,6 @@ export const patternsRoute = {
 	areas: {
 		sidebar: <SidebarNavigationScreenPatterns backPath="/" />,
 		content: <PagePatterns />,
-		mobile: <PagePatterns />,
+		mobile: <MobilePatternsView />,
 	},
 };

package/src/components/site-hub/index.js

@@ -28,8 +28,8 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
 import { store as editSiteStore } from '../../store';
 import SiteIcon from '../site-icon';
 import { unlock } from '../../lock-unlock';
-const { useHistory } = unlock( routerPrivateApis );
 import { SidebarNavigationContext } from '../sidebar';
+const { useLocation, useHistory } = unlock( routerPrivateApis );
 
 const SiteHub = memo(
 	forwardRef( ( { isTransparent }, ref ) => {
@@ -117,29 +117,25 @@ export default SiteHub;
 
 export const SiteHubMobile = memo(
 	forwardRef( ( { isTransparent }, ref ) => {
+		const { path } = useLocation();
 		const history = useHistory();
 		const { navigate } = useContext( SidebarNavigationContext );
 
-		const { dashboardLink, isBlockTheme, homeUrl, siteTitle } = useSelect(
-			( select ) => {
-				const { getSettings } = unlock( select( editSiteStore ) );
-
-				const { getEntityRecord, getCurrentTheme } =
-					select( coreStore );
-				const _site = getEntityRecord( 'root', 'site' );
-				return {
-					dashboardLink: getSettings().__experimentalDashboardLink,
-					isBlockTheme: getCurrentTheme()?.is_block_theme,
-					homeUrl: getEntityRecord( 'root', '__unstableBase' )?.home,
-					siteTitle:
-						! _site?.title && !! _site?.url
-							? filterURLForDisplay( _site?.url )
-							: _site?.title,
-				};
-			},
-			[]
-		);
+		const { dashboardLink, homeUrl, siteTitle } = useSelect( ( select ) => {
+			const { getSettings } = unlock( select( editSiteStore ) );
+			const { getEntityRecord } = select( coreStore );
+			const _site = getEntityRecord( 'root', 'site' );
+			return {
+				dashboardLink: getSettings().__experimentalDashboardLink,
+				homeUrl: getEntityRecord( 'root', '__unstableBase' )?.home,
+				siteTitle:
+					! _site?.title && !! _site?.url
+						? filterURLForDisplay( _site?.url )
+						: _site?.title,
+			};
+		}, [] );
 		const { open: openCommandCenter } = useDispatch( commandsStore );
+		const isRoot = path === '/';
 
 		return (
 			<div className="edit-site-site-hub">
@@ -160,7 +156,7 @@ export const SiteHubMobile = memo(
 								transform: 'scale(0.5)',
 								borderRadius: 4,
 							} }
-							{ ...( ! isBlockTheme
+							{ ...( isRoot
 								? {
 										href: dashboardLink,
 										label: __( 'Go to the Dashboard' ),

package/src/components/welcome-guide/page.js

@@ -57,6 +57,7 @@ export default function WelcomeGuidePage() {
 							</h1>
 							<p className="edit-site-welcome-guide__text">
 								{ __(
+									// eslint-disable-next-line no-restricted-syntax -- 'sidebar' is a common web design term for layouts
 									'It’s now possible to edit page content in the site editor. To customise other parts of the page like the header and footer switch to editing the template using the settings sidebar.'
 								) }
 							</p>