@zat-design/sisyphus-react 4.0.0-beta.2 → 4.0.0-beta.4

package/es/ProIcon/index.js

@@ -1,19 +1,20 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _uniqBy from "lodash/uniqBy";
 var _excluded = ["type", "onClick", "size", "color", "className", "style", "spin", "rotate", "theme", "disabled", "mode", "buttonProps", "children", "mapList", "src", "actionMap", "tooltip", "buttonIcon"];
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import { useLocalStorageState, useSetState, useDeepCompareLayoutEffect } from 'ahooks';
 import { Button, Tooltip, Space } from 'antd';
 import classNames from 'classnames';
+import { uniqBy } from 'lodash';
 import { ReactSVG } from 'react-svg';
 import { useEffect } from 'react';
-import { useProConfig } from '../ProConfigProvider';
-import { iconMap } from './config';
-import { onBeforeInjection } from './utils';
-import locale from '../locale';
-import './symbolIcon.js';
+import { useProConfig } from "../ProConfigProvider";
+import { iconMap } from "./config";
+import { onBeforeInjection } from "./utils";
+import locale from "../locale";
+import "./symbolIcon.js";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 var ProIcon = function ProIcon(props) {
   var _window, _window2;
   var _useProConfig = useProConfig(),
@@ -51,25 +52,29 @@ var ProIcon = function ProIcon(props) {
     buttonIcon = _config$buttonIcon === void 0 ? true : _config$buttonIcon,
     reset = _objectWithoutProperties(_config, _excluded);
   var _useSetState = useSetState({
-      IconInstance: _jsx(_Fragment, {})
+      IconInstance: /*#__PURE__*/_jsx(_Fragment, {})
     }),
     _useSetState2 = _slicedToArray(_useSetState, 2),
     IconInstance = _useSetState2[0].IconInstance,
     setState = _useSetState2[1];
+
   // 主题色 primaryColor 用于单应用或处于组件库文档内 qiankunPrimaryColor用于主子应用
   var _ref = antdTheme !== null && antdTheme !== void 0 ? antdTheme : {},
     _ref$primaryColor = _ref.primaryColor,
     primaryColor = _ref$primaryColor === void 0 ? '#006AFF' : _ref$primaryColor,
     _ref$qiankunPrimaryCo = _ref.qiankunPrimaryColor,
     qiankunPrimaryColor = _ref$qiankunPrimaryCo === void 0 ? '#006AFF' : _ref$qiankunPrimaryCo;
+
   // 本地存储初始化主题
   var _useLocalStorageState = useLocalStorageState('themeConfig'),
     _useLocalStorageState2 = _slicedToArray(_useLocalStorageState, 1),
     themeConfig = _useLocalStorageState2[0];
+
   // 文档内部就不用判断window.top !== window.self了
   var isQiankun =
   // @ts-ignore
   ((_window = window) === null || _window === void 0 ? void 0 : _window.__POWERED_BY_QIANKUN__) || ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.isMicroApp);
+
   // 语言
   var language = locale.ProIcon.language;
   var rotateStyle = rotate ? {
@@ -83,21 +88,25 @@ var ProIcon = function ProIcon(props) {
     'pro-icon-btn': disabled
   });
   var _mode = mode || 'icon';
+
   // 观察者实例
   var observer;
+
   // 特殊情况，如果指定了type，并且没有接收到组件内的mode，那模式就是icon
   if (type && !props.mode) {
     _mode = 'icon';
   }
   var targetTextFill = "text-".concat(language); // text-cn text-en
+
   var isIconMode = _mode === 'icon';
   var isExtendButtonMode = !isIconMode || isIconMode && disabled;
-  var mergedMapList = _uniqBy(mapList.concat(iconMap), targetTextFill);
+  var mergedMapList = uniqBy(mapList.concat(iconMap), targetTextFill);
   var _type = type;
   var _text = children;
   // svg图标对应文本
   var iconText = tooltip || '';
   var typeIsExistAndIncludeEnglish = _type && /[a-zA-Z]/.test(_type);
+
   // 模式为icon下，对传入的text进行指定语言-icon 映射
   if (isIconMode && !type) {
     if (_text) {
@@ -110,6 +119,7 @@ var ProIcon = function ProIcon(props) {
       }
     }
   }
+
   // 模式为button下，对传入的type进行icon-指定语言 映射
   if (!isIconMode) {
     if (typeIsExistAndIncludeEnglish) {
@@ -129,16 +139,16 @@ var ProIcon = function ProIcon(props) {
       height: size
     }, rotateStyle), style)
   };
-  var icon = !src ? _jsx("svg", _objectSpread(_objectSpread({}, svgProps), {}, {
+  var icon = !src ? /*#__PURE__*/_jsx("svg", _objectSpread(_objectSpread({}, svgProps), {}, {
     style: _objectSpread({
       color: color
     }, svgProps === null || svgProps === void 0 ? void 0 : svgProps.style),
     onClick: onClick,
     "aria-hidden": "true",
-    children: _jsx("use", {
+    children: /*#__PURE__*/_jsx("use", {
       xlinkHref: "#icon-".concat(_type)
     })
-  })) : _jsx(ReactSVG, _objectSpread(_objectSpread({}, svgProps), {}, {
+  })) : /*#__PURE__*/_jsx(ReactSVG, _objectSpread(_objectSpread({}, svgProps), {}, {
     // @ts-ignore
     onClick: onClick,
     "aria-hidden": "true",
@@ -154,12 +164,12 @@ var ProIcon = function ProIcon(props) {
       }
     }
   }));
-  var RenderIcon = _jsx("span", _objectSpread(_objectSpread({
+  var RenderIcon = /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
     className: "anticon"
   }, reset), {}, {
-    children: _jsx(Tooltip, {
+    children: /*#__PURE__*/_jsx(Tooltip, {
       title: iconText,
-      children: buttonIcon ? _jsx(Button, _objectSpread({
+      children: buttonIcon ? /*#__PURE__*/_jsx(Button, _objectSpread({
         style: {
           width: size,
           height: size,
@@ -170,8 +180,8 @@ var ProIcon = function ProIcon(props) {
         },
         type: "text",
         icon: icon
-      }, buttonProps)) : _jsx(Space, {
-        children: _jsx("span", {
+      }, buttonProps)) : /*#__PURE__*/_jsx(Space, {
+        children: /*#__PURE__*/_jsx("span", {
           style: {
             width: size,
             height: size,
@@ -193,13 +203,13 @@ var ProIcon = function ProIcon(props) {
         var targetEntries = mutationsList[0];
         if (targetEntries) {
           if (targetEntries && targetEntries.target) {
-            var _Object$values, _Object$values$find, _Object$values$find$v3, _targetEntries$target, _targetEntries$target2;
+            var _Object$values, _targetEntries$target, _targetEntries$target2;
             var _Object$values$find$v = // @ts-ignore
-              (_Object$values = Object.values((_targetEntries$target = targetEntries === null || targetEntries === void 0 ? void 0 : (_targetEntries$target2 = targetEntries.target) === null || _targetEntries$target2 === void 0 ? void 0 : _targetEntries$target2.attributes) !== null && _targetEntries$target !== void 0 ? _targetEntries$target : {})) === null || _Object$values === void 0 ? void 0 : (_Object$values$find = _Object$values.find(function (item) {
+              (_Object$values = Object.values((_targetEntries$target = targetEntries === null || targetEntries === void 0 || (_targetEntries$target2 = targetEntries.target) === null || _targetEntries$target2 === void 0 ? void 0 : _targetEntries$target2.attributes) !== null && _targetEntries$target !== void 0 ? _targetEntries$target : {})) === null || _Object$values === void 0 || (_Object$values = _Object$values.find(function (item) {
                 return item.nodeName === 'style';
               })
               // @ts-ignore
-              ) === null || _Object$values$find === void 0 ? void 0 : (_Object$values$find$v3 = _Object$values$find.value) === null || _Object$values$find$v3 === void 0 ? void 0 : _Object$values$find$v3.match(/--zaui-brand:(.*?);/),
+              ) === null || _Object$values === void 0 || (_Object$values = _Object$values.value) === null || _Object$values === void 0 ? void 0 : _Object$values.match(/--zaui-brand:(.*?);/),
               _Object$values$find$v2 = _slicedToArray(_Object$values$find$v, 2),
               label = _Object$values$find$v2[0],
               value = _Object$values$find$v2[1];
@@ -238,7 +248,7 @@ var ProIcon = function ProIcon(props) {
         attributeFilter: ['style']
       });
       // 未变更时及初始化时
-      var extendFromMainColor = themeConfig === null || themeConfig === void 0 ? void 0 : (_themeConfig$data = themeConfig.data) === null || _themeConfig$data === void 0 ? void 0 : _themeConfig$data.zauiBrand;
+      var extendFromMainColor = themeConfig === null || themeConfig === void 0 || (_themeConfig$data = themeConfig.data) === null || _themeConfig$data === void 0 ? void 0 : _themeConfig$data.zauiBrand;
       if (extendFromMainColor && qiankunPrimaryColor !== extendFromMainColor) {
         dispatch({
           type: 'set',
@@ -265,9 +275,9 @@ var ProIcon = function ProIcon(props) {
       IconInstance: RenderIcon
     });
   }, [_config, primaryColor, qiankunPrimaryColor, language, svgProps]);
-  return !isExtendButtonMode ? IconInstance : _jsx(Tooltip, {
+  return !isExtendButtonMode ? IconInstance : /*#__PURE__*/_jsx(Tooltip, {
     title: tooltip,
-    children: _jsx(Button, _objectSpread(_objectSpread(_objectSpread({
+    children: /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread(_objectSpread({
       type: isIconMode ? 'text' : (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.type) || 'link',
       className: proIconClassNames,
       disabled: disabled,

package/es/ProIcon/style/index.less

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-icon {
   cursor: pointer;

package/es/ProIcon/utils/index.js

@@ -1,6 +1,6 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { themeMap, themeFillMap } from '../config';
-var _recurseGetNodes = function recurseGetNodes(type, node, queue) {
+import { themeMap, themeFillMap } from "../config";
+export var recurseGetNodes = function recurseGetNodes(type, node, queue) {
   switch (type) {
     // 渐变
     case 'gradation':
@@ -19,11 +19,10 @@ var _recurseGetNodes = function recurseGetNodes(type, node, queue) {
   }
   if (node.childNodes) {
     for (var i = 0; i < node.childNodes.length; i++) {
-      _recurseGetNodes(type, node.childNodes[i], queue);
+      recurseGetNodes(type, node.childNodes[i], queue);
     }
   }
 };
-export { _recurseGetNodes as recurseGetNodes };
 export var onBeforeInjection = function onBeforeInjection(_ref) {
   var svg = _ref.svg,
     actionMap = _ref.actionMap,
@@ -50,7 +49,7 @@ export var onBeforeInjection = function onBeforeInjection(_ref) {
     // 目前只支持处理渐变及fill填充
     var types = Reflect.ownKeys(nodeMap !== null && nodeMap !== void 0 ? nodeMap : {});
     types.forEach(function (typeKey) {
-      _recurseGetNodes(typeKey, svg, nodeMap[typeKey]);
+      recurseGetNodes(typeKey, svg, nodeMap[typeKey]);
     });
     if ((gradList === null || gradList === void 0 ? void 0 : gradList.length) > 0) {
       nodeMap.gradation.forEach(function (item, index) {

package/es/ProLayout/components/Layout/Header/index.js

@@ -1,6 +1,8 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'classnames';
-import logoImg from '../../../images/logoImg.png';
+import logoImg from "../../../images/logoImg.png";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var Header = function Header(props) {
   var headerHeight = props.headerHeight,
     pure = props.pure,
@@ -9,10 +11,10 @@ var Header = function Header(props) {
     rightContentRender = props.rightContentRender,
     title = props.title,
     logo = props.logo;
-  if (pure === true || (pure === null || pure === void 0 ? void 0 : pure.topMenu)) {
-    return _jsx(_Fragment, {});
+  if (pure === true || pure !== null && pure !== void 0 && pure.topMenu) {
+    return /*#__PURE__*/_jsx(_Fragment, {});
   }
-  return _jsxs("div", {
+  return /*#__PURE__*/_jsxs("div", {
     className: classNames({
       'pro-layout-header': true,
       'pro-layout-header-pure': typeof pure !== 'boolean' ? pure === null || pure === void 0 ? void 0 : pure.topMenu : pure
@@ -20,18 +22,18 @@ var Header = function Header(props) {
     style: {
       height: headerHeight
     },
-    children: [headerTitleRender || _jsxs("div", {
+    children: [headerTitleRender || /*#__PURE__*/_jsxs("div", {
       className: "pro-layout-header-logo",
-      children: [_jsx("span", {
-        children: logo || _jsx("img", {
+      children: [/*#__PURE__*/_jsx("span", {
+        children: logo || /*#__PURE__*/_jsx("img", {
           className: "default-logo",
           src: logoImg,
           alt: "logo"
         })
-      }), title ? _jsx("h4", {
+      }), title ? /*#__PURE__*/_jsx("h4", {
         children: title
       }) : null]
-    }), headerContentRender || null, rightContentRender ? _jsx("div", {
+    }), headerContentRender || null, rightContentRender ? /*#__PURE__*/_jsx("div", {
       className: "pro-layout-header-actions",
       children: rightContentRender
     }) : null]

package/es/ProLayout/components/Layout/Icon/Icon.js

@@ -1,5 +1,5 @@
+import React, { useEffect } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from 'react';
 var customCache = new Set();
 var Icon = function Icon(props) {
   // @ts-ignore
@@ -20,12 +20,12 @@ var Icon = function Icon(props) {
   useEffect(function () {
     loadSymbol(iconfontUrl);
   }, []);
-  return _jsx("svg", {
+  return /*#__PURE__*/_jsx("svg", {
     className: "pro-layout-icon",
     "aria-hidden": "true",
     onClick: onClick,
     style: style,
-    children: _jsx("use", {
+    children: /*#__PURE__*/_jsx("use", {
       xlinkHref: "#icon-".concat(type)
     })
   });

package/es/ProLayout/components/Layout/Icon/index.js

@@ -1,2 +1,2 @@
-import Icon from './Icon';
+import Icon from "./Icon";
 export default Icon;

package/es/ProLayout/components/Layout/Menu/FoldMenu/index.js

@@ -1,16 +1,18 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useContext } from 'react';
 import { Popover, Tooltip } from 'antd';
 import classnames from 'classnames';
 import { Link } from 'react-router-dom';
-import { Icon } from '../../index';
-import SideMenu from '../SideMenu';
-import { LayoutContext } from '../../../../index';
-import { getUrlParams, getPathNameKey } from '../../../../utils';
+import { Icon } from "../../index";
+import SideMenu from "../SideMenu";
+import { LayoutContext } from "../../../../index";
+import { getUrlParams, getPathNameKey, findMenuItemByKey } from "../../../../utils";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var FoldMenu = function FoldMenu(props) {
   var style = props.style,
-    dataSource = props.dataSource;
+    dataSource = props.dataSource,
+    onMenuClick = props.onMenuClick;
   var menus = dataSource.menus,
     iconfontUrl = dataSource.iconfontUrl,
     notice = dataSource.notice,
@@ -25,10 +27,10 @@ var FoldMenu = function FoldMenu(props) {
   var _useContext = useContext(LayoutContext),
     selectedPath = _useContext.selectedPath,
     onSelected = _useContext.onSelected;
-  return _jsx("div", {
+  return /*#__PURE__*/_jsx("div", {
     className: "pro-layout-menu-fold",
     style: _objectSpread({}, style),
-    children: _jsx("ul", {
+    children: /*#__PURE__*/_jsx("ul", {
       className: "pro-layout-menu-fold-list",
       style: _objectSpread({}, style),
       children: menus.map(function (item, index) {
@@ -42,11 +44,13 @@ var FoldMenu = function FoldMenu(props) {
           hideInMenu = item.hideInMenu,
           children = item.children;
         var toPath = item.redirectUrl || item.url;
+
         // 隐藏菜单
         if (hideInMenu) {
           return null;
         }
         var selectedMenu = getUrlParams('activeMenu');
+
         // 取第一级
         var currentKeyIdPath = getPathNameKey({
           menus: menus,
@@ -55,31 +59,34 @@ var FoldMenu = function FoldMenu(props) {
         var cls = classnames({
           active: currentKeyIdPath.includes(id)
         });
+
         // 是否包含子级菜单
         var hasChildrenMenu = Array.isArray(children) && children.length;
+
         // 一级li Dom节点
-        var LiNode = _jsx("li", {
-          id: url === null || url === void 0 ? void 0 : (_url$split = url.split('/')) === null || _url$split === void 0 ? void 0 : _url$split[1],
+        var LiNode = /*#__PURE__*/_jsx("li", {
+          id: url === null || url === void 0 || (_url$split = url.split('/')) === null || _url$split === void 0 ? void 0 : _url$split[1],
           className: "".concat(cls, " pro-layout-menu-fold-li"),
-          children: _jsxs("div", {
-            children: [imgUrl ? _jsx("img", {
+          children: /*#__PURE__*/_jsxs("div", {
+            children: [imgUrl ? /*#__PURE__*/_jsx("img", {
               className: "pro-layout-icon",
               src: pathNamePrefix === url ? imgActiveUrl || imgUrl : imgUrl,
               alt: "icon"
-            }) : _jsx(Icon, {
+            }) : /*#__PURE__*/_jsx(Icon, {
               type: icon || '',
               iconfontUrl: iconfontUrl || ''
-            }), _jsx("h2", {
+            }), /*#__PURE__*/_jsx("h2", {
               children: name
             })]
           })
         }, "".concat(id, "-").concat(name));
-        return hasChildrenMenu ? _jsx(Popover, {
+        return hasChildrenMenu ? /*#__PURE__*/_jsx(Popover, {
           mouseEnterDelay: 0,
-          content: _jsx(SideMenu, {
+          content: /*#__PURE__*/_jsx(SideMenu, {
             dataSource: _objectSpread(_objectSpread({}, dataSource), {}, {
               menus: item
-            })
+            }),
+            onMenuClick: onMenuClick
           }),
           color: "#fff",
           classNames: {
@@ -92,25 +99,75 @@ var FoldMenu = function FoldMenu(props) {
             }
           },
           placement: "rightTop",
-          children: LiNode
-        }, "".concat(id, "-").concat(name)) : !collapsed ? _jsx(Tooltip, {
+          children: /*#__PURE__*/_jsx("span", {
+            onClick: function onClick() {
+              // 查找完整的菜单项数据
+              var menuItem = findMenuItemByKey(menus, String(id));
+              var menuKeyPath = menuItem !== null && menuItem !== void 0 && menuItem.keyIdPath ? menuItem.keyIdPath.map(function (id) {
+                return String(id);
+              }) : [String(id)];
+
+              // 调用用户传入的onMenuClick回调
+              if (onMenuClick) {
+                onMenuClick({
+                  item: menuItem,
+                  key: String(id),
+                  keyPath: menuKeyPath
+                });
+              }
+            },
+            children: LiNode
+          })
+        }, "".concat(id, "-").concat(name)) : !collapsed ? /*#__PURE__*/_jsx(Tooltip, {
           placement: "right",
           title: name,
-          children: _jsx("span", {
+          children: /*#__PURE__*/_jsx("span", {
             onClick: function onClick() {
+              // 查找完整的菜单项数据
+              var menuItem = findMenuItemByKey(menus, String(id));
+              var menuKeyPath = menuItem !== null && menuItem !== void 0 && menuItem.keyIdPath ? menuItem.keyIdPath.map(function (id) {
+                return String(id);
+              }) : [String(id)];
+
+              // 调用用户传入的onMenuClick回调
+              if (onMenuClick) {
+                onMenuClick({
+                  item: menuItem,
+                  key: String(id),
+                  keyPath: menuKeyPath
+                });
+              }
               onSelected({
                 selectedPath: toPath
               });
             },
-            children: _jsx(Link, {
+            children: /*#__PURE__*/_jsx(Link, {
               to: toPath,
               children: LiNode
             }, toPath)
           })
-        }, toPath) : _jsx(Link, {
-          to: toPath,
-          children: LiNode
-        }, toPath);
+        }, toPath) : /*#__PURE__*/_jsx("span", {
+          onClick: function onClick() {
+            // 查找完整的菜单项数据
+            var menuItem = findMenuItemByKey(menus, String(id));
+            var menuKeyPath = menuItem !== null && menuItem !== void 0 && menuItem.keyIdPath ? menuItem.keyIdPath.map(function (id) {
+              return String(id);
+            }) : [String(id)];
+
+            // 调用用户传入的onMenuClick回调
+            if (onMenuClick) {
+              onMenuClick({
+                item: menuItem,
+                key: String(id),
+                keyPath: menuKeyPath
+              });
+            }
+          },
+          children: /*#__PURE__*/_jsx(Link, {
+            to: toPath,
+            children: LiNode
+          }, toPath)
+        });
       })
     })
   });

package/es/ProLayout/components/Layout/Menu/FoldMenu/style/index.less

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-layout-menu-fold-list {
   padding-top: 4px;