@hi-ui/menu 4.1.2 → 4.1.4

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @hi-ui/menu
 
+## 4.1.4
+
+### Patch Changes
+
+- [#2672](https://github.com/XiaoMi/hiui/pull/2672) [`1ebe27830`](https://github.com/XiaoMi/hiui/commit/1ebe2783098b3a8cd980bd10076d67635463800e) Thanks [@zyprepare](https://github.com/zyprepare)! - build: 升级到 rollup3,重新构建发布组件
+
+- Updated dependencies [[`1ebe27830`](https://github.com/XiaoMi/hiui/commit/1ebe2783098b3a8cd980bd10076d67635463800e)]:
+  - @hi-ui/core@4.0.6
+  - @hi-ui/use-id@4.0.2
+  - @hi-ui/use-merge-refs@4.0.2
+  - @hi-ui/use-resize-observer@4.0.2
+  - @hi-ui/use-toggle@4.0.2
+  - @hi-ui/use-uncontrolled-state@4.0.2
+  - @hi-ui/icons@4.0.16
+  - @hi-ui/popper@4.1.1
+  - @hi-ui/tooltip@4.0.8
+  - @hi-ui/array-utils@4.0.2
+  - @hi-ui/classname@4.0.2
+  - @hi-ui/env@4.0.2
+  - @hi-ui/times@4.0.2
+  - @hi-ui/tree-utils@4.1.2
+  - @hi-ui/type-assertion@4.0.2
+
+## 4.1.3
+
+### Patch Changes
+
+- [#2659](https://github.com/XiaoMi/hiui/pull/2659) [`b78487cd7`](https://github.com/XiaoMi/hiui/commit/b78487cd725532000f81876e1826f1918c37b23a) Thanks [@zyprepare](https://github.com/zyprepare)! - fix: 修复 mini 模式下子菜单内容展示不全问题
+
 ## 4.1.2
 
 ### Patch Changes

package/lib/cjs/Expander.js

@@ -9,34 +9,16 @@
  */
 'use strict';
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-
 var React = require('react');
-
 var reactTransitionGroup = require('react-transition-group');
-
-function _interopDefaultLegacy(e) {
-  return e && _typeof(e) === 'object' && 'default' in e ? e : {
-    'default': e
-  };
-}
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 var Expander = function Expander(_ref) {
   var children = _ref.children,
-      visible = _ref.visible,
-      className = _ref.className;
-
+    visible = _ref.visible,
+    className = _ref.className;
   var _useState = React.useState(visible ? 'auto' : 0),
-      height = _useState[0],
-      setHeight = _useState[1];
-
-  return /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
+    height = _useState[0],
+    setHeight = _useState[1];
+  return /*#__PURE__*/React.createElement(reactTransitionGroup.CSSTransition, {
     "in": visible,
     timeout: 200,
     classNames: className,
@@ -56,7 +38,7 @@ var Expander = function Expander(_ref) {
         setHeight(0);
       });
     }
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     style: {
       height: height,
       overflow: 'hidden',
@@ -64,5 +46,4 @@ var Expander = function Expander(_ref) {
     }
   }, children));
 };
-
 exports.Expander = Expander;

package/lib/cjs/Menu.js

@@ -9,54 +9,22 @@
  */
 'use strict';
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-
 var tslib = require('tslib');
-
 var React = require('react');
-
 var classname = require('@hi-ui/classname');
-
 var icons = require('@hi-ui/icons');
-
 var env = require('@hi-ui/env');
-
 var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
-
 var Tooltip = require('@hi-ui/tooltip');
-
 var useToggle = require('@hi-ui/use-toggle');
-
 var treeUtils = require('@hi-ui/tree-utils');
-
 var typeAssertion = require('@hi-ui/type-assertion');
-
 var useResizeObserver = require('@hi-ui/use-resize-observer');
-
 var useMergeRefs = require('@hi-ui/use-merge-refs');
-
 var useId = require('@hi-ui/use-id');
-
 var MenuItem = require('./MenuItem.js');
-
 var context = require('./context.js');
-
 var util = require('./util.js');
-
-function _interopDefaultLegacy(e) {
-  return e && _typeof(e) === 'object' && 'default' in e ? e : {
-    'default': e
-  };
-}
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip);
-
 var MENU_PREFIX = classname.getPrefixCls('menu');
 var DEFAULT_EXPANDED_IDS = [];
 var NOOP_ARRAY = [];
@@ -65,68 +33,62 @@ var MENU_MORE_ID = "MENU_MORE_" + useId.uuid();
 /**
  * 菜单
  */
-
 var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
   var _a$prefixCls = _a.prefixCls,
-      prefixCls = _a$prefixCls === void 0 ? MENU_PREFIX : _a$prefixCls,
-      _a$role = _a.role,
-      role = _a$role === void 0 ? 'menu' : _a$role,
-      className = _a.className,
-      _a$data = _a.data,
-      data = _a$data === void 0 ? NOOP_ARRAY : _a$data,
-      _a$placement = _a.placement,
-      placement = _a$placement === void 0 ? 'vertical' : _a$placement,
-      _a$showCollapse = _a.showCollapse,
-      showCollapse = _a$showCollapse === void 0 ? false : _a$showCollapse,
-      _a$expandedType = _a.expandedType,
-      expandedType = _a$expandedType === void 0 ? 'collapse' : _a$expandedType,
-      _a$showAllSubMenus = _a.showAllSubMenus,
-      showAllSubMenus = _a$showAllSubMenus === void 0 ? false : _a$showAllSubMenus,
-      _a$defaultExpandAll = _a.defaultExpandAll,
-      defaultExpandAll = _a$defaultExpandAll === void 0 ? false : _a$defaultExpandAll,
-      _a$defaultExpandedIds = _a.defaultExpandedIds,
-      defaultExpandedIds = _a$defaultExpandedIds === void 0 ? DEFAULT_EXPANDED_IDS : _a$defaultExpandedIds,
-      expandedIdsProp = _a.expandedIds,
-      onExpand = _a.onExpand,
-      _a$defaultActiveId = _a.defaultActiveId,
-      defaultActiveId = _a$defaultActiveId === void 0 ? '' : _a$defaultActiveId,
-      activeIdProp = _a.activeId,
-      onClickSubMenu = _a.onClickSubMenu,
-      collapsed = _a.collapsed,
-      _a$defaultCollapsed = _a.defaultCollapsed,
-      defaultCollapsed = _a$defaultCollapsed === void 0 ? false : _a$defaultCollapsed,
-      overlayClassName = _a.overlayClassName,
-      onCollapse = _a.onCollapse,
-      footerRender = _a.footerRender,
-      render = _a.render,
-      extraHeader = _a.extraHeader,
-      onClick = _a.onClick,
-      _a$size = _a.size,
-      size = _a$size === void 0 ? 'lg' : _a$size,
-      rest = tslib.__rest(_a, ["prefixCls", "role", "className", "data", "placement", "showCollapse", "expandedType", "showAllSubMenus", "defaultExpandAll", "defaultExpandedIds", "expandedIds", "onExpand", "defaultActiveId", "activeId", "onClickSubMenu", "collapsed", "defaultCollapsed", "overlayClassName", "onCollapse", "footerRender", "render", "extraHeader", "onClick", "size"]);
-
+    prefixCls = _a$prefixCls === void 0 ? MENU_PREFIX : _a$prefixCls,
+    _a$role = _a.role,
+    role = _a$role === void 0 ? 'menu' : _a$role,
+    className = _a.className,
+    _a$data = _a.data,
+    data = _a$data === void 0 ? NOOP_ARRAY : _a$data,
+    _a$placement = _a.placement,
+    placement = _a$placement === void 0 ? 'vertical' : _a$placement,
+    _a$showCollapse = _a.showCollapse,
+    showCollapse = _a$showCollapse === void 0 ? false : _a$showCollapse,
+    _a$expandedType = _a.expandedType,
+    expandedType = _a$expandedType === void 0 ? 'collapse' : _a$expandedType,
+    _a$showAllSubMenus = _a.showAllSubMenus,
+    showAllSubMenus = _a$showAllSubMenus === void 0 ? false : _a$showAllSubMenus,
+    _a$defaultExpandAll = _a.defaultExpandAll,
+    defaultExpandAll = _a$defaultExpandAll === void 0 ? false : _a$defaultExpandAll,
+    _a$defaultExpandedIds = _a.defaultExpandedIds,
+    defaultExpandedIds = _a$defaultExpandedIds === void 0 ? DEFAULT_EXPANDED_IDS : _a$defaultExpandedIds,
+    expandedIdsProp = _a.expandedIds,
+    onExpand = _a.onExpand,
+    _a$defaultActiveId = _a.defaultActiveId,
+    defaultActiveId = _a$defaultActiveId === void 0 ? '' : _a$defaultActiveId,
+    activeIdProp = _a.activeId,
+    onClickSubMenu = _a.onClickSubMenu,
+    collapsed = _a.collapsed,
+    _a$defaultCollapsed = _a.defaultCollapsed,
+    defaultCollapsed = _a$defaultCollapsed === void 0 ? false : _a$defaultCollapsed,
+    overlayClassName = _a.overlayClassName,
+    onCollapse = _a.onCollapse,
+    footerRender = _a.footerRender,
+    render = _a.render,
+    extraHeader = _a.extraHeader,
+    onClick = _a.onClick,
+    _a$size = _a.size,
+    size = _a$size === void 0 ? 'lg' : _a$size,
+    rest = tslib.__rest(_a, ["prefixCls", "role", "className", "data", "placement", "showCollapse", "expandedType", "showAllSubMenus", "defaultExpandAll", "defaultExpandedIds", "expandedIds", "onExpand", "defaultActiveId", "activeId", "onClickSubMenu", "collapsed", "defaultCollapsed", "overlayClassName", "onCollapse", "footerRender", "render", "extraHeader", "onClick", "size"]);
   var _useUncontrolledState = useUncontrolledState.useUncontrolledState(defaultActiveId, activeIdProp, onClick),
-      activeId = _useUncontrolledState[0],
-      updateActiveId = _useUncontrolledState[1];
-
+    activeId = _useUncontrolledState[0],
+    updateActiveId = _useUncontrolledState[1];
   var _useState = React.useState(function () {
-    return util.getAncestorIds(activeId, data);
-  }),
-      activeParents = _useState[0],
-      updateActiveParents = _useState[1];
-
+      return util.getAncestorIds(activeId, data);
+    }),
+    activeParents = _useState[0],
+    updateActiveParents = _useState[1];
   React.useEffect(function () {
     updateActiveParents(util.getAncestorIds(activeId, data));
   }, [activeId, data]);
-
   var _useUncontrolledState2 = useUncontrolledState.useUncontrolledState(function () {
-    return defaultExpandAll ? treeUtils.getTreeNodesWithChildren(data).map(function (node) {
-      return node.id;
-    }) : defaultExpandedIds;
-  }, expandedIdsProp, onExpand),
-      expandedIds = _useUncontrolledState2[0],
-      updateExpandedIds = _useUncontrolledState2[1];
-
+      return defaultExpandAll ? treeUtils.getTreeNodesWithChildren(data).map(function (node) {
+        return node.id;
+      }) : defaultExpandedIds;
+    }, expandedIdsProp, onExpand),
+    expandedIds = _useUncontrolledState2[0],
+    updateExpandedIds = _useUncontrolledState2[1];
   var clickMenu = React.useCallback(function (id, raw) {
     updateActiveId(id, raw);
   }, [updateActiveId]);
@@ -135,7 +97,6 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       return expandedId !== id;
     }) : expandedIds.concat(id);
     updateExpandedIds(nextExpandedIds);
-
     if (onClickSubMenu) {
       onClickSubMenu(id, nextExpandedIds);
     }
@@ -148,28 +109,23 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
   var closeAllPopper = React.useCallback(function () {
     updateExpandedIds([]);
   }, [updateExpandedIds]);
-
   var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
-    defaultVisible: defaultCollapsed,
-    visible: collapsed,
-    onToggle: onCollapse
-  }),
-      mini = _useUncontrolledToggl[0],
-      miniToggleAction = _useUncontrolledToggl[1];
-
+      defaultVisible: defaultCollapsed,
+      visible: collapsed,
+      onToggle: onCollapse
+    }),
+    mini = _useUncontrolledToggl[0],
+    miniToggleAction = _useUncontrolledToggl[1];
   var showVertical = placement === 'vertical';
   var canToggle = showVertical && showCollapse;
   var showMini = showVertical && mini;
-
   var _useState2 = React.useState(null),
-      containerElement = _useState2[0],
-      setContainerElement = _useState2[1];
-
+    containerElement = _useState2[0],
+    setContainerElement = _useState2[1];
   var _useState3 = React.useState(),
-      _useState3$ = _useState3[0],
-      containerWidth = _useState3$ === void 0 ? 0 : _useState3$,
-      setContainerWidth = _useState3[1];
-
+    _useState3$ = _useState3[0],
+    containerWidth = _useState3$ === void 0 ? 0 : _useState3$,
+    setContainerWidth = _useState3[1];
   useResizeObserver.useResizeObserver({
     element: containerElement,
     disabled: showVertical,
@@ -181,11 +137,9 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       setContainerWidth(width);
     }
   });
-
   var _useState4 = React.useState(0),
-      tagMaxCount = _useState4[0],
-      setTagMaxCount = _useState4[1];
-
+    tagMaxCount = _useState4[0],
+    setTagMaxCount = _useState4[1];
   var mergedTagList = React.useMemo(function () {
     if (showVertical) return data;
     if (containerWidth < MIN_WIDTH) return data;
@@ -205,21 +159,16 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
   React.useLayoutEffect(function () {
     if (showVertical) return;
     var tagMaxCount = 0;
-
     if (typeAssertion.isArrayNonEmpty(mergedTagList)) {
       var len = mergedTagList.length;
       var lastIndex = len - 1;
       var totalWidth = 72; // 更多
-
       for (var i = 0; i < len; ++i) {
         var currentTagWidth = getTagWidth(i);
-
         if (currentTagWidth === undefined) {
           break;
         }
-
         totalWidth += currentTagWidth;
-
         if (lastIndex === 0 && totalWidth <= containerWidth || i === lastIndex - 1 && totalWidth + getTagWidth(lastIndex) <= containerWidth) {
           tagMaxCount = lastIndex;
           break;
@@ -230,33 +179,37 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       }
     } else {
       tagMaxCount = 0;
-    } // 保底要展示 1 个
-
-
+    }
+    // 保底要展示 1 个
     setTagMaxCount(typeAssertion.isArrayNonEmpty(mergedTagList) && tagMaxCount < 1 ? 1 : tagMaxCount + 1);
   }, [showVertical, getTagWidth, containerWidth, mergedTagList]);
-
   var renderFooter = function renderFooter() {
-    var collapseNode = canToggle ? /*#__PURE__*/React__default["default"].createElement("div", {
+    var collapseNode = canToggle ? /*#__PURE__*/React.createElement("div", {
       className: classname.cx(prefixCls + "__toggle"),
       onClick: function onClick() {
-        miniToggleAction.not(); // 关闭所有展开的子菜单，防止切换到 mini 模式后，子菜单还是展开的
-
+        miniToggleAction.not();
+        // 关闭所有展开的子菜单，防止切换到 mini 模式后，子菜单还是展开的
         updateExpandedIds([]);
       }
-    }, mini ? /*#__PURE__*/React__default["default"].createElement(icons.MenuUnfoldOutlined, null) : /*#__PURE__*/React__default["default"].createElement(icons.MenuFoldOutlined, null)) : null;
-    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, typeAssertion.isFunction(footerRender) ? footerRender({
+    }, mini ? /*#__PURE__*/React.createElement(icons.MenuUnfoldOutlined, null) : /*#__PURE__*/React.createElement(icons.MenuFoldOutlined, null)) : null;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, typeAssertion.isFunction(footerRender) ? footerRender({
       collapsed: showMini,
       collapseNode: collapseNode
     }) : collapseNode);
   };
-
+  var renderItem = React.useCallback(function (menuItem, level) {
+    // 显示缩略内容
+    if (showMini && level === 1) {
+      return renderMenuItemMini(menuItem);
+    }
+    return typeAssertion.isFunction(render) ? render(menuItem, level) : menuItem.title;
+  }, [render, showMini]);
   var cls = classname.cx(prefixCls, className, prefixCls + "--" + placement, prefixCls + "--size-" + size, mini && prefixCls + "--mini", (expandedType === 'pop' || showAllSubMenus || mini) && prefixCls + "--popup");
-  return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
+  return /*#__PURE__*/React.createElement("div", Object.assign({
     ref: useMergeRefs.useMergeRefs(ref, setContainerElement),
     role: role,
     className: cls
-  }, rest), extraHeader, /*#__PURE__*/React__default["default"].createElement(context["default"].Provider, {
+  }, rest), extraHeader, /*#__PURE__*/React.createElement(context["default"].Provider, {
     value: {
       placement: placement,
       expandedType: expandedType,
@@ -271,51 +224,46 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       expandedIds: expandedIds,
       overlayClassName: overlayClassName
     }
-  }, /*#__PURE__*/React__default["default"].createElement("ul", {
+  }, /*#__PURE__*/React.createElement("ul", {
     className: classname.cx(prefixCls + "__wrapper")
   }, mergedTagList.map(function (item, index) {
-    return showMini ? /*#__PURE__*/React__default["default"].createElement(Tooltip__default["default"], {
+    return showMini ? /*#__PURE__*/React.createElement(Tooltip, {
       title: item.title,
       key: item.id,
       placement: "right"
-    }, /*#__PURE__*/React__default["default"].createElement(MenuItem.MenuItem, Object.assign({}, item, {
+    }, /*#__PURE__*/React.createElement(MenuItem.MenuItem, Object.assign({}, item, {
       level: 1,
-      render: renderMenuItemMini,
+      render: renderItem,
       raw: item,
       size: size
-    }))) : /*#__PURE__*/React__default["default"].createElement(MenuItem.MenuItem, Object.assign({
+    }))) : /*#__PURE__*/React.createElement(MenuItem.MenuItem, Object.assign({
       hidden: !showVertical && index >= tagMaxCount
     }, item, {
-      render: render,
+      render: renderItem,
       key: item.id,
       level: 1,
       raw: item,
       size: size
     }));
-  }), showVertical || restTagList.length === 0 ? null : /*#__PURE__*/React__default["default"].createElement(MenuItem.MenuItem, {
+  }), showVertical || restTagList.length === 0 ? null : /*#__PURE__*/React.createElement(MenuItem.MenuItem, {
     key: MENU_MORE_ID,
     id: MENU_MORE_ID,
     title: "\u66F4\u591A",
     children: restTagList
-  })), /*#__PURE__*/React__default["default"].createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: prefixCls + "__footer"
   }, renderFooter())));
 });
-
 if (env.__DEV__) {
   Menu.displayName = 'Menu';
 }
 /**
  * Mini 模式下渲染 item
  */
-
-
 var renderMenuItemMini = function renderMenuItemMini(menu) {
   if (typeof menu.title === 'string') {
     return menu.title.substring(0, 1);
   }
-
   return menu.title;
 };
-
 exports.Menu = Menu;