@ant-design/pro-components 3.0.0-beta.1 → 3.0.0-beta.3

package/es/layout/components/SiderMenu/BaseMenu.js

@@ -1,522 +1,473 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-
-// src/layout/components/SiderMenu/BaseMenu.tsx
-import { createFromIconfontCN } from "@ant-design/icons";
-import { Menu, Skeleton, Tooltip } from "antd";
-import classNames from "classnames";
-import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { createFromIconfontCN } from '@ant-design/icons';
+import { Menu, Skeleton, Tooltip } from 'antd';
+import classNames from 'classnames';
+import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { ProProvider } from "../../../provider";
 import { isImg, isUrl, useMountMergeState } from "../../../utils";
 import { defaultSettings } from "../../defaultSettings";
 import { getOpenKeysFromMenuData } from "../../utils/utils";
 import { useStyle } from "./style/menu";
-var MenuItemTooltip = (props) => {
-  const [collapsed, setCollapsed] = useState(props.collapsed);
-  const [open, setOpen] = useState(false);
-  useEffect(() => {
+
+// todo
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+var MenuItemTooltip = function MenuItemTooltip(props) {
+  var _useState = useState(props.collapsed),
+    _useState2 = _slicedToArray(_useState, 2),
+    collapsed = _useState2[0],
+    setCollapsed = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    open = _useState4[0],
+    setOpen = _useState4[1];
+  useEffect(function () {
     setOpen(false);
-    setTimeout(() => {
+    setTimeout(function () {
       setCollapsed(props.collapsed);
     }, 400);
   }, [props.collapsed]);
   if (props.disable) {
     return props.children;
   }
-  return /* @__PURE__ */ React.createElement(
-    Tooltip,
-    {
-      title: props.title,
-      open: collapsed && props.collapsed ? open : false,
-      placement: "right",
-      onOpenChange: setOpen
-    },
-    props.children
-  );
+  return /*#__PURE__*/_jsx(Tooltip, {
+    title: props.title,
+    open: collapsed && props.collapsed ? open : false,
+    placement: "right",
+    onOpenChange: setOpen,
+    children: props.children
+  });
 };
 var IconFont = createFromIconfontCN({
   scriptUrl: defaultSettings.iconfontUrl
 });
-var getIcon = (icon, iconPrefixes = "icon-", className) => {
-  if (typeof icon === "string" && icon !== "") {
+
+// Allow menu.js config icon as string or ReactNode
+//   icon: 'setting',
+//   icon: 'icon-geren' #For Iconfont ,
+//   icon: 'http://demo.com/icon.png',
+//   icon: '/favicon.png',
+//   icon: <Icon type="setting" />,
+var getIcon = function getIcon(icon) {
+  var iconPrefixes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'icon-';
+  var className = arguments.length > 2 ? arguments[2] : undefined;
+  if (typeof icon === 'string' && icon !== '') {
     if (isUrl(icon) || isImg(icon)) {
-      return /* @__PURE__ */ React.createElement(
-        "img",
-        {
-          width: 16,
-          key: icon,
-          src: icon,
-          alt: "icon",
-          className
-        }
-      );
+      return /*#__PURE__*/_jsx("img", {
+        width: 16,
+        src: icon,
+        alt: "icon",
+        className: className
+      }, icon);
     }
     if (icon.startsWith(iconPrefixes)) {
-      return /* @__PURE__ */ React.createElement(IconFont, { type: icon });
+      return /*#__PURE__*/_jsx(IconFont, {
+        type: icon
+      });
     }
   }
   return icon;
 };
-var getMenuTitleSymbol = (title) => {
-  if (title && typeof title === "string") {
-    const symbol = title.substring(0, 1).toUpperCase();
+var getMenuTitleSymbol = function getMenuTitleSymbol(title) {
+  if (title && typeof title === 'string') {
+    var symbol = title.substring(0, 1).toUpperCase();
     return symbol;
   }
   return null;
 };
-var MenuUtil = class {
-  constructor(props) {
-    this.getNavMenuItems = (menusData = [], level, noGroupLevel) => menusData.map((item) => this.getSubMenuOrItem(item, level, noGroupLevel)).filter((item) => item).flat(1);
-    /** Get SubMenu or Item */
-    this.getSubMenuOrItem = (item, level, noGroupLevel) => {
-      var _a, _b, _c, _d, _e, _f;
-      const {
-        subMenuItemRender,
-        baseClassName,
-        prefixCls,
-        collapsed,
-        menu,
-        iconPrefixes,
-        layout
-      } = this.props;
-      const isGroup = (menu == null ? void 0 : menu.type) === "group" && layout !== "top";
-      const designToken = this.props.token;
-      const name = this.getIntlName(item);
-      const children = item == null ? void 0 : item.children;
-      const menuType = isGroup && level === 0 ? "group" : void 0;
-      if (Array.isArray(children) && children.length > 0) {
-        const shouldHasIcon = level === 0 || isGroup && level === 1;
-        const iconDom = getIcon(
-          item.icon,
-          iconPrefixes,
-          `${baseClassName}-icon ${(_a = this.props) == null ? void 0 : _a.hashId}`
-        );
-        const defaultIcon = collapsed && shouldHasIcon ? getMenuTitleSymbol(name) : null;
-        const defaultTitle = /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            className: classNames(
-              `${baseClassName}-item-title`,
-              (_b = this.props) == null ? void 0 : _b.hashId,
-              {
-                [`${baseClassName}-item-title-collapsed`]: collapsed,
-                [`${baseClassName}-item-title-collapsed-level-${noGroupLevel}`]: collapsed,
-                [`${baseClassName}-group-item-title`]: menuType === "group",
-                [`${baseClassName}-item-collapsed-show-title`]: (menu == null ? void 0 : menu.collapsedShowTitle) && collapsed
-              }
-            )
-          },
-          menuType === "group" && collapsed ? null : shouldHasIcon && iconDom ? /* @__PURE__ */ React.createElement(
-            "span",
-            {
-              className: `${baseClassName}-item-icon ${(_c = this.props) == null ? void 0 : _c.hashId}`.trim()
-            },
-            iconDom
-          ) : defaultIcon,
-          /* @__PURE__ */ React.createElement(
-            "span",
-            {
-              className: classNames(
-                `${baseClassName}-item-text`,
-                (_d = this.props) == null ? void 0 : _d.hashId,
-                {
-                  [`${baseClassName}-item-text-has-icon`]: menuType !== "group" && shouldHasIcon && (iconDom || defaultIcon)
-                }
-              )
-            },
-            name
-          )
-        );
-        const title = subMenuItemRender ? subMenuItemRender(__spreadProps(__spreadValues({}, item), { isUrl: false }), defaultTitle, this.props) : defaultTitle;
-        if (isGroup && level === 0 && this.props.collapsed && !menu.collapsedShowGroupTitle) {
-          return this.getNavMenuItems(children, level + 1, level);
-        }
-        const childrenList = this.getNavMenuItems(
-          children,
-          level + 1,
-          isGroup && level === 0 && this.props.collapsed ? level : level + 1
-        );
-        return [
-          {
-            type: menuType,
-            key: item.key || item.path,
-            label: title,
-            onClick: isGroup ? void 0 : item.onTitleClick,
-            children: childrenList,
-            className: classNames({
-              [`${baseClassName}-group`]: menuType === "group",
-              [`${baseClassName}-submenu`]: menuType !== "group",
-              [`${baseClassName}-submenu-has-icon`]: menuType !== "group" && shouldHasIcon && iconDom
-            })
-          },
-          isGroup && level === 0 ? {
-            type: "divider",
-            prefixCls,
-            className: `${baseClassName}-divider`,
-            key: (item.key || item.path) + "-group-divider",
-            style: {
-              padding: 0,
-              borderBlockEnd: 0,
-              margin: this.props.collapsed ? "4px" : "6px 16px",
-              marginBlockStart: this.props.collapsed ? 4 : 8,
-              borderColor: (_f = (_e = designToken == null ? void 0 : designToken.layout) == null ? void 0 : _e.sider) == null ? void 0 : _f.colorMenuItemDivider
-            }
-          } : void 0
-        ].filter(Boolean);
+var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
+  var _this = this;
+  _classCallCheck(this, MenuUtil);
+  _defineProperty(this, "props", void 0);
+  _defineProperty(this, "getNavMenuItems", function () {
+    var menusData = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    var level = arguments.length > 1 ? arguments[1] : undefined;
+    var noGroupLevel = arguments.length > 2 ? arguments[2] : undefined;
+    return menusData.map(function (item) {
+      return _this.getSubMenuOrItem(item, level, noGroupLevel);
+    }).filter(function (item) {
+      return item;
+    }).flat(1);
+  });
+  /** Get SubMenu or Item */
+  _defineProperty(this, "getSubMenuOrItem", function (item, level, noGroupLevel) {
+    var _this$props = _this.props,
+      subMenuItemRender = _this$props.subMenuItemRender,
+      baseClassName = _this$props.baseClassName,
+      prefixCls = _this$props.prefixCls,
+      collapsed = _this$props.collapsed,
+      menu = _this$props.menu,
+      iconPrefixes = _this$props.iconPrefixes,
+      layout = _this$props.layout;
+    var isGroup = (menu === null || menu === void 0 ? void 0 : menu.type) === 'group' && layout !== 'top';
+    var designToken = _this.props.token;
+    var name = _this.getIntlName(item);
+    var children = item === null || item === void 0 ? void 0 : item.children;
+    var menuType = isGroup && level === 0 ? 'group' : undefined;
+    if (Array.isArray(children) && children.length > 0) {
+      var _this$props2, _this$props3, _this$props4, _this$props5, _designToken$layout;
+      /** Menu 第一级可以有icon，或者 isGroup 时第二级别也要有 */
+      var shouldHasIcon = level === 0 || isGroup && level === 1;
+
+      //  get defaultTitle by menuItemRender
+      var iconDom = getIcon(item.icon, iconPrefixes, "".concat(baseClassName, "-icon ").concat((_this$props2 = _this.props) === null || _this$props2 === void 0 ? void 0 : _this$props2.hashId));
+      /**
+       * 如果没有icon在收起的时候用首字母代替
+       */
+      var defaultIcon = collapsed && shouldHasIcon ? getMenuTitleSymbol(name) : null;
+      var defaultTitle = /*#__PURE__*/_jsxs("div", {
+        className: classNames("".concat(baseClassName, "-item-title"), (_this$props3 = _this.props) === null || _this$props3 === void 0 ? void 0 : _this$props3.hashId, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(baseClassName, "-item-title-collapsed"), collapsed), "".concat(baseClassName, "-item-title-collapsed-level-").concat(noGroupLevel), collapsed), "".concat(baseClassName, "-group-item-title"), menuType === 'group'), "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed)),
+        children: [menuType === 'group' && collapsed ? null : shouldHasIcon && iconDom ? /*#__PURE__*/_jsx("span", {
+          className: "".concat(baseClassName, "-item-icon ").concat((_this$props4 = _this.props) === null || _this$props4 === void 0 ? void 0 : _this$props4.hashId).trim(),
+          children: iconDom
+        }) : defaultIcon, /*#__PURE__*/_jsx("span", {
+          className: classNames("".concat(baseClassName, "-item-text"), (_this$props5 = _this.props) === null || _this$props5 === void 0 ? void 0 : _this$props5.hashId, _defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), menuType !== 'group' && shouldHasIcon && (iconDom || defaultIcon))),
+          children: name
+        })]
+      });
+
+      // subMenu only title render
+      var title = subMenuItemRender ? subMenuItemRender(_objectSpread(_objectSpread({}, item), {}, {
+        isUrl: false
+      }), defaultTitle, _this.props) : defaultTitle;
+
+      // 如果收起来，没有子菜单了，就不需要展示 group，所以 level 不增加
+      if (isGroup && level === 0 && _this.props.collapsed && !menu.collapsedShowGroupTitle) {
+        return _this.getNavMenuItems(children, level + 1, level);
       }
-      return {
-        className: `${baseClassName}-menu-item`,
-        disabled: item.disabled,
+      var childrenList = _this.getNavMenuItems(children, level + 1, isGroup && level === 0 && _this.props.collapsed ? level : level + 1);
+      return [{
+        type: menuType,
         key: item.key || item.path,
-        onClick: item.onTitleClick,
-        // eslint-disable-next-line react/no-is-mounted
-        label: this.getMenuItemPath(item, level, noGroupLevel)
-      };
-    };
-    this.getIntlName = (item) => {
-      const { name, locale } = item;
-      const { menu, formatMessage } = this.props;
-      let finalName = name;
-      if (locale && (menu == null ? void 0 : menu.locale) !== false) {
-        finalName = formatMessage == null ? void 0 : formatMessage({
-          id: locale,
-          defaultMessage: name
-        });
-      }
-      if (this.props.menuTextRender) {
-        return this.props.menuTextRender(item, finalName, this.props);
-      }
-      return finalName;
+        label: title,
+        onClick: isGroup ? undefined : item.onTitleClick,
+        children: childrenList,
+        className: classNames(_defineProperty(_defineProperty(_defineProperty({}, "".concat(baseClassName, "-group"), menuType === 'group'), "".concat(baseClassName, "-submenu"), menuType !== 'group'), "".concat(baseClassName, "-submenu-has-icon"), menuType !== 'group' && shouldHasIcon && iconDom))
+      }, isGroup && level === 0 ? {
+        type: 'divider',
+        prefixCls: prefixCls,
+        className: "".concat(baseClassName, "-divider"),
+        key: (item.key || item.path) + '-group-divider',
+        style: {
+          padding: 0,
+          borderBlockEnd: 0,
+          margin: _this.props.collapsed ? '4px' : '6px 16px',
+          marginBlockStart: _this.props.collapsed ? 4 : 8,
+          borderColor: designToken === null || designToken === void 0 || (_designToken$layout = designToken.layout) === null || _designToken$layout === void 0 || (_designToken$layout = _designToken$layout.sider) === null || _designToken$layout === void 0 ? void 0 : _designToken$layout.colorMenuItemDivider
+        }
+      } : undefined].filter(Boolean);
+    }
+    return {
+      className: "".concat(baseClassName, "-menu-item"),
+      disabled: item.disabled,
+      key: item.key || item.path,
+      onClick: item.onTitleClick,
+      // eslint-disable-next-line react/no-is-mounted
+      label: _this.getMenuItemPath(item, level, noGroupLevel)
     };
-    /**
-     * 判断是否是http链接.返回 Link 或 a Judge whether it is http link.return a or Link
-     *
-     * @memberof SiderMenu
-     */
-    this.getMenuItemPath = (item, level, noGroupLevel) => {
-      var _a, _b, _c, _d, _e, _f, _g;
-      const itemPath = this.conversionPath(item.path || "/");
-      const {
-        location = { pathname: "/" },
-        isMobile,
-        onCollapse,
-        menuItemRender,
-        iconPrefixes
-      } = this.props;
-      const menuItemTitle = this.getIntlName(item);
-      const { baseClassName, menu, collapsed } = this.props;
-      const isGroup = (menu == null ? void 0 : menu.type) === "group";
-      const hasIcon = level === 0 || isGroup && level === 1;
-      const icon = !hasIcon ? null : getIcon(
-        item.icon,
-        iconPrefixes,
-        `${baseClassName}-icon ${(_a = this.props) == null ? void 0 : _a.hashId}`
-      );
-      const defaultIcon = collapsed && hasIcon ? getMenuTitleSymbol(menuItemTitle) : null;
-      let defaultItem = /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          key: itemPath,
-          className: classNames(
-            `${baseClassName}-item-title`,
-            (_b = this.props) == null ? void 0 : _b.hashId,
-            {
-              [`${baseClassName}-item-title-collapsed`]: collapsed,
-              [`${baseClassName}-item-title-collapsed-level-${noGroupLevel}`]: collapsed,
-              [`${baseClassName}-item-collapsed-show-title`]: (menu == null ? void 0 : menu.collapsedShowTitle) && collapsed
-            }
-          )
+  });
+  _defineProperty(this, "getIntlName", function (item) {
+    var name = item.name,
+      locale = item.locale;
+    var _this$props6 = _this.props,
+      menu = _this$props6.menu,
+      formatMessage = _this$props6.formatMessage;
+    var finalName = name;
+    if (locale && (menu === null || menu === void 0 ? void 0 : menu.locale) !== false) {
+      finalName = formatMessage === null || formatMessage === void 0 ? void 0 : formatMessage({
+        id: locale,
+        defaultMessage: name
+      });
+    }
+    if (_this.props.menuTextRender) {
+      return _this.props.menuTextRender(item, finalName, _this.props);
+    }
+    return finalName;
+  });
+  /**
+   * 判断是否是http链接.返回 Link 或 a Judge whether it is http link.return a or Link
+   *
+   * @memberof SiderMenu
+   */
+  _defineProperty(this, "getMenuItemPath", function (item, level, noGroupLevel) {
+    var _this$props9, _this$props10, _this$props11, _this$props12;
+    var itemPath = _this.conversionPath(item.path || '/');
+    var _this$props7 = _this.props,
+      _this$props7$location = _this$props7.location,
+      location = _this$props7$location === void 0 ? {
+        pathname: '/'
+      } : _this$props7$location,
+      isMobile = _this$props7.isMobile,
+      onCollapse = _this$props7.onCollapse,
+      menuItemRender = _this$props7.menuItemRender,
+      iconPrefixes = _this$props7.iconPrefixes;
+
+    // if local is true formatMessage all name。
+    var menuItemTitle = _this.getIntlName(item);
+    var _this$props8 = _this.props,
+      baseClassName = _this$props8.baseClassName,
+      menu = _this$props8.menu,
+      collapsed = _this$props8.collapsed;
+    var isGroup = (menu === null || menu === void 0 ? void 0 : menu.type) === 'group';
+    /** Menu 第一级可以有icon，或者 isGroup 时第二级别也要有 */
+    var hasIcon = level === 0 || isGroup && level === 1;
+    var icon = !hasIcon ? null : getIcon(item.icon, iconPrefixes, "".concat(baseClassName, "-icon ").concat((_this$props9 = _this.props) === null || _this$props9 === void 0 ? void 0 : _this$props9.hashId));
+
+    // 如果没有 icon 在收起的时候用首字母代替
+    var defaultIcon = collapsed && hasIcon ? getMenuTitleSymbol(menuItemTitle) : null;
+    var defaultItem = /*#__PURE__*/_jsxs("div", {
+      className: classNames("".concat(baseClassName, "-item-title"), (_this$props10 = _this.props) === null || _this$props10 === void 0 ? void 0 : _this$props10.hashId, _defineProperty(_defineProperty(_defineProperty({}, "".concat(baseClassName, "-item-title-collapsed"), collapsed), "".concat(baseClassName, "-item-title-collapsed-level-").concat(noGroupLevel), collapsed), "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed)),
+      children: [/*#__PURE__*/_jsx("span", {
+        className: "".concat(baseClassName, "-item-icon ").concat((_this$props11 = _this.props) === null || _this$props11 === void 0 ? void 0 : _this$props11.hashId).trim(),
+        style: {
+          display: defaultIcon === null && !icon ? 'none' : ''
         },
-        /* @__PURE__ */ React.createElement(
-          "span",
-          {
-            className: `${baseClassName}-item-icon ${(_c = this.props) == null ? void 0 : _c.hashId}`.trim(),
-            style: {
-              display: defaultIcon === null && !icon ? "none" : ""
-            }
-          },
-          icon || /* @__PURE__ */ React.createElement("span", { className: "anticon" }, defaultIcon)
-        ),
-        /* @__PURE__ */ React.createElement(
-          "span",
-          {
-            className: classNames(
-              `${baseClassName}-item-text`,
-              (_d = this.props) == null ? void 0 : _d.hashId,
-              {
-                [`${baseClassName}-item-text-has-icon`]: hasIcon && (icon || defaultIcon)
-              }
-            )
-          },
-          menuItemTitle
-        )
-      );
-      const isHttpUrl = isUrl(itemPath);
-      if (isHttpUrl) {
-        defaultItem = /* @__PURE__ */ React.createElement(
-          "span",
-          {
-            key: itemPath,
-            onClick: () => {
-              var _a2;
-              (_a2 = window == null ? void 0 : window.open) == null ? void 0 : _a2.call(window, itemPath, "_blank");
-            },
-            className: classNames(
-              `${baseClassName}-item-title`,
-              (_e = this.props) == null ? void 0 : _e.hashId,
-              {
-                [`${baseClassName}-item-title-collapsed`]: collapsed,
-                [`${baseClassName}-item-title-collapsed-level-${noGroupLevel}`]: collapsed,
-                [`${baseClassName}-item-link`]: true,
-                [`${baseClassName}-item-collapsed-show-title`]: (menu == null ? void 0 : menu.collapsedShowTitle) && collapsed
-              }
-            )
-          },
-          /* @__PURE__ */ React.createElement(
-            "span",
-            {
-              className: `${baseClassName}-item-icon ${(_f = this.props) == null ? void 0 : _f.hashId}`.trim(),
-              style: {
-                display: defaultIcon === null && !icon ? "none" : ""
-              }
-            },
-            icon || /* @__PURE__ */ React.createElement("span", { className: "anticon" }, defaultIcon)
-          ),
-          /* @__PURE__ */ React.createElement(
-            "span",
-            {
-              className: classNames(
-                `${baseClassName}-item-text`,
-                (_g = this.props) == null ? void 0 : _g.hashId,
-                {
-                  [`${baseClassName}-item-text-has-icon`]: hasIcon && (icon || defaultIcon)
-                }
-              )
-            },
-            menuItemTitle
-          )
-        );
-      }
-      if (menuItemRender) {
-        const renderItemProps = __spreadProps(__spreadValues({}, item), {
-          isUrl: isHttpUrl,
-          itemPath,
-          isMobile,
-          replace: itemPath === location.pathname,
-          onClick: () => onCollapse && onCollapse(true),
-          children: void 0
-        });
-        return level === 0 ? /* @__PURE__ */ React.createElement(
-          MenuItemTooltip,
-          {
-            collapsed,
-            title: menuItemTitle,
-            disable: item.disabledTooltip
+        children: icon || /*#__PURE__*/_jsx("span", {
+          className: "anticon",
+          children: defaultIcon
+        })
+      }), /*#__PURE__*/_jsx("span", {
+        className: classNames("".concat(baseClassName, "-item-text"), (_this$props12 = _this.props) === null || _this$props12 === void 0 ? void 0 : _this$props12.hashId, _defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), hasIcon && (icon || defaultIcon))),
+        children: menuItemTitle
+      })]
+    }, itemPath);
+    var isHttpUrl = isUrl(itemPath);
+
+    // Is it a http link
+    if (isHttpUrl) {
+      var _this$props13, _this$props14, _this$props15;
+      defaultItem = /*#__PURE__*/_jsxs("span", {
+        onClick: function onClick() {
+          var _window, _window$open;
+          (_window = window) === null || _window === void 0 || (_window$open = _window.open) === null || _window$open === void 0 || _window$open.call(_window, itemPath, '_blank');
+        },
+        className: classNames("".concat(baseClassName, "-item-title"), (_this$props13 = _this.props) === null || _this$props13 === void 0 ? void 0 : _this$props13.hashId, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(baseClassName, "-item-title-collapsed"), collapsed), "".concat(baseClassName, "-item-title-collapsed-level-").concat(noGroupLevel), collapsed), "".concat(baseClassName, "-item-link"), true), "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed)),
+        children: [/*#__PURE__*/_jsx("span", {
+          className: "".concat(baseClassName, "-item-icon ").concat((_this$props14 = _this.props) === null || _this$props14 === void 0 ? void 0 : _this$props14.hashId).trim(),
+          style: {
+            display: defaultIcon === null && !icon ? 'none' : ''
           },
-          menuItemRender(renderItemProps, defaultItem, this.props)
-        ) : menuItemRender(renderItemProps, defaultItem, this.props);
-      }
-      return level === 0 ? /* @__PURE__ */ React.createElement(
-        MenuItemTooltip,
-        {
-          collapsed,
-          title: menuItemTitle,
-          disable: item.disabledTooltip
+          children: icon || /*#__PURE__*/_jsx("span", {
+            className: "anticon",
+            children: defaultIcon
+          })
+        }), /*#__PURE__*/_jsx("span", {
+          className: classNames("".concat(baseClassName, "-item-text"), (_this$props15 = _this.props) === null || _this$props15 === void 0 ? void 0 : _this$props15.hashId, _defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), hasIcon && (icon || defaultIcon))),
+          children: menuItemTitle
+        })]
+      }, itemPath);
+    }
+    if (menuItemRender) {
+      var renderItemProps = _objectSpread(_objectSpread({}, item), {}, {
+        isUrl: isHttpUrl,
+        itemPath: itemPath,
+        isMobile: isMobile,
+        replace: itemPath === location.pathname,
+        onClick: function onClick() {
+          return onCollapse && onCollapse(true);
         },
-        defaultItem
-      ) : defaultItem;
-    };
-    this.conversionPath = (path) => {
-      if (path && path.indexOf("http") === 0) {
-        return path;
-      }
-      return `/${path || ""}`.replace(/\/+/g, "/");
-    };
-    this.props = props;
-  }
-};
-var getOpenKeysProps = (openKeys, { layout, collapsed }) => {
-  let openKeysProps = {};
-  if (openKeys && !collapsed && ["side", "mix"].includes(layout || "mix")) {
+        children: undefined
+      });
+      return level === 0 ? /*#__PURE__*/_jsx(MenuItemTooltip, {
+        collapsed: collapsed,
+        title: menuItemTitle,
+        disable: item.disabledTooltip,
+        children: menuItemRender(renderItemProps, defaultItem, _this.props)
+      }) : menuItemRender(renderItemProps, defaultItem, _this.props);
+    }
+    return level === 0 ? /*#__PURE__*/_jsx(MenuItemTooltip, {
+      collapsed: collapsed,
+      title: menuItemTitle,
+      disable: item.disabledTooltip,
+      children: defaultItem
+    }) : defaultItem;
+  });
+  _defineProperty(this, "conversionPath", function (path) {
+    if (path && path.indexOf('http') === 0) {
+      return path;
+    }
+    return "/".concat(path || '').replace(/\/+/g, '/');
+  });
+  this.props = props;
+});
+/**
+ * 生成openKeys 的对象，因为设置了openKeys 就会变成受控，所以需要一个空对象
+ *
+ * @param BaseMenuProps
+ */
+var getOpenKeysProps = function getOpenKeysProps(openKeys, _ref) {
+  var layout = _ref.layout,
+    collapsed = _ref.collapsed;
+  var openKeysProps = {};
+  if (openKeys && !collapsed && ['side', 'mix'].includes(layout || 'mix')) {
     openKeysProps = {
-      openKeys
+      openKeys: openKeys
     };
   }
   return openKeysProps;
 };
-var BaseMenu = (props) => {
-  const {
-    mode,
-    className,
-    handleOpenChange,
-    style,
-    menuData,
-    prefixCls,
-    menu,
-    matchMenuKeys,
-    iconfontUrl,
-    selectedKeys: propsSelectedKeys,
-    onSelect,
-    menuRenderType,
-    openKeys: propsOpenKeys
-  } = props;
-  const { dark, token: designToken } = useContext(ProProvider);
-  const baseClassName = `${prefixCls}-base-menu-${mode}`;
-  const defaultOpenKeysRef = useRef([]);
-  const [defaultOpenAll, setDefaultOpenAll] = useMountMergeState(
-    menu == null ? void 0 : menu.defaultOpenAll
-  );
-  const [openKeys, setOpenKeys] = useMountMergeState(
-    () => {
-      if (menu == null ? void 0 : menu.defaultOpenAll) {
+var BaseMenu = function BaseMenu(props) {
+  var mode = props.mode,
+    className = props.className,
+    handleOpenChange = props.handleOpenChange,
+    style = props.style,
+    menuData = props.menuData,
+    prefixCls = props.prefixCls,
+    menu = props.menu,
+    matchMenuKeys = props.matchMenuKeys,
+    iconfontUrl = props.iconfontUrl,
+    propsSelectedKeys = props.selectedKeys,
+    onSelect = props.onSelect,
+    menuRenderType = props.menuRenderType,
+    propsOpenKeys = props.openKeys;
+  var _useContext = useContext(ProProvider),
+    dark = _useContext.dark,
+    designToken = _useContext.token;
+  var baseClassName = "".concat(prefixCls, "-base-menu-").concat(mode);
+  // 用于减少 defaultOpenKeys 计算的组件
+  var defaultOpenKeysRef = useRef([]);
+  var _useMountMergeState = useMountMergeState(menu === null || menu === void 0 ? void 0 : menu.defaultOpenAll),
+    _useMountMergeState2 = _slicedToArray(_useMountMergeState, 2),
+    defaultOpenAll = _useMountMergeState2[0],
+    setDefaultOpenAll = _useMountMergeState2[1];
+  var _useMountMergeState3 = useMountMergeState(function () {
+      if (menu !== null && menu !== void 0 && menu.defaultOpenAll) {
         return getOpenKeysFromMenuData(menuData) || [];
       }
       if (propsOpenKeys === false) {
         return false;
       }
       return [];
-    },
-    {
-      value: propsOpenKeys === false ? void 0 : propsOpenKeys,
+    }, {
+      value: propsOpenKeys === false ? undefined : propsOpenKeys,
       onChange: handleOpenChange
-    }
-  );
-  const [selectedKeys, setSelectedKeys] = useMountMergeState([], {
-    value: propsSelectedKeys,
-    onChange: onSelect ? (keys) => {
-      if (onSelect && keys) {
-        onSelect(keys);
-      }
-    } : void 0
-  });
-  useEffect(() => {
-    if ((menu == null ? void 0 : menu.defaultOpenAll) || propsOpenKeys === false) {
+    }),
+    _useMountMergeState4 = _slicedToArray(_useMountMergeState3, 2),
+    openKeys = _useMountMergeState4[0],
+    setOpenKeys = _useMountMergeState4[1];
+  var _useMountMergeState5 = useMountMergeState([], {
+      value: propsSelectedKeys,
+      onChange: onSelect ? function (keys) {
+        if (onSelect && keys) {
+          onSelect(keys);
+        }
+      } : undefined
+    }),
+    _useMountMergeState6 = _slicedToArray(_useMountMergeState5, 2),
+    selectedKeys = _useMountMergeState6[0],
+    setSelectedKeys = _useMountMergeState6[1];
+  useEffect(function () {
+    if (menu !== null && menu !== void 0 && menu.defaultOpenAll || propsOpenKeys === false) {
       return;
     }
     if (matchMenuKeys) {
       setOpenKeys(matchMenuKeys);
       setSelectedKeys(matchMenuKeys);
     }
-  }, [matchMenuKeys.join("-")]);
-  useEffect(() => {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [matchMenuKeys.join('-')]);
+  useEffect(function () {
+    // reset IconFont
     if (iconfontUrl) {
       IconFont = createFromIconfontCN({
         scriptUrl: iconfontUrl
       });
     }
   }, [iconfontUrl]);
-  useEffect(
-    () => {
-      if (matchMenuKeys.join("-") !== (selectedKeys || []).join("-")) {
-        setSelectedKeys(matchMenuKeys);
-      }
-      if (!defaultOpenAll && propsOpenKeys !== false && matchMenuKeys.join("-") !== (openKeys || []).join("-")) {
-        let newKeys = matchMenuKeys;
-        if ((menu == null ? void 0 : menu.autoClose) === false) {
-          newKeys = Array.from(
-            /* @__PURE__ */ new Set([...matchMenuKeys, ...openKeys || []])
-          );
-        }
-        setOpenKeys(newKeys);
-      } else if ((menu == null ? void 0 : menu.ignoreFlatMenu) && defaultOpenAll && !props.collapsed) {
-        setOpenKeys(getOpenKeysFromMenuData(menuData));
-      } else {
-        setDefaultOpenAll(false);
+  useEffect(function () {
+    // if pathname can't match, use the nearest parent's key
+    if (matchMenuKeys.join('-') !== (selectedKeys || []).join('-')) {
+      setSelectedKeys(matchMenuKeys);
+    }
+    if (!defaultOpenAll && propsOpenKeys !== false && matchMenuKeys.join('-') !== (openKeys || []).join('-')) {
+      var newKeys = matchMenuKeys;
+      // 如果不自动关闭，我需要把 openKeys 放进去
+      if ((menu === null || menu === void 0 ? void 0 : menu.autoClose) === false) {
+        newKeys = Array.from(new Set([].concat(_toConsumableArray(matchMenuKeys), _toConsumableArray(openKeys || []))));
       }
-    },
-    // 依赖项加上 props.collapsed，保证折叠时能正确响应
-    [matchMenuKeys.join("-"), props.collapsed]
-  );
-  const openKeysProps = useMemo(
-    () => getOpenKeysProps(openKeys, props),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [openKeys && openKeys.join(","), props.layout, props.collapsed]
-  );
-  const { wrapSSR, hashId } = useStyle(baseClassName, mode);
-  const menuUtils = useMemo(() => {
-    return new MenuUtil(__spreadProps(__spreadValues({}, props), {
+      setOpenKeys(newKeys);
+    } else if (menu !== null && menu !== void 0 && menu.ignoreFlatMenu && defaultOpenAll && !props.collapsed) {
+      // 忽略用户手动折叠过的菜单状态，折叠按钮切换之后也可实现默认展开所有菜单
+      // 但是如果用户手动点击关闭菜单，则应该遵循用户的选择
+      setOpenKeys(getOpenKeysFromMenuData(menuData));
+    } else {
+      setDefaultOpenAll(false);
+    }
+  },
+  // 依赖项加上 props.collapsed，保证折叠时能正确响应
+  [matchMenuKeys.join('-'), props.collapsed]);
+  var openKeysProps = useMemo(function () {
+    return getOpenKeysProps(openKeys, props);
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [openKeys && openKeys.join(','), props.layout, props.collapsed]);
+  var _useStyle = useStyle(baseClassName, mode),
+    wrapSSR = _useStyle.wrapSSR,
+    hashId = _useStyle.hashId;
+  var menuUtils = useMemo(function () {
+    return new MenuUtil(_objectSpread(_objectSpread({}, props), {}, {
       token: designToken,
-      menuRenderType,
-      baseClassName,
-      hashId
+      menuRenderType: menuRenderType,
+      baseClassName: baseClassName,
+      hashId: hashId
     }));
   }, [props, designToken, menuRenderType, baseClassName, hashId]);
-  if (menu == null ? void 0 : menu.loading) {
-    return /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        style: (mode == null ? void 0 : mode.includes("inline")) ? { padding: 24 } : {
-          marginBlockStart: 16
-        }
+  if (menu !== null && menu !== void 0 && menu.loading) {
+    return /*#__PURE__*/_jsx("div", {
+      style: mode !== null && mode !== void 0 && mode.includes('inline') ? {
+        padding: 24
+      } : {
+        marginBlockStart: 16
       },
-      /* @__PURE__ */ React.createElement(
-        Skeleton,
-        {
-          active: true,
-          title: false,
-          paragraph: {
-            rows: (mode == null ? void 0 : mode.includes("inline")) ? 6 : 1
-          }
+      children: /*#__PURE__*/_jsx(Skeleton, {
+        active: true,
+        title: false,
+        paragraph: {
+          rows: mode !== null && mode !== void 0 && mode.includes('inline') ? 6 : 1
         }
-      )
-    );
+      })
+    });
   }
+
+  // 这次 openKeys === false 的时候的情况，这种情况下帮用户选中一次
+  // 第二此不会使用，所以用了 defaultOpenKeys
+  // 这里返回 null，是为了让 defaultOpenKeys 生效
   if (props.openKeys === false && !props.handleOpenChange) {
     defaultOpenKeysRef.current = matchMenuKeys;
   }
-  const finallyData = props.postMenuData ? props.postMenuData(menuData) : menuData;
-  if (finallyData && (finallyData == null ? void 0 : finallyData.length) < 1) {
+  var finallyData = props.postMenuData ? props.postMenuData(menuData) : menuData;
+  if (finallyData && (finallyData === null || finallyData === void 0 ? void 0 : finallyData.length) < 1) {
     return null;
   }
-  return wrapSSR(
-    /* @__PURE__ */ React.createElement(
-      Menu,
-      __spreadValues(__spreadProps(__spreadValues({}, openKeysProps), {
-        _internalDisableMenuItemTitleTooltip: true,
-        key: "Menu",
-        mode,
-        inlineIndent: 16,
-        defaultOpenKeys: defaultOpenKeysRef.current,
-        theme: dark ? "dark" : "light",
-        selectedKeys,
-        style: __spreadValues({
-          backgroundColor: "transparent",
-          border: "none"
-        }, style),
-        className: classNames(className, hashId, baseClassName, {
-          [`${baseClassName}-horizontal`]: mode === "horizontal",
-          [`${baseClassName}-collapsed`]: props.collapsed
-        }),
-        items: menuUtils.getNavMenuItems(finallyData, 0, 0),
-        onOpenChange: (_openKeys) => {
-          if (!props.collapsed) {
-            if (_openKeys.length === 0) {
-              setDefaultOpenAll(false);
-            }
-            setOpenKeys(_openKeys);
-          }
+  return wrapSSR( /*#__PURE__*/_createElement(Menu, _objectSpread(_objectSpread({}, openKeysProps), {}, {
+    _internalDisableMenuItemTitleTooltip: true,
+    key: "Menu",
+    mode: mode,
+    inlineIndent: 16,
+    defaultOpenKeys: defaultOpenKeysRef.current,
+    theme: dark ? 'dark' : 'light',
+    selectedKeys: selectedKeys,
+    style: _objectSpread({
+      backgroundColor: 'transparent',
+      border: 'none'
+    }, style),
+    className: classNames(className, hashId, baseClassName, _defineProperty(_defineProperty({}, "".concat(baseClassName, "-horizontal"), mode === 'horizontal'), "".concat(baseClassName, "-collapsed"), props.collapsed)),
+    items: menuUtils.getNavMenuItems(finallyData, 0, 0),
+    onOpenChange: function onOpenChange(_openKeys) {
+      if (!props.collapsed) {
+        // 如果用户手动关闭所有菜单，则关闭自动展开
+        if (_openKeys.length === 0) {
+          setDefaultOpenAll(false);
         }
-      }), props.menuProps)
-    )
-  );
-};
-export {
-  BaseMenu
+        setOpenKeys(_openKeys);
+      }
+    }
+  }, props.menuProps)));
 };
+export { BaseMenu };