@wordpress/edit-site 5.3.6 → 5.3.7

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

@@ -20,22 +20,52 @@ export default function useSyncCanvasModeWithURL() {
 	);
 	const { setCanvasMode } = unlock( useDispatch( editSiteStore ) );
 	const currentCanvasMode = useRef( canvasMode );
-	const { canvas: canvasInUrl = 'view' } = params;
+	const { canvas: canvasInUrl } = params;
 	const currentCanvasInUrl = useRef( canvasInUrl );
+	const currentUrlParams = useRef( params );
+	useEffect( () => {
+		currentUrlParams.current = params;
+	}, [ params ] );
+
 	useEffect( () => {
 		currentCanvasMode.current = canvasMode;
-		if ( currentCanvasMode !== currentCanvasInUrl ) {
+		if ( canvasMode === 'init' ) {
+			return;
+		}
+
+		if (
+			canvasMode === 'edit' &&
+			currentCanvasInUrl.current !== canvasMode
+		) {
+			history.push( {
+				...currentUrlParams.current,
+				canvas: 'edit',
+			} );
+		}
+
+		if (
+			canvasMode === 'view' &&
+			currentCanvasInUrl.current !== undefined
+		) {
 			history.push( {
-				...params,
-				canvas: canvasMode,
+				...currentUrlParams.current,
+				canvas: undefined,
 			} );
 		}
-	}, [ canvasMode ] );
+	}, [ canvasMode, history ] );
 
 	useEffect( () => {
 		currentCanvasInUrl.current = canvasInUrl;
-		if ( canvasInUrl !== currentCanvasMode.current ) {
-			setCanvasMode( canvasInUrl );
+		if (
+			canvasInUrl === undefined &&
+			currentCanvasMode.current !== 'view'
+		) {
+			setCanvasMode( 'view' );
+		} else if (
+			canvasInUrl === 'edit' &&
+			currentCanvasMode.current !== 'edit'
+		) {
+			setCanvasMode( 'edit' );
 		}
-	}, [ canvasInUrl ] );
+	}, [ canvasInUrl, setCanvasMode ] );
 }

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

@@ -41,8 +41,16 @@ export default function useSyncPathWithURL() {
 	} = useNavigator();
 	const currentUrlParams = useRef( urlParams );
 	const currentPath = useRef( navigatorLocation.path );
+	const isMounting = useRef( true );
 
 	useEffect( () => {
+		// The navigatorParams are only initially filled properly when the
+		// navigator screens mount. so we ignore the first synchronisation.
+		if ( isMounting.current ) {
+			isMounting.current = false;
+			return;
+		}
+
 		function updateUrlParams( newUrlParams ) {
 			if (
 				Object.entries( newUrlParams ).every( ( [ key, value ] ) => {
@@ -65,17 +73,14 @@ export default function useSyncPathWithURL() {
 				postId: navigatorParams?.postId,
 				path: undefined,
 			} );
-		} else if ( navigatorParams?.postType && ! navigatorParams?.postId ) {
-			updateUrlParams( {
-				postType: navigatorParams?.postType,
-				path: navigatorLocation.path,
-				postId: undefined,
-			} );
 		} else {
 			updateUrlParams( {
 				postType: undefined,
 				postId: undefined,
-				path: navigatorLocation.path,
+				path:
+					navigatorLocation.path === '/'
+						? undefined
+						: navigatorLocation.path,
 			} );
 		}
 	}, [ navigatorLocation?.path, navigatorParams, history ] );

package/src/components/template-details/index.js

@@ -32,9 +32,6 @@ export default function TemplateDetails( { template, onClose } ) {
 
 	// TODO: We should update this to filter by template part's areas as well.
 	const browseAllLinkProps = useLink( {
-		canvas: 'view',
-		postType: template.type,
-		postId: undefined,
 		path: '/' + template.type + '/all',
 	} );
 

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

@@ -11,25 +11,33 @@ import { decodeEntities } from '@wordpress/html-entities';
  */
 import { store as editSiteStore } from '../../store';
 
-export default function useEditedEntityRecord() {
-	const { record, title, description, isLoaded } = useSelect( ( select ) => {
-		const { getEditedPostType, getEditedPostId } = select( editSiteStore );
-		const { getEditedEntityRecord } = select( coreStore );
-		const { __experimentalGetTemplateInfo: getTemplateInfo } =
-			select( editorStore );
-		const postType = getEditedPostType();
-		const postId = getEditedPostId();
-		const _record = getEditedEntityRecord( 'postType', postType, postId );
-		const _isLoaded = !! postId;
-		const templateInfo = getTemplateInfo( _record );
+export default function useEditedEntityRecord( postType, postId ) {
+	const { record, title, description, isLoaded } = useSelect(
+		( select ) => {
+			const { getEditedPostType, getEditedPostId } =
+				select( editSiteStore );
+			const { getEditedEntityRecord } = select( coreStore );
+			const { __experimentalGetTemplateInfo: getTemplateInfo } =
+				select( editorStore );
+			const usedPostType = postType ?? getEditedPostType();
+			const usedPostId = postId ?? getEditedPostId();
+			const _record = getEditedEntityRecord(
+				'postType',
+				usedPostType,
+				usedPostId
+			);
+			const _isLoaded = !! usedPostId;
+			const templateInfo = getTemplateInfo( _record );
 
-		return {
-			record: _record,
-			title: templateInfo.title,
-			description: templateInfo.description,
-			isLoaded: _isLoaded,
-		};
-	}, [] );
+			return {
+				record: _record,
+				title: templateInfo.title,
+				description: templateInfo.description,
+				isLoaded: _isLoaded,
+			};
+		},
+		[ postType, postId ]
+	);
 
 	return {
 		isLoaded,

package/src/index.js

@@ -17,7 +17,10 @@ import {
 import { store as editorStore } from '@wordpress/editor';
 import { store as interfaceStore } from '@wordpress/interface';
 import { store as preferencesStore } from '@wordpress/preferences';
-import { registerLegacyWidgetBlock } from '@wordpress/widgets';
+import {
+	registerLegacyWidgetBlock,
+	registerWidgetGroupBlock,
+} from '@wordpress/widgets';
 
 /**
  * Internal dependencies
@@ -47,6 +50,7 @@ export function initializeEditor( id, settings ) {
 	registerCoreBlocks( coreBlocks );
 	dispatch( blocksStore ).setFreeformFallbackBlockName( 'core/html' );
 	registerLegacyWidgetBlock( { inserter: false } );
+	registerWidgetGroupBlock( { inserter: false } );
 	if ( process.env.IS_GUTENBERG_PLUGIN ) {
 		__experimentalRegisterExperimentalCoreBlocks( {
 			enableFSEBlocks: true,

package/src/style.scss

@@ -8,7 +8,6 @@
 @import "./components/header-edit-mode/style.scss";
 @import "./components/header-edit-mode/document-actions/style.scss";
 @import "./components/list/style.scss";
-@import "./components/navigation-inspector/style.scss";
 @import "./components/sidebar-edit-mode/style.scss";
 @import "./components/sidebar-edit-mode/settings-header/style.scss";
 @import "./components/sidebar-edit-mode/template-card/style.scss";
@@ -19,6 +18,7 @@
 @import "./components/welcome-guide/style.scss";
 @import "./components/keyboard-shortcut-help-modal/style.scss";
 @import "./components/layout/style.scss";
+@import "./components/save-hub/style.scss";
 @import "./components/save-panel/style.scss";
 @import "./components/sidebar/style.scss";
 @import "./components/sidebar-button/style.scss";

package/src/utils/history.js

@@ -6,7 +6,7 @@ import { createBrowserHistory } from 'history';
 /**
  * WordPress dependencies
  */
-import { addQueryArgs } from '@wordpress/url';
+import { addQueryArgs, getQueryArgs, removeQueryArgs } from '@wordpress/url';
 
 const history = createBrowserHistory();
 
@@ -14,19 +14,23 @@ const originalHistoryPush = history.push;
 const originalHistoryReplace = history.replace;
 
 function push( params, state ) {
-	return originalHistoryPush.call(
-		history,
-		addQueryArgs( window.location.href, params ),
-		state
+	const currentArgs = getQueryArgs( window.location.href );
+	const currentUrlWithoutArgs = removeQueryArgs(
+		window.location.href,
+		...Object.keys( currentArgs )
 	);
+	const newUrl = addQueryArgs( currentUrlWithoutArgs, params );
+	return originalHistoryPush.call( history, newUrl, state );
 }
 
 function replace( params, state ) {
-	return originalHistoryReplace.call(
-		history,
-		addQueryArgs( window.location.href, params ),
-		state
+	const currentArgs = getQueryArgs( window.location.href );
+	const currentUrlWithoutArgs = removeQueryArgs(
+		window.location.href,
+		...Object.keys( currentArgs )
 	);
+	const newUrl = addQueryArgs( currentUrlWithoutArgs, params );
+	return originalHistoryReplace.call( history, newUrl, state );
 }
 
 history.push = push;

package/build/components/navigation-inspector/index.js

@@ -1,190 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = NavigationInspector;
-
-var _element = require("@wordpress/element");
-
-var _data = require("@wordpress/data");
-
-var _components = require("@wordpress/components");
-
-var _coreData = require("@wordpress/core-data");
-
-var _blockEditor = require("@wordpress/block-editor");
-
-var _a11y = require("@wordpress/a11y");
-
-var _compose = require("@wordpress/compose");
-
-var _i18n = require("@wordpress/i18n");
-
-var _navigationMenu = _interopRequireDefault(require("./navigation-menu"));
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-const NAVIGATION_MENUS_QUERY = [{
-  per_page: -1,
-  status: 'publish'
-}];
-
-function NavigationInspector(_ref) {
-  var _navigationMenus$;
-
-  let {
-    onSelect
-  } = _ref;
-  const {
-    selectedNavigationBlockId,
-    clientIdToRef,
-    navigationMenus,
-    isResolvingNavigationMenus,
-    hasResolvedNavigationMenus,
-    firstNavigationBlockId
-  } = (0, _data.useSelect)(select => {
-    const {
-      __experimentalGetActiveBlockIdByBlockNames,
-      __experimentalGetGlobalBlocksByName,
-      getBlock
-    } = select(_blockEditor.store);
-    const {
-      getEntityRecords,
-      hasFinishedResolution,
-      isResolving
-    } = select(_coreData.store);
-    const navigationMenusQuery = ['postType', 'wp_navigation', NAVIGATION_MENUS_QUERY[0]]; // Get the active Navigation block (if present).
-
-    const selectedNavId = __experimentalGetActiveBlockIdByBlockNames('core/navigation'); // Get all Navigation blocks currently within the editor canvas.
-
-
-    const navBlockIds = __experimentalGetGlobalBlocksByName('core/navigation');
-
-    const idToRef = {};
-    navBlockIds.forEach(id => {
-      var _getBlock, _getBlock$attributes;
-
-      idToRef[id] = (_getBlock = getBlock(id)) === null || _getBlock === void 0 ? void 0 : (_getBlock$attributes = _getBlock.attributes) === null || _getBlock$attributes === void 0 ? void 0 : _getBlock$attributes.ref;
-    });
-    return {
-      selectedNavigationBlockId: selectedNavId,
-      firstNavigationBlockId: navBlockIds === null || navBlockIds === void 0 ? void 0 : navBlockIds[0],
-      clientIdToRef: idToRef,
-      navigationMenus: getEntityRecords(...navigationMenusQuery),
-      isResolvingNavigationMenus: isResolving('getEntityRecords', navigationMenusQuery),
-      hasResolvedNavigationMenus: hasFinishedResolution('getEntityRecords', navigationMenusQuery)
-    };
-  }, []);
-  const navMenuListId = (0, _compose.useInstanceId)(_navigationMenu.default, 'edit-site-navigation-inspector-menu');
-  const firstNavRefInTemplate = clientIdToRef[firstNavigationBlockId];
-  const firstNavigationMenuRef = navigationMenus === null || navigationMenus === void 0 ? void 0 : (_navigationMenus$ = navigationMenus[0]) === null || _navigationMenus$ === void 0 ? void 0 : _navigationMenus$.id; // Default Navigation Menu is either:
-  // - the Navigation Menu referenced by the first Nav block within the template.
-  // - the first of the available Navigation Menus (`wp_navigation`) posts.
-
-  const defaultNavigationMenuId = firstNavRefInTemplate || firstNavigationMenuRef; // The Navigation Menu manually selected by the user within the Nav inspector.
-
-  const [currentMenuId, setCurrentMenuId] = (0, _element.useState)(firstNavRefInTemplate); // If a Nav block is selected within the canvas then set the
-  // Navigation Menu referenced by it's `ref` attribute  to be
-  // active within the Navigation sidebar.
-
-  (0, _element.useEffect)(() => {
-    if (selectedNavigationBlockId) {
-      setCurrentMenuId(clientIdToRef[selectedNavigationBlockId]);
-    }
-  }, [selectedNavigationBlockId]);
-  let options = [];
-
-  if (navigationMenus) {
-    options = navigationMenus.map(_ref2 => {
-      let {
-        id,
-        title
-      } = _ref2;
-      return {
-        value: id,
-        label: title.rendered
-      };
-    });
-  }
-
-  const [innerBlocks, onInput, onChange] = (0, _coreData.useEntityBlockEditor)('postType', 'wp_navigation', {
-    id: currentMenuId || defaultNavigationMenuId
-  });
-  const {
-    isLoadingInnerBlocks,
-    hasLoadedInnerBlocks
-  } = (0, _data.useSelect)(select => {
-    const {
-      isResolving,
-      hasFinishedResolution
-    } = select(_coreData.store);
-    return {
-      isLoadingInnerBlocks: isResolving('getEntityRecord', ['postType', 'wp_navigation', currentMenuId || defaultNavigationMenuId]),
-      hasLoadedInnerBlocks: hasFinishedResolution('getEntityRecord', ['postType', 'wp_navigation', currentMenuId || defaultNavigationMenuId])
-    };
-  }, [currentMenuId, defaultNavigationMenuId]);
-  const isLoading = !(hasResolvedNavigationMenus && hasLoadedInnerBlocks);
-  const hasMoreThanOneNavigationMenu = (navigationMenus === null || navigationMenus === void 0 ? void 0 : navigationMenus.length) > 1;
-  const hasNavigationMenus = !!(navigationMenus !== null && navigationMenus !== void 0 && navigationMenus.length); // Entity block editor will return entities that are not currently published.
-  // Guard by only allowing their usage if there are published Nav Menus.
-
-  const publishedInnerBlocks = hasNavigationMenus ? innerBlocks : [];
-  const hasInnerBlocks = !!(publishedInnerBlocks !== null && publishedInnerBlocks !== void 0 && publishedInnerBlocks.length);
-  (0, _element.useEffect)(() => {
-    if (isResolvingNavigationMenus) {
-      (0, _a11y.speak)('Loading Navigation sidebar menus.');
-    }
-
-    if (hasResolvedNavigationMenus) {
-      (0, _a11y.speak)('Navigation sidebar menus have loaded.');
-    }
-  }, [isResolvingNavigationMenus, hasResolvedNavigationMenus]);
-  (0, _element.useEffect)(() => {
-    if (isLoadingInnerBlocks) {
-      (0, _a11y.speak)('Loading Navigation sidebar selected menu items.');
-    }
-
-    if (hasLoadedInnerBlocks) {
-      (0, _a11y.speak)('Navigation sidebar selected menu items have loaded.');
-    }
-  }, [isLoadingInnerBlocks, hasLoadedInnerBlocks]);
-  return (0, _element.createElement)("div", {
-    className: "edit-site-navigation-inspector"
-  }, hasResolvedNavigationMenus && !hasNavigationMenus && (0, _element.createElement)("p", {
-    className: "edit-site-navigation-inspector__empty-msg"
-  }, (0, _i18n.__)('There are no Navigation Menus.')), !hasResolvedNavigationMenus && (0, _element.createElement)("div", {
-    className: "edit-site-navigation-inspector__placeholder"
-  }), hasResolvedNavigationMenus && hasMoreThanOneNavigationMenu && (0, _element.createElement)(_components.SelectControl, {
-    __nextHasNoMarginBottom: true,
-    className: "edit-site-navigation-inspector__select-menu",
-    "aria-controls": // aria-controls should only apply when referenced element is in DOM
-    hasLoadedInnerBlocks ? navMenuListId : undefined,
-    value: currentMenuId || defaultNavigationMenuId,
-    options: options,
-    onChange: newMenuId => setCurrentMenuId(Number(newMenuId))
-  }), isLoading && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("div", {
-    className: "edit-site-navigation-inspector__placeholder is-child"
-  }), (0, _element.createElement)("div", {
-    className: "edit-site-navigation-inspector__placeholder is-child"
-  }), (0, _element.createElement)("div", {
-    className: "edit-site-navigation-inspector__placeholder is-child"
-  })), hasInnerBlocks && !isLoading && (0, _element.createElement)(_blockEditor.BlockEditorProvider, {
-    value: publishedInnerBlocks,
-    onChange: onChange,
-    onInput: onInput
-  }, (0, _element.createElement)(_navigationMenu.default, {
-    innerBlocks: publishedInnerBlocks,
-    onSelect: onSelect
-  })), !hasInnerBlocks && !isLoading && (0, _element.createElement)("p", {
-    className: "edit-site-navigation-inspector__empty-msg"
-  }, (0, _i18n.__)('Navigation Menu is empty.')));
-}
-//# sourceMappingURL=index.js.map

package/build/components/navigation-inspector/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/navigation-inspector/index.js"],"names":["NAVIGATION_MENUS_QUERY","per_page","status","NavigationInspector","onSelect","selectedNavigationBlockId","clientIdToRef","navigationMenus","isResolvingNavigationMenus","hasResolvedNavigationMenus","firstNavigationBlockId","select","__experimentalGetActiveBlockIdByBlockNames","__experimentalGetGlobalBlocksByName","getBlock","blockEditorStore","getEntityRecords","hasFinishedResolution","isResolving","coreStore","navigationMenusQuery","selectedNavId","navBlockIds","idToRef","forEach","id","attributes","ref","navMenuListId","NavigationMenu","firstNavRefInTemplate","firstNavigationMenuRef","defaultNavigationMenuId","currentMenuId","setCurrentMenuId","options","map","title","value","label","rendered","innerBlocks","onInput","onChange","isLoadingInnerBlocks","hasLoadedInnerBlocks","isLoading","hasMoreThanOneNavigationMenu","length","hasNavigationMenus","publishedInnerBlocks","hasInnerBlocks","undefined","newMenuId","Number"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useState, useEffect } from '@wordpress/element';\nimport { SelectControl } from '@wordpress/components';\nimport { store as coreStore, useEntityBlockEditor } from '@wordpress/core-data';\nimport {\n\tstore as blockEditorStore,\n\tBlockEditorProvider,\n} from '@wordpress/block-editor';\nimport { speak } from '@wordpress/a11y';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport NavigationMenu from './navigation-menu';\n\nconst NAVIGATION_MENUS_QUERY = [ { per_page: -1, status: 'publish' } ];\n\nexport default function NavigationInspector( { onSelect } ) {\n\tconst {\n\t\tselectedNavigationBlockId,\n\t\tclientIdToRef,\n\t\tnavigationMenus,\n\t\tisResolvingNavigationMenus,\n\t\thasResolvedNavigationMenus,\n\t\tfirstNavigationBlockId,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\t__experimentalGetActiveBlockIdByBlockNames,\n\t\t\t__experimentalGetGlobalBlocksByName,\n\t\t\tgetBlock,\n\t\t} = select( blockEditorStore );\n\n\t\tconst { getEntityRecords, hasFinishedResolution, isResolving } =\n\t\t\tselect( coreStore );\n\n\t\tconst navigationMenusQuery = [\n\t\t\t'postType',\n\t\t\t'wp_navigation',\n\t\t\tNAVIGATION_MENUS_QUERY[ 0 ],\n\t\t];\n\n\t\t// Get the active Navigation block (if present).\n\t\tconst selectedNavId =\n\t\t\t__experimentalGetActiveBlockIdByBlockNames( 'core/navigation' );\n\n\t\t// Get all Navigation blocks currently within the editor canvas.\n\t\tconst navBlockIds =\n\t\t\t__experimentalGetGlobalBlocksByName( 'core/navigation' );\n\t\tconst idToRef = {};\n\t\tnavBlockIds.forEach( ( id ) => {\n\t\t\tidToRef[ id ] = getBlock( id )?.attributes?.ref;\n\t\t} );\n\t\treturn {\n\t\t\tselectedNavigationBlockId: selectedNavId,\n\t\t\tfirstNavigationBlockId: navBlockIds?.[ 0 ],\n\t\t\tclientIdToRef: idToRef,\n\t\t\tnavigationMenus: getEntityRecords( ...navigationMenusQuery ),\n\t\t\tisResolvingNavigationMenus: isResolving(\n\t\t\t\t'getEntityRecords',\n\t\t\t\tnavigationMenusQuery\n\t\t\t),\n\t\t\thasResolvedNavigationMenus: hasFinishedResolution(\n\t\t\t\t'getEntityRecords',\n\t\t\t\tnavigationMenusQuery\n\t\t\t),\n\t\t};\n\t}, [] );\n\n\tconst navMenuListId = useInstanceId(\n\t\tNavigationMenu,\n\t\t'edit-site-navigation-inspector-menu'\n\t);\n\n\tconst firstNavRefInTemplate = clientIdToRef[ firstNavigationBlockId ];\n\tconst firstNavigationMenuRef = navigationMenus?.[ 0 ]?.id;\n\n\t// Default Navigation Menu is either:\n\t// - the Navigation Menu referenced by the first Nav block within the template.\n\t// - the first of the available Navigation Menus (`wp_navigation`) posts.\n\tconst defaultNavigationMenuId =\n\t\tfirstNavRefInTemplate || firstNavigationMenuRef;\n\n\t// The Navigation Menu manually selected by the user within the Nav inspector.\n\tconst [ currentMenuId, setCurrentMenuId ] = useState(\n\t\tfirstNavRefInTemplate\n\t);\n\n\t// If a Nav block is selected within the canvas then set the\n\t// Navigation Menu referenced by it's `ref` attribute  to be\n\t// active within the Navigation sidebar.\n\tuseEffect( () => {\n\t\tif ( selectedNavigationBlockId ) {\n\t\t\tsetCurrentMenuId( clientIdToRef[ selectedNavigationBlockId ] );\n\t\t}\n\t}, [ selectedNavigationBlockId ] );\n\n\tlet options = [];\n\tif ( navigationMenus ) {\n\t\toptions = navigationMenus.map( ( { id, title } ) => ( {\n\t\t\tvalue: id,\n\t\t\tlabel: title.rendered,\n\t\t} ) );\n\t}\n\n\tconst [ innerBlocks, onInput, onChange ] = useEntityBlockEditor(\n\t\t'postType',\n\t\t'wp_navigation',\n\t\t{ id: currentMenuId || defaultNavigationMenuId }\n\t);\n\n\tconst { isLoadingInnerBlocks, hasLoadedInnerBlocks } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { isResolving, hasFinishedResolution } = select( coreStore );\n\t\t\treturn {\n\t\t\t\tisLoadingInnerBlocks: isResolving( 'getEntityRecord', [\n\t\t\t\t\t'postType',\n\t\t\t\t\t'wp_navigation',\n\t\t\t\t\tcurrentMenuId || defaultNavigationMenuId,\n\t\t\t\t] ),\n\t\t\t\thasLoadedInnerBlocks: hasFinishedResolution(\n\t\t\t\t\t'getEntityRecord',\n\t\t\t\t\t[\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t'wp_navigation',\n\t\t\t\t\t\tcurrentMenuId || defaultNavigationMenuId,\n\t\t\t\t\t]\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ currentMenuId, defaultNavigationMenuId ]\n\t);\n\n\tconst isLoading = ! ( hasResolvedNavigationMenus && hasLoadedInnerBlocks );\n\n\tconst hasMoreThanOneNavigationMenu = navigationMenus?.length > 1;\n\n\tconst hasNavigationMenus = !! navigationMenus?.length;\n\n\t// Entity block editor will return entities that are not currently published.\n\t// Guard by only allowing their usage if there are published Nav Menus.\n\tconst publishedInnerBlocks = hasNavigationMenus ? innerBlocks : [];\n\n\tconst hasInnerBlocks = !! publishedInnerBlocks?.length;\n\n\tuseEffect( () => {\n\t\tif ( isResolvingNavigationMenus ) {\n\t\t\tspeak( 'Loading Navigation sidebar menus.' );\n\t\t}\n\n\t\tif ( hasResolvedNavigationMenus ) {\n\t\t\tspeak( 'Navigation sidebar menus have loaded.' );\n\t\t}\n\t}, [ isResolvingNavigationMenus, hasResolvedNavigationMenus ] );\n\n\tuseEffect( () => {\n\t\tif ( isLoadingInnerBlocks ) {\n\t\t\tspeak( 'Loading Navigation sidebar selected menu items.' );\n\t\t}\n\n\t\tif ( hasLoadedInnerBlocks ) {\n\t\t\tspeak( 'Navigation sidebar selected menu items have loaded.' );\n\t\t}\n\t}, [ isLoadingInnerBlocks, hasLoadedInnerBlocks ] );\n\n\treturn (\n\t\t<div className=\"edit-site-navigation-inspector\">\n\t\t\t{ hasResolvedNavigationMenus && ! hasNavigationMenus && (\n\t\t\t\t<p className=\"edit-site-navigation-inspector__empty-msg\">\n\t\t\t\t\t{ __( 'There are no Navigation Menus.' ) }\n\t\t\t\t</p>\n\t\t\t) }\n\n\t\t\t{ ! hasResolvedNavigationMenus && (\n\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder\" />\n\t\t\t) }\n\t\t\t{ hasResolvedNavigationMenus && hasMoreThanOneNavigationMenu && (\n\t\t\t\t<SelectControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tclassName=\"edit-site-navigation-inspector__select-menu\"\n\t\t\t\t\taria-controls={\n\t\t\t\t\t\t// aria-controls should only apply when referenced element is in DOM\n\t\t\t\t\t\thasLoadedInnerBlocks ? navMenuListId : undefined\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ currentMenuId || defaultNavigationMenuId }\n\t\t\t\t\toptions={ options }\n\t\t\t\t\tonChange={ ( newMenuId ) =>\n\t\t\t\t\t\tsetCurrentMenuId( Number( newMenuId ) )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isLoading && (\n\t\t\t\t<>\n\t\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder is-child\" />\n\t\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder is-child\" />\n\t\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder is-child\" />\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ hasInnerBlocks && ! isLoading && (\n\t\t\t\t<BlockEditorProvider\n\t\t\t\t\tvalue={ publishedInnerBlocks }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tonInput={ onInput }\n\t\t\t\t>\n\t\t\t\t\t<NavigationMenu\n\t\t\t\t\t\tinnerBlocks={ publishedInnerBlocks }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t/>\n\t\t\t\t</BlockEditorProvider>\n\t\t\t) }\n\n\t\t\t{ ! hasInnerBlocks && ! isLoading && (\n\t\t\t\t<p className=\"edit-site-navigation-inspector__empty-msg\">\n\t\t\t\t\t{ __( 'Navigation Menu is empty.' ) }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"]}

package/build/components/navigation-inspector/navigation-menu.js

@@ -1,62 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = NavigationMenu;
-
-var _element = require("@wordpress/element");
-
-var _blockEditor = require("@wordpress/block-editor");
-
-var _data = require("@wordpress/data");
-
-var _privateApis = require("../../private-apis");
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-const ALLOWED_BLOCKS = {
-  'core/navigation': ['core/navigation-link', 'core/search', 'core/social-links', 'core/page-list', 'core/spacer', 'core/home-link', 'core/site-title', 'core/site-logo', 'core/navigation-submenu'],
-  'core/social-links': ['core/social-link'],
-  'core/navigation-submenu': ['core/navigation-link', 'core/navigation-submenu'],
-  'core/navigation-link': ['core/navigation-link', 'core/navigation-submenu']
-};
-
-function NavigationMenu(_ref) {
-  let {
-    innerBlocks,
-    onSelect
-  } = _ref;
-  const {
-    updateBlockListSettings
-  } = (0, _data.useDispatch)(_blockEditor.store);
-  const {
-    OffCanvasEditor,
-    LeafMoreMenu
-  } = (0, _privateApis.unlock)(_blockEditor.privateApis); //TODO: Block settings are normally updated as a side effect of rendering InnerBlocks in BlockList
-  //Think through a better way of doing this, possible with adding allowed blocks to block library metadata
-
-  (0, _element.useEffect)(() => {
-    updateBlockListSettings('', {
-      allowedBlocks: ALLOWED_BLOCKS['core/navigation']
-    });
-    innerBlocks.forEach(block => {
-      if (ALLOWED_BLOCKS[block.name]) {
-        updateBlockListSettings(block.clientId, {
-          allowedBlocks: ALLOWED_BLOCKS[block.name]
-        });
-      }
-    });
-  }, [updateBlockListSettings, innerBlocks]);
-  return (0, _element.createElement)(OffCanvasEditor, {
-    blocks: innerBlocks,
-    onSelect: onSelect,
-    LeafMoreMenu: LeafMoreMenu
-  });
-}
-//# sourceMappingURL=navigation-menu.js.map

package/build/components/navigation-inspector/navigation-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/navigation-inspector/navigation-menu.js"],"names":["ALLOWED_BLOCKS","NavigationMenu","innerBlocks","onSelect","updateBlockListSettings","blockEditorStore","OffCanvasEditor","LeafMoreMenu","blockEditorPrivateApis","allowedBlocks","forEach","block","name","clientId"],"mappings":";;;;;;;AAOA;;AAJA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAQA;AACA;AACA;AAGA,MAAMA,cAAc,GAAG;AACtB,qBAAmB,CAClB,sBADkB,EAElB,aAFkB,EAGlB,mBAHkB,EAIlB,gBAJkB,EAKlB,aALkB,EAMlB,gBANkB,EAOlB,iBAPkB,EAQlB,gBARkB,EASlB,yBATkB,CADG;AAYtB,uBAAqB,CAAE,kBAAF,CAZC;AAatB,6BAA2B,CAC1B,sBAD0B,EAE1B,yBAF0B,CAbL;AAiBtB,0BAAwB,CACvB,sBADuB,EAEvB,yBAFuB;AAjBF,CAAvB;;AAuBe,SAASC,cAAT,OAAqD;AAAA,MAA5B;AAAEC,IAAAA,WAAF;AAAeC,IAAAA;AAAf,GAA4B;AACnE,QAAM;AAAEC,IAAAA;AAAF,MAA8B,uBAAaC,kBAAb,CAApC;AAEA,QAAM;AAAEC,IAAAA,eAAF;AAAmBC,IAAAA;AAAnB,MAAoC,yBAAQC,wBAAR,CAA1C,CAHmE,CAKnE;AACA;;AACA,0BAAW,MAAM;AAChBJ,IAAAA,uBAAuB,CAAE,EAAF,EAAM;AAC5BK,MAAAA,aAAa,EAAET,cAAc,CAAE,iBAAF;AADD,KAAN,CAAvB;AAGAE,IAAAA,WAAW,CAACQ,OAAZ,CAAuBC,KAAF,IAAa;AACjC,UAAKX,cAAc,CAAEW,KAAK,CAACC,IAAR,CAAnB,EAAoC;AACnCR,QAAAA,uBAAuB,CAAEO,KAAK,CAACE,QAAR,EAAkB;AACxCJ,UAAAA,aAAa,EAAET,cAAc,CAAEW,KAAK,CAACC,IAAR;AADW,SAAlB,CAAvB;AAGA;AACD,KAND;AAOA,GAXD,EAWG,CAAER,uBAAF,EAA2BF,WAA3B,CAXH;AAaA,SACC,4BAAC,eAAD;AACC,IAAA,MAAM,EAAGA,WADV;AAEC,IAAA,QAAQ,EAAGC,QAFZ;AAGC,IAAA,YAAY,EAAGI;AAHhB,IADD;AAOA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useEffect } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\n\nconst ALLOWED_BLOCKS = {\n\t'core/navigation': [\n\t\t'core/navigation-link',\n\t\t'core/search',\n\t\t'core/social-links',\n\t\t'core/page-list',\n\t\t'core/spacer',\n\t\t'core/home-link',\n\t\t'core/site-title',\n\t\t'core/site-logo',\n\t\t'core/navigation-submenu',\n\t],\n\t'core/social-links': [ 'core/social-link' ],\n\t'core/navigation-submenu': [\n\t\t'core/navigation-link',\n\t\t'core/navigation-submenu',\n\t],\n\t'core/navigation-link': [\n\t\t'core/navigation-link',\n\t\t'core/navigation-submenu',\n\t],\n};\n\nexport default function NavigationMenu( { innerBlocks, onSelect } ) {\n\tconst { updateBlockListSettings } = useDispatch( blockEditorStore );\n\n\tconst { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis );\n\n\t//TODO: Block settings are normally updated as a side effect of rendering InnerBlocks in BlockList\n\t//Think through a better way of doing this, possible with adding allowed blocks to block library metadata\n\tuseEffect( () => {\n\t\tupdateBlockListSettings( '', {\n\t\t\tallowedBlocks: ALLOWED_BLOCKS[ 'core/navigation' ],\n\t\t} );\n\t\tinnerBlocks.forEach( ( block ) => {\n\t\t\tif ( ALLOWED_BLOCKS[ block.name ] ) {\n\t\t\t\tupdateBlockListSettings( block.clientId, {\n\t\t\t\t\tallowedBlocks: ALLOWED_BLOCKS[ block.name ],\n\t\t\t\t} );\n\t\t\t}\n\t\t} );\n\t}, [ updateBlockListSettings, innerBlocks ] );\n\n\treturn (\n\t\t<OffCanvasEditor\n\t\t\tblocks={ innerBlocks }\n\t\t\tonSelect={ onSelect }\n\t\t\tLeafMoreMenu={ LeafMoreMenu }\n\t\t/>\n\t);\n}\n"]}