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

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 {
@@ -99,7 +98,7 @@
     }
 
     .pro-collapse-content {
-      padding: var(--zaui-space-size-sm, 8px) 0 !important;
+      padding: var(--zaui-space-size-md, 16px) !important;
     }
 
     .pro-collapse-level2-collapse {
@@ -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;
         }
@@ -150,6 +150,9 @@
       .@{ant-prefix}-collapse-expand-icon {
         display: none;
       }
+      .pro-collapse-content{
+        padding: var(--zaui-space-size-sm, 8px) 0 !important;
+      }
     }
   }
 
@@ -201,4 +204,145 @@
     }
 
   }
+
+  &.pro-collapse-level3 {
+    margin-bottom: var(--zaui-space-size-md, 16px);
+
+    .pro-collapse-level2{
+      margin-top: 8px !important;
+      .pro-collapse-panel {
+        border: none !important;
+      }
+      .@{ant-prefix}-collapse-header {
+        height: auto !important;
+        background: #fff !important;
+        &:hover{
+          background: #fff !important;
+        }
+        .@{ant-prefix}-collapse-header-text {
+          &:before{
+            display: block;
+          }
+        }
+  
+        .@{ant-prefix}-collapse-extra {
+          .extra-info {
+            font-size: var(--zaui-font-size, 14px);
+            color: var(--zaui-text, #343434);
+          }
+        }
+      }
+      .@{ant-prefix}-collapse-content{
+        .@{ant-prefix}-collapse-content-box{
+          .pro-collapse-content{
+            padding: var(--zaui-space-size-sm, 8px) 0 !important;
+          }
+        }
+      }
+     
+    }
+   
+    .@{ant-prefix}-collapse-item-active{
+      margin-bottom: 0 !important;
+    }
+    .pro-collapse-panel {
+      border: 1px solid #d9d9d9;
+      margin-bottom: var(--zaui-space-size-md, 16px);
+      overflow: hidden;
+      border-radius: 8px !important;
+      
+      &:last-child {
+        margin-bottom: 0;
+        border-bottom: 1px solid #d9d9d9;
+      }
+    }
+
+    .pro-collapse-level3-no-collapse{
+      .@{ant-prefix}-collapse-header{
+        padding: 0 !important;
+      }
+    }
+
+    .@{ant-prefix}-collapse-header {
+      height: 48px !important;
+      padding: 0 var(--zaui-space-size-md, 16px) !important;
+      background: #F8F8F8 !important;
+      border-radius: 8px;
+      align-items: center !important;
+      justify-content: center !important;
+      display: flex !important;
+      margin: 0 !important;
+      border-bottom: none !important;
+
+      .@{ant-prefix}-collapse-header-text {
+        font-size: var(--zaui-font-size, 14px);
+        font-weight: 500;
+        color: var(--zaui-text, #343434);
+        padding-left: 16px !important;
+        &:before{
+          display: none;
+        }
+      }
+
+      .@{ant-prefix}-collapse-extra {
+        .extra-info {
+          font-size: var(--zaui-font-size, 14px);
+          color: var(--zaui-text, #343434);
+        }
+      }
+    }
+
+    .@{ant-prefix}-collapse-content {
+      .@{ant-prefix}-collapse-content-box {
+        .pro-collapse-content {
+          padding: var(--zaui-space-size-md, 16px) !important;
+          background: var(--zaui-base-bg, #ffffff);
+        }
+      }
+    }
+
+    // 可折叠样式
+    .pro-collapse-level3-collapse {
+      .@{ant-prefix}-collapse-expand-icon {
+        display: block !important;
+        color: #999;
+        margin-right: 8px;
+      }
+      
+      .@{ant-prefix}-collapse-header {
+        cursor: pointer;
+        padding: 0 !important;
+        &:hover {
+          background: #f0f0f0;
+        }
+      }
+    }
+
+    // 不可折叠样式
+    .pro-collapse-level3-no-collapse {
+      .@{ant-prefix}-collapse-expand-icon {
+        display: none !important;
+      }
+      
+      .@{ant-prefix}-collapse-header {
+        cursor: default;
+      }
+    }
+
+    // 禁用折叠时的样式
+    &.@{ant-prefix}-collapse .@{ant-prefix}-collapse-item-disabled > .@{ant-prefix}-collapse-header,
+    .@{ant-prefix}-collapse
+      .@{ant-prefix}-collapse-item-disabled
+      > .@{ant-prefix}-collapse-header
+      > .arrow {
+      color: var(--zaui-text, #343434);
+      cursor: default;
+      background: #F8F8F8 !important;
+    }
+  }
+  // 当pro-collapse-content直接包含level3且不包含level2时，添加padding
+ .pro-collapse-level2 .pro-collapse-content:has(.pro-collapse-level3) {
+    padding: var(--zaui-space-size-md, 16px) !important;
+    padding-right: 0 !important;
+  } 
 }

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

@@ -1,10 +1,10 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { jsx as _jsx } from "react/jsx-runtime";
 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";
 var ProFooter = function ProFooter(props) {
   var _props$visible = props.visible,
     visible = _props$visible === void 0 ? true : _props$visible,
@@ -36,13 +36,13 @@ var ProFooter = function ProFooter(props) {
   var cls = classnames(_defineProperty({
     'pro-footer': true
   }, "".concat(className), className));
-  return _jsx("div", {
+  return /*#__PURE__*/_jsx("div", {
     className: cls,
     style: _objectSpread({
       zIndex: zIndex,
       width: "calc(100% - ".concat(size === null || size === void 0 ? void 0 : size.width, "px)")
     }, props.style),
-    children: _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,20 +1,20 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 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 copySvg from "../../../../../assets/copy.svg";
+import locale from "../../../../../locale";
+import { jsx as _jsx } from "react/jsx-runtime";
 var Paragraph = Typography.Paragraph;
 var Copy = function Copy(_ref) {
   var text = _ref.text;
-  return _jsx(Paragraph, {
+  return /*#__PURE__*/_jsx(Paragraph, {
     className: "pro-header-copy",
     copyable: {
       text: text,
-      icon: [_jsx(ReactSVG, {
+      icon: [/*#__PURE__*/_jsx(ReactSVG, {
         className: "drag-icon",
         src: copySvg
-      }, "copy-icon"), _jsx(CheckOutlined, {}, "copied-icon")],
+      }, "copy-icon"), /*#__PURE__*/_jsx(CheckOutlined, {}, "copied-icon")],
       tooltips: ["".concat(locale.ProHeader.copyTooltips[0]), "".concat(locale.ProHeader.copyTooltips[1])]
     }
   });

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

@@ -1,12 +1,13 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { ArrowLeftOutlined } from '@ant-design/icons';
 import { Button } from 'antd';
-import locale from '../../../../../locale';
+import locale from "../../../../../locale";
+
 /**
  * 页面返回按钮
  * @param onBack 自定义返回方法
  * @param text 自定义按钮文字
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 var ProBackBtn = function ProBackBtn(_ref) {
   var onBack = _ref.onBack,
     _ref$text = _ref.text,
@@ -18,8 +19,8 @@ var ProBackBtn = function ProBackBtn(_ref) {
       window.history.back();
     }
   };
-  return _jsx(Button, {
-    icon: _jsx(ArrowLeftOutlined, {}),
+  return /*#__PURE__*/_jsx(Button, {
+    icon: /*#__PURE__*/_jsx(ArrowLeftOutlined, {}),
     className: "back-button-container",
     onClick: handleClick,
     shape: "round",

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

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .back-button-container {
   &.@{ant-prefix}-btn {

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

@@ -1,2 +1,2 @@
-export { default as Copy } from './Copy';
-export { default as ProBackBtn } from './ProBackBtn';
+export { default as Copy } from "./Copy";
+export { default as ProBackBtn } from "./ProBackBtn";