tntd 3.0.35 → 3.0.36-beta.1

package/es/tntd-layout/SideMenu.js

@@ -1,5 +1,30 @@
-import _get from "lodash/get";
-var __rest = this && this.__rest || function (s, e) {
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _get2 = _interopRequireDefault(require("lodash/get"));
+var _react = _interopRequireWildcard(require("react"));
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _menu = _interopRequireDefault(require("../menu"));
+var _utils = require("../utils");
+var _ActionsContext = _interopRequireDefault(require("./ActionsContext"));
+var _Iconfont = _interopRequireDefault(require("./Iconfont"));
+var _storage = require("./storage");
+var _templateObject, _templateObject2;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
+var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
@@ -7,331 +32,116 @@ var __rest = this && this.__rest || function (s, e) {
   }
   return t;
 };
-import React, { useContext, useEffect, useState } from 'react';
-import styled, { withTheme } from 'styled-components';
-import Menu from '../menu';
-import { getSelectedMenuInfo, isGroupMenu, isNewTabMenu, openInNewTab, traverseTree } from '../utils';
-import ActionsContext from './ActionsContext';
-import Iconfont from './Iconfont';
-import { setSideMenuStore } from './storage';
-const color = 'rgba(255,255,255,.85)';
-const compatibleColor = '#a1d7ff';
-const {
-  SubMenu,
-  Item: MenuItem
-} = Menu;
-const TNTMenu = styled(Menu)`
-  background: none !important;
-  &.ant-menu.ant-menu-root {
-    position: relative;
-    transition: none !important;
-    padding-top: 10px;
-    border-right: none;
-    text-rendering: optimizeLegibility;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    height: calc(100vh - ${props => `${props.theme.headerHeight}px`});
-    overflow-y: auto;
-    overflow-x: hidden;
-    .collapseIconPlacementBottom & {
-      padding-bottom: 36px;
-    }
-    .tnt-themeS1 & {
-      overflow-x: unset;
-      box-shadow: 10px 0 10px -5px rgba(0, 0, 0, 0.1);
-      z-index: 2;
-    }
-    scrollbar-width: none;
-    -ms-overflow-style: none;
-
-    &::-webkit-scrollbar {
-      display: none;
-    }
-    &::-moz-scrollbar {
-      display: none;
-    }
-
-    /** 一级结点是菜单样式开始 */
-    & > .ant-menu-item {
-      & > .tnt-icon:first-child {
-        font-size: 16px;
-      }
-    }
-
-    .ant-layout-sider-collapsed & {
-      & > .ant-menu-item {
-        & > .tnt-icon:first-child {
-          padding-left: 8px;
-        }
-        a {
-          visibility: hidden;
-        }
-      }
-    }
-    /** 一级结点是菜单样式结束 */
-
-    .ant-menu-item:active,
-    .ant-menu-submenu-title:active {
-      background: none;
-    }
-
-    .ant-menu-submenu .ant-menu-sub {
-      background: #212635;
-      border-radius: 0 0 2px 2px;
-      .compatible & {
-        background: #07408d !important;
-      }
-      .tnt-themeS1 & {
-        background: #fff !important;
-      }
-
-      // 蓝色系列 菜单展开区域颜色
-      .tnt-themeS3 & {
-        background: #07408d !important;
-      }
-    }
-    .ant-menu-submenu.ant-menu-submenu-active,
-    .ant-menu-submenu.ant-menu-submenu-selected {
-      background: rgba(47, 129, 247, 0.25) !important;
-      .tnt-themeS1 & {
-        background: ${props => props.theme.dividerColor} !important;
-      }
-
-      // 蓝色系 一级菜单的选中效果
-      .tnt-themeS3 & {
-        background: #204085 !important;
-      }
-    }
-    & > .ant-menu-submenu .ant-menu-submenu.ant-menu-submenu-active,
-    & > .ant-menu-submenu .ant-menu-submenu.ant-menu-submenu-selected {
-      background: none !important;
-      .tnt-themeS1 & {
-        background: ${props => props.theme.dividerColor} !important;
-      }
-      // 蓝色系 子级菜单级的选中效果
-      .tnt-themeS3 & {
-        background: #204085 !important;
-      }
-    }
-    .ant-menu-item {
-      margin: 0;
-      font-size: 14px;
-      padding-left: 54px !important;
-      height: ${({
-  size
-}) => size === 'large' ? '40px' : '36px'};
-      line-height: ${({
-  size
-}) => size === 'large' ? '40px' : '36px'};
-    }
-
-    & > .ant-menu-item {
-      padding-left: 24px !important;
-      width: 100%;
-
-      & > .tnt-icon {
-        margin-right: 12px;
-      }
-      & > a {
-        display: inline-block;
-      }
-    }
-
-    .ant-menu-submenu-title {
-      position: relative;
-      color: ${props => props.theme.compatible ? compatibleColor : color};
-      .tnt-themeS1 & {
-        color: ${props => props.theme.primaryTextColor};
-      }
-      height: ${({
-  size
-}) => size === 'large' ? '40px' : '36px'};
-      line-height: ${({
-  size
-}) => size === 'large' ? '40px' : '36px'};
-      .tnt-icon {
-        .tnt-themeS1 & {
-          color: ${props => props.theme.lightIconColor};
-        }
-      }
-      & > .tnt-icon {
-        position: absolute;
-        right: 20px;
-        top: 1px;
-        font-size: 10px;
-      }
-
-      // 蓝色系主题
-      .tnt-themeS3 & {
-        color: #fff;
-      }
-      .tnt-icon {
-        .tnt-themeS3 & {
-          color: #fff;
-        }
-      }
-    }
-
-    & > .ant-menu-submenu .ant-menu-submenu .ant-menu-submenu-title {
-      margin-top: 0;
-      margin-bottom: 0;
-      padding-left: 54px !important;
-    }
-  }
-
-  &.ant-menu .menu-arrow-right {
-    color: ${props => props.theme.compatible ? compatibleColor : color};
-  }
-
-  .ant-menu-item,
-  .ant-menu-item > a {
-    color: ${props => props.theme.compatible ? compatibleColor : color};
-    .tnt-themeS1 & {
-      color: ${props => props.theme.primaryTextColor};
-    }
-    &:hover {
-      color: #fff;
-      .tnt-themeS1 & {
-        color: ${props => props.theme.primaryColor};
-      }
-    }
-
-    // 蓝色系列
-    .tnt-themeS3 & {
-      color: #fff;
-    }
-    &:hover {
-      .tnt-themeS3 & {
-        color: #fff;
-      }
-    }
-  }
-  & > .ant-menu-item.ant-menu-item-selected,
-  &.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
-    color: rgba(255, 255, 255, 0.85);
-    background-color: ${props => props.theme.primaryColor};
-    .compatible & {
-      background-color: #013479;
-    }
-    & > a {
-      .tnt-themeS1 & {
-        color: #fff;
-      }
-    }
-    .tnt-themeS1 & {
-      color: #fff;
-      background-color: ${props => props.theme.primaryColor};
-    }
-
-    // 蓝色系 子项选中颜色
-    .tnt-themeS3 & {
-      color: #fff;
-      background: #013479;
-      &::after {
-        content: '';
-        display: none;
-      }
-    }
-  }
-  .ant-menu-submenu.ant-menu-submenu-selected {
-    .tnt-themeS2 & {
-      background: #141825;
-    }
-    .tnt-themeS2.compatible & {
-      background: rgba(47, 129, 247, 0.25) !important;
-    }
-  }
-`;
-const MenuTitle = styled.span`
-  font-size: 14px;
-  .large-size & {
-    font-size: 15px;
-  }
-  color: rgba(255, 255, 255, 0.85);
-  .compatible & {
-    color: #a1d7ff;
-  }
-  .tnt-themeS1 & {
-    color: ${props => props.theme.primaryTextColor};
-  }
-  .tnt-icon {
-    margin-right: 12px;
-    font-size: 16px;
-    position: relative;
-    top: 1px;
-
-    .large-size & {
-      font-size: 18px;
-      top: auto;
-    }
-    .tnt-themeS1 & {
-      /* color: #7e8081; */
-      color: ${props => `${props.theme.iconColor}`};
-    }
-  }
-`;
-export default withTheme(props => {
-  const actions = useContext(ActionsContext);
-  const {
-    language,
-    menus = [],
-    formatMenuPath,
-    changeRouter,
-    selectedKey,
-    openKeys,
-    onSelect,
-    onBeforeChange,
-    onChange,
-    onOpenChange,
-    collapsed
-  } = props;
-  const {
-    subMenu,
-    parentMenus
-  } = getSelectedMenuInfo(selectedKey, menus);
-  const [selectedKeys, setSelectedKeys] = useState([_get(subMenu, 'code')]);
-  const onSelectMenu = param => {
-    const {
-      subMenu,
-      parentMenus
-    } = getSelectedMenuInfo(param.key, menus) || {};
-    const params = Object.assign(Object.assign({}, param), {
+var color = 'rgba(255,255,255,.85)';
+var compatibleColor = '#a1d7ff';
+var SubMenu = _menu["default"].SubMenu,
+  MenuItem = _menu["default"].Item;
+var TNTMenu = (0, _styledComponents["default"])(_menu["default"])(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: none !important;\n  &.ant-menu.ant-menu-root {\n    position: relative;\n    transition: none !important;\n    padding-top: 10px;\n    border-right: none;\n    text-rendering: optimizeLegibility;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    height: calc(100vh - ", ");\n    overflow-y: auto;\n    overflow-x: hidden;\n    .collapseIconPlacementBottom & {\n      padding-bottom: 36px;\n    }\n    .tnt-themeS1 & {\n      overflow-x: unset;\n      box-shadow: 10px 0 10px -5px rgba(0, 0, 0, 0.1);\n      z-index: 2;\n    }\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n    &::-moz-scrollbar {\n      display: none;\n    }\n\n    /** \u4E00\u7EA7\u7ED3\u70B9\u662F\u83DC\u5355\u6837\u5F0F\u5F00\u59CB */\n    & > .ant-menu-item {\n      & > .tnt-icon:first-child {\n        font-size: 16px;\n      }\n    }\n\n    .ant-layout-sider-collapsed & {\n      & > .ant-menu-item {\n        & > .tnt-icon:first-child {\n          padding-left: 8px;\n        }\n        a {\n          visibility: hidden;\n        }\n      }\n    }\n    /** \u4E00\u7EA7\u7ED3\u70B9\u662F\u83DC\u5355\u6837\u5F0F\u7ED3\u675F */\n\n    .ant-menu-item:active,\n    .ant-menu-submenu-title:active {\n      background: none;\n    }\n\n    .ant-menu-submenu .ant-menu-sub {\n      background: #212635;\n      border-radius: 0 0 2px 2px;\n      .compatible & {\n        background: #07408d !important;\n      }\n      .tnt-themeS1 & {\n        background: #fff !important;\n      }\n\n      // \u84DD\u8272\u7CFB\u5217 \u83DC\u5355\u5C55\u5F00\u533A\u57DF\u989C\u8272\n      .tnt-themeS3 & {\n        background: #07408d !important;\n      }\n    }\n    .ant-menu-submenu.ant-menu-submenu-active,\n    .ant-menu-submenu.ant-menu-submenu-selected {\n      background: rgba(47, 129, 247, 0.25) !important;\n      .tnt-themeS1 & {\n        background: ", " !important;\n      }\n\n      // \u84DD\u8272\u7CFB \u4E00\u7EA7\u83DC\u5355\u7684\u9009\u4E2D\u6548\u679C\n      .tnt-themeS3 & {\n        background: #204085 !important;\n      }\n    }\n    & > .ant-menu-submenu .ant-menu-submenu.ant-menu-submenu-active,\n    & > .ant-menu-submenu .ant-menu-submenu.ant-menu-submenu-selected {\n      background: none !important;\n      .tnt-themeS1 & {\n        background: ", " !important;\n      }\n      // \u84DD\u8272\u7CFB \u5B50\u7EA7\u83DC\u5355\u7EA7\u7684\u9009\u4E2D\u6548\u679C\n      .tnt-themeS3 & {\n        background: #204085 !important;\n      }\n    }\n    .ant-menu-item {\n      margin: 0;\n      font-size: 14px;\n      padding-left: 54px !important;\n      height: ", ";\n      line-height: ", ";\n    }\n\n    & > .ant-menu-item {\n      padding-left: 24px !important;\n      width: 100%;\n\n      & > .tnt-icon {\n        margin-right: 12px;\n      }\n      & > a {\n        display: inline-block;\n      }\n    }\n\n    .ant-menu-submenu-title {\n      position: relative;\n      color: ", ";\n      .tnt-themeS1 & {\n        color: ", ";\n      }\n      height: ", ";\n      line-height: ", ";\n      .tnt-icon {\n        .tnt-themeS1 & {\n          color: ", ";\n        }\n      }\n      & > .tnt-icon {\n        position: absolute;\n        right: 20px;\n        top: 1px;\n        font-size: 10px;\n      }\n\n      // \u84DD\u8272\u7CFB\u4E3B\u9898\n      .tnt-themeS3 & {\n        color: #fff;\n      }\n      .tnt-icon {\n        .tnt-themeS3 & {\n          color: #fff;\n        }\n      }\n    }\n\n    & > .ant-menu-submenu .ant-menu-submenu .ant-menu-submenu-title {\n      margin-top: 0;\n      margin-bottom: 0;\n      padding-left: 54px !important;\n    }\n  }\n\n  &.ant-menu .menu-arrow-right {\n    color: ", ";\n  }\n\n  .ant-menu-item,\n  .ant-menu-item > a {\n    color: ", ";\n    .tnt-themeS1 & {\n      color: ", ";\n    }\n    &:hover {\n      color: #fff;\n      .tnt-themeS1 & {\n        color: ", ";\n      }\n    }\n\n    // \u84DD\u8272\u7CFB\u5217\n    .tnt-themeS3 & {\n      color: #fff;\n    }\n    &:hover {\n      .tnt-themeS3 & {\n        color: #fff;\n      }\n    }\n  }\n  & > .ant-menu-item.ant-menu-item-selected,\n  &.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {\n    color: rgba(255, 255, 255, 0.85);\n    background-color: ", ";\n    .compatible & {\n      background-color: #013479;\n    }\n    & > a {\n      .tnt-themeS1 & {\n        color: #fff;\n      }\n    }\n    .tnt-themeS1 & {\n      color: #fff;\n      background-color: ", ";\n    }\n\n    // \u84DD\u8272\u7CFB \u5B50\u9879\u9009\u4E2D\u989C\u8272\n    .tnt-themeS3 & {\n      color: #fff;\n      background: #013479;\n      &::after {\n        content: '';\n        display: none;\n      }\n    }\n  }\n  .ant-menu-submenu.ant-menu-submenu-selected {\n    .tnt-themeS2 & {\n      background: #141825;\n    }\n    .tnt-themeS2.compatible & {\n      background: rgba(47, 129, 247, 0.25) !important;\n    }\n  }\n"])), function (props) {
+  return "".concat(props.theme.headerHeight, "px");
+}, function (props) {
+  return props.theme.dividerColor;
+}, function (props) {
+  return props.theme.dividerColor;
+}, function (_ref) {
+  var size = _ref.size;
+  return size === 'large' ? '40px' : '36px';
+}, function (_ref2) {
+  var size = _ref2.size;
+  return size === 'large' ? '40px' : '36px';
+}, function (props) {
+  return props.theme.compatible ? compatibleColor : color;
+}, function (props) {
+  return props.theme.primaryTextColor;
+}, function (_ref3) {
+  var size = _ref3.size;
+  return size === 'large' ? '40px' : '36px';
+}, function (_ref4) {
+  var size = _ref4.size;
+  return size === 'large' ? '40px' : '36px';
+}, function (props) {
+  return props.theme.lightIconColor;
+}, function (props) {
+  return props.theme.compatible ? compatibleColor : color;
+}, function (props) {
+  return props.theme.compatible ? compatibleColor : color;
+}, function (props) {
+  return props.theme.primaryTextColor;
+}, function (props) {
+  return props.theme.primaryColor;
+}, function (props) {
+  return props.theme.primaryColor;
+}, function (props) {
+  return props.theme.primaryColor;
+});
+var MenuTitle = _styledComponents["default"].span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: 14px;\n  .large-size & {\n    font-size: 15px;\n  }\n  color: rgba(255, 255, 255, 0.85);\n  .compatible & {\n    color: #a1d7ff;\n  }\n  .tnt-themeS1 & {\n    color: ", ";\n  }\n  .tnt-icon {\n    margin-right: 12px;\n    font-size: 16px;\n    position: relative;\n    top: 1px;\n\n    .large-size & {\n      font-size: 18px;\n      top: auto;\n    }\n    .tnt-themeS1 & {\n      /* color: #7e8081; */\n      color: ", ";\n    }\n  }\n"])), function (props) {
+  return props.theme.primaryTextColor;
+}, function (props) {
+  return "".concat(props.theme.iconColor);
+});
+var _default = exports["default"] = (0, _styledComponents.withTheme)(function (props) {
+  var actions = (0, _react.useContext)(_ActionsContext["default"]);
+  var language = props.language,
+    _props$menus = props.menus,
+    menus = _props$menus === void 0 ? [] : _props$menus,
+    formatMenuPath = props.formatMenuPath,
+    changeRouter = props.changeRouter,
+    selectedKey = props.selectedKey,
+    openKeys = props.openKeys,
+    onSelect = props.onSelect,
+    onBeforeChange = props.onBeforeChange,
+    onChange = props.onChange,
+    onOpenChange = props.onOpenChange,
+    collapsed = props.collapsed;
+  var _getSelectedMenuInfo = (0, _utils.getSelectedMenuInfo)(selectedKey, menus),
+    subMenu = _getSelectedMenuInfo.subMenu,
+    parentMenus = _getSelectedMenuInfo.parentMenus;
+  var _useState = (0, _react.useState)([(0, _get2["default"])(subMenu, 'code')]),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedKeys = _useState2[0],
+    setSelectedKeys = _useState2[1];
+  var onSelectMenu = function onSelectMenu(param) {
+    var _ref5 = (0, _utils.getSelectedMenuInfo)(param.key, menus) || {},
+      subMenu = _ref5.subMenu,
+      parentMenus = _ref5.parentMenus;
+    var params = Object.assign(Object.assign({}, param), {
       data: subMenu
     });
-    const defaultBeforeChange = ({
-      data
-    }) => !isNewTabMenu(data);
-    const defaultSelect = ({
-      data
-    }) => {
+    var defaultBeforeChange = function defaultBeforeChange(_ref6) {
+      var data = _ref6.data;
+      return !(0, _utils.isNewTabMenu)(data);
+    };
+    var defaultSelect = function defaultSelect(_ref7) {
+      var data = _ref7.data;
       var _a;
-      const {
-        path
-      } = data || {};
-      const formatPath = formatMenuPath || (path => path);
-      if (isNewTabMenu(data)) {
-        openInNewTab(formatPath(data === null || data === void 0 ? void 0 : data.path, data));
+      var _ref8 = data || {},
+        path = _ref8.path;
+      var formatPath = formatMenuPath || function (path) {
+        return path;
+      };
+      if ((0, _utils.isNewTabMenu)(data)) {
+        (0, _utils.openInNewTab)(formatPath(data === null || data === void 0 ? void 0 : data.path, data));
         return;
       }
-      const routerPrefix = (_a = window.location.pathname.match(/(^\/[^\/]+)/i)) === null || _a === void 0 ? void 0 : _a[1];
+      var routerPrefix = (_a = window.location.pathname.match(/(^\/[^\/]+)/i)) === null || _a === void 0 ? void 0 : _a[1];
       if (path === null || path === void 0 ? void 0 : path.startsWith(routerPrefix)) {
-        const forwardPath = formatPath(path, data);
+        var forwardPath = formatPath(path, data);
         changeRouter ? changeRouter(forwardPath, data) : window.history.pushState(data, data === null || data === void 0 ? void 0 : data.name, forwardPath);
       } else {
         window.location.href = formatPath(path, data);
       }
     };
-    const finalSelect = onSelect || defaultSelect;
-    if (param.key !== _get(selectedKeys, '0')) {
-      const finalBeforeChange = onBeforeChange || defaultBeforeChange;
-      if (finalBeforeChange(params, _get(selectedKeys, '0'))) {
+    var finalSelect = onSelect || defaultSelect;
+    if (param.key !== (0, _get2["default"])(selectedKeys, '0')) {
+      var finalBeforeChange = onBeforeChange || defaultBeforeChange;
+      if (finalBeforeChange(params, (0, _get2["default"])(selectedKeys, '0'))) {
         // SideMenu菜单收起状态
         if (collapsed) {
-          const newOpenKeys = parentMenus === null || parentMenus === void 0 ? void 0 : parentMenus.map(({
-            code
-          }) => code).reverse();
+          var newOpenKeys = parentMenus === null || parentMenus === void 0 ? void 0 : parentMenus.map(function (_ref9) {
+            var code = _ref9.code;
+            return code;
+          }).reverse();
           onOpenChange(newOpenKeys);
-          setSideMenuStore({
+          (0, _storage.setSideMenuStore)({
             openKeys: newOpenKeys,
             beforeOpenKeys: newOpenKeys
           });
@@ -344,19 +154,21 @@ export default withTheme(props => {
     setSelectedKeys([param.key]);
     finalSelect(params);
   };
-  const getExpandIcon = code => {
+  var getExpandIcon = function getExpandIcon(code) {
     if (props.theme.compatible) {
       return openKeys.includes(code) ? 'minus' : 'plus';
     }
     return openKeys.includes(code) ? 'up' : 'down';
   };
-  const onOpenKeysChange = keys => {
-    const openKey = keys.find(key => !openKeys.includes(key));
+  var onOpenKeysChange = function onOpenKeysChange(keys) {
+    var openKey = keys.find(function (key) {
+      return !openKeys.includes(key);
+    });
     // const closeKey = openKeys.find(key => !keys.includes(key));
-    let newOpenKeys = keys;
-    const findParentGroupKey = (key, openKeys) => {
-      let parentGroupKey;
-      traverseTree(menus, (node, pnode) => {
+    var newOpenKeys = keys;
+    var findParentGroupKey = function findParentGroupKey(key, openKeys) {
+      var parentGroupKey;
+      (0, _utils.traverseTree)(menus, function (node, pnode) {
         if (node.code === key) {
           if (pnode && openKeys.includes(pnode === null || pnode === void 0 ? void 0 : pnode.code)) {
             parentGroupKey = pnode === null || pnode === void 0 ? void 0 : pnode.code;
@@ -369,7 +181,7 @@ export default withTheme(props => {
     // 展开openKey
     if (openKey) {
       // 父子关系展开
-      const parentGroupKey = findParentGroupKey(openKey, openKeys);
+      var parentGroupKey = findParentGroupKey(openKey, openKeys);
       if (parentGroupKey) {
         newOpenKeys = keys.length > 2 ? [parentGroupKey, openKey] : keys;
       } else {
@@ -381,89 +193,93 @@ export default withTheme(props => {
     }
     onOpenChange(newOpenKeys);
   };
-  useEffect(() => {
+  (0, _react.useEffect)(function () {
     setSelectedKeys([selectedKey]);
     if (selectedKey && !collapsed && (parentMenus === null || parentMenus === void 0 ? void 0 : parentMenus.length)) {
-      onOpenChange(parentMenus === null || parentMenus === void 0 ? void 0 : parentMenus.map(({
-        code
-      }) => code).reverse());
+      onOpenChange(parentMenus === null || parentMenus === void 0 ? void 0 : parentMenus.map(function (_ref10) {
+        var code = _ref10.code;
+        return code;
+      }).reverse());
     }
     actions.setSelectedMenuKey(selectedKey);
   }, [selectedKey]);
   actions.off('menuSelect', onSelectMenu);
   actions.on('menuSelect', onSelectMenu);
-  return React.createElement(TNTMenu, {
+  return _react["default"].createElement(TNTMenu, {
     mode: "inline",
     defaultSelectedKeys: [],
     openKeys: openKeys,
     selectedKeys: selectedKeys,
     onOpenChange: onOpenKeysChange
-  }, menus === null || menus === void 0 ? void 0 : menus.map(menu => {
+  }, menus === null || menus === void 0 ? void 0 : menus.map(function (menu) {
     var _a;
-    const MenuLink = ({
-      menuName,
-      enName,
-      path
-    }) => React.createElement("a", {
-      href: path,
-      onClick: evt => evt.preventDefault()
-    }, {
-      cn: menuName,
-      en: enName
-    }[language]);
-    if (isGroupMenu(menu)) {
-      const getSubMenuProps = ({
-        code,
-        groupIcon,
-        groupName,
-        enName
-      }, isSubGroup = false) => ({
-        key: code,
-        title: React.createElement(MenuTitle, {
-          style: collapsed && isSubGroup ? {
-            color: props.theme.primaryTextColor
-          } : {}
-        }, !isSubGroup && React.createElement(Iconfont, {
-          type: groupIcon
-        }), collapsed && !isSubGroup ? '' : {
-          cn: groupName,
-          en: enName
-        }[language]),
-        expandIcon: collapsed ? null : React.createElement(Iconfont /*  */, {
-          type: getExpandIcon(code)
-        })
-      });
-      return React.createElement(SubMenu, Object.assign({}, getSubMenuProps(menu), {
+    var MenuLink = function MenuLink(_ref11) {
+      var menuName = _ref11.menuName,
+        enName = _ref11.enName,
+        path = _ref11.path;
+      return _react["default"].createElement("a", {
+        href: path,
+        onClick: function onClick(evt) {
+          return evt.preventDefault();
+        }
+      }, {
+        cn: menuName,
+        en: enName
+      }[language]);
+    };
+    if ((0, _utils.isGroupMenu)(menu)) {
+      var getSubMenuProps = function getSubMenuProps(_ref12) {
+        var code = _ref12.code,
+          groupIcon = _ref12.groupIcon,
+          groupName = _ref12.groupName,
+          enName = _ref12.enName;
+        var isSubGroup = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+        return {
+          key: code,
+          title: _react["default"].createElement(MenuTitle, {
+            style: collapsed && isSubGroup ? {
+              color: props.theme.primaryTextColor
+            } : {}
+          }, !isSubGroup && _react["default"].createElement(_Iconfont["default"], {
+            type: groupIcon
+          }), collapsed && !isSubGroup ? '' : {
+            cn: groupName,
+            en: enName
+          }[language]),
+          expandIcon: collapsed ? null : _react["default"].createElement(_Iconfont["default"] /*  */, {
+            type: getExpandIcon(code)
+          })
+        };
+      };
+      return _react["default"].createElement(SubMenu, Object.assign({}, getSubMenuProps(menu), {
         onClick: onSelectMenu
-      }), (_a = menu === null || menu === void 0 ? void 0 : menu.children) === null || _a === void 0 ? void 0 : _a.map(menu => {
+      }), (_a = menu === null || menu === void 0 ? void 0 : menu.children) === null || _a === void 0 ? void 0 : _a.map(function (menu) {
         var _a;
-        if (isGroupMenu(menu)) {
-          return React.createElement(SubMenu, Object.assign({}, getSubMenuProps(menu, true), {
+        if ((0, _utils.isGroupMenu)(menu)) {
+          return _react["default"].createElement(SubMenu, Object.assign({}, getSubMenuProps(menu, true), {
             onClick: onSelectMenu
-          }), (_a = menu === null || menu === void 0 ? void 0 : menu.children) === null || _a === void 0 ? void 0 : _a.map(_a => {
-            var {
-                code
-              } = _a,
+          }), (_a = menu === null || menu === void 0 ? void 0 : menu.children) === null || _a === void 0 ? void 0 : _a.map(function (_a) {
+            var code = _a.code,
               menu = __rest(_a, ["code"]);
-            return React.createElement(MenuItem, {
+            return _react["default"].createElement(MenuItem, {
               key: code
-            }, React.createElement(MenuLink, Object.assign({}, menu, {
+            }, _react["default"].createElement(MenuLink, Object.assign({}, menu, {
               style: {
                 paddingLeft: '24px'
               }
             })));
           }));
         }
-        return React.createElement(MenuItem, {
+        return _react["default"].createElement(MenuItem, {
           key: menu === null || menu === void 0 ? void 0 : menu.code
-        }, React.createElement(MenuLink, Object.assign({}, menu)));
+        }, _react["default"].createElement(MenuLink, Object.assign({}, menu)));
       }));
     }
-    return React.createElement(MenuItem, {
+    return _react["default"].createElement(MenuItem, {
       key: menu.code,
       onClick: onSelectMenu
-    }, React.createElement(Iconfont, {
+    }, _react["default"].createElement(_Iconfont["default"], {
       type: menu.icon
-    }), React.createElement(MenuLink, Object.assign({}, menu)));
+    }), _react["default"].createElement(MenuLink, Object.assign({}, menu)));
   }));
 });