@wordpress/block-library 7.12.2-next.d6164808d3.0 → 7.14.0

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,13 +9,15 @@ 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';
+import { close, Icon } from '@wordpress/icons';
 /**
  * Internal dependencies
  */
@@ -31,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';
@@ -68,7 +71,8 @@ function Navigation(_ref) {
       orientation = 'horizontal',
       flexWrap = 'wrap'
     } = {},
-    hasIcon
+    hasIcon,
+    icon = 'handle'
   } = attributes;
   const ref = attributes.ref;
 
@@ -79,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();
@@ -89,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'
   });
@@ -101,6 +111,11 @@ function Navigation(_ref) {
     isSuccess: createNavigationMenuIsSuccess,
     isError: createNavigationMenuIsError
   } = useCreateNavigationMenu(clientId);
+
+  const createUntitledEmptyNavigationMenu = () => {
+    createNavigationMenu('');
+  };
+
   useEffect(() => {
     hideNavigationMenuStatusNotice();
 
@@ -109,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,
@@ -164,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
@@ -175,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,
@@ -245,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(() => {
@@ -305,38 +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(OverlayMenuIcon, null), !hasIcon && createElement("span", null, __('Menu'))), overlayMenuPreview && createElement(ToggleControl, {
-    label: __('Show icon button'),
-    help: __('Configure the visual appearance of the button opening the overlay menu.'),
-    onChange: value => setAttributes({
-      hasIcon: value
-    }),
-    checked: hasIcon
-  }), createElement("h3", null, __('Overlay Menu')), createElement(ToggleGroupControl, {
+  }, 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(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.'),
@@ -413,39 +445,45 @@ 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,
       overlayTextColor: overlayTextColor
     }, createElement(UnsavedInnerBlocks, {
-      blockProps: blockProps,
       blocks: uncontrolledInnerBlocks,
       clientId: clientId,
       navigationMenus: navigationMenus,
@@ -464,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?'))));
   }
@@ -517,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
     }));
   }
 
@@ -537,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 () {
@@ -576,6 +625,7 @@ function Navigation(_ref) {
     onToggle: setResponsiveMenuVisibility,
     label: __('Menu'),
     hasIcon: hasIcon,
+    icon: icon,
     isOpen: isResponsiveMenuOpen,
     isResponsive: isResponsive,
     isHiddenByDefault: 'always' === overlayMenu,