@wordpress/block-library 7.13.1-next.957ca95e4c.0 → 7.14.0

package/build-module/missing/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/missing/index.js"],"names":["getBlockType","edit","save","name","metadata","settings","__experimentalLabel","attributes","context","originalName","originalBlockType","undefined","title"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,YAAT,QAA6B,mBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,IAAP,MAAiB,QAAjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAOC,IAAP,MAAiB,QAAjB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAWC,QAAjB;AAEA,SAASA,QAAT,EAAmBD,IAAnB;AAEA,OAAO,MAAME,QAAQ,GAAG;AACvBF,EAAAA,IADuB;;AAEvBG,EAAAA,mBAAmB,CAAEC,UAAF,QAA4B;AAAA,QAAd;AAAEC,MAAAA;AAAF,KAAc;;AAC9C,QAAKA,OAAO,KAAK,eAAjB,EAAmC;AAClC,YAAM;AAAEC,QAAAA;AAAF,UAAmBF,UAAzB;AAEA,YAAMG,iBAAiB,GAAGD,YAAY,GACnCT,YAAY,CAAES,YAAF,CADuB,GAEnCE,SAFH;;AAIA,UAAKD,iBAAL,EAAyB;AACxB,eAAOA,iBAAiB,CAACL,QAAlB,CAA2BO,KAA3B,IAAoCH,YAA3C;AACA;;AAED,aAAO,EAAP;AACA;AACD,GAhBsB;;AAiBvBR,EAAAA,IAjBuB;AAkBvBC,EAAAA;AAlBuB,CAAjB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\tname,\n\t__experimentalLabel( attributes, { context } ) {\n\t\tif ( context === 'accessibility' ) {\n\t\t\tconst { originalName } = attributes;\n\n\t\t\tconst originalBlockType = originalName\n\t\t\t\t? getBlockType( originalName )\n\t\t\t\t: undefined;\n\n\t\t\tif ( originalBlockType ) {\n\t\t\t\treturn originalBlockType.settings.title || originalName;\n\t\t\t}\n\n\t\t\treturn '';\n\t\t}\n\t},\n\tedit,\n\tsave,\n};\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/missing/index.js"],"names":["getBlockType","initBlock","edit","save","name","metadata","settings","__experimentalLabel","attributes","context","originalName","originalBlockType","undefined","title","init"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,YAAT,QAA6B,mBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,SAAP,MAAsB,qBAAtB;AACA,OAAOC,IAAP,MAAiB,QAAjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAOC,IAAP,MAAiB,QAAjB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAWC,QAAjB;AAEA,SAASA,QAAT,EAAmBD,IAAnB;AAEA,OAAO,MAAME,QAAQ,GAAG;AACvBF,EAAAA,IADuB;;AAEvBG,EAAAA,mBAAmB,CAAEC,UAAF,QAA4B;AAAA,QAAd;AAAEC,MAAAA;AAAF,KAAc;;AAC9C,QAAKA,OAAO,KAAK,eAAjB,EAAmC;AAClC,YAAM;AAAEC,QAAAA;AAAF,UAAmBF,UAAzB;AAEA,YAAMG,iBAAiB,GAAGD,YAAY,GACnCV,YAAY,CAAEU,YAAF,CADuB,GAEnCE,SAFH;;AAIA,UAAKD,iBAAL,EAAyB;AACxB,eAAOA,iBAAiB,CAACL,QAAlB,CAA2BO,KAA3B,IAAoCH,YAA3C;AACA;;AAED,aAAO,EAAP;AACA;AACD,GAhBsB;;AAiBvBR,EAAAA,IAjBuB;AAkBvBC,EAAAA;AAlBuB,CAAjB;AAqBP,OAAO,MAAMW,IAAI,GAAG,MAAMb,SAAS,CAAE;AAAEG,EAAAA,IAAF;AAAQC,EAAAA,QAAR;AAAkBC,EAAAA;AAAlB,CAAF,CAA5B","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport initBlock from '../utils/init-block';\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\tname,\n\t__experimentalLabel( attributes, { context } ) {\n\t\tif ( context === 'accessibility' ) {\n\t\t\tconst { originalName } = attributes;\n\n\t\t\tconst originalBlockType = originalName\n\t\t\t\t? getBlockType( originalName )\n\t\t\t\t: undefined;\n\n\t\t\tif ( originalBlockType ) {\n\t\t\t\treturn originalBlockType.settings.title || originalName;\n\t\t\t}\n\n\t\t\treturn '';\n\t\t}\n\t},\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"]}

package/build-module/missing/init.js

@@ -0,0 +1,6 @@
+/**
+ * Internal dependencies
+ */
+import { init } from './';
+export default init();
+//# sourceMappingURL=init.js.map

package/build-module/missing/init.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/missing/init.js"],"names":["init"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,IAArB;AAEA,eAAeA,IAAI,EAAnB","sourcesContent":["/**\n * Internal dependencies\n */\nimport { init } from './';\n\nexport default init();\n"]}

package/build-module/more/index.js

@@ -6,6 +6,7 @@ import { more as icon } from '@wordpress/icons';
  * Internal dependencies
  */
 
+import initBlock from '../utils/init-block';
 import edit from './edit';
 const metadata = {
   $schema: "https://schemas.wp.org/trunk/block.json",
@@ -57,4 +58,9 @@ export const settings = {
   edit,
   save
 };
+export const init = () => initBlock({
+  name,
+  metadata,
+  settings
+});
 //# sourceMappingURL=index.js.map

package/build-module/more/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/more/index.js"],"names":["more","icon","edit","save","transforms","name","metadata","settings","example","__experimentalLabel","attributes","context","customText"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,IAAI,IAAIC,IAAjB,QAA6B,kBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,IAAP,MAAiB,QAAjB;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAOC,IAAP,MAAiB,QAAjB;AACA,OAAOC,UAAP,MAAuB,cAAvB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAWC,QAAjB;AAEA,SAASA,QAAT,EAAmBD,IAAnB;AAEA,OAAO,MAAME,QAAQ,GAAG;AACvBN,EAAAA,IADuB;AAEvBO,EAAAA,OAAO,EAAE,EAFc;;AAGvBC,EAAAA,mBAAmB,CAAEC,UAAF,QAA4B;AAAA,QAAd;AAAEC,MAAAA;AAAF,KAAc;;AAC9C,QAAKA,OAAO,KAAK,eAAjB,EAAmC;AAClC,aAAOD,UAAU,CAACE,UAAlB;AACA;AACD,GAPsB;;AAQvBR,EAAAA,UARuB;AASvBF,EAAAA,IATuB;AAUvBC,EAAAA;AAVuB,CAAjB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { more as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\nimport transforms from './transforms';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\texample: {},\n\t__experimentalLabel( attributes, { context } ) {\n\t\tif ( context === 'accessibility' ) {\n\t\t\treturn attributes.customText;\n\t\t}\n\t},\n\ttransforms,\n\tedit,\n\tsave,\n};\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/more/index.js"],"names":["more","icon","initBlock","edit","save","transforms","name","metadata","settings","example","__experimentalLabel","attributes","context","customText","init"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,IAAI,IAAIC,IAAjB,QAA6B,kBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,SAAP,MAAsB,qBAAtB;AACA,OAAOC,IAAP,MAAiB,QAAjB;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAOC,IAAP,MAAiB,QAAjB;AACA,OAAOC,UAAP,MAAuB,cAAvB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAWC,QAAjB;AAEA,SAASA,QAAT,EAAmBD,IAAnB;AAEA,OAAO,MAAME,QAAQ,GAAG;AACvBP,EAAAA,IADuB;AAEvBQ,EAAAA,OAAO,EAAE,EAFc;;AAGvBC,EAAAA,mBAAmB,CAAEC,UAAF,QAA4B;AAAA,QAAd;AAAEC,MAAAA;AAAF,KAAc;;AAC9C,QAAKA,OAAO,KAAK,eAAjB,EAAmC;AAClC,aAAOD,UAAU,CAACE,UAAlB;AACA;AACD,GAPsB;;AAQvBR,EAAAA,UARuB;AASvBF,EAAAA,IATuB;AAUvBC,EAAAA;AAVuB,CAAjB;AAaP,OAAO,MAAMU,IAAI,GAAG,MAAMZ,SAAS,CAAE;AAAEI,EAAAA,IAAF;AAAQC,EAAAA,QAAR;AAAkBC,EAAAA;AAAlB,CAAF,CAA5B","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { more as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport initBlock from '../utils/init-block';\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\nimport transforms from './transforms';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\texample: {},\n\t__experimentalLabel( attributes, { context } ) {\n\t\tif ( context === 'accessibility' ) {\n\t\t\treturn attributes.customText;\n\t\t}\n\t},\n\ttransforms,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"]}

package/build-module/more/init.js

@@ -0,0 +1,6 @@
+/**
+ * Internal dependencies
+ */
+import { init } from './';
+export default init();
+//# sourceMappingURL=init.js.map

package/build-module/more/init.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/more/init.js"],"names":["init"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,IAArB;AAEA,eAAeA,IAAI,EAAnB","sourcesContent":["/**\n * Internal dependencies\n */\nimport { init } from './';\n\nexport default init();\n"]}

package/build-module/more/transforms.native.js

@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import webTransforms from './transforms.js';
-import transformationCategories from '../transformationCategories';
+import transformationCategories from '../utils/transformation-categories';
 const transforms = { ...webTransforms,
   supportedMobileTransforms: transformationCategories.other
 };

package/build-module/more/transforms.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/more/transforms.native.js"],"names":["webTransforms","transformationCategories","transforms","supportedMobileTransforms","other"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,aAAP,MAA0B,iBAA1B;AACA,OAAOC,wBAAP,MAAqC,6BAArC;AAEA,MAAMC,UAAU,GAAG,EAClB,GAAGF,aADe;AAElBG,EAAAA,yBAAyB,EAAEF,wBAAwB,CAACG;AAFlC,CAAnB;AAKA,eAAeF,UAAf","sourcesContent":["/**\n * Internal dependencies\n */\nimport webTransforms from './transforms.js';\nimport transformationCategories from '../transformationCategories';\n\nconst transforms = {\n\t...webTransforms,\n\tsupportedMobileTransforms: transformationCategories.other,\n};\n\nexport default transforms;\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/more/transforms.native.js"],"names":["webTransforms","transformationCategories","transforms","supportedMobileTransforms","other"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,aAAP,MAA0B,iBAA1B;AACA,OAAOC,wBAAP,MAAqC,oCAArC;AAEA,MAAMC,UAAU,GAAG,EAClB,GAAGF,aADe;AAElBG,EAAAA,yBAAyB,EAAEF,wBAAwB,CAACG;AAFlC,CAAnB;AAKA,eAAeF,UAAf","sourcesContent":["/**\n * Internal dependencies\n */\nimport webTransforms from './transforms.js';\nimport transformationCategories from '../utils/transformation-categories';\n\nconst transforms = {\n\t...webTransforms,\n\tsupportedMobileTransforms: transformationCategories.other,\n};\n\nexport default transforms;\n"]}

package/build-module/navigation/edit/index.js

@@ -9,10 +9,11 @@ import classnames from 'classnames';
  */
 
 import { useState, useEffect, useRef, Platform } from '@wordpress/element';
-import { InspectorControls, BlockControls, useBlockProps, __experimentalRecursionProvider as RecursionProvider, __experimentalUseHasRecursion as useHasRecursion, store as blockEditorStore, withColors, PanelColorSettings, ContrastChecker, getColorClassName, Warning, __experimentalUseBlockOverlayActive as useBlockOverlayActive } from '@wordpress/block-editor';
-import { EntityProvider } from '@wordpress/core-data';
+import { addQueryArgs } from '@wordpress/url';
+import { InspectorControls, useBlockProps, __experimentalRecursionProvider as RecursionProvider, __experimentalUseHasRecursion as useHasRecursion, store as blockEditorStore, withColors, PanelColorSettings, ContrastChecker, getColorClassName, Warning, __experimentalUseBlockOverlayActive as useBlockOverlayActive } from '@wordpress/block-editor';
+import { EntityProvider, store as coreStore } from '@wordpress/core-data';
 import { useDispatch } from '@wordpress/data';
-import { PanelBody, ToggleControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, ToolbarGroup, Button, Spinner } from '@wordpress/components';
+import { PanelBody, ToggleControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, Button, Spinner } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import { speak } from '@wordpress/a11y';
 import { createBlock } from '@wordpress/blocks';
@@ -32,6 +33,7 @@ import UnsavedInnerBlocks from './unsaved-inner-blocks';
 import NavigationMenuDeleteControl from './navigation-menu-delete-control';
 import useNavigationNotice from './use-navigation-notice';
 import OverlayMenuIcon from './overlay-menu-icon';
+import OverlayMenuPreview from './overlay-menu-preview';
 import useConvertClassicToBlockMenu, { CLASSIC_MENU_CONVERSION_ERROR, CLASSIC_MENU_CONVERSION_PENDING, CLASSIC_MENU_CONVERSION_SUCCESS } from './use-convert-classic-menu-to-block-menu';
 import useCreateNavigationMenu from './use-create-navigation-menu';
 import { useInnerBlocks } from './use-inner-blocks';
@@ -69,7 +71,8 @@ function Navigation(_ref) {
       orientation = 'horizontal',
       flexWrap = 'wrap'
     } = {},
-    hasIcon
+    hasIcon,
+    icon = 'handle'
   } = attributes;
   const ref = attributes.ref;
 
@@ -80,7 +83,10 @@ function Navigation(_ref) {
   };
 
   const recursionId = `navigationMenu/${ref}`;
-  const hasAlreadyRendered = useHasRecursion(recursionId); // Preload classic menus, so that they don't suddenly pop-in when viewing
+  const hasAlreadyRendered = useHasRecursion(recursionId);
+  const {
+    editEntityRecord
+  } = useDispatch(coreStore); // Preload classic menus, so that they don't suddenly pop-in when viewing
   // the Select Menu dropdown.
 
   useNavigationEntities();
@@ -90,6 +96,9 @@ function Navigation(_ref) {
   const [showClassicMenuConversionNotice, hideClassicMenuConversionNotice] = useNavigationNotice({
     name: 'block-library/core/navigation/classic-menu-conversion'
   });
+  const [showMenuAutoPublishDraftNotice, hideMenuAutoPublishDraftNotice] = useNavigationNotice({
+    name: 'block-library/core/navigation/auto-publish-draft'
+  });
   const [showNavigationMenuPermissionsNotice, hideNavigationMenuPermissionsNotice] = useNavigationNotice({
     name: 'block-library/core/navigation/permissions/update'
   });
@@ -102,6 +111,11 @@ function Navigation(_ref) {
     isSuccess: createNavigationMenuIsSuccess,
     isError: createNavigationMenuIsError
   } = useCreateNavigationMenu(clientId);
+
+  const createUntitledEmptyNavigationMenu = () => {
+    createNavigationMenu('');
+  };
+
   useEffect(() => {
     hideNavigationMenuStatusNotice();
 
@@ -110,15 +124,16 @@ function Navigation(_ref) {
     }
 
     if (createNavigationMenuIsSuccess) {
-      setRef(createNavigationMenuPost.id);
-      selectBlock(clientId);
+      handleUpdateMenu(createNavigationMenuPost.id, {
+        focusNavigationBlock: true
+      });
       showNavigationMenuStatusNotice(__(`Navigation Menu successfully created.`));
     }
 
     if (createNavigationMenuIsError) {
       showNavigationMenuStatusNotice(__('Failed to create Navigation Menu.'));
     }
-  }, [createNavigationMenu, createNavigationMenuStatus, createNavigationMenuError, createNavigationMenuPost]);
+  }, [createNavigationMenuStatus, createNavigationMenuError, createNavigationMenuPost]);
   const {
     hasUncontrolledInnerBlocks,
     uncontrolledInnerBlocks,
@@ -165,7 +180,10 @@ function Navigation(_ref) {
       const menuADate = new Date(menuA.date);
       const menuBDate = new Date(menuB.date);
       return menuADate.getTime() < menuBDate.getTime();
-    });
+    }); // Only autofallback to published menus.
+
+    const fallbackNavigationMenus = navigationMenus.filter(menu => menu.status === 'publish');
+    if (fallbackNavigationMenus.length === 0) return;
     /**
      *  This fallback displays (both in editor and on front)
      *  a list of pages only if no menu (user assigned or
@@ -176,10 +194,9 @@ function Navigation(_ref) {
 
     __unstableMarkNextChangeAsNotPersistent();
 
-    setRef(navigationMenus[0].id);
+    setRef(fallbackNavigationMenus[0].id);
   }, [navigationMenus]);
   const navRef = useRef();
-  const isDraftNavigationMenu = (navigationMenu === null || navigationMenu === void 0 ? void 0 : navigationMenu.status) === 'draft';
   const {
     convert: convertClassicMenu,
     status: classicMenuConversionStatus,
@@ -246,9 +263,18 @@ function Navigation(_ref) {
   const [detectedOverlayBackgroundColor, setDetectedOverlayBackgroundColor] = useState();
   const [detectedOverlayColor, setDetectedOverlayColor] = useState();
 
-  const handleUpdateMenu = menuId => {
+  const handleUpdateMenu = function (menuId) {
+    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+      focusNavigationBlock: false
+    };
+    const {
+      focusNavigationBlock
+    } = options;
     setRef(menuId);
-    selectBlock(clientId);
+
+    if (focusNavigationBlock) {
+      selectBlock(clientId);
+    }
   };
 
   useEffect(() => {
@@ -306,40 +332,43 @@ function Navigation(_ref) {
       }
     }
   }, [isSelected, isInnerBlockSelected, canUserUpdateNavigationMenu, hasResolvedCanUserUpdateNavigationMenu, canUserCreateNavigationMenu, hasResolvedCanUserCreateNavigationMenu, ref]);
-  const navigationSelectorRef = useRef();
-  const [shouldFocusNavigationSelector, setShouldFocusNavigationSelector] = useState(false); // Focus support after menu selection.
-
-  useEffect(() => {
-    var _navigationSelectorRe;
-
-    if (isDraftNavigationMenu || !isEntityAvailable || !shouldFocusNavigationSelector) {
-      return;
-    }
-
-    navigationSelectorRef === null || navigationSelectorRef === void 0 ? void 0 : (_navigationSelectorRe = navigationSelectorRef.current) === null || _navigationSelectorRe === void 0 ? void 0 : _navigationSelectorRe.focus();
-    setShouldFocusNavigationSelector(false);
-  }, [isDraftNavigationMenu, isEntityAvailable, shouldFocusNavigationSelector]);
+  const hasManagePermissions = canUserCreateNavigationMenu || canUserUpdateNavigationMenu;
   const isResponsive = 'never' !== overlayMenu;
   const overlayMenuPreviewClasses = classnames('wp-block-navigation__overlay-menu-preview', {
     open: overlayMenuPreview
-  });
+  }); // Prompt the user to publish the menu they have set as a draft
+
+  const isDraftNavigationMenu = (navigationMenu === null || navigationMenu === void 0 ? void 0 : navigationMenu.status) === 'draft';
+  useEffect(async () => {
+    hideMenuAutoPublishDraftNotice();
+    if (!isDraftNavigationMenu) return;
+
+    try {
+      await editEntityRecord('postType', 'wp_navigation', navigationMenu === null || navigationMenu === void 0 ? void 0 : navigationMenu.id, {
+        status: 'publish'
+      }, {
+        throwOnError: true
+      });
+    } catch {
+      showMenuAutoPublishDraftNotice(__('Error ocurred while publishing the navigation menu.'));
+    }
+  }, [isDraftNavigationMenu, navigationMenu]);
   const stylingInspectorControls = createElement(InspectorControls, null, hasSubmenuIndicatorSetting && createElement(PanelBody, {
     title: __('Display')
-  }, isResponsive && createElement(Button, {
+  }, isResponsive && createElement(Fragment, null, createElement(Button, {
     className: overlayMenuPreviewClasses,
     onClick: () => {
       setOverlayMenuPreview(!overlayMenuPreview);
     }
-  }, hasIcon && createElement(Fragment, null, createElement(OverlayMenuIcon, null), createElement(Icon, {
+  }, hasIcon && createElement(Fragment, null, createElement(OverlayMenuIcon, {
+    icon: icon
+  }), createElement(Icon, {
     icon: close
-  })), !hasIcon && createElement(Fragment, null, createElement("span", null, __('Menu')), createElement("span", null, __('Close')))), overlayMenuPreview && createElement(ToggleControl, {
-    label: __('Show icon button'),
-    help: __('Configure the visual appearance of the button opening and closing the overlay menu.'),
-    onChange: value => setAttributes({
-      hasIcon: value
-    }),
-    checked: hasIcon
-  }), createElement("h3", null, __('Overlay Menu')), createElement(ToggleGroupControl, {
+  })), !hasIcon && createElement(Fragment, null, createElement("span", null, __('Menu')), createElement("span", null, __('Close')))), overlayMenuPreview && createElement(OverlayMenuPreview, {
+    setAttributes: setAttributes,
+    hasIcon: hasIcon,
+    icon: icon
+  })), createElement("h3", null, __('Overlay Menu')), createElement(ToggleGroupControl, {
     label: __('Configure overlay menu'),
     value: overlayMenu,
     help: __('Collapses the navigation options in a menu icon opening an overlay.'),
@@ -416,33 +445,40 @@ function Navigation(_ref) {
   const hasUnsavedBlocks = hasUncontrolledInnerBlocks && !isEntityAvailable;
 
   if (hasUnsavedBlocks) {
-    return createElement(TagName, blockProps, createElement(BlockControls, null, createElement(ToolbarGroup, {
-      className: "wp-block-navigation__toolbar-menu-selector"
+    return createElement(TagName, blockProps, createElement(InspectorControls, null, createElement(PanelBody, {
+      title: __('Menu')
     }, createElement(NavigationMenuSelector, {
-      ref: null,
-      currentMenuId: null,
+      currentMenuId: ref,
       clientId: clientId,
       onSelectNavigationMenu: menuId => {
         handleUpdateMenu(menuId);
-        setShouldFocusNavigationSelector(true);
       },
       onSelectClassicMenu: async classicMenu => {
         const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name);
 
         if (navMenu) {
-          handleUpdateMenu(navMenu.id);
-          setShouldFocusNavigationSelector(true);
+          handleUpdateMenu(navMenu.id, {
+            focusNavigationBlock: true
+          });
         }
       },
-      onCreateNew: () => createNavigationMenu('', [])
+      onCreateNew: createUntitledEmptyNavigationMenu,
+      createNavigationMenuIsSuccess: createNavigationMenuIsSuccess
       /* translators: %s: The name of a menu. */
       ,
-      actionLabel: __("Switch to '%s'"),
-      showManageActions: true
-    }))), stylingInspectorControls, createElement(ResponsiveWrapper, {
+      actionLabel: __("Switch to '%s'")
+    }), createElement(Button, {
+      variant: "link",
+      disabled: !hasManagePermissions || !hasResolvedNavigationMenus,
+      href: addQueryArgs('edit.php', {
+        post_type: 'wp_navigation'
+      })
+    }, __('Manage menus')))), stylingInspectorControls, createElement(ResponsiveWrapper, {
       id: clientId,
       onToggle: setResponsiveMenuVisibility,
       isOpen: isResponsiveMenuOpen,
+      hasIcon: hasIcon,
+      icon: icon,
       isResponsive: 'never' !== overlayMenu,
       isHiddenByDefault: 'always' === overlayMenu,
       overlayBackgroundColor: overlayBackgroundColor,
@@ -466,31 +502,36 @@ function Navigation(_ref) {
 
 
   if (ref && isNavigationMenuMissing) {
-    return createElement(TagName, blockProps, createElement(BlockControls, null, createElement(ToolbarGroup, {
-      className: "wp-block-navigation__toolbar-menu-selector"
+    return createElement(TagName, blockProps, createElement(InspectorControls, null, createElement(PanelBody, {
+      title: __('Menu')
     }, createElement(NavigationMenuSelector, {
-      ref: navigationSelectorRef,
-      currentMenuId: ref,
+      currentMenuId: null,
       clientId: clientId,
       onSelectNavigationMenu: menuId => {
         handleUpdateMenu(menuId);
-        setShouldFocusNavigationSelector(true);
       },
       onSelectClassicMenu: async classicMenu => {
         const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name);
 
         if (navMenu) {
-          handleUpdateMenu(navMenu.id);
-          setShouldFocusNavigationSelector(true);
+          handleUpdateMenu(navMenu.id, {
+            focusNavigationBlock: true
+          });
         }
       },
-      onCreateNew: () => createNavigationMenu('', [])
+      onCreateNew: createUntitledEmptyNavigationMenu,
+      createNavigationMenuIsSuccess: createNavigationMenuIsSuccess
       /* translators: %s: The name of a menu. */
       ,
-      actionLabel: __("Switch to '%s'"),
-      showManageActions: true
-    }))), createElement(Warning, null, __('Navigation menu has been deleted or is unavailable. '), createElement(Button, {
-      onClick: () => createNavigationMenu('', []),
+      actionLabel: __("Switch to '%s'")
+    }), createElement(Button, {
+      variant: "link",
+      disabled: !hasManagePermissions || !hasResolvedNavigationMenus,
+      href: addQueryArgs('edit.php', {
+        post_type: 'wp_navigation'
+      })
+    }, __('Manage menus')))), createElement(Warning, null, __('Navigation menu has been deleted or is unavailable. '), createElement(Button, {
+      onClick: createUntitledEmptyNavigationMenu,
       variant: "link"
     }, __('Create a new menu?'))));
   }
@@ -519,17 +560,17 @@ function Navigation(_ref) {
       isResolvingCanUserCreateNavigationMenu: isResolvingCanUserCreateNavigationMenu,
       onSelectNavigationMenu: menuId => {
         handleUpdateMenu(menuId);
-        setShouldFocusNavigationSelector(true);
       },
       onSelectClassicMenu: async classicMenu => {
         const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name);
 
         if (navMenu) {
-          handleUpdateMenu(navMenu.id);
-          setShouldFocusNavigationSelector(true);
+          handleUpdateMenu(navMenu.id, {
+            focusNavigationBlock: true
+          });
         }
       },
-      onCreateEmpty: () => createNavigationMenu('', [])
+      onCreateEmpty: createUntitledEmptyNavigationMenu
     }));
   }
 
@@ -539,30 +580,36 @@ function Navigation(_ref) {
     id: ref
   }, createElement(RecursionProvider, {
     uniqueId: recursionId
-  }, createElement(BlockControls, null, !isDraftNavigationMenu && isEntityAvailable && createElement(ToolbarGroup, {
-    className: "wp-block-navigation__toolbar-menu-selector"
+  }, createElement(InspectorControls, null, createElement(PanelBody, {
+    title: __('Menu')
   }, createElement(NavigationMenuSelector, {
-    ref: navigationSelectorRef,
     currentMenuId: ref,
     clientId: clientId,
     onSelectNavigationMenu: menuId => {
       handleUpdateMenu(menuId);
-      setShouldFocusNavigationSelector(true);
     },
     onSelectClassicMenu: async classicMenu => {
       const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name);
 
       if (navMenu) {
-        handleUpdateMenu(navMenu.id);
-        setShouldFocusNavigationSelector(true);
+        handleUpdateMenu(navMenu.id, {
+          focusNavigationBlock: true
+        });
       }
     },
-    onCreateNew: () => createNavigationMenu('', [])
+    onCreateNew: createUntitledEmptyNavigationMenu,
+    createNavigationMenuIsSuccess: createNavigationMenuIsSuccess,
+    createNavigationMenuIsError: createNavigationMenuIsError
     /* translators: %s: The name of a menu. */
     ,
-    actionLabel: __("Switch to '%s'"),
-    showManageActions: true
-  }))), stylingInspectorControls, isEntityAvailable && createElement(InspectorControls, {
+    actionLabel: __("Switch to '%s'")
+  }), createElement(Button, {
+    variant: "link",
+    disabled: !hasManagePermissions || !hasResolvedNavigationMenus,
+    href: addQueryArgs('edit.php', {
+      post_type: 'wp_navigation'
+    })
+  }, __('Manage menus')))), stylingInspectorControls, isEntityAvailable && createElement(InspectorControls, {
     __experimentalGroup: "advanced"
   }, hasResolvedCanUserUpdateNavigationMenu && canUserUpdateNavigationMenu && createElement(NavigationMenuNameControl, null), hasResolvedCanUserDeleteNavigationMenu && canUserDeleteNavigationMenu && createElement(NavigationMenuDeleteControl, {
     onDelete: function () {
@@ -578,6 +625,7 @@ function Navigation(_ref) {
     onToggle: setResponsiveMenuVisibility,
     label: __('Menu'),
     hasIcon: hasIcon,
+    icon: icon,
     isOpen: isResponsiveMenuOpen,
     isResponsive: isResponsive,
     isHiddenByDefault: 'always' === overlayMenu,