@wordpress/edit-site 5.1.0 → 5.2.0

package/build-module/components/layout/index.js

@@ -10,10 +10,10 @@ import classnames from 'classnames';
  */
 
 import { useSelect } from '@wordpress/data';
-import { __unstableMotion as motion, __unstableAnimatePresence as AnimatePresence, __unstableUseNavigateRegions as useNavigateRegions } from '@wordpress/components';
+import { __unstableMotion as motion, __unstableAnimatePresence as AnimatePresence, __unstableUseNavigateRegions as useNavigateRegions, ResizableBox } from '@wordpress/components';
 import { useReducedMotion, useViewportMatch, useResizeObserver } from '@wordpress/compose';
 import { __ } from '@wordpress/i18n';
-import { useState, useEffect } from '@wordpress/element';
+import { useState, useEffect, useRef } from '@wordpress/element';
 import { NavigableRegion } from '@wordpress/interface';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
 /**
@@ -30,13 +30,28 @@ import getIsListPage from '../../utils/get-is-list-page';
 import Header from '../header-edit-mode';
 import useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';
 import SiteHub from '../site-hub';
+import ResizeHandle from '../block-editor/resize-handle';
+import useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';
 const ANIMATION_DURATION = 0.5;
+const emptyResizeHandleStyles = {
+  position: undefined,
+  userSelect: undefined,
+  cursor: undefined,
+  width: undefined,
+  height: undefined,
+  top: undefined,
+  right: undefined,
+  bottom: undefined,
+  left: undefined
+};
 export default function Layout(_ref) {
   let {
     onError
   } = _ref;
   // This ensures the edited entity id and type are initialized properly.
   useInitEditedEntityFromURL();
+  useSyncCanvasModeWithURL();
+  const hubRef = useRef();
   const {
     params
   } = useLocation();
@@ -74,6 +89,16 @@ export default function Layout(_ref) {
 
   const [canvasResizer, canvasSize] = useResizeObserver();
   const [fullResizer, fullSize] = useResizeObserver();
+  const [forcedWidth, setForcedWidth] = useState(null);
+  const [isResizing, setIsResizing] = useState(false);
+  const isResizingEnabled = !isMobileViewport && canvasMode === 'view';
+  const defaultSidebarWidth = isMobileViewport ? '100vw' : 360;
+  let canvasWidth = isResizing ? '100%' : fullSize.width;
+
+  if (showFrame && !isResizing) {
+    canvasWidth = canvasSize.width - canvasPadding;
+  }
+
   useEffect(() => {
     if (canvasMode === 'view' && isMobileViewport) {
       setIsMobileCanvasVisible(false);
@@ -82,7 +107,14 @@ export default function Layout(_ref) {
     if (canvasMode === 'edit' && isMobileViewport) {
       setIsMobileCanvasVisible(true);
     }
-  }, [canvasMode, isMobileViewport]);
+  }, [canvasMode, isMobileViewport]); // Synchronizing the URL with the store value of canvasMode happens in an effect
+  // This condition ensures the component is only rendered after the synchronization happens
+  // which prevents any animations due to potential canvasMode value change.
+
+  if (canvasMode === 'init') {
+    return null;
+  }
+
   return createElement(Fragment, null, fullResizer, createElement("div", _extends({}, navigateRegionsProps, {
     ref: navigateRegionsProps.ref,
     className: classnames('edit-site-layout', navigateRegionsProps.className, {
@@ -90,7 +122,11 @@ export default function Layout(_ref) {
       'is-edit-mode': canvasMode === 'edit'
     })
   }), createElement(SiteHub, {
+    ref: hubRef,
     className: "edit-site-layout__hub",
+    style: {
+      width: isResizingEnabled && forcedWidth ? forcedWidth - 48 : undefined
+    },
     isMobileCanvasVisible: isMobileCanvasVisible,
     setIsMobileCanvasVisible: setIsMobileCanvasVisible
   }), createElement(AnimatePresence, {
@@ -117,7 +153,7 @@ export default function Layout(_ref) {
     className: "edit-site-layout__content"
   }, createElement(AnimatePresence, {
     initial: false
-  }, showSidebar && createElement(NavigableRegion, {
+  }, showSidebar && createElement(ResizableBox, {
     as: motion.div,
     initial: {
       opacity: 0
@@ -130,13 +166,48 @@ export default function Layout(_ref) {
     },
     transition: {
       type: 'tween',
-      duration: disableMotion ? 0 : ANIMATION_DURATION,
+      duration: disableMotion || isResizing ? 0 : ANIMATION_DURATION,
       ease: 'easeOut'
     },
+    size: {
+      height: '100%',
+      width: isResizingEnabled && forcedWidth ? forcedWidth : defaultSidebarWidth
+    },
     className: "edit-site-layout__sidebar",
+    enable: {
+      right: isResizingEnabled
+    },
+    onResizeStop: (event, direction, elt) => {
+      setForcedWidth(elt.clientWidth);
+      setIsResizing(false);
+    },
+    onResizeStart: () => {
+      setIsResizing(true);
+    },
+    onResize: (event, direction, elt) => {
+      // This is a performance optimization
+      // We set the width imperatively to avoid re-rendering
+      // the whole component while resizing.
+      hubRef.current.style.width = elt.clientWidth - 48 + 'px';
+    },
+    handleComponent: {
+      right: createElement(ResizeHandle, {
+        direction: "right",
+        variation: "separator"
+      })
+    },
+    handleClasses: undefined,
+    handleStyles: {
+      right: emptyResizeHandleStyles
+    },
+    minWidth: isResizingEnabled ? 320 : undefined,
+    maxWidth: isResizingEnabled && fullSize ? fullSize.width - 360 : undefined
+  }, createElement(NavigableRegion, {
     ariaLabel: __('Navigation sidebar')
-  }, createElement(Sidebar, null))), showCanvas && createElement("div", {
-    className: "edit-site-layout__canvas-container",
+  }, createElement(Sidebar, null)))), showCanvas && createElement("div", {
+    className: classnames('edit-site-layout__canvas-container', {
+      'is-resizing': isResizing
+    }),
     style: {
       paddingTop: showFrame ? canvasPadding : 0,
       paddingBottom: showFrame ? canvasPadding : 0
@@ -147,7 +218,7 @@ export default function Layout(_ref) {
     className: "edit-site-layout__canvas",
     transition: {
       type: 'tween',
-      duration: disableMotion ? 0 : ANIMATION_DURATION,
+      duration: disableMotion || isResizing ? 0 : ANIMATION_DURATION,
       ease: 'easeOut'
     }
   }, createElement(motion.div, {
@@ -159,11 +230,11 @@ export default function Layout(_ref) {
     },
     initial: false,
     animate: {
-      width: showFrame ? canvasSize.width - canvasPadding : fullSize.width
+      width: canvasWidth
     },
     transition: {
       type: 'tween',
-      duration: disableMotion ? 0 : ANIMATION_DURATION,
+      duration: disableMotion || isResizing ? 0 : ANIMATION_DURATION,
       ease: 'easeOut'
     }
   }, createElement(ErrorBoundary, {

package/build-module/components/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/layout/index.js"],"names":["classnames","useSelect","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","__unstableUseNavigateRegions","useNavigateRegions","useReducedMotion","useViewportMatch","useResizeObserver","__","useState","useEffect","NavigableRegion","store","keyboardShortcutsStore","Sidebar","Editor","ListPage","ErrorBoundary","editSiteStore","useLocation","getIsListPage","Header","useInitEditedEntityFromURL","SiteHub","ANIMATION_DURATION","Layout","onError","params","isListPage","isEditorPage","canvasMode","previousShortcut","nextShortcut","select","getAllShortcutKeyCombinations","__unstableGetCanvasMode","navigateRegionsProps","previous","next","disableMotion","isMobileViewport","isMobileCanvasVisible","setIsMobileCanvasVisible","canvasPadding","showSidebar","showCanvas","showFrame","isFullCanvas","canvasResizer","canvasSize","fullResizer","fullSize","ref","className","div","y","type","duration","ease","opacity","paddingTop","paddingBottom","width","position","top","left","bottom"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useEffect } from '@wordpress/element';\nimport { NavigableRegion } from '@wordpress/interface';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\n\n/**\n * Internal dependencies\n */\nimport Sidebar from '../sidebar';\nimport Editor from '../editor';\nimport ListPage from '../list';\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport { useLocation } from '../routes';\nimport getIsListPage from '../../utils/get-is-list-page';\nimport Header from '../header-edit-mode';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\n\nconst ANIMATION_DURATION = 0.5;\n\nexport default function Layout( { onError } ) {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\n\tconst { params } = useLocation();\n\tconst isListPage = getIsListPage( params );\n\tconst isEditorPage = ! isListPage;\n\tconst { canvasMode, previousShortcut, nextShortcut } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\t\tkeyboardShortcutsStore\n\t\t\t);\n\t\t\tconst { __unstableGetCanvasMode } = select( editSiteStore );\n\t\t\treturn {\n\t\t\t\tcanvasMode: __unstableGetCanvasMode(),\n\t\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t\t'core/edit-site/previous-region'\n\t\t\t\t),\n\t\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t\t'core/edit-site/next-region'\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst [ isMobileCanvasVisible, setIsMobileCanvasVisible ] =\n\t\tuseState( false );\n\tconst canvasPadding = isMobileViewport ? 0 : 24;\n\tconst showSidebar =\n\t\t( isMobileViewport && ! isMobileCanvasVisible ) ||\n\t\t( ! isMobileViewport && ( canvasMode === 'view' || ! isEditorPage ) );\n\tconst showCanvas =\n\t\t( isMobileViewport && isMobileCanvasVisible ) || ! isMobileViewport;\n\tconst showFrame =\n\t\t! isEditorPage || ( canvasMode === 'view' && ! isMobileViewport );\n\n\tconst isFullCanvas =\n\t\t( isEditorPage && canvasMode === 'edit' && ! isMobileViewport ) ||\n\t\tisMobileCanvasVisible;\n\t// Ideally this effect could be removed if we move the \"isMobileCanvasVisible\" into the store.\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer, fullSize ] = useResizeObserver();\n\tuseEffect( () => {\n\t\tif ( canvasMode === 'view' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( false );\n\t\t}\n\n\t\tif ( canvasMode === 'edit' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( true );\n\t\t}\n\t}, [ canvasMode, isMobileViewport ] );\n\n\treturn (\n\t\t<>\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-full-canvas': isFullCanvas,\n\t\t\t\t\t\t'is-edit-mode': canvasMode === 'edit',\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<SiteHub\n\t\t\t\t\tclassName=\"edit-site-layout__hub\"\n\t\t\t\t\tisMobileCanvasVisible={ isMobileCanvasVisible }\n\t\t\t\t\tsetIsMobileCanvasVisible={ setIsMobileCanvasVisible }\n\t\t\t\t/>\n\n\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t{ isEditorPage &&\n\t\t\t\t\t\t( canvasMode === 'edit' || isMobileCanvasVisible ) && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__header\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Editor top bar' ) }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\ty: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ canvasMode === 'edit' && <Header /> }\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t</AnimatePresence>\n\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ showSidebar && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Navigation sidebar' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Sidebar />\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\n\t\t\t\t\t{ showCanvas && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__canvas-container\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tpaddingTop: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\t\tpaddingBottom: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\tlayout=\"position\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__canvas\"\n\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t\t\t\t\tbottom: 0,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\twidth: showFrame\n\t\t\t\t\t\t\t\t\t\t\t\t? canvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t  canvasPadding\n\t\t\t\t\t\t\t\t\t\t\t\t: fullSize.width,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<ErrorBoundary onError={ onError }>\n\t\t\t\t\t\t\t\t\t\t\t{ isEditorPage && <Editor /> }\n\t\t\t\t\t\t\t\t\t\t\t{ isListPage && <ListPage /> }\n\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/layout/index.js"],"names":["classnames","useSelect","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","__unstableUseNavigateRegions","useNavigateRegions","ResizableBox","useReducedMotion","useViewportMatch","useResizeObserver","__","useState","useEffect","useRef","NavigableRegion","store","keyboardShortcutsStore","Sidebar","Editor","ListPage","ErrorBoundary","editSiteStore","useLocation","getIsListPage","Header","useInitEditedEntityFromURL","SiteHub","ResizeHandle","useSyncCanvasModeWithURL","ANIMATION_DURATION","emptyResizeHandleStyles","position","undefined","userSelect","cursor","width","height","top","right","bottom","left","Layout","onError","hubRef","params","isListPage","isEditorPage","canvasMode","previousShortcut","nextShortcut","select","getAllShortcutKeyCombinations","__unstableGetCanvasMode","navigateRegionsProps","previous","next","disableMotion","isMobileViewport","isMobileCanvasVisible","setIsMobileCanvasVisible","canvasPadding","showSidebar","showCanvas","showFrame","isFullCanvas","canvasResizer","canvasSize","fullResizer","fullSize","forcedWidth","setForcedWidth","isResizing","setIsResizing","isResizingEnabled","defaultSidebarWidth","canvasWidth","ref","className","div","y","type","duration","ease","opacity","event","direction","elt","clientWidth","current","style","paddingTop","paddingBottom"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n\tResizableBox,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { NavigableRegion } from '@wordpress/interface';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\n\n/**\n * Internal dependencies\n */\nimport Sidebar from '../sidebar';\nimport Editor from '../editor';\nimport ListPage from '../list';\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport { useLocation } from '../routes';\nimport getIsListPage from '../../utils/get-is-list-page';\nimport Header from '../header-edit-mode';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\nimport ResizeHandle from '../block-editor/resize-handle';\nimport useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';\n\nconst ANIMATION_DURATION = 0.5;\nconst emptyResizeHandleStyles = {\n\tposition: undefined,\n\tuserSelect: undefined,\n\tcursor: undefined,\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\nexport default function Layout( { onError } ) {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\tuseSyncCanvasModeWithURL();\n\n\tconst hubRef = useRef();\n\tconst { params } = useLocation();\n\tconst isListPage = getIsListPage( params );\n\tconst isEditorPage = ! isListPage;\n\tconst { canvasMode, previousShortcut, nextShortcut } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\t\tkeyboardShortcutsStore\n\t\t\t);\n\t\t\tconst { __unstableGetCanvasMode } = select( editSiteStore );\n\t\t\treturn {\n\t\t\t\tcanvasMode: __unstableGetCanvasMode(),\n\t\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t\t'core/edit-site/previous-region'\n\t\t\t\t),\n\t\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t\t'core/edit-site/next-region'\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst [ isMobileCanvasVisible, setIsMobileCanvasVisible ] =\n\t\tuseState( false );\n\tconst canvasPadding = isMobileViewport ? 0 : 24;\n\tconst showSidebar =\n\t\t( isMobileViewport && ! isMobileCanvasVisible ) ||\n\t\t( ! isMobileViewport && ( canvasMode === 'view' || ! isEditorPage ) );\n\tconst showCanvas =\n\t\t( isMobileViewport && isMobileCanvasVisible ) || ! isMobileViewport;\n\tconst showFrame =\n\t\t! isEditorPage || ( canvasMode === 'view' && ! isMobileViewport );\n\n\tconst isFullCanvas =\n\t\t( isEditorPage && canvasMode === 'edit' && ! isMobileViewport ) ||\n\t\tisMobileCanvasVisible;\n\t// Ideally this effect could be removed if we move the \"isMobileCanvasVisible\" into the store.\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer, fullSize ] = useResizeObserver();\n\tconst [ forcedWidth, setForcedWidth ] = useState( null );\n\tconst [ isResizing, setIsResizing ] = useState( false );\n\tconst isResizingEnabled = ! isMobileViewport && canvasMode === 'view';\n\tconst defaultSidebarWidth = isMobileViewport ? '100vw' : 360;\n\tlet canvasWidth = isResizing ? '100%' : fullSize.width;\n\tif ( showFrame && ! isResizing ) {\n\t\tcanvasWidth = canvasSize.width - canvasPadding;\n\t}\n\tuseEffect( () => {\n\t\tif ( canvasMode === 'view' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( false );\n\t\t}\n\n\t\tif ( canvasMode === 'edit' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( true );\n\t\t}\n\t}, [ canvasMode, isMobileViewport ] );\n\n\t// Synchronizing the URL with the store value of canvasMode happens in an effect\n\t// This condition ensures the component is only rendered after the synchronization happens\n\t// which prevents any animations due to potential canvasMode value change.\n\tif ( canvasMode === 'init' ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-full-canvas': isFullCanvas,\n\t\t\t\t\t\t'is-edit-mode': canvasMode === 'edit',\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<SiteHub\n\t\t\t\t\tref={ hubRef }\n\t\t\t\t\tclassName=\"edit-site-layout__hub\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\tisResizingEnabled && forcedWidth\n\t\t\t\t\t\t\t\t? forcedWidth - 48\n\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} }\n\t\t\t\t\tisMobileCanvasVisible={ isMobileCanvasVisible }\n\t\t\t\t\tsetIsMobileCanvasVisible={ setIsMobileCanvasVisible }\n\t\t\t\t/>\n\n\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t{ isEditorPage &&\n\t\t\t\t\t\t( canvasMode === 'edit' || isMobileCanvasVisible ) && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__header\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Editor top bar' ) }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\ty: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ canvasMode === 'edit' && <Header /> }\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t</AnimatePresence>\n\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ showSidebar && (\n\t\t\t\t\t\t\t<ResizableBox\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\tdisableMotion || isResizing\n\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tsize={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\tisResizingEnabled && forcedWidth\n\t\t\t\t\t\t\t\t\t\t\t? forcedWidth\n\t\t\t\t\t\t\t\t\t\t\t: defaultSidebarWidth,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\tenable={ {\n\t\t\t\t\t\t\t\t\tright: isResizingEnabled,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tonResizeStop={ ( event, direction, elt ) => {\n\t\t\t\t\t\t\t\t\tsetForcedWidth( elt.clientWidth );\n\t\t\t\t\t\t\t\t\tsetIsResizing( false );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tonResizeStart={ () => {\n\t\t\t\t\t\t\t\t\tsetIsResizing( true );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tonResize={ ( event, direction, elt ) => {\n\t\t\t\t\t\t\t\t\t// This is a performance optimization\n\t\t\t\t\t\t\t\t\t// We set the width imperatively to avoid re-rendering\n\t\t\t\t\t\t\t\t\t// the whole component while resizing.\n\t\t\t\t\t\t\t\t\thubRef.current.style.width =\n\t\t\t\t\t\t\t\t\t\telt.clientWidth - 48 + 'px';\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\thandleComponent={ {\n\t\t\t\t\t\t\t\t\tright: (\n\t\t\t\t\t\t\t\t\t\t<ResizeHandle\n\t\t\t\t\t\t\t\t\t\t\tdirection=\"right\"\n\t\t\t\t\t\t\t\t\t\t\tvariation=\"separator\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\thandleClasses={ undefined }\n\t\t\t\t\t\t\t\thandleStyles={ {\n\t\t\t\t\t\t\t\t\tright: emptyResizeHandleStyles,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tminWidth={ isResizingEnabled ? 320 : undefined }\n\t\t\t\t\t\t\t\tmaxWidth={\n\t\t\t\t\t\t\t\t\tisResizingEnabled && fullSize\n\t\t\t\t\t\t\t\t\t\t? fullSize.width - 360\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\t\tariaLabel={ __( 'Navigation sidebar' ) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Sidebar />\n\t\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t\t</ResizableBox>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\n\t\t\t\t\t{ showCanvas && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'edit-site-layout__canvas-container',\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t'is-resizing': isResizing,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tpaddingTop: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\t\tpaddingBottom: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\tlayout=\"position\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__canvas\"\n\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\tdisableMotion || isResizing\n\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t\t\t\t\tbottom: 0,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\twidth: canvasWidth,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion || isResizing\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<ErrorBoundary onError={ onError }>\n\t\t\t\t\t\t\t\t\t\t\t{ isEditorPage && <Editor /> }\n\t\t\t\t\t\t\t\t\t\t\t{ isListPage && <ListPage /> }\n\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}

package/build-module/components/sidebar-edit-mode/navigation-menu-sidebar/navigation-inspector.js

@@ -143,6 +143,8 @@ export default function NavigationInspector() {
   }, __('There are no Navigation Menus.')), !hasResolvedNavigationMenus && createElement("div", {
     className: "edit-site-navigation-inspector__placeholder"
   }), hasResolvedNavigationMenus && hasMoreThanOneNavigationMenu && createElement(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,

package/build-module/components/sidebar-edit-mode/navigation-menu-sidebar/navigation-inspector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/navigation-menu-sidebar/navigation-inspector.js"],"names":["useSelect","useState","useEffect","SelectControl","store","coreStore","useEntityBlockEditor","blockEditorStore","BlockEditorProvider","speak","useInstanceId","__","NavigationMenu","NAVIGATION_MENUS_QUERY","per_page","status","NavigationInspector","selectedNavigationBlockId","clientIdToRef","navigationMenus","isResolvingNavigationMenus","hasResolvedNavigationMenus","firstNavigationBlockId","select","__experimentalGetActiveBlockIdByBlockNames","__experimentalGetGlobalBlocksByName","getBlock","getEntityRecords","hasFinishedResolution","isResolving","navigationMenusQuery","selectedNavId","navBlockIds","idToRef","forEach","id","attributes","ref","navMenuListId","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":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,iBAA1B;AACA,SAASC,QAAT,EAAmBC,SAAnB,QAAoC,oBAApC;AACA,SAASC,aAAT,QAA8B,uBAA9B;AACA,SAASC,KAAK,IAAIC,SAAlB,EAA6BC,oBAA7B,QAAyD,sBAAzD;AACA,SACCF,KAAK,IAAIG,gBADV,EAECC,mBAFD,QAGO,yBAHP;AAIA,SAASC,KAAT,QAAsB,iBAAtB;AACA,SAASC,aAAT,QAA8B,oBAA9B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,cAAP,MAA2B,mBAA3B;AAEA,MAAMC,sBAAsB,GAAG,CAAE;AAAEC,EAAAA,QAAQ,EAAE,CAAC,CAAb;AAAgBC,EAAAA,MAAM,EAAE;AAAxB,CAAF,CAA/B;AAEA,eAAe,SAASC,mBAAT,GAA+B;AAAA;;AAC7C,QAAM;AACLC,IAAAA,yBADK;AAELC,IAAAA,aAFK;AAGLC,IAAAA,eAHK;AAILC,IAAAA,0BAJK;AAKLC,IAAAA,0BALK;AAMLC,IAAAA;AANK,MAOFtB,SAAS,CAAIuB,MAAF,IAAc;AAC5B,UAAM;AACLC,MAAAA,0CADK;AAELC,MAAAA,mCAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAEhB,gBAAF,CAJV;AAMA,UAAM;AAAEoB,MAAAA,gBAAF;AAAoBC,MAAAA,qBAApB;AAA2CC,MAAAA;AAA3C,QACLN,MAAM,CAAElB,SAAF,CADP;AAGA,UAAMyB,oBAAoB,GAAG,CAC5B,UAD4B,EAE5B,eAF4B,EAG5BjB,sBAAsB,CAAE,CAAF,CAHM,CAA7B,CAV4B,CAgB5B;;AACA,UAAMkB,aAAa,GAClBP,0CAA0C,CAAE,iBAAF,CAD3C,CAjB4B,CAoB5B;;;AACA,UAAMQ,WAAW,GAChBP,mCAAmC,CAAE,iBAAF,CADpC;;AAEA,UAAMQ,OAAO,GAAG,EAAhB;AACAD,IAAAA,WAAW,CAACE,OAAZ,CAAuBC,EAAF,IAAU;AAAA;;AAC9BF,MAAAA,OAAO,CAAEE,EAAF,CAAP,gBAAgBT,QAAQ,CAAES,EAAF,CAAxB,sEAAgB,UAAgBC,UAAhC,yDAAgB,qBAA4BC,GAA5C;AACA,KAFD;AAGA,WAAO;AACNpB,MAAAA,yBAAyB,EAAEc,aADrB;AAENT,MAAAA,sBAAsB,EAAEU,WAAF,aAAEA,WAAF,uBAAEA,WAAW,CAAI,CAAJ,CAF7B;AAGNd,MAAAA,aAAa,EAAEe,OAHT;AAINd,MAAAA,eAAe,EAAEQ,gBAAgB,CAAE,GAAGG,oBAAL,CAJ3B;AAKNV,MAAAA,0BAA0B,EAAES,WAAW,CACtC,kBADsC,EAEtCC,oBAFsC,CALjC;AASNT,MAAAA,0BAA0B,EAAEO,qBAAqB,CAChD,kBADgD,EAEhDE,oBAFgD;AAT3C,KAAP;AAcA,GAzCY,EAyCV,EAzCU,CAPb;AAkDA,QAAMQ,aAAa,GAAG5B,aAAa,CAClCE,cADkC,EAElC,qCAFkC,CAAnC;AAKA,QAAM2B,qBAAqB,GAAGrB,aAAa,CAAEI,sBAAF,CAA3C;AACA,QAAMkB,sBAAsB,GAAGrB,eAAH,aAAGA,eAAH,4CAAGA,eAAe,CAAI,CAAJ,CAAlB,sDAAG,kBAAwBgB,EAAvD,CAzD6C,CA2D7C;AACA;AACA;;AACA,QAAMM,uBAAuB,GAC5BF,qBAAqB,IAAIC,sBAD1B,CA9D6C,CAiE7C;;AACA,QAAM,CAAEE,aAAF,EAAiBC,gBAAjB,IAAsC1C,QAAQ,CACnDsC,qBADmD,CAApD,CAlE6C,CAsE7C;AACA;AACA;;AACArC,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKe,yBAAL,EAAiC;AAChC0B,MAAAA,gBAAgB,CAAEzB,aAAa,CAAED,yBAAF,CAAf,CAAhB;AACA;AACD,GAJQ,EAIN,CAAEA,yBAAF,CAJM,CAAT;AAMA,MAAI2B,OAAO,GAAG,EAAd;;AACA,MAAKzB,eAAL,EAAuB;AACtByB,IAAAA,OAAO,GAAGzB,eAAe,CAAC0B,GAAhB,CAAqB;AAAA,UAAE;AAAEV,QAAAA,EAAF;AAAMW,QAAAA;AAAN,OAAF;AAAA,aAAuB;AACrDC,QAAAA,KAAK,EAAEZ,EAD8C;AAErDa,QAAAA,KAAK,EAAEF,KAAK,CAACG;AAFwC,OAAvB;AAAA,KAArB,CAAV;AAIA;;AAED,QAAM,CAAEC,WAAF,EAAeC,OAAf,EAAwBC,QAAxB,IAAqC9C,oBAAoB,CAC9D,UAD8D,EAE9D,eAF8D,EAG9D;AAAE6B,IAAAA,EAAE,EAAEO,aAAa,IAAID;AAAvB,GAH8D,CAA/D;AAMA,QAAM;AAAEY,IAAAA,oBAAF;AAAwBC,IAAAA;AAAxB,MAAiDtD,SAAS,CAC7DuB,MAAF,IAAc;AACb,UAAM;AAAEM,MAAAA,WAAF;AAAeD,MAAAA;AAAf,QAAyCL,MAAM,CAAElB,SAAF,CAArD;AACA,WAAO;AACNgD,MAAAA,oBAAoB,EAAExB,WAAW,CAAE,iBAAF,EAAqB,CACrD,UADqD,EAErD,eAFqD,EAGrDa,aAAa,IAAID,uBAHoC,CAArB,CAD3B;AAMNa,MAAAA,oBAAoB,EAAE1B,qBAAqB,CAC1C,iBAD0C,EAE1C,CACC,UADD,EAEC,eAFD,EAGCc,aAAa,IAAID,uBAHlB,CAF0C;AANrC,KAAP;AAeA,GAlB8D,EAmB/D,CAAEC,aAAF,EAAiBD,uBAAjB,CAnB+D,CAAhE;AAsBA,QAAMc,SAAS,GAAG,EAAIlC,0BAA0B,IAAIiC,oBAAlC,CAAlB;AAEA,QAAME,4BAA4B,GAAG,CAAArC,eAAe,SAAf,IAAAA,eAAe,WAAf,YAAAA,eAAe,CAAEsC,MAAjB,IAA0B,CAA/D;AAEA,QAAMC,kBAAkB,GAAG,CAAC,EAAEvC,eAAF,aAAEA,eAAF,eAAEA,eAAe,CAAEsC,MAAnB,CAA5B,CAvH6C,CAyH7C;AACA;;AACA,QAAME,oBAAoB,GAAGD,kBAAkB,GAAGR,WAAH,GAAiB,EAAhE;AAEA,QAAMU,cAAc,GAAG,CAAC,EAAED,oBAAF,aAAEA,oBAAF,eAAEA,oBAAoB,CAAEF,MAAxB,CAAxB;AAEAvD,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKkB,0BAAL,EAAkC;AACjCX,MAAAA,KAAK,CAAE,mCAAF,CAAL;AACA;;AAED,QAAKY,0BAAL,EAAkC;AACjCZ,MAAAA,KAAK,CAAE,uCAAF,CAAL;AACA;AACD,GARQ,EAQN,CAAEW,0BAAF,EAA8BC,0BAA9B,CARM,CAAT;AAUAnB,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKmD,oBAAL,EAA4B;AAC3B5C,MAAAA,KAAK,CAAE,iDAAF,CAAL;AACA;;AAED,QAAK6C,oBAAL,EAA4B;AAC3B7C,MAAAA,KAAK,CAAE,qDAAF,CAAL;AACA;AACD,GARQ,EAQN,CAAE4C,oBAAF,EAAwBC,oBAAxB,CARM,CAAT;AAUA,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGjC,0BAA0B,IAAI,CAAEqC,kBAAhC,IACD;AAAG,IAAA,SAAS,EAAC;AAAb,KACG/C,EAAE,CAAE,gCAAF,CADL,CAFF,EAOG,CAAEU,0BAAF,IACD;AAAK,IAAA,SAAS,EAAC;AAAf,IARF,EAUGA,0BAA0B,IAAImC,4BAA9B,IACD,cAAC,aAAD;AACC,qBACC;AACAF,IAAAA,oBAAoB,GAAGhB,aAAH,GAAmBuB,SAHzC;AAKC,IAAA,KAAK,EAAGnB,aAAa,IAAID,uBAL1B;AAMC,IAAA,OAAO,EAAGG,OANX;AAOC,IAAA,QAAQ,EAAKkB,SAAF,IACVnB,gBAAgB,CAAEoB,MAAM,CAAED,SAAF,CAAR;AARlB,IAXF,EAuBGP,SAAS,IACV,8BACC;AAAK,IAAA,SAAS,EAAC;AAAf,IADD,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,IAFD,EAGC;AAAK,IAAA,SAAS,EAAC;AAAf,IAHD,CAxBF,EA8BGK,cAAc,IAAI,CAAEL,SAApB,IACD,cAAC,mBAAD;AACC,IAAA,KAAK,EAAGI,oBADT;AAEC,IAAA,QAAQ,EAAGP,QAFZ;AAGC,IAAA,OAAO,EAAGD;AAHX,KAKC,cAAC,cAAD;AACC,IAAA,EAAE,EAAGb,aADN;AAEC,IAAA,WAAW,EAAGqB;AAFf,IALD,CA/BF,EA2CG,CAAEC,cAAF,IAAoB,CAAEL,SAAtB,IACD;AAAG,IAAA,SAAS,EAAC;AAAb,KACG5C,EAAE,CAAE,2BAAF,CADL,CA5CF,CADD;AAmDA","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() {\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\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\tid={ navMenuListId }\n\t\t\t\t\t\tinnerBlocks={ publishedInnerBlocks }\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"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/navigation-menu-sidebar/navigation-inspector.js"],"names":["useSelect","useState","useEffect","SelectControl","store","coreStore","useEntityBlockEditor","blockEditorStore","BlockEditorProvider","speak","useInstanceId","__","NavigationMenu","NAVIGATION_MENUS_QUERY","per_page","status","NavigationInspector","selectedNavigationBlockId","clientIdToRef","navigationMenus","isResolvingNavigationMenus","hasResolvedNavigationMenus","firstNavigationBlockId","select","__experimentalGetActiveBlockIdByBlockNames","__experimentalGetGlobalBlocksByName","getBlock","getEntityRecords","hasFinishedResolution","isResolving","navigationMenusQuery","selectedNavId","navBlockIds","idToRef","forEach","id","attributes","ref","navMenuListId","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() {\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\tid={ navMenuListId }\n\t\t\t\t\t\tinnerBlocks={ publishedInnerBlocks }\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-module/components/site-hub/index.js

@@ -15,6 +15,7 @@ import { useReducedMotion, useViewportMatch } from '@wordpress/compose';
 import { __ } from '@wordpress/i18n';
 import { store as blockEditorStore } from '@wordpress/block-editor';
 import { store as coreStore } from '@wordpress/core-data';
+import { forwardRef } from '@wordpress/element';
 /**
  * Internal dependencies
  */
@@ -25,12 +26,11 @@ import getIsListPage from '../../utils/get-is-list-page';
 import SiteIcon from '../site-icon';
 import useEditedEntityRecord from '../use-edited-entity-record';
 const HUB_ANIMATION_DURATION = 0.3;
-
-function SiteHub(_ref) {
+const SiteHub = forwardRef((_ref, ref) => {
   let {
-    className,
     isMobileCanvasVisible,
-    setIsMobileCanvasVisible
+    setIsMobileCanvasVisible,
+    ...props
   } = _ref;
   const {
     params
@@ -80,15 +80,17 @@ function SiteHub(_ref) {
   const {
     getTitle
   } = useEditedEntityRecord();
-  return createElement(motion.div, {
-    className: classnames('edit-site-site-hub', className),
+  return createElement(motion.div, _extends({
+    ref: ref
+  }, props, {
+    className: classnames('edit-site-site-hub', props.className),
     layout: true,
     transition: {
       type: 'tween',
       duration: disableMotion ? 0 : HUB_ANIMATION_DURATION,
       ease: 'easeOut'
     }
-  }, createElement(HStack, {
+  }), createElement(HStack, {
     justify: "flex-start",
     className: "edit-site-site-hub__text-content"
   }, createElement(motion.div, {
@@ -120,7 +122,6 @@ function SiteHub(_ref) {
     onClick: () => setIsMobileCanvasVisible(true),
     variant: "primary"
   }, __('View Editor')));
-}
-
+});
 export default SiteHub;
 //# sourceMappingURL=index.js.map

package/build-module/components/site-hub/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/site-hub/index.js"],"names":["classnames","useSelect","useDispatch","Button","__unstableMotion","motion","__experimentalHStack","HStack","__experimentalVStack","VStack","useReducedMotion","useViewportMatch","__","store","blockEditorStore","coreStore","editSiteStore","useLocation","getIsListPage","SiteIcon","useEditedEntityRecord","HUB_ANIMATION_DURATION","SiteHub","className","isMobileCanvasVisible","setIsMobileCanvasVisible","params","isListPage","isEditorPage","canvasMode","dashboardLink","entityConfig","select","getEditedPostType","__unstableGetCanvasMode","getSettings","__experimentalDashboardLink","getEntityConfig","disableMotion","isMobileViewport","__unstableSetCanvasMode","clearSelectedBlock","showEditButton","isBackToDashboardButton","showLabels","siteIconButtonProps","href","label","onClick","getTitle","type","duration","ease"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tButton,\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useViewportMatch } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { useLocation } from '../routes';\nimport getIsListPage from '../../utils/get-is-list-page';\nimport SiteIcon from '../site-icon';\nimport useEditedEntityRecord from '../use-edited-entity-record';\n\nconst HUB_ANIMATION_DURATION = 0.3;\n\nfunction SiteHub( {\n\tclassName,\n\tisMobileCanvasVisible,\n\tsetIsMobileCanvasVisible,\n} ) {\n\tconst { params } = useLocation();\n\tconst isListPage = getIsListPage( params );\n\tconst isEditorPage = ! isListPage;\n\tconst { canvasMode, dashboardLink, entityConfig } = useSelect(\n\t\t( select ) => {\n\t\t\tselect( editSiteStore ).getEditedPostType();\n\t\t\tconst { __unstableGetCanvasMode, getSettings, getEditedPostType } =\n\t\t\t\tselect( editSiteStore );\n\t\t\treturn {\n\t\t\t\tcanvasMode: __unstableGetCanvasMode(),\n\t\t\t\tdashboardLink: getSettings().__experimentalDashboardLink,\n\t\t\t\tentityConfig: select( coreStore ).getEntityConfig(\n\t\t\t\t\t'postType',\n\t\t\t\t\tgetEditedPostType()\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst { __unstableSetCanvasMode } = useDispatch( editSiteStore );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst showEditButton =\n\t\t( isEditorPage && canvasMode === 'view' && ! isMobileViewport ) ||\n\t\t( isMobileViewport && canvasMode === 'view' && isMobileCanvasVisible );\n\tconst isBackToDashboardButton =\n\t\t( ! isMobileViewport && canvasMode === 'view' ) ||\n\t\t( isMobileViewport && ! isMobileCanvasVisible );\n\tconst showLabels = canvasMode !== 'edit';\n\tconst siteIconButtonProps = isBackToDashboardButton\n\t\t? {\n\t\t\t\thref: dashboardLink || 'index.php',\n\t\t\t\t'aria-label': __( 'Go back to the dashboard' ),\n\t\t  }\n\t\t: {\n\t\t\t\tlabel: __( 'Open Navigation Sidebar' ),\n\t\t\t\tonClick: () => {\n\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\tsetIsMobileCanvasVisible( false );\n\t\t\t\t\t__unstableSetCanvasMode( 'view' );\n\t\t\t\t},\n\t\t  };\n\tconst { getTitle } = useEditedEntityRecord();\n\n\treturn (\n\t\t<motion.div\n\t\t\tclassName={ classnames( 'edit-site-site-hub', className ) }\n\t\t\tlayout\n\t\t\ttransition={ {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\tease: 'easeOut',\n\t\t\t} }\n\t\t>\n\t\t\t<HStack\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tclassName=\"edit-site-site-hub__text-content\"\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-site-hub__view-mode-toggle-container\"\n\t\t\t\t\tlayout\n\t\t\t\t\ttransition={ {\n\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</motion.div>\n\n\t\t\t\t{ showLabels && (\n\t\t\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t\t\t<div className=\"edit-site-site-hub__title\">\n\t\t\t\t\t\t\t{ getTitle() }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"edit-site-site-hub__post-type\">\n\t\t\t\t\t\t\t{ entityConfig?.label }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</VStack>\n\t\t\t\t) }\n\t\t\t</HStack>\n\n\t\t\t{ showEditButton && (\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"edit-site-site-hub__edit-button\"\n\t\t\t\t\tlabel={ __( 'Open the editor' ) }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t__unstableSetCanvasMode( 'edit' );\n\t\t\t\t\t} }\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t</Button>\n\t\t\t) }\n\n\t\t\t{ isMobileViewport && ! isMobileCanvasVisible && (\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ () => setIsMobileCanvasVisible( true ) }\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t>\n\t\t\t\t\t{ __( 'View Editor' ) }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</motion.div>\n\t);\n}\n\nexport default SiteHub;\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/site-hub/index.js"],"names":["classnames","useSelect","useDispatch","Button","__unstableMotion","motion","__experimentalHStack","HStack","__experimentalVStack","VStack","useReducedMotion","useViewportMatch","__","store","blockEditorStore","coreStore","forwardRef","editSiteStore","useLocation","getIsListPage","SiteIcon","useEditedEntityRecord","HUB_ANIMATION_DURATION","SiteHub","ref","isMobileCanvasVisible","setIsMobileCanvasVisible","props","params","isListPage","isEditorPage","canvasMode","dashboardLink","entityConfig","select","getEditedPostType","__unstableGetCanvasMode","getSettings","__experimentalDashboardLink","getEntityConfig","disableMotion","isMobileViewport","__unstableSetCanvasMode","clearSelectedBlock","showEditButton","isBackToDashboardButton","showLabels","siteIconButtonProps","href","label","onClick","getTitle","className","type","duration","ease"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tButton,\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useViewportMatch } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { useLocation } from '../routes';\nimport getIsListPage from '../../utils/get-is-list-page';\nimport SiteIcon from '../site-icon';\nimport useEditedEntityRecord from '../use-edited-entity-record';\n\nconst HUB_ANIMATION_DURATION = 0.3;\n\nconst SiteHub = forwardRef(\n\t( { isMobileCanvasVisible, setIsMobileCanvasVisible, ...props }, ref ) => {\n\t\tconst { params } = useLocation();\n\t\tconst isListPage = getIsListPage( params );\n\t\tconst isEditorPage = ! isListPage;\n\t\tconst { canvasMode, dashboardLink, entityConfig } = useSelect(\n\t\t\t( select ) => {\n\t\t\t\tselect( editSiteStore ).getEditedPostType();\n\t\t\t\tconst {\n\t\t\t\t\t__unstableGetCanvasMode,\n\t\t\t\t\tgetSettings,\n\t\t\t\t\tgetEditedPostType,\n\t\t\t\t} = select( editSiteStore );\n\t\t\t\treturn {\n\t\t\t\t\tcanvasMode: __unstableGetCanvasMode(),\n\t\t\t\t\tdashboardLink: getSettings().__experimentalDashboardLink,\n\t\t\t\t\tentityConfig: select( coreStore ).getEntityConfig(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\tgetEditedPostType()\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t\tconst disableMotion = useReducedMotion();\n\t\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\t\tconst { __unstableSetCanvasMode } = useDispatch( editSiteStore );\n\t\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\t\tconst showEditButton =\n\t\t\t( isEditorPage && canvasMode === 'view' && ! isMobileViewport ) ||\n\t\t\t( isMobileViewport &&\n\t\t\t\tcanvasMode === 'view' &&\n\t\t\t\tisMobileCanvasVisible );\n\t\tconst isBackToDashboardButton =\n\t\t\t( ! isMobileViewport && canvasMode === 'view' ) ||\n\t\t\t( isMobileViewport && ! isMobileCanvasVisible );\n\t\tconst showLabels = canvasMode !== 'edit';\n\t\tconst siteIconButtonProps = isBackToDashboardButton\n\t\t\t? {\n\t\t\t\t\thref: dashboardLink || 'index.php',\n\t\t\t\t\t'aria-label': __( 'Go back to the dashboard' ),\n\t\t\t  }\n\t\t\t: {\n\t\t\t\t\tlabel: __( 'Open Navigation Sidebar' ),\n\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\t\tsetIsMobileCanvasVisible( false );\n\t\t\t\t\t\t__unstableSetCanvasMode( 'view' );\n\t\t\t\t\t},\n\t\t\t  };\n\t\tconst { getTitle } = useEditedEntityRecord();\n\n\t\treturn (\n\t\t\t<motion.div\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...props }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-site-hub',\n\t\t\t\t\tprops.className\n\t\t\t\t) }\n\t\t\t\tlayout\n\t\t\t\ttransition={ {\n\t\t\t\t\ttype: 'tween',\n\t\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\t\tease: 'easeOut',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\tclassName=\"edit-site-site-hub__text-content\"\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tclassName=\"edit-site-site-hub__view-mode-toggle-container\"\n\t\t\t\t\t\tlayout\n\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t: HUB_ANIMATION_DURATION,\n\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</motion.div>\n\n\t\t\t\t\t{ showLabels && (\n\t\t\t\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t\t\t\t<div className=\"edit-site-site-hub__title\">\n\t\t\t\t\t\t\t\t{ getTitle() }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div className=\"edit-site-site-hub__post-type\">\n\t\t\t\t\t\t\t\t{ entityConfig?.label }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\n\t\t\t\t{ showEditButton && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"edit-site-site-hub__edit-button\"\n\t\t\t\t\t\tlabel={ __( 'Open the editor' ) }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t__unstableSetCanvasMode( 'edit' );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\n\t\t\t\t{ isMobileViewport && ! isMobileCanvasVisible && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tonClick={ () => setIsMobileCanvasVisible( true ) }\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'View Editor' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t</motion.div>\n\t\t);\n\t}\n);\n\nexport default SiteHub;\n"]}

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

@@ -0,0 +1,43 @@
+/**
+ * WordPress dependencies
+ */
+import { useEffect, useRef } from '@wordpress/element';
+import { useSelect, useDispatch } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+
+import { store as editSiteStore } from '../../store';
+import { useLocation, useHistory } from '../routes';
+export default function useSyncCanvasModeWithURL() {
+  const history = useHistory();
+  const {
+    params
+  } = useLocation();
+  const canvasMode = useSelect(select => select(editSiteStore).__unstableGetCanvasMode(), []);
+  const {
+    __unstableSetCanvasMode
+  } = useDispatch(editSiteStore);
+  const currentCanvasMode = useRef(canvasMode);
+  const {
+    canvas: canvasInUrl = 'view'
+  } = params;
+  const currentCanvasInUrl = useRef(canvasInUrl);
+  useEffect(() => {
+    currentCanvasMode.current = canvasMode;
+
+    if (currentCanvasMode !== currentCanvasInUrl) {
+      history.push({ ...params,
+        canvas: canvasMode
+      });
+    }
+  }, [canvasMode]);
+  useEffect(() => {
+    currentCanvasInUrl.current = canvasInUrl;
+
+    if (canvasInUrl !== currentCanvasMode.current) {
+      __unstableSetCanvasMode(canvasInUrl);
+    }
+  }, [canvasInUrl]);
+}
+//# sourceMappingURL=use-sync-canvas-mode-with-url.js.map

package/build-module/components/sync-state-with-url/use-sync-canvas-mode-with-url.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/sync-state-with-url/use-sync-canvas-mode-with-url.js"],"names":["useEffect","useRef","useSelect","useDispatch","store","editSiteStore","useLocation","useHistory","useSyncCanvasModeWithURL","history","params","canvasMode","select","__unstableGetCanvasMode","__unstableSetCanvasMode","currentCanvasMode","canvas","canvasInUrl","currentCanvasInUrl","current","push"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,aAAlB,QAAuC,aAAvC;AACA,SAASC,WAAT,EAAsBC,UAAtB,QAAwC,WAAxC;AAEA,eAAe,SAASC,wBAAT,GAAoC;AAClD,QAAMC,OAAO,GAAGF,UAAU,EAA1B;AACA,QAAM;AAAEG,IAAAA;AAAF,MAAaJ,WAAW,EAA9B;AACA,QAAMK,UAAU,GAAGT,SAAS,CACzBU,MAAF,IAAcA,MAAM,CAAEP,aAAF,CAAN,CAAwBQ,uBAAxB,EADa,EAE3B,EAF2B,CAA5B;AAIA,QAAM;AAAEC,IAAAA;AAAF,MAA8BX,WAAW,CAAEE,aAAF,CAA/C;AACA,QAAMU,iBAAiB,GAAGd,MAAM,CAAEU,UAAF,CAAhC;AACA,QAAM;AAAEK,IAAAA,MAAM,EAAEC,WAAW,GAAG;AAAxB,MAAmCP,MAAzC;AACA,QAAMQ,kBAAkB,GAAGjB,MAAM,CAAEgB,WAAF,CAAjC;AACAjB,EAAAA,SAAS,CAAE,MAAM;AAChBe,IAAAA,iBAAiB,CAACI,OAAlB,GAA4BR,UAA5B;;AACA,QAAKI,iBAAiB,KAAKG,kBAA3B,EAAgD;AAC/CT,MAAAA,OAAO,CAACW,IAAR,CAAc,EACb,GAAGV,MADU;AAEbM,QAAAA,MAAM,EAAEL;AAFK,OAAd;AAIA;AACD,GARQ,EAQN,CAAEA,UAAF,CARM,CAAT;AAUAX,EAAAA,SAAS,CAAE,MAAM;AAChBkB,IAAAA,kBAAkB,CAACC,OAAnB,GAA6BF,WAA7B;;AACA,QAAKA,WAAW,KAAKF,iBAAiB,CAACI,OAAvC,EAAiD;AAChDL,MAAAA,uBAAuB,CAAEG,WAAF,CAAvB;AACA;AACD,GALQ,EAKN,CAAEA,WAAF,CALM,CAAT;AAMA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { useLocation, useHistory } from '../routes';\n\nexport default function useSyncCanvasModeWithURL() {\n\tconst history = useHistory();\n\tconst { params } = useLocation();\n\tconst canvasMode = useSelect(\n\t\t( select ) => select( editSiteStore ).__unstableGetCanvasMode(),\n\t\t[]\n\t);\n\tconst { __unstableSetCanvasMode } = useDispatch( editSiteStore );\n\tconst currentCanvasMode = useRef( canvasMode );\n\tconst { canvas: canvasInUrl = 'view' } = params;\n\tconst currentCanvasInUrl = useRef( canvasInUrl );\n\tuseEffect( () => {\n\t\tcurrentCanvasMode.current = canvasMode;\n\t\tif ( currentCanvasMode !== currentCanvasInUrl ) {\n\t\t\thistory.push( {\n\t\t\t\t...params,\n\t\t\t\tcanvas: canvasMode,\n\t\t\t} );\n\t\t}\n\t}, [ canvasMode ] );\n\n\tuseEffect( () => {\n\t\tcurrentCanvasInUrl.current = canvasInUrl;\n\t\tif ( canvasInUrl !== currentCanvasMode.current ) {\n\t\t\t__unstableSetCanvasMode( canvasInUrl );\n\t\t}\n\t}, [ canvasInUrl ] );\n}\n"]}

package/build-module/components/template-details/edit-template-title.js

@@ -14,6 +14,7 @@ export default function EditTemplateTitle(_ref) {
   const [forceEmpty, setForceEmpty] = useState(false);
   const [title, setTitle] = useEntityProp('postType', template.type, 'title', template.id);
   return createElement(TextControl, {
+    __nextHasNoMarginBottom: true,
     label: __('Title'),
     value: forceEmpty ? '' : title,
     help: template.type !== 'wp_template_part' ? __('Give the template a title that indicates its purpose, e.g. "Full Width".') : null,

package/build-module/components/template-details/edit-template-title.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/template-details/edit-template-title.js"],"names":["__","TextControl","useEntityProp","useState","EditTemplateTitle","template","forceEmpty","setForceEmpty","title","setTitle","type","id","newTitle"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,WAAT,QAA4B,uBAA5B;AACA,SAASC,aAAT,QAA8B,sBAA9B;AACA,SAASC,QAAT,QAAyB,oBAAzB;AAEA,eAAe,SAASC,iBAAT,OAA2C;AAAA,MAAf;AAAEC,IAAAA;AAAF,GAAe;AACzD,QAAM,CAAEC,UAAF,EAAcC,aAAd,IAAgCJ,QAAQ,CAAE,KAAF,CAA9C;AACA,QAAM,CAAEK,KAAF,EAASC,QAAT,IAAsBP,aAAa,CACxC,UADwC,EAExCG,QAAQ,CAACK,IAF+B,EAGxC,OAHwC,EAIxCL,QAAQ,CAACM,EAJ+B,CAAzC;AAOA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGX,EAAE,CAAE,OAAF,CADX;AAEC,IAAA,KAAK,EAAGM,UAAU,GAAG,EAAH,GAAQE,KAF3B;AAGC,IAAA,IAAI,EACHH,QAAQ,CAACK,IAAT,KAAkB,kBAAlB,GACGV,EAAE,CACF,0EADE,CADL,GAIG,IARL;AAUC,IAAA,QAAQ,EAAKY,QAAF,IAAgB;AAC1B,UAAK,CAAEA,QAAF,IAAc,CAAEN,UAArB,EAAkC;AACjCC,QAAAA,aAAa,CAAE,IAAF,CAAb;AACA;AACA;;AACDA,MAAAA,aAAa,CAAE,KAAF,CAAb;AACAE,MAAAA,QAAQ,CAAEG,QAAF,CAAR;AACA,KAjBF;AAkBC,IAAA,MAAM,EAAG,MAAML,aAAa,CAAE,KAAF;AAlB7B,IADD;AAsBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { TextControl } from '@wordpress/components';\nimport { useEntityProp } from '@wordpress/core-data';\nimport { useState } from '@wordpress/element';\n\nexport default function EditTemplateTitle( { template } ) {\n\tconst [ forceEmpty, setForceEmpty ] = useState( false );\n\tconst [ title, setTitle ] = useEntityProp(\n\t\t'postType',\n\t\ttemplate.type,\n\t\t'title',\n\t\ttemplate.id\n\t);\n\n\treturn (\n\t\t<TextControl\n\t\t\tlabel={ __( 'Title' ) }\n\t\t\tvalue={ forceEmpty ? '' : title }\n\t\t\thelp={\n\t\t\t\ttemplate.type !== 'wp_template_part'\n\t\t\t\t\t? __(\n\t\t\t\t\t\t\t'Give the template a title that indicates its purpose, e.g. \"Full Width\".'\n\t\t\t\t\t  )\n\t\t\t\t\t: null\n\t\t\t}\n\t\t\tonChange={ ( newTitle ) => {\n\t\t\t\tif ( ! newTitle && ! forceEmpty ) {\n\t\t\t\t\tsetForceEmpty( true );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tsetForceEmpty( false );\n\t\t\t\tsetTitle( newTitle );\n\t\t\t} }\n\t\t\tonBlur={ () => setForceEmpty( false ) }\n\t\t/>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/template-details/edit-template-title.js"],"names":["__","TextControl","useEntityProp","useState","EditTemplateTitle","template","forceEmpty","setForceEmpty","title","setTitle","type","id","newTitle"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,WAAT,QAA4B,uBAA5B;AACA,SAASC,aAAT,QAA8B,sBAA9B;AACA,SAASC,QAAT,QAAyB,oBAAzB;AAEA,eAAe,SAASC,iBAAT,OAA2C;AAAA,MAAf;AAAEC,IAAAA;AAAF,GAAe;AACzD,QAAM,CAAEC,UAAF,EAAcC,aAAd,IAAgCJ,QAAQ,CAAE,KAAF,CAA9C;AACA,QAAM,CAAEK,KAAF,EAASC,QAAT,IAAsBP,aAAa,CACxC,UADwC,EAExCG,QAAQ,CAACK,IAF+B,EAGxC,OAHwC,EAIxCL,QAAQ,CAACM,EAJ+B,CAAzC;AAOA,SACC,cAAC,WAAD;AACC,IAAA,uBAAuB,MADxB;AAEC,IAAA,KAAK,EAAGX,EAAE,CAAE,OAAF,CAFX;AAGC,IAAA,KAAK,EAAGM,UAAU,GAAG,EAAH,GAAQE,KAH3B;AAIC,IAAA,IAAI,EACHH,QAAQ,CAACK,IAAT,KAAkB,kBAAlB,GACGV,EAAE,CACF,0EADE,CADL,GAIG,IATL;AAWC,IAAA,QAAQ,EAAKY,QAAF,IAAgB;AAC1B,UAAK,CAAEA,QAAF,IAAc,CAAEN,UAArB,EAAkC;AACjCC,QAAAA,aAAa,CAAE,IAAF,CAAb;AACA;AACA;;AACDA,MAAAA,aAAa,CAAE,KAAF,CAAb;AACAE,MAAAA,QAAQ,CAAEG,QAAF,CAAR;AACA,KAlBF;AAmBC,IAAA,MAAM,EAAG,MAAML,aAAa,CAAE,KAAF;AAnB7B,IADD;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { TextControl } from '@wordpress/components';\nimport { useEntityProp } from '@wordpress/core-data';\nimport { useState } from '@wordpress/element';\n\nexport default function EditTemplateTitle( { template } ) {\n\tconst [ forceEmpty, setForceEmpty ] = useState( false );\n\tconst [ title, setTitle ] = useEntityProp(\n\t\t'postType',\n\t\ttemplate.type,\n\t\t'title',\n\t\ttemplate.id\n\t);\n\n\treturn (\n\t\t<TextControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tlabel={ __( 'Title' ) }\n\t\t\tvalue={ forceEmpty ? '' : title }\n\t\t\thelp={\n\t\t\t\ttemplate.type !== 'wp_template_part'\n\t\t\t\t\t? __(\n\t\t\t\t\t\t\t'Give the template a title that indicates its purpose, e.g. \"Full Width\".'\n\t\t\t\t\t  )\n\t\t\t\t\t: null\n\t\t\t}\n\t\t\tonChange={ ( newTitle ) => {\n\t\t\t\tif ( ! newTitle && ! forceEmpty ) {\n\t\t\t\t\tsetForceEmpty( true );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tsetForceEmpty( false );\n\t\t\t\tsetTitle( newTitle );\n\t\t\t} }\n\t\t\tonBlur={ () => setForceEmpty( false ) }\n\t\t/>\n\t);\n}\n"]}

package/build-module/components/template-details/template-part-area-selector.js

@@ -25,6 +25,7 @@ export default function TemplatePartAreaSelector(_ref) {
     };
   });
   return createElement(SelectControl, {
+    __nextHasNoMarginBottom: true,
     label: __('Area'),
     labelPosition: "top",
     options: areaOptions,

package/build-module/components/template-details/template-part-area-selector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/template-details/template-part-area-selector.js"],"names":["__","SelectControl","useEntityProp","useSelect","store","editorStore","TemplatePartAreaSelector","id","area","setArea","definedAreas","select","__experimentalGetDefaultTemplatePartAreas","areaOptions","map","label","_area","value"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,aAAT,QAA8B,uBAA9B;AACA,SAASC,aAAT,QAA8B,sBAA9B;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,KAAK,IAAIC,WAAlB,QAAqC,mBAArC;AAEA,eAAe,SAASC,wBAAT,OAA4C;AAAA,MAAT;AAAEC,IAAAA;AAAF,GAAS;AAC1D,QAAM,CAAEC,IAAF,EAAQC,OAAR,IAAoBP,aAAa,CACtC,UADsC,EAEtC,kBAFsC,EAGtC,MAHsC,EAItCK,EAJsC,CAAvC;AAOA,QAAMG,YAAY,GAAGP,SAAS,CAC3BQ,MAAF,IACCA,MAAM,CAAEN,WAAF,CAAN,CAAsBO,yCAAtB,EAF4B,EAG7B,EAH6B,CAA9B;AAMA,QAAMC,WAAW,GAAGH,YAAY,CAACI,GAAb,CAAkB;AAAA,QAAE;AAAEC,MAAAA,KAAF;AAASP,MAAAA,IAAI,EAAEQ;AAAf,KAAF;AAAA,WAAgC;AACrED,MAAAA,KADqE;AAErEE,MAAAA,KAAK,EAAED;AAF8D,KAAhC;AAAA,GAAlB,CAApB;AAKA,SACC,cAAC,aAAD;AACC,IAAA,KAAK,EAAGhB,EAAE,CAAE,MAAF,CADX;AAEC,IAAA,aAAa,EAAC,KAFf;AAGC,IAAA,OAAO,EAAGa,WAHX;AAIC,IAAA,KAAK,EAAGL,IAJT;AAKC,IAAA,QAAQ,EAAGC;AALZ,IADD;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { SelectControl } from '@wordpress/components';\nimport { useEntityProp } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { store as editorStore } from '@wordpress/editor';\n\nexport default function TemplatePartAreaSelector( { id } ) {\n\tconst [ area, setArea ] = useEntityProp(\n\t\t'postType',\n\t\t'wp_template_part',\n\t\t'area',\n\t\tid\n\t);\n\n\tconst definedAreas = useSelect(\n\t\t( select ) =>\n\t\t\tselect( editorStore ).__experimentalGetDefaultTemplatePartAreas(),\n\t\t[]\n\t);\n\n\tconst areaOptions = definedAreas.map( ( { label, area: _area } ) => ( {\n\t\tlabel,\n\t\tvalue: _area,\n\t} ) );\n\n\treturn (\n\t\t<SelectControl\n\t\t\tlabel={ __( 'Area' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\toptions={ areaOptions }\n\t\t\tvalue={ area }\n\t\t\tonChange={ setArea }\n\t\t/>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/template-details/template-part-area-selector.js"],"names":["__","SelectControl","useEntityProp","useSelect","store","editorStore","TemplatePartAreaSelector","id","area","setArea","definedAreas","select","__experimentalGetDefaultTemplatePartAreas","areaOptions","map","label","_area","value"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,aAAT,QAA8B,uBAA9B;AACA,SAASC,aAAT,QAA8B,sBAA9B;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,KAAK,IAAIC,WAAlB,QAAqC,mBAArC;AAEA,eAAe,SAASC,wBAAT,OAA4C;AAAA,MAAT;AAAEC,IAAAA;AAAF,GAAS;AAC1D,QAAM,CAAEC,IAAF,EAAQC,OAAR,IAAoBP,aAAa,CACtC,UADsC,EAEtC,kBAFsC,EAGtC,MAHsC,EAItCK,EAJsC,CAAvC;AAOA,QAAMG,YAAY,GAAGP,SAAS,CAC3BQ,MAAF,IACCA,MAAM,CAAEN,WAAF,CAAN,CAAsBO,yCAAtB,EAF4B,EAG7B,EAH6B,CAA9B;AAMA,QAAMC,WAAW,GAAGH,YAAY,CAACI,GAAb,CAAkB;AAAA,QAAE;AAAEC,MAAAA,KAAF;AAASP,MAAAA,IAAI,EAAEQ;AAAf,KAAF;AAAA,WAAgC;AACrED,MAAAA,KADqE;AAErEE,MAAAA,KAAK,EAAED;AAF8D,KAAhC;AAAA,GAAlB,CAApB;AAKA,SACC,cAAC,aAAD;AACC,IAAA,uBAAuB,MADxB;AAEC,IAAA,KAAK,EAAGhB,EAAE,CAAE,MAAF,CAFX;AAGC,IAAA,aAAa,EAAC,KAHf;AAIC,IAAA,OAAO,EAAGa,WAJX;AAKC,IAAA,KAAK,EAAGL,IALT;AAMC,IAAA,QAAQ,EAAGC;AANZ,IADD;AAUA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { SelectControl } from '@wordpress/components';\nimport { useEntityProp } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { store as editorStore } from '@wordpress/editor';\n\nexport default function TemplatePartAreaSelector( { id } ) {\n\tconst [ area, setArea ] = useEntityProp(\n\t\t'postType',\n\t\t'wp_template_part',\n\t\t'area',\n\t\tid\n\t);\n\n\tconst definedAreas = useSelect(\n\t\t( select ) =>\n\t\t\tselect( editorStore ).__experimentalGetDefaultTemplatePartAreas(),\n\t\t[]\n\t);\n\n\tconst areaOptions = definedAreas.map( ( { label, area: _area } ) => ( {\n\t\tlabel,\n\t\tvalue: _area,\n\t} ) );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tlabel={ __( 'Area' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\toptions={ areaOptions }\n\t\t\tvalue={ area }\n\t\t\tonChange={ setArea }\n\t\t/>\n\t);\n}\n"]}

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

@@ -97,7 +97,7 @@ function PushChangesToGlobalStylesControl(_ref) {
       undoIgnore: true
     });
     createSuccessNotice(sprintf( // translators: %s: Title of the block e.g. 'Heading'.
-    __('Pushed styles to all %s blocks.'), getBlockType(name).title), {
+    __('%s styles applied.'), getBlockType(name).title), {
       type: 'snackbar',
       actions: [{
         label: __('Undo'),
@@ -119,12 +119,12 @@ function PushChangesToGlobalStylesControl(_ref) {
   return createElement(BaseControl, {
     className: "edit-site-push-changes-to-global-styles-control",
     help: sprintf( // translators: %s: Title of the block e.g. 'Heading'.
-    __('Move this block’s typography, spacing, dimensions, and color styles to all %s blocks.'), getBlockType(name).title)
+    __('Apply this block’s typography, spacing, dimensions, and color styles to all %s blocks.'), getBlockType(name).title)
   }, createElement(BaseControl.VisualLabel, null, __('Styles')), createElement(Button, {
     variant: "primary",
     disabled: changes.length === 0,
     onClick: pushChanges
-  }, __('Push changes to Global Styles')));
+  }, __('Apply globally')));
 }
 
 const withPushChangesToGlobalStyles = createHigherOrderComponent(BlockEdit => props => createElement(Fragment, null, createElement(BlockEdit, props), createElement(InspectorAdvancedControls, null, createElement(PushChangesToGlobalStylesControl, props))));