@zat-design/sisyphus-react 3.14.0-beta.1 → 4.0.0-beta.10

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

@@ -1,38 +1,35 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
 
 .pro-layout-menu-fold-list {
   padding-top: 4px;
-  overflow-y : auto;
+  overflow-y: auto;
 
   li {
-    width        : 100%;
-    min-height   : 48px;
-    padding      : 12px;
-    overflow     : hidden;
+    width: 100%;
+    min-height: 48px;
+    padding: 12px;
+    overflow: hidden;
     text-overflow: ellipsis;
 
     div {
-      display        : flex;
-      align-items    : center;
+      display: flex;
+      align-items: center;
       justify-content: center;
-      color          : var(--zaui-text, #343434);
+      color: var(--zaui-text, #343434);
 
       .pro-layout-icon {
-        flex     : 0 0 20px;
-        width    : 20px;
-        height   : 20px;
+        flex: 0 0 20px;
+        width: 20px;
         min-width: 20px;
-        color    : #fff;
+        height: 20px;
+        color: #fff;
       }
 
       h2 {
-        flex-grow    : 1;
-        margin-bottom: 0;
-        opacity      : 1;
-        transition   : opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-          margin 0.3s, color 0.3s;
         display: none;
+        flex-grow: 1;
+        margin-bottom: 0;
+        opacity: 1;
+        transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), margin 0.3s, color 0.3s;
       }
     }
 
@@ -42,20 +39,20 @@
 
     i {
       display: inline-block;
-      width  : 19px;
-      color  : #909090;
+      width: 19px;
+      color: #909090;
     }
 
     h2 {
-      display     : inline-block;
+      display: inline-block;
       padding-left: var(--zaui-space-size-sm, 8px);
-      color       : var(--zaui-base-bg, #ffffff);
-      font-weight : normal;
-      font-size   : var(--zaui-font-size-md, 14px);
+      color: var(--zaui-base-bg, #ffffff);
+      font-weight: normal;
+      font-size: var(--zaui-font-size-md, 14px);
     }
 
     &.active {
-      background-color: var(--zaui-brand, #006AFF);
+      background-color: var(--zaui-brand, #006aff);
 
       a {
         h2 {
@@ -67,37 +64,41 @@
 }
 
 .pro-layout-menu-tooltip {
-  top       : 48px !important;
-  transform : none !important;
-  transition: none !important
+  top: 48px !important;
+  transform: none !important;
+  transition: none !important;
 }
 
 .pro-layout-menu-tooltip.pro-layout-menu-tooltip-has-notice {
-  top: 80px !important
+  top: 80px !important;
 }
 
 .pro-layout-menu-tooltip.pro-layout-menu-tooltip-nav-open.@{ant-prefix}-popover-placement-rightBottom,
 .pro-layout-menu-tooltip.pro-layout-menu-tooltip-nav-open.@{ant-prefix}-popover-placement-rightTop {
-  left: 220px !important
+  left: 220px !important;
 }
 
 .pro-layout-menu-tooltip.@{ant-prefix}-popover-placement-rightBottom,
 .pro-layout-menu-tooltip.@{ant-prefix}-popover-placement-rightTop {
-  position    : fixed;
-  z-index     : 1001;
-  left        : 49px !important;
-  padding-left: 0
+  position: fixed;
+  left: 49px !important;
+  z-index: 99;
+  padding-left: 0;
+
+  .@{ant-prefix}-popover-arrow {
+    display: none;
+  }
 }
 
 .pro-layout-menu-tooltip .@{ant-prefix}-popover-inner-content {
-  padding: 0
+  padding: 0;
 }
 
-.pro-layout-menu-tooltip .@{ant-prefix}-popover-content>.@{ant-prefix}-popover-arrow {
-  display: none
+.pro-layout-menu-tooltip .@{ant-prefix}-popover-content > .@{ant-prefix}-popover-arrow {
+  display: none;
 }
 
 .pro-layout-menu-tooltip .@{ant-prefix}-popover-content .@{ant-prefix}-popover-inner {
-  padding   : 0;
+  padding: 0;
   box-shadow: 2px 0px 5px 0px rgba(0, 55, 93, 0.1);
 }

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

@@ -1,7 +1,6 @@
-import "antd/es/menu/style";
-import _Menu from "antd/es/menu";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useMemo, useRef, useContext } from 'react';
+import { Menu } from 'antd';
 import { useDeepCompareEffect, useSetState } from 'ahooks';
 import { CaretDownOutlined } from '@ant-design/icons';
 import classnames from 'classnames';
@@ -132,7 +131,7 @@ var OpenMenu = props => {
   return /*#__PURE__*/_jsxs("div", {
     className: cls,
     style: style,
-    children: [/*#__PURE__*/_jsx(_Menu, {
+    children: [/*#__PURE__*/_jsx(Menu, {
       mode: "inline"
       // @ts-ignore
       ,

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

@@ -1,6 +1,3 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
-
 .pro-layout-open-menu {
   color: #fff;
 

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

@@ -1,5 +1,3 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
 
 .pro-layout-sider-menu {
   width: 220px;
@@ -61,7 +59,7 @@
             display: none;
 
             & ~ h2 {
-              margin-left: var(--zaui-space-size-md, 16px);
+              margin-left: 32px;
             }
           }
         }
@@ -93,12 +91,16 @@
           color: #909090;
         }
 
+ 
+
         .@{ant-prefix}-menu-submenu-title,
         &.@{ant-prefix}-menu-root > .@{ant-prefix}-menu-item-only-child,
         &.@{ant-prefix}-menu-sub.@{ant-prefix}-menu-inline > .@{ant-prefix}-menu-item {
           min-height: 40px;
-          padding-top: 10px;
-          padding-bottom: 10px;
+          padding-top: 8px;
+          padding-bottom: 8px;
+          width: 100%;
+          border-radius: 0;
         }
       }
     }

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

@@ -27,7 +27,7 @@ var Menu = props => {
   } else if (dataSource) {
     menus = dataSource === null || dataSource === void 0 ? void 0 : dataSource.menus;
   }
-  if (pure.leftMenu || pure === true) {
+  if (pure !== null && pure !== void 0 && pure.leftMenu || pure === true) {
     return /*#__PURE__*/_jsx(_Fragment, {});
   }
   return /*#__PURE__*/_jsxs("div", {

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

@@ -1,5 +1,3 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
 @import '../FoldMenu/style/index.less';
 @import '../OpenMenu/style/index.less';
 @import '../SideMenu/style/index.less';

package/es/ProLayout/components/Layout/Notice/style/index.less

@@ -1,5 +1,3 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
 
   /** 告知区 */
   .pro-layout-header-notice {

package/es/ProLayout/components/ProCollapse/index.js

@@ -1,18 +1,12 @@
-import "antd/es/descriptions/style";
-import _Descriptions from "antd/es/descriptions";
-import "antd/es/space/style";
-import _Space from "antd/es/space";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import "antd/es/collapse/style";
-import _Collapse from "antd/es/collapse";
 import { useLayoutEffect } from 'react';
+import { Collapse, Descriptions, Space } from 'antd';
 import { CaretRightOutlined } from '@ant-design/icons';
 import classNames from 'classnames';
 import foldSvg from "../../../assets/fold.svg";
 import ProIcon from "../../../ProIcon/index";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var Panel = _Collapse.Panel;
 var ProCollapse = props => {
   var title = props.title,
     id = props.id,
@@ -62,29 +56,21 @@ var ProCollapse = props => {
     style: contentStyle,
     children: children
   });
-  var renderPanel = () => {
+
+  // 生成 Collapse items 配置
+  var getCollapseItems = () => {
     var _title = title;
+    var panelClassName = 'pro-collapse-panel';
+    var panelProps = {};
     if (level === '2') {
-      var level2Panel = classNames({
+      panelClassName = classNames({
         'pro-collapse-level2-collapse': towCollapse,
         'pro-collapse-level2-no-collapse': !towCollapse,
         'pro-collapse-panel': true
       });
-      var hasCollapse = {};
       if (!towCollapse) {
-        hasCollapse.collapsible = 'disabled';
+        panelProps.collapsible = 'disabled';
       }
-      return /*#__PURE__*/_jsx(Panel, _objectSpread(_objectSpread(_objectSpread({
-        header: _title,
-        className: level2Panel,
-        extra: /*#__PURE__*/_jsx("div", {
-          className: "extra-info",
-          children: extra
-        }),
-        forceRender: true
-      }, hasCollapse), collapsePanelProps), {}, {
-        children: content
-      }), "1");
     }
     if (level === '3') {
       var level3Panel = classNames({
@@ -92,24 +78,24 @@ var ProCollapse = props => {
         'pro-collapse-level3-no-collapse': !threeCollapse,
         'pro-collapse-panel': true
       });
-      var _hasCollapse = {};
+      var hasCollapse = {};
       if (!threeCollapse) {
-        _hasCollapse.collapsible = 'disabled';
+        hasCollapse.collapsible = 'disabled';
       }
-      return /*#__PURE__*/_jsx(Panel, _objectSpread(_objectSpread(_objectSpread({
-        header: _title,
-        className: level3Panel,
+      return [_objectSpread(_objectSpread({
+        key: '1',
+        label: _title,
+        children: content,
         extra: /*#__PURE__*/_jsx("div", {
           className: "extra-info",
           children: extra
         }),
+        className: level3Panel,
         forceRender: true
-      }, _hasCollapse), collapsePanelProps), {}, {
-        children: content
-      }), "1");
+      }, hasCollapse), collapsePanelProps)];
     }
     if (icon) {
-      _title = /*#__PURE__*/_jsxs(_Space, {
+      _title = /*#__PURE__*/_jsxs(Space, {
         size: 8,
         align: "center",
         children: [/*#__PURE__*/_jsx("div", {
@@ -123,25 +109,25 @@ var ProCollapse = props => {
         }), title]
       });
     }
-    return /*#__PURE__*/_jsx(Panel, _objectSpread(_objectSpread({
-      header: _title,
-      className: "pro-collapse-panel",
+    return [_objectSpread(_objectSpread({
+      key: '1',
+      label: _title,
+      children: content,
       extra: /*#__PURE__*/_jsx("div", {
         className: "extra-info",
         children: extra
       }),
+      className: panelClassName,
       forceRender: true
-    }, collapsePanelProps), {}, {
-      children: content
-    }), "1");
+    }, panelProps), collapsePanelProps)];
   };
   var renderTitleList = () => {
     return /*#__PURE__*/_jsxs("div", {
       className: cls,
-      children: [/*#__PURE__*/_jsx(_Descriptions, {
+      children: [/*#__PURE__*/_jsx(Descriptions, {
         column: column,
         children: titleList === null || titleList === void 0 ? void 0 : titleList.map(item => {
-          return /*#__PURE__*/_jsx(_Descriptions.Item, {
+          return /*#__PURE__*/_jsx(Descriptions.Item, {
             label: item.label,
             children: item.value || '-'
           }, item.label);
@@ -182,7 +168,7 @@ var ProCollapse = props => {
   return /*#__PURE__*/_jsx("div", {
     id: id,
     style: style,
-    children: Array.isArray(titleList) && titleList.length ? renderTitleList() : /*#__PURE__*/_jsx(_Collapse, _objectSpread(_objectSpread({
+    children: Array.isArray(titleList) && titleList.length ? renderTitleList() : /*#__PURE__*/_jsx(Collapse, _objectSpread({
       className: cls,
       bordered: false,
       expandIcon: _ref => {
@@ -193,10 +179,9 @@ var ProCollapse = props => {
       },
       expandIconPosition: "end",
       defaultActiveKey: folding ? [] : ['1'],
-      onChange: onChange
-    }, finalCollapseProps), {}, {
-      children: renderPanel()
-    }))
+      onChange: onChange,
+      items: getCollapseItems()
+    }, finalCollapseProps))
   });
 };
 export default ProCollapse;

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

@@ -1,5 +1,3 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
 
 .pro-collapse {
   .pro-collapse-icon{
@@ -33,7 +31,8 @@
   .@{ant-prefix}-collapse-header {
     align-items: center !important;
     padding: 10px var(--zaui-space-size-md, 16px) !important;
-    background: var(--zaui-area, #fafafa);
+    background: #e4f2fe;
+    border-radius: 8px !important;
   }
 
   .@{ant-prefix}-collapse-header-text {
@@ -111,6 +110,7 @@
         padding: 0 8px 6px !important;
         border-bottom: 1px solid #dee0e3;
         margin: 0 -8px;
+        border-radius: 0 !important;
         .@{ant-prefix}-collapse-arrow{
           right: 8px;
         }
@@ -118,7 +118,7 @@
 
       .@{ant-prefix}-collapse-extra {
         .extra-info {
-          margin-right: var(--zaui-space-size-lg, 32px);
+          margin-right: 4px;
         }
       }
     }
@@ -306,6 +306,7 @@
       .@{ant-prefix}-collapse-expand-icon {
         display: block !important;
         color: #999;
+        margin-right: 8px;
       }
       
       .@{ant-prefix}-collapse-header {

package/es/ProLayout/components/ProFooter/index.js

@@ -1,7 +1,6 @@
-import "antd/es/space/style";
-import _Space from "antd/es/space";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { useSize } from 'ahooks';
+import { Space } from 'antd';
 import classnames from 'classnames';
 import { memo, useEffect } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -41,7 +40,7 @@ var ProFooter = props => {
       zIndex,
       width: `calc(100% - ${size === null || size === void 0 ? void 0 : size.width}px)`
     }, props.style),
-    children: /*#__PURE__*/_jsx(_Space, {
+    children: /*#__PURE__*/_jsx(Space, {
       children: children
     })
   });

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

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

package/es/ProLayout/components/ProHeader/components/Copy/index.js

@@ -1,11 +1,10 @@
-import "antd/es/typography/style";
-import _Typography from "antd/es/typography";
+import { Typography } from 'antd';
 import { ReactSVG } from 'react-svg';
 import { CheckOutlined } from '@ant-design/icons';
 import copySvg from "../../../../../assets/copy.svg";
 import locale from "../../../../../locale";
 import { jsx as _jsx } from "react/jsx-runtime";
-var Paragraph = _Typography.Paragraph;
+var Paragraph = Typography.Paragraph;
 var Copy = _ref => {
   var text = _ref.text;
   return /*#__PURE__*/_jsx(Paragraph, {

package/es/ProLayout/components/ProHeader/components/ProBackBtn/index.js

@@ -1,6 +1,5 @@
-import "antd/es/button/style";
-import _Button from "antd/es/button";
 import { ArrowLeftOutlined } from '@ant-design/icons';
+import { Button } from 'antd';
 import locale from "../../../../../locale";
 
 /**
@@ -20,7 +19,7 @@ var ProBackBtn = _ref => {
       window.history.back();
     }
   };
-  return /*#__PURE__*/_jsx(_Button, {
+  return /*#__PURE__*/_jsx(Button, {
     icon: /*#__PURE__*/_jsx(ArrowLeftOutlined, {}),
     className: "back-button-container",
     onClick: handleClick,

package/es/ProLayout/components/ProHeader/components/ProBackBtn/style/index.less

@@ -1,24 +1,22 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
 
 .back-button-container {
   &.@{ant-prefix}-btn {
     color      : var(--zaui-text);
     font-weight: 400;
-    background : var(--zaui-disabled-bg);
-    border     : none;
+    background : var(--zaui-disabled-bg) !important;
+    border     : none !important;
 
     &:hover {
-      color     : var(--zaui-aide-text);
-      background: var(--zaui-disabled-bg);
-      border    : none;
+      color     : var(--zaui-aide-text) !important;
+      background: var(--zaui-disabled-bg) !important;
+      border    : none !important;
     }
 
     &:active,
     &:focus {
-      color      : var(--zaui-text);
+      color      : var(--zaui-text) !important;
       font-weight: 400;
-      background : var(--zaui-disabled-bg);
+      background : var(--zaui-disabled-bg) !important;
     }
   }
 }