@lemon-fe/components 0.1.154 → 1.1.0-alpha.1

package/es/MainFramework/components/Menu/index.js

@@ -1,603 +0,0 @@
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { createPortal } from 'react-dom';
-import classNames from 'classnames';
-import { useDebounce } from '@lemon-fe/hooks';
-import { PREFIX_CLS as prefixCls } from '../../../constants';
-import { Divider } from 'antd';
-import Icons from '../../../Icons';
-function Star(props) {
-  if (props.active) {
-    return /*#__PURE__*/React.createElement("svg", {
-      className: props.className,
-      width: "20",
-      height: "20",
-      xmlns: "http://www.w3.org/2000/svg"
-    }, /*#__PURE__*/React.createElement("path", {
-      d: "m9.666 15.526-3.584 1.27a1 1 0 0 1-1.334-.97l.1-3.8a1 1 0 0 0-.206-.636L2.326 8.373a1 1 0 0 1 .51-1.567l3.646-1.08a1 1 0 0 0 .54-.393L9.176 2.2a1 1 0 0 1 1.648 0l2.154 3.134a1 1 0 0 0 .54.393l3.646 1.08a1 1 0 0 1 .51 1.567l-2.316 3.017a1 1 0 0 0-.206.635l.1 3.801a1 1 0 0 1-1.334.97l-3.584-1.27a1 1 0 0 0-.668 0Z",
-      fill: "currentColor",
-      fillRule: "evenodd"
-    }));
-  }
-  return /*#__PURE__*/React.createElement("svg", {
-    className: props.className,
-    width: "20",
-    height: "20",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "m9.954 2.52 2.406 3.238c.227.33.56.573.945.687l3.646 1.08a.25.25 0 0 1 .179.22l-2.367 3.188a1.75 1.75 0 0 0-.36 1.112l.1 3.801a.25.25 0 0 1-.156.238l-3.77-1.267a1.75 1.75 0 0 0-1.161.002l-3.585 1.27a.25.25 0 0 1-.274-.075l.04-3.976a1.75 1.75 0 0 0-.36-1.105L2.92 7.917a.25.25 0 0 1-.014-.284l3.794-1.19a1.75 1.75 0 0 0 .94-.685l2.153-3.134a.25.25 0 0 1 .16-.104Z",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    fill: "none",
-    fillRule: "evenodd"
-  }));
-}
-var drawerIcon = /*#__PURE__*/React.createElement("svg", {
-  width: "20",
-  height: "20",
-  xmlns: "http://www.w3.org/2000/svg"
-}, /*#__PURE__*/React.createElement("g", {
-  fill: "none",
-  fillRule: "evenodd"
-}, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
-  fill: "currentColor"
-}, /*#__PURE__*/React.createElement("path", {
-  d: "M4.75,5 L15.25,5 C15.6642136,5 16,5.33578644 16,5.75 C16,6.16421356 15.6642136,6.5 15.25,6.5 L4.75,6.5 C4.33578644,6.5 4,6.16421356 4,5.75 C4,5.33578644 4.33578644,5 4.75,5 Z",
-  opacity: ".7",
-  transform: "translate(-274.000000, -586.000000) translate(274.000000, 586.000000)"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M4.75,9 L15.25,9 C15.6642136,9 16,9.33578644 16,9.75 C16,10.1642136 15.6642136,10.5 15.25,10.5 L4.75,10.5 C4.33578644,10.5 4,10.1642136 4,9.75 C4,9.33578644 4.33578644,9 4.75,9 Z",
-  opacity: ".7",
-  transform: "translate(-274.000000, -586.000000) translate(274.000000, 586.000000)"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M4.75,13 L15.25,13 C15.6642136,13 16,13.3357864 16,13.75 C16,14.1642136 15.6642136,14.5 15.25,14.5 L4.75,14.5 C4.33578644,14.5 4,14.1642136 4,13.75 C4,13.3357864 4.33578644,13 4.75,13 Z",
-  opacity: ".7",
-  transform: "translate(-274.000000, -586.000000) translate(274.000000, 586.000000)"
-})))));
-function FavoritesEmpty(props) {
-  return /*#__PURE__*/React.createElement("svg", _objectSpread(_objectSpread({}, props), {}, {
-    width: "72",
-    height: "72",
-    xmlns: "http://www.w3.org/2000/svg",
-    xmlnsXlink: "http://www.w3.org/1999/xlink"
-  }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("path", {
-    d: "M3.2 0h27.475a3.2 3.2 0 0 1 2.262.937l10.126 10.126c.6.6.937 1.414.937 2.262V46.8a3.2 3.2 0 0 1-3.2 3.2H3.2A3.2 3.2 0 0 1 0 46.8V3.2A3.2 3.2 0 0 1 3.2 0Z",
-    id: "a"
-  })), /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    fillRule: "evenodd"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M10.766 23.2h20.889a3.2 3.2 0 0 1 3.051 2.236l9.98 31.6a3.2 3.2 0 0 1-3.052 4.164H20.745a3.2 3.2 0 0 1-3.051-2.236l-9.98-31.6a3.2 3.2 0 0 1 3.052-4.164Z",
-    fill: "#E7E7E7",
-    opacity: ".4"
-  }), /*#__PURE__*/React.createElement("rect", {
-    fill: "#E7E7E7",
-    x: "49.2",
-    y: "11.2",
-    width: "14.8",
-    height: "14.8",
-    rx: "3.2"
-  }), /*#__PURE__*/React.createElement("g", {
-    transform: "translate(20 11.2)"
-  }, /*#__PURE__*/React.createElement("mask", {
-    id: "b",
-    fill: "#fff"
-  }, /*#__PURE__*/React.createElement("use", {
-    xlinkHref: "#a"
-  })), /*#__PURE__*/React.createElement("use", {
-    fill: "#E7E7E7",
-    xlinkHref: "#a"
-  }), /*#__PURE__*/React.createElement("circle", {
-    fill: "#CFCFCF",
-    mask: "url(#b)",
-    cx: "31.8",
-    cy: "17",
-    r: "35.4"
-  }), /*#__PURE__*/React.createElement("rect", {
-    fill: "#BEBEBE",
-    mask: "url(#b)",
-    x: "29.2",
-    width: "14.8",
-    height: "14.8",
-    rx: "3.2"
-  })), /*#__PURE__*/React.createElement("rect", {
-    fill: "#FFF",
-    x: "30",
-    y: "31.6",
-    width: "24",
-    height: "2.4",
-    rx: "1.2"
-  }), /*#__PURE__*/React.createElement("rect", {
-    fill: "#FFF",
-    x: "30",
-    y: "39.6",
-    width: "12.8",
-    height: "2.4",
-    rx: "1.2"
-  })));
-}
-var favoriteIcon = /*#__PURE__*/React.createElement("svg", {
-  width: "20px",
-  height: "20px",
-  viewBox: "0 0 20 20",
-  version: "1.1",
-  xmlns: "http://www.w3.org/2000/svg",
-  xmlnsXlink: "http://www.w3.org/1999/xlink"
-}, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("rect", {
-  x: "0",
-  y: "0",
-  width: "20",
-  height: "20"
-})), /*#__PURE__*/React.createElement("g", {
-  stroke: "none",
-  strokeWidth: "1",
-  fill: "none",
-  fillRule: "evenodd"
-}, /*#__PURE__*/React.createElement("g", {
-  transform: "translate(-1398.000000, -481.000000)"
-}, /*#__PURE__*/React.createElement("g", {
-  transform: "translate(1398.000000, 481.000000)"
-}, /*#__PURE__*/React.createElement("mask", {
-  fill: "white"
-}, /*#__PURE__*/React.createElement("use", {
-  xlinkHref: "#path-1"
-})), /*#__PURE__*/React.createElement("use", {
-  fillOpacity: "0",
-  fill: "#C4C4C4",
-  xlinkHref: "#path-1"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M17.4350762,7.192388 L17.4350762,13.192388 C17.4350762,15.9538117 15.1964999,18.192388 12.4350762,18.192388 C9.67365243,18.192388 7.43507618,15.9538117 7.43507618,13.192388 L7.43507618,7.192388 C7.43507618,4.43096425 9.67365243,2.192388 12.4350762,2.192388 C15.1964999,2.192388 17.4350762,4.43096425 17.4350762,7.192388 Z",
-  fill: "currentColor",
-  opacity: "0.5",
-  mask: "url(#mask-2)",
-  transform: "translate(12.435076, 10.192388) rotate(45.000000) translate(-12.435076, -10.192388) "
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M13.192388,7.19236523 L13.192388,13.1923652 C13.192388,15.953789 10.9538117,18.1923652 8.192388,18.1923652 C5.43096425,18.1923652 3.192388,15.953789 3.192388,13.1923652 L3.192388,7.19236523 C3.192388,4.43094148 5.43096425,2.19236523 8.192388,2.19236523 C10.9538117,2.19236523 13.192388,4.43094148 13.192388,7.19236523 Z",
-  fill: "currentColor",
-  fillRule: "nonzero",
-  mask: "url(#mask-2)",
-  transform: "translate(8.192388, 10.192365) rotate(-45.000000) translate(-8.192388, -10.192365) "
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M6,6 C5.5,6 4,6.5 4,8.5",
-  stroke: "#F2F2F2",
-  strokeLinecap: "round",
-  strokeDasharray: "0,0",
-  mask: "url(#mask-2)"
-})))));
-var WIDTH = 1280;
-var FAVORITES_POPOVER = 'FAVORITES_POPOVER';
-export default function Menu(props) {
-  var menus = props.data,
-    onClick = props.onClick,
-    onFavoritesChange = props.onFavoritesChange,
-    _props$favorites = props.favorites,
-    favorites = _props$favorites === void 0 ? [] : _props$favorites;
-  var location = window.location;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    popover = _useState2[0],
-    setPopover = _useState2[1];
-  var popup = useRef(null);
-  var popupContainer = useRef(null);
-  var drawer = useRef(null);
-  var clientWidth = useRef(document.body.clientWidth);
-  var _useState3 = useState(clientWidth.current <= WIDTH),
-    _useState4 = _slicedToArray(_useState3, 2),
-    collapsed = _useState4[0],
-    setCollapsed = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    visible = _useState6[0],
-    setVisible = _useState6[1];
-  var _useState7 = useState(0),
-    _useState8 = _slicedToArray(_useState7, 2),
-    top = _useState8[0],
-    setTop = _useState8[1];
-  var activeMenu = useMemo(function () {
-    var check = function check(path) {
-      if (path) {
-        return new RegExp("".concat(path.split('?')[0], "(?![^\\/])")).test(location.pathname);
-      }
-      return false;
-    };
-    for (var i = 0; i < menus.length; i += 1) {
-      var _menus$i = menus[i],
-        _menus$i$children = _menus$i.children,
-        subMenus = _menus$i$children === void 0 ? [] : _menus$i$children,
-        topPath = _menus$i.path;
-      if (check(topPath)) {
-        return {
-          path: [i],
-          key: topPath
-        };
-      }
-      for (var j = 0; j < subMenus.length; j += 1) {
-        var _subMenus$j = subMenus[j],
-          subPath = _subMenus$j.path,
-          _subMenus$j$children = _subMenus$j.children,
-          items = _subMenus$j$children === void 0 ? [] : _subMenus$j$children;
-        if (check(subPath)) {
-          return {
-            path: [i, j],
-            key: subPath
-          };
-        }
-        for (var k = 0; k < items.length; k += 1) {
-          if (check(items[k].path)) {
-            return {
-              path: [i, j, k],
-              key: items[k].path
-            };
-          }
-        }
-      }
-    }
-  }, [location.pathname, menus]);
-  var openMenu = function openMenu(item, elm) {
-    var isFavorite = item.name === FAVORITES_POPOVER;
-    if (isFavorite || item.children !== undefined && item.children.length > 0 || collapsed) {
-      var _popupContainer$curre;
-      setPopover(item);
-      setTop(elm.offsetTop - (isFavorite ? 0 : ((_popupContainer$curre = popupContainer.current) === null || _popupContainer$curre === void 0 ? void 0 : _popupContainer$curre.scrollTop) || 0));
-      setTimeout(function () {
-        if (popup.current) {
-          popup.current.classList.add('animated');
-        }
-      }, 16);
-    } else {
-      setPopover(null);
-    }
-  };
-  var closeMenu = function closeMenu() {
-    if (popup.current) {
-      popup.current.classList.remove('animated');
-      var handler = function handler() {
-        var _popup$current;
-        setPopover(null);
-        (_popup$current = popup.current) === null || _popup$current === void 0 ? void 0 : _popup$current.removeEventListener('transitionend', handler);
-      };
-      popup.current.addEventListener('transitionend', handler);
-    }
-  };
-  var toggle = useDebounce(function (handler) {
-    if (handler) {
-      handler();
-    }
-  }, 200);
-  var toggleCollapse = function toggleCollapse() {
-    setCollapsed(function (prev) {
-      return !prev;
-    });
-  };
-  useEffect(function () {
-    if (!visible) {
-      return;
-    }
-    var target = drawer.current;
-    if (target !== null) {
-      var handler = function handler(e) {
-        if (!target.contains(e.target)) {
-          closeDrawer();
-        }
-      };
-      requestAnimationFrame(function () {
-        window.addEventListener('click', handler);
-      });
-      return function () {
-        window.removeEventListener('click', handler);
-      };
-    }
-  }, [visible]);
-  useEffect(function () {
-    var handleResize = function handleResize() {
-      var width = document.body.clientWidth;
-      if (clientWidth.current > WIDTH && width <= WIDTH) {
-        setCollapsed(true);
-      } else if (clientWidth.current <= WIDTH && width > WIDTH) {
-        setCollapsed(false);
-      }
-      clientWidth.current = width;
-    };
-    window.addEventListener('resize', handleResize);
-    return function () {
-      window.removeEventListener('resize', handleResize);
-    };
-  }, []);
-  var openDrawer = function openDrawer() {
-    setVisible(true);
-    setTimeout(function () {
-      var _drawer$current;
-      (_drawer$current = drawer.current) === null || _drawer$current === void 0 ? void 0 : _drawer$current.classList.add('animated');
-    }, 16);
-  };
-  var closeDrawer = function closeDrawer() {
-    if (drawer.current) {
-      drawer.current.classList.remove('animated');
-      var handler = function handler() {
-        var _drawer$current2;
-        (_drawer$current2 = drawer.current) === null || _drawer$current2 === void 0 ? void 0 : _drawer$current2.removeEventListener('transitionend', handler);
-        setVisible(false);
-      };
-      drawer.current.addEventListener('transitionend', handler);
-    }
-  };
-  var handleClick = function handleClick(item) {
-    if (item.path) {
-      onClick === null || onClick === void 0 ? void 0 : onClick(item);
-      closeDrawer();
-      closeMenu();
-    }
-  };
-  var favoritesMap = useMemo(function () {
-    return new Map(favorites.map(function (item) {
-      return [item.path || '', item];
-    }));
-  }, [favorites]);
-  var toggleFavorite = function toggleFavorite(e, item) {
-    e.stopPropagation();
-    var nextMap = new Map(favoritesMap);
-    var key = item.path || '';
-    if (nextMap.has(key)) {
-      nextMap.delete(key);
-    } else {
-      nextMap.set(key, {
-        name: item.name,
-        path: item.path
-      });
-    }
-    if (onFavoritesChange) {
-      onFavoritesChange(_toConsumableArray(nextMap.values()));
-    }
-  };
-  var renderItem = function renderItem(item, index) {
-    var favorited = favoritesMap.has(item.path || '');
-    return /*#__PURE__*/React.createElement("div", {
-      key: index,
-      className: classNames("".concat(prefixCls, "-menu-item"), _defineProperty({}, "".concat(prefixCls, "-menu-active"), activeMenu !== undefined && activeMenu.key === item.path)),
-      onClick: function onClick() {
-        return handleClick(item);
-      }
-    }, /*#__PURE__*/React.createElement("span", {
-      style: {
-        overflow: 'hidden'
-      }
-    }, item.name), /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-menu-item-favorite"),
-      onClick: function onClick(e) {
-        toggleFavorite(e, item);
-      }
-    }, /*#__PURE__*/React.createElement(Star, {
-      className: "".concat(prefixCls, "-menu-favorite-star"),
-      active: favorited
-    })));
-  };
-  var renderDrawerItems = function renderDrawerItems() {
-    var cols = [[], [], []];
-    var value = [0, 0, 0];
-    menus.forEach(function (item) {
-      var list = [/*#__PURE__*/React.createElement("div", {
-        className: classNames("".concat(prefixCls, "-menu-drawer-1"), _defineProperty({}, "".concat(prefixCls, "-menu-drawer-1-path"), item.path !== undefined)),
-        key: item.name,
-        onClick: function onClick() {
-          return handleClick(item);
-        }
-      }, item.name)];
-      if (item.children) {
-        item.children.forEach(function (subItem) {
-          list.push( /*#__PURE__*/React.createElement("div", {
-            className: "".concat(prefixCls, "-menu-drawer-2"),
-            key: "2-".concat(subItem.name),
-            onClick: function onClick() {
-              return handleClick(subItem);
-            }
-          }, subItem.name));
-          if (subItem.children) {
-            subItem.children.forEach(function (child) {
-              list.push( /*#__PURE__*/React.createElement("div", {
-                className: classNames("".concat(prefixCls, "-menu-drawer-3"), _defineProperty({}, "".concat(prefixCls, "-menu-active"), activeMenu !== undefined && activeMenu.key === child.path)),
-                key: "3-".concat(child.name),
-                onClick: function onClick() {
-                  return handleClick(child);
-                }
-              }, child.name));
-            });
-          }
-        });
-      }
-      var node = /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefixCls, "-menu-drawer-block")
-      }, /*#__PURE__*/React.createElement("div", null, list));
-      var target = 0;
-      var min = Infinity;
-      for (var i = 0; i < value.length; i++) {
-        if (value[i] < min) {
-          target = i;
-          min = value[i];
-        }
-      }
-      value[target] += list.length;
-      cols[target].push(node);
-    });
-    return cols.map(function (items, index) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefixCls, "-menu-drawer-col"),
-        key: index
-      }, items);
-    });
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames("".concat(prefixCls, "-menu"), _defineProperty({}, "".concat(prefixCls, "-menu-collapsed"), collapsed))
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-bar"),
-    onMouseLeave: function onMouseLeave() {
-      toggle(closeMenu);
-    }
-  }, popover !== null && /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-popup"),
-    style: {
-      top: top
-    },
-    ref: popup,
-    onMouseEnter: function onMouseEnter() {
-      return toggle.cancel();
-    }
-  }, popover.children !== undefined ? popover.name === FAVORITES_POPOVER ? /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-popup-body"),
-    key: "pop"
-  }, popover.children !== undefined && popover.children.length > 0 ? /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-block-favorite")
-  }, popover.children.map(renderItem)) : /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-block-empty")
-  }, /*#__PURE__*/React.createElement(FavoritesEmpty, null), /*#__PURE__*/React.createElement("span", null, "\u6682\u65E0\u6536\u85CF"))) : /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-popup-body"),
-    key: "pop"
-  }, popover.children.map(function (item, index) {
-    return /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-menu-block"),
-      key: index
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-menu-sub-item")
-    }, item.name), item.children !== undefined && item.children.map(renderItem));
-  })) : /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-popup-tip"),
-    key: "tip"
-  }, popover.name)), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-collapse"),
-    onClick: toggleCollapse,
-    onMouseEnter: function onMouseEnter() {
-      return toggle(closeMenu);
-    }
-  }, /*#__PURE__*/React.createElement("svg", {
-    width: "20",
-    height: "20",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    fillRule: "evenodd",
-    opacity: ".7"
-  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("path", {
-    d: "M14.75,5 C15.1642136,5 15.5,5.33578644 15.5,5.75 L15.5,14.25 C15.5,14.6642136 15.1642136,15 14.75,15 C14.3357864,15 14,14.6642136 14,14.25 L14,5.75 C14,5.33578644 14.3357864,5 14.75,5 Z",
-    fill: "currentColor",
-    transform: "translate(-274.000000, -57.000000) translate(284.000000, 67.000000) scale(-1, 1) translate(-284.000000, -67.000000) translate(274.000000, 57.000000)"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M15,10 C15,10.4142136 14.6642136,10.75 14.25,10.75 L5,10.75 L5,10.75 L5,9.25 L14.25,9.25 C14.6642136,9.25 15,9.58578644 15,10 Z",
-    fill: "currentColor",
-    fillRule: "nonzero",
-    transform: "translate(-274.000000, -57.000000) translate(284.000000, 67.000000) scale(-1, 1) translate(-284.000000, -67.000000) translate(274.000000, 57.000000)"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M11.7426212,6.79290128 L5.32842371,6.79290128 L5.32842371,13.2070987",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeDasharray: "0,0",
-    transform: "translate(-274.000000, -57.000000) translate(284.000000, 67.000000) scale(-1, 1) translate(-284.000000, -67.000000) translate(274.000000, 57.000000) translate(8.535522, 10.000000) rotate(-45.000000) translate(-8.535522, -10.000000)"
-  })))))), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-top-items"),
-    ref: popupContainer
-  }, menus.map(function (item, index) {
-    var _classNames5;
-    return /*#__PURE__*/React.createElement("div", {
-      key: index,
-      className: classNames("".concat(prefixCls, "-menu-top-item"), (_classNames5 = {}, _defineProperty(_classNames5, "".concat(prefixCls, "-menu-top-item-active"), (activeMenu === null || activeMenu === void 0 ? void 0 : activeMenu.path[0]) === index), _defineProperty(_classNames5, "".concat(prefixCls, "-menu-top-item-popover-active"), item === popover), _classNames5)),
-      onClick: function onClick() {
-        return handleClick(item);
-      },
-      onMouseEnter: function onMouseEnter(e) {
-        var target = e.currentTarget;
-        toggle(function () {
-          return openMenu(item, target);
-        });
-      }
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-menu-top-item-content")
-    }, typeof item.icon === 'string' ? /*#__PURE__*/React.createElement("img", {
-      className: "".concat(prefixCls, "-menu-icon"),
-      src: item.icon
-    }) : /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-menu-icon")
-    }, item.icon), /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-menu-title")
-    }, item.name), item.children && item.children.length > 0 && /*#__PURE__*/React.createElement(Icons.Down, null)));
-  })), /*#__PURE__*/React.createElement("div", {
-    className: classNames("".concat(prefixCls, "-menu-divider-div"), _defineProperty({}, "".concat(prefixCls, "-menu-divider-div-collapsed"), collapsed))
-  }, /*#__PURE__*/React.createElement(Divider, {
-    className: "".concat(prefixCls, "-menu-divider")
-  })), !collapsed ? /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-other-title")
-  }, "\u529F\u80FD\u7BA1\u7406") : null, /*#__PURE__*/React.createElement("div", {
-    className: classNames("".concat(prefixCls, "-menu-top-item"), _defineProperty({}, "".concat(prefixCls, "-menu-top-item-popover-active"), (popover === null || popover === void 0 ? void 0 : popover.name) === FAVORITES_POPOVER)),
-    onMouseEnter: function onMouseEnter(e) {
-      var target = e.currentTarget;
-      toggle(function () {
-        return openMenu({
-          name: FAVORITES_POPOVER,
-          children: _toConsumableArray(favoritesMap.values())
-        }, target);
-      });
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-top-item-content")
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-icon")
-  }, favoriteIcon), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-title")
-  }, "\u6536\u85CF")))), false && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-gutter")
-  }), collapsed ? /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-top-item"),
-    onClick: openDrawer
-  }, drawerIcon) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-label")
-  }, "\u6CA1\u6709\u627E\u5230\u60F3\u8981\u7684\u529F\u80FD?"), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-more"),
-    onClick: openDrawer
-  }, drawerIcon, /*#__PURE__*/React.createElement("span", null, "\u67E5\u770B\u5168\u90E8")))), visible && /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-drawer"),
-    ref: drawer
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-drawer-header")
-  }, /*#__PURE__*/React.createElement("div", null, "\u67E5\u770B\u5168\u90E8"), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-drawer-close"),
-    onClick: closeDrawer
-  }, /*#__PURE__*/React.createElement("svg", {
-    width: "16",
-    height: "16",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    fillRule: "evenodd",
-    opacity: ".7"
-  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
-    transform: "translate(-1880.000000, -20.000000) translate(1880.000000, 20.000000)",
-    fill: "currentColor"
-  }, /*#__PURE__*/React.createElement("rect", {
-    transform: "translate(8.000000, 8.000000) rotate(-45.000000) translate(-8.000000, -8.000000)",
-    x: "7.25",
-    y: "1",
-    width: "1.5",
-    height: "14",
-    rx: ".75"
-  }), /*#__PURE__*/React.createElement("rect", {
-    transform: "translate(8.000000, 8.000000) scale(-1, 1) rotate(-45.000000) translate(-8.000000, -8.000000)",
-    x: "7.25",
-    y: "1",
-    width: "1.5",
-    height: "14",
-    rx: ".75"
-  }))))))), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu-drawer-body")
-  }, renderDrawerItems())), document.body));
-}