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

package/es/ProLayout/components/TabsManager/style/index.less

@@ -30,13 +30,13 @@
       background: transparent;
       pointer-events: none;
       z-index: 1;
-      box-shadow: 1px 2px 4px 1px rgba(0, 55, 93, .2);
+      box-shadow: 1px 2px 4px 1px rgba(0, 55, 93, 0.2);
     }
 
-    .pro-layout-tab-icon {  
+    .pro-layout-tab-icon {
       display: none !important;
     }
-    .@{ant-prefix}-tabs-nav-list{
+    .@{ant-prefix}-tabs-nav-list {
       overflow: initial;
     }
 
@@ -70,7 +70,6 @@
   }
 
   &-content {
-
     .tab-pane {
       &.hidden {
         display: none;
@@ -134,7 +133,7 @@
       padding: 0 !important;
       margin: 0 !important;
       background: transparent !important;
-      border: none ;
+      border: none;
       border-radius: 0 !important;
       cursor: pointer;
       transition: none; // 由内部 TabItemComponent 处理过渡
@@ -160,7 +159,7 @@
     .@{ant-prefix}-tabs-tab-active {
       background: transparent !important;
       border: none !important;
-      .pro-layout-tab-item{
+      .pro-layout-tab-item {
         border-color: transparent !important;
       }
 
@@ -173,7 +172,6 @@
     .@{ant-prefix}-tabs-ink-bar {
       display: none !important;
     }
-
   }
 }
 
@@ -284,14 +282,14 @@
   }
 }
 
-.pro-layout-tabs-dropdown-menu{
-  .@{ant-prefix}-tabs-dropdown-menu-item-remove{
+.pro-layout-tabs-dropdown-menu {
+  .@{ant-prefix}-tabs-dropdown-menu-item-remove {
     display: none !important;
   }
-  .pro-layout-tab-icon{
+  .pro-layout-tab-icon {
     display: none !important;
   }
-  .pro-layout-tab-content{
+  .pro-layout-tab-content {
     width: 100%;
   }
 }

package/es/ProLayout/components/TabsManager/utils/index.js

@@ -1,8 +1,7 @@
 /**
  * 根据菜单项生成TabItem
  */
-export var createTabFromMenu = function createTabFromMenu(menuItem) {
-  var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+export const createTabFromMenu = (menuItem, index = 0) => {
   return {
     id: String(menuItem.id || menuItem.code || menuItem.url || index),
     code: menuItem.code,
@@ -18,10 +17,10 @@ export var createTabFromMenu = function createTabFromMenu(menuItem) {
 /**
  * 生成唯一的tab ID
  */
-export var generateTabId = (menuItem, existingIds) => {
-  var baseId = String(menuItem.id || menuItem.code || menuItem.url);
-  var finalId = baseId;
-  var counter = 1;
+export const generateTabId = (menuItem, existingIds) => {
+  const baseId = String(menuItem.id || menuItem.code || menuItem.url);
+  let finalId = baseId;
+  let counter = 1;
 
   // 如果ID已存在，则添加数字后缀
   while (existingIds.includes(finalId)) {
@@ -34,15 +33,15 @@ export var generateTabId = (menuItem, existingIds) => {
 /**
  * 检查菜单项是否应该外部跳转
  */
-export var shouldOpenExternal = (menuItem, target) => {
+export const shouldOpenExternal = (menuItem, target) => {
   return target === '_blank' || menuItem.redirectUrl && menuItem.redirectUrl !== menuItem.url || menuItem.type === 'EXTERNAL';
 };
 
 /**
  * 处理外部跳转
  */
-export var handleExternalOpen = menuItem => {
-  var url = menuItem.redirectUrl || menuItem.url;
+export const handleExternalOpen = menuItem => {
+  const url = menuItem.redirectUrl || menuItem.url;
   if (url) {
     window.open(url, '_blank');
   }
@@ -54,7 +53,7 @@ export var handleExternalOpen = menuItem => {
  * @param maxTabs 最大标签页数量，如果为 undefined 或 null，表示无限制
  * @returns 如果超出限制返回 true，否则返回 false
  */
-export var checkTabLimit = (currentTabs, maxTabs) => {
+export const checkTabLimit = (currentTabs, maxTabs) => {
   // 如果 maxTabs 为 undefined 或 null，表示无限制
   if (maxTabs === undefined || maxTabs === null) {
     return false;
@@ -65,23 +64,23 @@ export var checkTabLimit = (currentTabs, maxTabs) => {
 /**
  * 移除最旧的标签页（根据访问时间或创建时间）
  */
-export var removeOldestTab = tabs => {
+export const removeOldestTab = tabs => {
   if (tabs.length === 0) return tabs;
 
   // 找到可关闭的最旧标签页
-  var closableTabs = tabs.filter(tab => tab.closable);
+  const closableTabs = tabs.filter(tab => tab.closable);
   if (closableTabs.length === 0) return tabs;
 
   // 移除第一个可关闭的标签页
-  var oldestTab = closableTabs[0];
+  const oldestTab = closableTabs[0];
   return tabs.filter(tab => tab.id !== oldestTab.id);
 };
 
 /**
  * 获取右侧标签页
  */
-export var getRightTabs = (tabs, currentTabId) => {
-  var currentIndex = tabs.findIndex(tab => tab.id === currentTabId);
+export const getRightTabs = (tabs, currentTabId) => {
+  const currentIndex = tabs.findIndex(tab => tab.id === currentTabId);
   if (currentIndex === -1) return [];
   return tabs.slice(currentIndex + 1);
 };
@@ -89,9 +88,8 @@ export var getRightTabs = (tabs, currentTabId) => {
 /**
  * 扁平化菜单数据
  */
-export var flattenMenuData = function flattenMenuData() {
-  var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  var flatMenus = [];
+export const flattenMenuData = (menus = []) => {
+  let flatMenus = [];
   menus.forEach(item => {
     flatMenus.push(item);
     if (item.children) {
@@ -105,9 +103,10 @@ export var flattenMenuData = function flattenMenuData() {
  * 判断菜单项是否为最后一级（叶子节点）
  * 只有当菜单项没有子菜单或子菜单为空时，才认为是叶子节点
  */
-export var isLeafMenuItem = menuItem => {
-  var _ref = menuItem || {},
-    children = _ref.children;
+export const isLeafMenuItem = menuItem => {
+  const {
+    children
+  } = menuItem || {};
   // 如果 children 不存在、为 null、为 undefined，或者为空数组，则认为是叶子节点
   return !children || Array.isArray(children) && children.length === 0;
 };

package/es/ProLayout/index.js

@@ -1,14 +1,3 @@
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-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(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(arr) { if (Array.isArray(arr)) return arr; }
 /* eslint-disable func-call-spacing */
 /* eslint-disable no-spaced-func */
 import { createContext, useMemo, useRef, useCallback } from 'react';
@@ -27,64 +16,54 @@ import headerBg from "../assets/header_bg.png";
 
 // 全局上下文
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export var LayoutContext = /*#__PURE__*/createContext(undefined);
-var ProLayout = props => {
-  var _Object$keys;
-  var children = props.children,
-    _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    _props$pure = props.pure,
-    pure = _props$pure === void 0 ? false : _props$pure,
-    _props$headerHeight = props.headerHeight,
-    headerHeight = _props$headerHeight === void 0 ? 64 : _props$headerHeight,
-    _props$contentStyle = props.contentStyle,
-    contentStyle = _props$contentStyle === void 0 ? {} : _props$contentStyle,
-    _props$waterMarkProps = props.waterMarkProps,
-    waterMarkProps = _props$waterMarkProps === void 0 ? {} : _props$waterMarkProps,
-    headerNotice = props.headerNotice,
-    noticeIn = props.notice,
-    dataSource = props.dataSource,
-    _props$pathPrefix = props.pathPrefix,
-    pathPrefix = _props$pathPrefix === void 0 ? '' : _props$pathPrefix,
-    target = props.target,
-    onCollapsedChange = props.onCollapsedChange,
-    _props$collapsed = props.collapsed,
-    propsCollapsed = _props$collapsed === void 0 ? false : _props$collapsed,
-    onMenuClick = props.onMenuClick,
-    headerTitleRender = props.headerTitleRender,
-    headerContentRender = props.headerContentRender,
-    rightContentRender = props.rightContentRender,
-    _props$title = props.title,
-    title = _props$title === void 0 ? '' : _props$title,
-    logo = props.logo,
-    appsOptions = props.appsOptions,
-    _props$iconfontUrl = props.iconfontUrl,
-    iconfontUrl = _props$iconfontUrl === void 0 ? '' : _props$iconfontUrl,
-    sideMenuFooterRender = props.sideMenuFooterRender,
-    sideMenuHeaderRender = props.sideMenuHeaderRender,
-    _props$mode = props.mode,
-    mode = _props$mode === void 0 ? 'normal' : _props$mode,
-    tabs = props.tabs;
-  var isTabsLayout = isTabsMode(props);
+export const LayoutContext = /*#__PURE__*/createContext(undefined);
+const ProLayout = props => {
+  const {
+    children,
+    className = '',
+    pure = false,
+    headerHeight = 64,
+    contentStyle = {},
+    waterMarkProps = {},
+    headerNotice,
+    notice: noticeIn,
+    // 修改别名
+    dataSource,
+    pathPrefix = '',
+    target,
+    onCollapsedChange,
+    collapsed: propsCollapsed = false,
+    onMenuClick,
+    // Header组件需要的props
+    headerTitleRender,
+    headerContentRender,
+    rightContentRender,
+    title = '',
+    logo,
+    appsOptions,
+    // Menu组件需要的props
+    iconfontUrl = '',
+    sideMenuFooterRender,
+    sideMenuHeaderRender,
+    mode = 'normal',
+    tabs
+  } = props;
+  const isTabsLayout = isTabsMode(props);
   validateTabsProps(mode, tabs);
-  var tabsManagerRef = useRef(null);
-  var _useSetState = useSetState({
-      notice: headerNotice || noticeIn,
-      menus: [],
-      selectedPath: ''
-    }),
-    _useSetState2 = _slicedToArray(_useSetState, 2),
-    _useSetState2$ = _useSetState2[0],
-    notice = _useSetState2$.notice,
-    menus = _useSetState2$.menus,
-    selectedPath = _useSetState2$.selectedPath,
-    setState = _useSetState2[1];
-  var _useToggle = useToggle(props.collapsed || false),
-    _useToggle2 = _slicedToArray(_useToggle, 2),
-    collapsed = _useToggle2[0],
-    _useToggle2$ = _useToggle2[1],
-    toggle = _useToggle2$.toggle,
-    set = _useToggle2$.set;
+  const tabsManagerRef = useRef(null);
+  const [{
+    notice,
+    menus,
+    selectedPath
+  }, setState] = useSetState({
+    notice: headerNotice || noticeIn,
+    menus: [],
+    selectedPath: ''
+  });
+  const [collapsed, {
+    toggle,
+    set
+  }] = useToggle(props.collapsed || false);
   useDeepCompareEffect(() => {
     set(props.collapsed || false);
   }, [props.collapsed]);
@@ -92,23 +71,23 @@ var ProLayout = props => {
     if (Array.isArray(dataSource) && !dataSource.length) {
       return;
     }
-    var userData = transformMenus(dataSource, pathPrefix);
+    const userData = transformMenus(dataSource, pathPrefix);
     // 确保 menus 始终是一个数组
-    var menuData = Array.isArray(userData) ? userData : (userData === null || userData === void 0 ? void 0 : userData.menus) || [];
+    const menuData = Array.isArray(userData) ? userData : userData?.menus || [];
     setState({
       menus: menuData
     });
   }, [dataSource]);
-  var menuDataSource = useMemo(() => Array.isArray(menus) ? {
+  const menuDataSource = useMemo(() => Array.isArray(menus) ? {
     menus
   } : menus, [menus]);
-  var enhancedTabsConfig = useMemo(() => {
+  const enhancedTabsConfig = useMemo(() => {
     if (!isTabsLayout || !tabs) {
       return tabs;
     }
-    return _objectSpread(_objectSpread({}, tabs), {}, {
+    return {
+      ...tabs,
       onTabChange: (activeKey, activeTab, allTabs) => {
-        var _activeTab$menuItem, _activeTab$menuItem2, _activeTab$menuItem3, _tabs$onTabChange;
         if (!allTabs || allTabs.length === 0) {
           // 使用一个不可能匹配的路径来清除选中状态，避免 OpenMenu fallback 到 window.location.pathname
           setState({
@@ -116,17 +95,17 @@ var ProLayout = props => {
           });
           return;
         }
-        var targetPath = (activeTab === null || activeTab === void 0 ? void 0 : activeTab.url) || (activeTab === null || activeTab === void 0 || (_activeTab$menuItem = activeTab.menuItem) === null || _activeTab$menuItem === void 0 ? void 0 : _activeTab$menuItem.router) || (activeTab === null || activeTab === void 0 || (_activeTab$menuItem2 = activeTab.menuItem) === null || _activeTab$menuItem2 === void 0 ? void 0 : _activeTab$menuItem2.url) || (activeTab === null || activeTab === void 0 || (_activeTab$menuItem3 = activeTab.menuItem) === null || _activeTab$menuItem3 === void 0 ? void 0 : _activeTab$menuItem3.redirectUrl);
+        const targetPath = activeTab?.url || activeTab?.menuItem?.router || activeTab?.menuItem?.url || activeTab?.menuItem?.redirectUrl;
         if (targetPath && targetPath !== selectedPath) {
           setState({
             selectedPath: targetPath
           });
         }
-        (_tabs$onTabChange = tabs.onTabChange) === null || _tabs$onTabChange === void 0 || _tabs$onTabChange.call(tabs, activeKey, activeTab, allTabs);
+        tabs.onTabChange?.(activeKey, activeTab, allTabs);
       }
-    });
+    };
   }, [isTabsLayout, tabs, selectedPath]);
-  var renderContent = () => {
+  const renderContent = () => {
     if (!isTabsLayout || !enhancedTabsConfig) {
       return /*#__PURE__*/_jsx("div", {
         children: children
@@ -140,16 +119,15 @@ var ProLayout = props => {
       children: children
     });
   };
-  var handleMenuClick = useCallback(params => {
-    var _tabsManagerRef$curre, _tabsManagerRef$curre2, _tabsManagerRef$curre3, _tabsManagerRef$curre4, _params$item, _params$item2, _params$item3;
+  const handleMenuClick = useCallback(params => {
     // 非 tabs 模式，直接调用原始回调并允许激活
     if (!isTabsLayout) {
-      onMenuClick === null || onMenuClick === void 0 || onMenuClick(params);
+      onMenuClick?.(params);
       return true;
     }
 
     // tabs 模式：调用 TabsManager 的 handleMenuClick 来添加标签页
-    (_tabsManagerRef$curre = tabsManagerRef.current) === null || _tabsManagerRef$curre === void 0 || (_tabsManagerRef$curre2 = _tabsManagerRef$curre.handleMenuClick) === null || _tabsManagerRef$curre2 === void 0 || _tabsManagerRef$curre2.call(_tabsManagerRef$curre, params);
+    tabsManagerRef.current?.handleMenuClick?.(params);
 
     // 非叶子节点，直接允许激活
     if (!params.item || !isLeafMenuItem(params.item)) {
@@ -157,14 +135,14 @@ var ProLayout = props => {
     }
 
     // 叶子节点：检查是否可以添加标签页（检查 max 限制）
-    var canAdd = (_tabsManagerRef$curre3 = tabsManagerRef.current) === null || _tabsManagerRef$curre3 === void 0 || (_tabsManagerRef$curre4 = _tabsManagerRef$curre3.canAddTab) === null || _tabsManagerRef$curre4 === void 0 ? void 0 : _tabsManagerRef$curre4.call(_tabsManagerRef$curre3, params.item);
+    const canAdd = tabsManagerRef.current?.canAddTab?.(params.item);
     if (!canAdd) {
       // 超过限制，返回 false 阻止菜单激活
       return false;
     }
 
     // 可以添加标签页，设置选中路径（激活菜单）
-    var targetPath = ((_params$item = params.item) === null || _params$item === void 0 ? void 0 : _params$item.url) || ((_params$item2 = params.item) === null || _params$item2 === void 0 ? void 0 : _params$item2.redirectUrl) || ((_params$item3 = params.item) === null || _params$item3 === void 0 ? void 0 : _params$item3.router);
+    const targetPath = params.item?.url || params.item?.redirectUrl || params.item?.router;
     if (targetPath && targetPath !== selectedPath) {
       setState({
         selectedPath: targetPath
@@ -176,22 +154,22 @@ var ProLayout = props => {
   /**
    * 关闭提示框
    */
-  var onCancelNotice = () => {
+  const onCancelNotice = () => {
     setState({
       notice: null
     });
   };
-  var contentCls = classNames({
+  const contentCls = classNames({
     'pro-layout-row': true,
     'pro-layout-row-has-notice': notice,
     'pro-layout-row-pure': typeof pure === 'boolean' && pure,
     'pro-layout-row-top-pure': typeof pure !== 'boolean' && pure.topMenu,
     'pro-layout-row-left-pure': typeof pure !== 'boolean' && pure.leftMenu
   });
-  var noticeHeight = notice ? 32 : 0;
+  const noticeHeight = notice ? 32 : 0;
 
   // 为Header组件创建专门的props对象
-  var headerProps = {
+  const headerProps = {
     headerHeight,
     pure,
     headerTitleRender,
@@ -203,14 +181,14 @@ var ProLayout = props => {
   };
 
   // 为Notice组件创建专门的props对象
-  var noticeProps = {
+  const noticeProps = {
     headerHeight,
     notice,
     onCancel: onCancelNotice
   };
 
   // 为Menu组件创建专门的props对象
-  var menuProps = {
+  const menuProps = {
     headerHeight,
     dataSource: Array.isArray(menus) ? {
       menus
@@ -228,23 +206,30 @@ var ProLayout = props => {
     onMenuClick: handleMenuClick,
     appsOptions
   };
-  var layoutDom = /*#__PURE__*/_jsxs("div", {
+  const layoutDom = /*#__PURE__*/_jsxs("div", {
     className: classNames({
       'pro-layout': true,
       'pro-layout-light': true,
-      'pro-layout-pure': typeof pure === 'boolean' ? pure : (pure === null || pure === void 0 ? void 0 : pure.topMenu) || (pure === null || pure === void 0 ? void 0 : pure.leftMenu),
+      'pro-layout-pure': typeof pure === 'boolean' ? pure : pure?.topMenu || pure?.leftMenu,
       [`${className}`]: className
     }),
     style: {
       '--header-bg-image': `url(${headerBg})`
     },
-    children: [/*#__PURE__*/_jsx(Header, _objectSpread({}, headerProps)), /*#__PURE__*/_jsx(Notice, _objectSpread({}, noticeProps)), /*#__PURE__*/_jsxs("div", {
+    children: [/*#__PURE__*/_jsx(Header, {
+      ...headerProps
+    }), /*#__PURE__*/_jsx(Notice, {
+      ...noticeProps
+    }), /*#__PURE__*/_jsxs("div", {
       className: contentCls,
-      children: [/*#__PURE__*/_jsx(Menu, _objectSpread({}, menuProps)), /*#__PURE__*/_jsx("div", {
+      children: [/*#__PURE__*/_jsx(Menu, {
+        ...menuProps
+      }), /*#__PURE__*/_jsx("div", {
         className: "pro-layout-content",
-        style: _objectSpread(_objectSpread({}, contentStyle), {}, {
+        style: {
+          ...contentStyle,
           marginTop: headerHeight + noticeHeight
-        }),
+        },
         children: renderContent()
       })]
     })]
@@ -255,9 +240,10 @@ var ProLayout = props => {
       target,
       onSelected: setState
     },
-    children: !((_Object$keys = Object.keys(waterMarkProps)) !== null && _Object$keys !== void 0 && _Object$keys.length) ? layoutDom : /*#__PURE__*/_jsx(ProWaterMark, _objectSpread(_objectSpread({}, waterMarkProps), {}, {
+    children: !Object.keys(waterMarkProps)?.length ? layoutDom : /*#__PURE__*/_jsx(ProWaterMark, {
+      ...waterMarkProps,
       children: layoutDom
-    }))
+    })
   });
 };
 ProLayout.ProCollapse = ProCollapse;

package/es/ProLayout/propTypes.js

@@ -26,10 +26,8 @@
  * @description ProLayout 标签页实例接口（类似 FormInstance）
  */
 
-export var isTabsMode = props => props.mode === 'tabs';
-export var validateTabsProps = function validateTabsProps() {
-  var mode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'normal';
-  var tabs = arguments.length > 1 ? arguments[1] : undefined;
+export const isTabsMode = props => props.mode === 'tabs';
+export const validateTabsProps = (mode = 'normal', tabs) => {
   if (mode === 'tabs' && !tabs) {
     throw new Error('ProLayout: tabs configuration is required when mode="tabs"，例如 <ProLayout mode="tabs" tabs={{ max: 10 }} />');
   }