@wordpress/edit-site 5.3.2 → 5.4.0

package/src/components/style-book/index.js

@@ -21,7 +21,7 @@ import {
 } from '@wordpress/blocks';
 import {
 	BlockPreview,
-	experiments as blockEditorExperiments,
+	privateApis as blockEditorPrivateApis,
 } from '@wordpress/block-editor';
 import { closeSmall } from '@wordpress/icons';
 import { useResizeObserver } from '@wordpress/compose';
@@ -30,9 +30,9 @@ import { useMemo, memo } from '@wordpress/element';
 /**
  * Internal dependencies
  */
-import { unlock } from '../../experiments';
+import { unlock } from '../../private-apis';
 
-const { useGlobalStyle } = unlock( blockEditorExperiments );
+const { useGlobalStyle } = unlock( blockEditorPrivateApis );
 
 const SLOT_FILL_NAME = 'EditSiteStyleBook';
 const { Slot: StyleBookSlot, Fill: StyleBookFill } =
@@ -70,10 +70,14 @@ function getExamples() {
 	};
 
 	const otherExamples = getBlockTypes()
-		.filter(
-			( blockType ) =>
-				blockType.name !== 'core/heading' && !! blockType.example
-		)
+		.filter( ( blockType ) => {
+			const { name, example, supports } = blockType;
+			return (
+				name !== 'core/heading' &&
+				!! example &&
+				supports.inserter !== false
+			);
+		} )
 		.map( ( blockType ) => ( {
 			name: blockType.name,
 			title: blockType.title,

package/src/components/sync-state-with-url/use-init-edited-entity-from-url.js

@@ -2,7 +2,8 @@
  * WordPress dependencies
  */
 import { useEffect } from '@wordpress/element';
-import { useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
+import { store as coreDataStore } from '@wordpress/core-data';
 
 /**
  * Internal dependencies
@@ -11,22 +12,55 @@ import { useLocation } from '../routes';
 import { store as editSiteStore } from '../../store';
 
 export default function useInitEditedEntityFromURL() {
+	const { params: { postId, postType, path = '/' } = {} } = useLocation();
+	const { isRequestingSite, homepageId } = useSelect( ( select ) => {
+		const { getSite } = select( coreDataStore );
+		const siteData = getSite();
+
+		return {
+			isRequestingSite: ! siteData,
+			homepageId:
+				siteData?.show_on_front === 'page'
+					? siteData.page_on_front
+					: null,
+		};
+	}, [] );
+
 	const { setTemplate, setTemplatePart, setPage } =
 		useDispatch( editSiteStore );
-	const {
-		params: { postId, postType },
-	} = useLocation();
 
-	// Set correct entity on page navigation.
 	useEffect( () => {
-		// This URL scheme mean we can't open a template part with the context of a given post.
-		// Potentially posts and pages could be moved to a "context" query string instead.
-		if ( 'page' === postType || 'post' === postType ) {
-			setPage( { context: { postType, postId } } ); // Resolves correct template based on ID.
-		} else if ( 'wp_template' === postType ) {
-			setTemplate( postId );
-		} else if ( 'wp_template_part' === postType ) {
-			setTemplatePart( postId );
+		switch ( path ) {
+			case '/templates/single':
+				setTemplate( postId );
+				break;
+			case '/template-parts/single':
+				setTemplatePart( postId );
+				break;
+			case '/navigation/single':
+				setPage( {
+					context: { postType, postId },
+				} );
+				break;
+			default: {
+				if ( homepageId ) {
+					setPage( {
+						context: { postType: 'page', postId: homepageId },
+					} );
+				} else if ( ! isRequestingSite ) {
+					setPage( {
+						path: '/',
+					} );
+				}
+			}
 		}
-	}, [ postId, postType ] );
+	}, [
+		path,
+		postId,
+		homepageId,
+		isRequestingSite,
+		setPage,
+		setTemplate,
+		setTemplatePart,
+	] );
 }

package/src/components/sync-state-with-url/use-sync-canvas-mode-with-url.js

@@ -9,7 +9,7 @@ import { useSelect, useDispatch } from '@wordpress/data';
  */
 import { store as editSiteStore } from '../../store';
 import { useLocation, useHistory } from '../routes';
-import { unlock } from '../../experiments';
+import { unlock } from '../../private-apis';
 
 export default function useSyncCanvasModeWithURL() {
 	const history = useHistory();

package/src/components/sync-state-with-url/{use-sync-sidebar-path-with-url.js → use-sync-path-with-url.js}

@@ -9,28 +9,28 @@ import { useEffect, useRef } from '@wordpress/element';
  */
 import { useLocation, useHistory } from '../routes';
 
-export default function useSyncSidebarPathWithURL() {
+export default function useSyncPathWithURL() {
 	const history = useHistory();
 	const { params } = useLocation();
-	const { sidebar = '/' } = params;
+	const { path = '/' } = params;
 	const { location, goTo } = useNavigator();
-	const currentSidebar = useRef( sidebar );
+	const currentPath = useRef( path );
 	const currentNavigatorLocation = useRef( location.path );
 	useEffect( () => {
-		currentSidebar.current = sidebar;
-		if ( sidebar !== currentNavigatorLocation.current ) {
-			goTo( sidebar );
+		currentPath.current = path;
+		if ( path !== currentNavigatorLocation.current ) {
+			goTo( path );
 		}
-	}, [ sidebar ] );
+	}, [ path ] );
 	useEffect( () => {
 		currentNavigatorLocation.current = location.path;
-		if ( location.path !== currentSidebar.current ) {
+		if ( location.path !== currentPath.current ) {
 			history.push( {
 				...params,
-				sidebar: location.path,
+				path: location.path,
 			} );
 		}
 	}, [ location.path, history ] );
 
-	return sidebar;
+	return path;
 }

package/src/components/use-edited-entity-record/index.js

@@ -12,7 +12,7 @@ import { decodeEntities } from '@wordpress/html-entities';
 import { store as editSiteStore } from '../../store';
 
 export default function useEditedEntityRecord() {
-	const { record, title, isLoaded } = useSelect( ( select ) => {
+	const { record, title, description, isLoaded } = useSelect( ( select ) => {
 		const { getEditedPostType, getEditedPostId } = select( editSiteStore );
 		const { getEditedEntityRecord } = select( coreStore );
 		const { __experimentalGetTemplateInfo: getTemplateInfo } =
@@ -21,10 +21,12 @@ export default function useEditedEntityRecord() {
 		const postId = getEditedPostId();
 		const _record = getEditedEntityRecord( 'postType', postType, postId );
 		const _isLoaded = !! postId;
+		const templateInfo = getTemplateInfo( _record );
 
 		return {
 			record: _record,
-			title: getTemplateInfo( _record ).title,
+			title: templateInfo.title,
+			description: templateInfo.description,
 			isLoaded: _isLoaded,
 		};
 	}, [] );
@@ -33,5 +35,7 @@ export default function useEditedEntityRecord() {
 		isLoaded,
 		record,
 		getTitle: () => ( title ? decodeEntities( title ) : null ),
+		getDescription: () =>
+			description ? decodeEntities( description ) : null,
 	};
 }

package/src/hooks/push-changes-to-global-styles/index.js

@@ -11,7 +11,7 @@ import { createHigherOrderComponent } from '@wordpress/compose';
 import {
 	InspectorAdvancedControls,
 	store as blockEditorStore,
-	experiments as blockEditorExperiments,
+	privateApis as blockEditorPrivateApis,
 } from '@wordpress/block-editor';
 import { BaseControl, Button } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
@@ -26,10 +26,10 @@ import { store as noticesStore } from '@wordpress/notices';
 /**
  * Internal dependencies
  */
-import { getSupportedGlobalStylesPanels } from '../../components/global-styles/hooks';
-import { unlock } from '../../experiments';
+import { useSupportedStyles } from '../../components/global-styles/hooks';
+import { unlock } from '../../private-apis';
 
-const { GlobalStylesContext } = unlock( blockEditorExperiments );
+const { GlobalStylesContext } = unlock( blockEditorPrivateApis );
 
 // TODO: Temporary duplication of constant in @wordpress/block-editor. Can be
 // removed by moving PushChangesToGlobalStylesControl to
@@ -90,22 +90,30 @@ const STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE = {
 	'typography.fontFamily': 'fontFamily',
 };
 
-function getChangesToPush( name, attributes ) {
-	return getSupportedGlobalStylesPanels( name ).flatMap( ( key ) => {
-		if ( ! STYLE_PROPERTY[ key ] ) {
-			return [];
-		}
-		const { value: path } = STYLE_PROPERTY[ key ];
-		const presetAttributeKey = path.join( '.' );
-		const presetAttributeValue =
-			attributes[
-				STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE[ presetAttributeKey ]
-			];
-		const value = presetAttributeValue
-			? `var:preset|${ STYLE_PATH_TO_CSS_VAR_INFIX[ presetAttributeKey ] }|${ presetAttributeValue }`
-			: get( attributes.style, path );
-		return value ? [ { path, value } ] : [];
-	} );
+function useChangesToPush( name, attributes ) {
+	const supports = useSupportedStyles( name );
+
+	return useMemo(
+		() =>
+			supports.flatMap( ( key ) => {
+				if ( ! STYLE_PROPERTY[ key ] ) {
+					return [];
+				}
+				const { value: path } = STYLE_PROPERTY[ key ];
+				const presetAttributeKey = path.join( '.' );
+				const presetAttributeValue =
+					attributes[
+						STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE[
+							presetAttributeKey
+						]
+					];
+				const value = presetAttributeValue
+					? `var:preset|${ STYLE_PATH_TO_CSS_VAR_INFIX[ presetAttributeKey ] }|${ presetAttributeValue }`
+					: get( attributes.style, path );
+				return value ? [ { path, value } ] : [];
+			} ),
+		[ supports, name, attributes ]
+	);
 }
 
 function cloneDeep( object ) {
@@ -117,10 +125,7 @@ function PushChangesToGlobalStylesControl( {
 	attributes,
 	setAttributes,
 } ) {
-	const changes = useMemo(
-		() => getChangesToPush( name, attributes ),
-		[ name, attributes ]
-	);
+	const changes = useChangesToPush( name, attributes );
 
 	const { user: userConfig, setUserConfig } =
 		useContext( GlobalStylesContext );

package/src/{experiments.js → private-apis.js}

@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/experiments';
+import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/private-apis';
 
 export const { lock, unlock } =
 	__dangerousOptInToUnstableAPIsOnlyForCoreModules(

package/src/store/index.js

@@ -12,7 +12,7 @@ import * as privateActions from './private-actions';
 import * as selectors from './selectors';
 import * as privateSelectors from './private-selectors';
 import { STORE_NAME } from './constants';
-import { unlock } from '../experiments';
+import { unlock } from '../private-apis';
 
 export const storeConfig = {
 	reducer,

package/src/style.scss

@@ -17,6 +17,7 @@
 @import "./components/create-template-part-modal/style.scss";
 @import "./components/secondary-sidebar/style.scss";
 @import "./components/welcome-guide/style.scss";
+@import "./components/start-template-options/style.scss";
 @import "./components/keyboard-shortcut-help-modal/style.scss";
 @import "./components/layout/style.scss";
 @import "./components/save-panel/style.scss";

package/src/utils/get-is-list-page.js

@@ -1,11 +1,11 @@
 /**
  * Returns if the params match the list page route.
  *
- * @param {Object} params          The search params.
- * @param {string} params.postId   The post ID.
- * @param {string} params.postType The post type.
+ * @param {Object} params      The url params.
+ * @param {string} params.path The current path.
+ *
  * @return {boolean} Is list page or not.
  */
-export default function getIsListPage( { postId, postType } ) {
-	return !! ( ! postId && postType );
+export default function getIsListPage( { path } ) {
+	return path === '/templates/all' || path === '/template-parts/all';
 }

package/build/components/sync-state-with-url/use-sync-sidebar-path-with-url.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sync-state-with-url/use-sync-sidebar-path-with-url.js"],"names":["useSyncSidebarPathWithURL","history","params","sidebar","location","goTo","currentSidebar","currentNavigatorLocation","path","current","push"],"mappings":";;;;;;;AAGA;;AACA;;AAKA;;AATA;AACA;AACA;;AAIA;AACA;AACA;AAGe,SAASA,yBAAT,GAAqC;AACnD,QAAMC,OAAO,GAAG,yBAAhB;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAa,0BAAnB;AACA,QAAM;AAAEC,IAAAA,OAAO,GAAG;AAAZ,MAAoBD,MAA1B;AACA,QAAM;AAAEE,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,MAAqB,6CAA3B;AACA,QAAMC,cAAc,GAAG,qBAAQH,OAAR,CAAvB;AACA,QAAMI,wBAAwB,GAAG,qBAAQH,QAAQ,CAACI,IAAjB,CAAjC;AACA,0BAAW,MAAM;AAChBF,IAAAA,cAAc,CAACG,OAAf,GAAyBN,OAAzB;;AACA,QAAKA,OAAO,KAAKI,wBAAwB,CAACE,OAA1C,EAAoD;AACnDJ,MAAAA,IAAI,CAAEF,OAAF,CAAJ;AACA;AACD,GALD,EAKG,CAAEA,OAAF,CALH;AAMA,0BAAW,MAAM;AAChBI,IAAAA,wBAAwB,CAACE,OAAzB,GAAmCL,QAAQ,CAACI,IAA5C;;AACA,QAAKJ,QAAQ,CAACI,IAAT,KAAkBF,cAAc,CAACG,OAAtC,EAAgD;AAC/CR,MAAAA,OAAO,CAACS,IAAR,CAAc,EACb,GAAGR,MADU;AAEbC,QAAAA,OAAO,EAAEC,QAAQ,CAACI;AAFL,OAAd;AAIA;AACD,GARD,EAQG,CAAEJ,QAAQ,CAACI,IAAX,EAAiBP,OAAjB,CARH;AAUA,SAAOE,OAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalUseNavigator as useNavigator } from '@wordpress/components';\nimport { useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useLocation, useHistory } from '../routes';\n\nexport default function useSyncSidebarPathWithURL() {\n\tconst history = useHistory();\n\tconst { params } = useLocation();\n\tconst { sidebar = '/' } = params;\n\tconst { location, goTo } = useNavigator();\n\tconst currentSidebar = useRef( sidebar );\n\tconst currentNavigatorLocation = useRef( location.path );\n\tuseEffect( () => {\n\t\tcurrentSidebar.current = sidebar;\n\t\tif ( sidebar !== currentNavigatorLocation.current ) {\n\t\t\tgoTo( sidebar );\n\t\t}\n\t}, [ sidebar ] );\n\tuseEffect( () => {\n\t\tcurrentNavigatorLocation.current = location.path;\n\t\tif ( location.path !== currentSidebar.current ) {\n\t\t\thistory.push( {\n\t\t\t\t...params,\n\t\t\t\tsidebar: location.path,\n\t\t\t} );\n\t\t}\n\t}, [ location.path, history ] );\n\n\treturn sidebar;\n}\n"]}

package/build/experiments.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-site/src/experiments.js"],"names":["lock","unlock"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAGO,MAAM;AAAEA,EAAAA,IAAF;AAAQC,EAAAA;AAAR,IACZ,mEACC,8GADD,EAEC,sBAFD,CADM","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/experiments';\n\nexport const { lock, unlock } =\n\t__dangerousOptInToUnstableAPIsOnlyForCoreModules(\n\t\t'I know using unstable features means my plugin or theme will inevitably break on the next WordPress release.',\n\t\t'@wordpress/edit-site'\n\t);\n"]}

package/build-module/components/sync-state-with-url/use-sync-sidebar-path-with-url.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sync-state-with-url/use-sync-sidebar-path-with-url.js"],"names":["__experimentalUseNavigator","useNavigator","useEffect","useRef","useLocation","useHistory","useSyncSidebarPathWithURL","history","params","sidebar","location","goTo","currentSidebar","currentNavigatorLocation","path","current","push"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,0BAA0B,IAAIC,YAAvC,QAA2D,uBAA3D;AACA,SAASC,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AAEA;AACA;AACA;;AACA,SAASC,WAAT,EAAsBC,UAAtB,QAAwC,WAAxC;AAEA,eAAe,SAASC,yBAAT,GAAqC;AACnD,QAAMC,OAAO,GAAGF,UAAU,EAA1B;AACA,QAAM;AAAEG,IAAAA;AAAF,MAAaJ,WAAW,EAA9B;AACA,QAAM;AAAEK,IAAAA,OAAO,GAAG;AAAZ,MAAoBD,MAA1B;AACA,QAAM;AAAEE,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,MAAqBV,YAAY,EAAvC;AACA,QAAMW,cAAc,GAAGT,MAAM,CAAEM,OAAF,CAA7B;AACA,QAAMI,wBAAwB,GAAGV,MAAM,CAAEO,QAAQ,CAACI,IAAX,CAAvC;AACAZ,EAAAA,SAAS,CAAE,MAAM;AAChBU,IAAAA,cAAc,CAACG,OAAf,GAAyBN,OAAzB;;AACA,QAAKA,OAAO,KAAKI,wBAAwB,CAACE,OAA1C,EAAoD;AACnDJ,MAAAA,IAAI,CAAEF,OAAF,CAAJ;AACA;AACD,GALQ,EAKN,CAAEA,OAAF,CALM,CAAT;AAMAP,EAAAA,SAAS,CAAE,MAAM;AAChBW,IAAAA,wBAAwB,CAACE,OAAzB,GAAmCL,QAAQ,CAACI,IAA5C;;AACA,QAAKJ,QAAQ,CAACI,IAAT,KAAkBF,cAAc,CAACG,OAAtC,EAAgD;AAC/CR,MAAAA,OAAO,CAACS,IAAR,CAAc,EACb,GAAGR,MADU;AAEbC,QAAAA,OAAO,EAAEC,QAAQ,CAACI;AAFL,OAAd;AAIA;AACD,GARQ,EAQN,CAAEJ,QAAQ,CAACI,IAAX,EAAiBP,OAAjB,CARM,CAAT;AAUA,SAAOE,OAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalUseNavigator as useNavigator } from '@wordpress/components';\nimport { useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useLocation, useHistory } from '../routes';\n\nexport default function useSyncSidebarPathWithURL() {\n\tconst history = useHistory();\n\tconst { params } = useLocation();\n\tconst { sidebar = '/' } = params;\n\tconst { location, goTo } = useNavigator();\n\tconst currentSidebar = useRef( sidebar );\n\tconst currentNavigatorLocation = useRef( location.path );\n\tuseEffect( () => {\n\t\tcurrentSidebar.current = sidebar;\n\t\tif ( sidebar !== currentNavigatorLocation.current ) {\n\t\t\tgoTo( sidebar );\n\t\t}\n\t}, [ sidebar ] );\n\tuseEffect( () => {\n\t\tcurrentNavigatorLocation.current = location.path;\n\t\tif ( location.path !== currentSidebar.current ) {\n\t\t\thistory.push( {\n\t\t\t\t...params,\n\t\t\t\tsidebar: location.path,\n\t\t\t} );\n\t\t}\n\t}, [ location.path, history ] );\n\n\treturn sidebar;\n}\n"]}

package/build-module/experiments.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-site/src/experiments.js"],"names":["__dangerousOptInToUnstableAPIsOnlyForCoreModules","lock","unlock"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,gDAAT,QAAiE,wBAAjE;AAEA,OAAO,MAAM;AAAEC,EAAAA,IAAF;AAAQC,EAAAA;AAAR,IACZF,gDAAgD,CAC/C,8GAD+C,EAE/C,sBAF+C,CAD1C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/experiments';\n\nexport const { lock, unlock } =\n\t__dangerousOptInToUnstableAPIsOnlyForCoreModules(\n\t\t'I know using unstable features means my plugin or theme will inevitably break on the next WordPress release.',\n\t\t'@wordpress/edit-site'\n\t);\n"]}