@zat-design/sisyphus-react 3.2.1 → 3.2.2-beta.10

package/lib/ProTable/style/index.less

@@ -1,38 +1,41 @@
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
+
 .pro-table {
   &.pro-table-bordered {
-    .ant-table .ant-table-thead>tr>th {
+    .@{ant-prefix}-table .@{ant-prefix}-table-thead>tr>th {
       border-bottom: 1px solid #f0f0f0
     }
 
-    .ant-table>.ant-table-container>.ant-table-content>table,
-    .ant-table>.ant-table-container>.ant-table-header>table {
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-content>table,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-header>table {
       border-top: 1px solid rgba(0, 0, 0, 0.06);
     }
 
-    .ant-table>.ant-table-container>.ant-table-content>table>thead>tr>th,
-    .ant-table>.ant-table-container>.ant-table-header>table>thead>tr>th,
-    .ant-table>.ant-table-container>.ant-table-body>table>thead>tr>th,
-    .ant-table>.ant-table-container>.ant-table-summary>table>thead>tr>th,
-    .ant-table>.ant-table-container>.ant-table-content>table>tbody>tr>td,
-    .ant-table>.ant-table-container>.ant-table-header>table>tbody>tr>td,
-    .ant-table>.ant-table-container>.ant-table-body>table>tbody>tr>td,
-    .ant-table>.ant-table-container>.ant-table-summary>table>tbody>tr>td,
-    .ant-table>.ant-table-container>.ant-table-content>table>tfoot>tr>th,
-    .ant-table>.ant-table-container>.ant-table-header>table>tfoot>tr>th,
-    .ant-table>.ant-table-container>.ant-table-body>table>tfoot>tr>th,
-    .ant-table>.ant-table-container>.ant-table-summary>table>tfoot>tr>th,
-    .ant-table>.ant-table-container>.ant-table-content>table>tfoot>tr>td,
-    .ant-table>.ant-table-container>.ant-table-header>table>tfoot>tr>td,
-    .ant-table>.ant-table-container>.ant-table-body>table>tfoot>tr>td,
-    .ant-table>.ant-table-container>.ant-table-summary>table>tfoot>tr>td {
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-content>table>thead>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-header>table>thead>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-body>table>thead>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-summary>table>thead>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-content>table>tbody>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-header>table>tbody>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-body>table>tbody>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-summary>table>tbody>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-content>table>tfoot>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-header>table>tfoot>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-body>table>tfoot>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-summary>table>tfoot>tr>th,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-content>table>tfoot>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-header>table>tfoot>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-body>table>tfoot>tr>td,
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container>.@{ant-prefix}-table-summary>table>tfoot>tr>td {
       border-right: 1px solid rgba(0, 0, 0, 0.06);
     }
 
-    .ant-table .ant-table-tbody>tr:not(.ant-table-measure-row)>td {
+    .@{ant-prefix}-table .@{ant-prefix}-table-tbody>tr:not(.@{ant-prefix}-table-measure-row)>td {
       border-bottom: 1px solid #f0f0f0;
     }
 
-    .ant-table>.ant-table-container {
+    .@{ant-prefix}-table>.@{ant-prefix}-table-container {
       border-left: 1px solid rgba(0, 0, 0, 0.06);
     }
   }
@@ -54,8 +57,14 @@
     }
   }
 
-  .ant-table-body {
-    .ant-table-cell .varied-cell {
+  .@{ant-prefix}-table-tbody {
+    .@{ant-prefix}-table-cell-fix-left, .@{ant-prefix}-table-cell-fix-right {
+      background: unset !important;
+    }
+  }
+
+  .@{ant-prefix}-table-body {
+    .@{ant-prefix}-table-cell .varied-cell {
       margin-left: -8px;
       background: var(--zaui-contract-bg, #fffaa1);
       padding: var(--zaui-space-size-xs, 4px) var(--zaui-space-size-sm, 8px);
@@ -70,7 +79,7 @@
   .copyable-table-cell {
 
 
-    .ant-typography {
+    .@{ant-prefix}-typography {
       margin-bottom: 0;
       display      : flex;
       align-items  : center;
@@ -83,7 +92,7 @@
       }
     }
 
-    .ant-typography-copy-success {
+    .@{ant-prefix}-typography-copy-success {
       svg {
         fill: var(--zaui-success, #00ae4d);
       }
@@ -98,14 +107,14 @@
   }
 
   &.pro-table-no-stripe {
-    .ant-table.ant-table-scroll-horizontal .ant-table-tbody .ant-table-row:nth-child(n)>td {
+    .@{ant-prefix}-table.@{ant-prefix}-table-scroll-horizontal .@{ant-prefix}-table-tbody .@{ant-prefix}-table-row:nth-child(n)>td {
       background: var(--zaui-base-bg, #ffffff);
     }
   }
 
-  .ant-table-thead {
-    .ant-dropdown-trigger {
-      &.ant-dropdown-open {
+  .@{ant-prefix}-table-thead {
+    .@{ant-prefix}-dropdown-trigger {
+      &.@{ant-prefix}-dropdown-open {
 
         .anticon-down {
           transition: transform 0.3s;
@@ -128,7 +137,7 @@
     }
   }
 
-  .ant-table-thead {
+  .@{ant-prefix}-table-thead {
     tr th {
       &:last-child {
         .react-resizable-handle {
@@ -138,11 +147,11 @@
     }
   }
 
-  .ant-space {
+  .@{ant-prefix}-space {
     gap: var(--zaui-space-size-sm, 8px) !important;
   }
 
-  .ant-btn-link {
+  .@{ant-prefix}-btn-link {
     padding: 0 var(--zaui-space-size-xs, 4px);
 
     &:first-child {
@@ -159,7 +168,7 @@
       display    : flex;
       align-items: center;
 
-      >.ant-btn {
+      >.@{ant-prefix}-btn {
 
         &:hover,
         &:visited,
@@ -176,11 +185,22 @@
     }
   }
 
-  .ant-empty .ant-empty-image {
-    height: 80px;
+  .pro-table-empty {
+    margin: var(--zaui-space-size-lg, 32px) 0;
+    color: rgba(0, 0, 0, 0.25);
+    font-size: var(--zaui-font-size-md, 14px);
+    text-align: center;
+
+    .empty-image {
+      height: 80px;
+
+      img {
+        height: 100%;
+      }
+    }
   }
 
-  .ant-table .ant-table-thead>tr>th {
+  .@{ant-prefix}-table .@{ant-prefix}-table-thead>tr>th {
     border-bottom: 0;
     white-space  : nowrap;
     background   : var(--zaui-table-header-bg, #f2f3f5);
@@ -223,29 +243,29 @@
     }
   }
 
-  .ant-table.ant-table-bordered {
-    .ant-table-thead>tr>th {
+  .@{ant-prefix}-table.@{ant-prefix}-table-bordered {
+    .@{ant-prefix}-table-thead>tr>th {
       border-bottom: 1px solid #f0f0f0;
     }
 
-    .ant-table-tbody>tr:not(.ant-table-placeholder)>td {
+    .@{ant-prefix}-table-tbody>tr:not(.@{ant-prefix}-table-placeholder)>td {
       border-bottom: 1px solid #f0f0f0;
     }
 
-    .ant-table-tbody>tr:not(.ant-table-measure-row)>td {
+    .@{ant-prefix}-table-tbody>tr:not(.@{ant-prefix}-table-measure-row)>td {
       border-bottom: 1px solid #f0f0f0;
     }
   }
 
-  .ant-table-tbody .ant-table-placeholder {
+  .@{ant-prefix}-table-tbody .@{ant-prefix}-table-placeholder {
     background: var(--zaui-base-bg, #ffffff) !important;
   }
 
-  .ant-table-tbody>tr:not(.ant-table-placeholder)>td {
+  .@{ant-prefix}-table-tbody>tr:not(.@{ant-prefix}-table-placeholder)>td {
     border-bottom: 0;
   }
 
-  .ant-table-tbody>tr:not(.ant-table-measure-row)>td {
+  .@{ant-prefix}-table-tbody>tr:not(.@{ant-prefix}-table-measure-row)>td {
     border-bottom: 0;
   }
 
@@ -253,7 +273,7 @@
     position       : relative;
     background-clip: padding-box;
 
-    .ant-table-filter-trigger {
+    .@{ant-prefix}-table-filter-trigger {
       margin-right: 0;
     }
   }
@@ -289,20 +309,20 @@
     }
   }
 
-  .ant-table-tbody tr td .ant-checkbox-wrapper-checked.checkbox-disabled {
+  .@{ant-prefix}-table-tbody tr td .@{ant-prefix}-checkbox-wrapper-checked.checkbox-disabled {
     pointer-events: none;
     cursor        : not-allowed;
     opacity       : 0.5;
   }
 
-  .ant-pagination-options-quick-jumper input {
+  .@{ant-prefix}-pagination-options-quick-jumper input {
     border    : unset;
     background: #FAFAFA;
     min-width : 32px;
     height    : 32px;
   }
 
-  .ant-pagination .ant-pagination-item-active a {
+  .@{ant-prefix}-pagination .@{ant-prefix}-pagination-item-active a {
     color        : #ffffff;
     background   : var(--zaui-brand, #006aff) !important;
     border-radius: var(--zaui-border-radius, 4px);
@@ -318,10 +338,10 @@
     }
   }
 
-  .ant-table-summary {
+  .@{ant-prefix}-table-summary {
     background-color: var(--zaui-table-header-bg, #f2f3f5);
 
-    .ant-table-cell {
+    .@{ant-prefix}-table-cell {
       font-weight     : 500;
       background-color: var(--zaui-table-header-bg, #f2f3f5);
       border          : none;
@@ -329,10 +349,10 @@
   }
 }
 
-.ant-dropdown-placement-bottomLeft {
-  .ant-dropdown-menu-vertical.ant-dropdown-menu-light {
+.@{ant-prefix}-dropdown-placement-bottomLeft {
+  .@{ant-prefix}-dropdown-menu-vertical.@{ant-prefix}-dropdown-menu-light {
 
-    .ant-dropdown-menu-item-only-child {
+    .@{ant-prefix}-dropdown-menu-item-only-child {
       &:hover {
         background: rgba(0, 106, 255, 0.08);
       }

package/lib/ProTabs/style/index.less

@@ -1,18 +1,20 @@
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
+
 .pro-tabs {
-  .ant-tabs .ant-tabs-nav-list .ant-tabs-tab {
-    padding: 0;
+  .@{ant-prefix}-tabs .@{ant-prefix}-tabs-nav-list .@{ant-prefix}-tabs-tab {
+    padding: 0 !important;
   }
 
-  .ant-tabs-top>.ant-tabs-nav::before,
-  .ant-tabs-bottom>.ant-tabs-nav::before,
-  .ant-tabs-top>div>.ant-tabs-nav::before,
-  .ant-tabs-bottom>div>.ant-tabs-nav::before {
+  .@{ant-prefix}-tabs-top > .@{ant-prefix}-tabs-nav::before,
+  .@{ant-prefix}-tabs-bottom > .@{ant-prefix}-tabs-nav::before,
+  .@{ant-prefix}-tabs-top > div > .@{ant-prefix}-tabs-nav::before,
+  .@{ant-prefix}-tabs-bottom > div > .@{ant-prefix}-tabs-nav::before {
     border: none;
   }
 
-
-  .ant-tabs-nav-list {
-    .ant-tabs-tab {
+  .@{ant-prefix}-tabs-nav-list {
+    .@{ant-prefix}-tabs-tab {
       &:first-child {
         .pro-tabs-card {
           border-left: 1px solid var(--zaui-line, #dddddd);
@@ -21,37 +23,37 @@
     }
   }
 
-  .ant-tabs-tab-active {
+  .@{ant-prefix}-tabs-tab-active {
     .pro-tabs-card {
       background: var(--ant-primary-color-active-deprecated-f-30, rgba(230, 247, 255, 0.3));
     }
   }
 
-  .ant-tabs-ink-bar {
-    top   : 0;
+  .@{ant-prefix}-tabs-ink-bar {
+    top: 0;
     height: 3px !important;
   }
 
   .pro-tabs-card {
-    width      : 200px;
-    padding    : 14px 16px 14px 24px;
-    border     : 1px solid var(--zaui-line, #dddddd);
+    width: 200px;
+    padding: calc(9px * var(--zaui-size; 1)) 16px calc(9px * var(--zaui-size; 1)) 24px;
+    border: 1px solid var(--zaui-line, #dddddd);
     border-left: none;
 
     .pro-tabs-card-left {
-      width      : 104px;
+      width: 104px;
       text-shadow: none;
 
       .pro-tabs-card-left-total {
-        font-size  : var(--zaui-font-size-lg-title, 24px);
+        color: var(--zaui-text, #343434);
         font-weight: 600;
-        color      : var(--zaui-text, #343434);
+        font-size: var(--zaui-font-size-lg-title, 24px);
       }
 
       .pro-tabs-card-left-label {
-        font-size  : var(--zaui-font-size, 14px);
+        color: var(--aui-text, #343434);
         font-weight: 400;
-        color      : var(--aui-text, #343434);
+        font-size: var(--zaui-font-size, 14px);
       }
     }
 
@@ -67,13 +69,13 @@
 
 .pro-tabs-tab {
   .pro-tabs-card {
-    .ant-tag {
+    .@{ant-prefix}-tag {
+      margin-right: 0;
+      padding: 0 var(--zaui-space-size-xs, 4px);
       border-radius: 10px;
-      padding      : 0 var(--zaui-space-size-xs, 4px);
-      margin-right : 0;
     }
 
-    .ant-space-item {
+    .@{ant-prefix}-space-item {
       display: flex;
     }
   }

package/lib/ProThemeTools/component/PrdTools/index.d.ts

@@ -1,3 +1,3 @@
 import type { DevToolsPropsType } from '../../propsType';
-declare const PrdTools: ({ onReset, onClose, setState, visible, state, tableBorder, tableStripe, }: DevToolsPropsType) => JSX.Element;
+declare const PrdTools: ({ onReset, onClose, setState, visible, state, tableBorder, tableStripe, prefixCls, }: DevToolsPropsType) => JSX.Element;
 export default PrdTools;

package/lib/ProThemeTools/component/PrdTools/index.js

@@ -12,6 +12,7 @@ var _icons = require("@ant-design/icons");
 var _antd = require("antd");
 var _react = require("react");
 var _index = require("../../utils/index");
+var _locale = _interopRequireDefault(require("../../../locale"));
 var connect = function connect(Component) {
   var ComponentWrapper = function ComponentWrapper(props) {
     return (0, _jsxRuntime.jsx)(Component, (0, _objectSpread2.default)({}, props));
@@ -26,7 +27,8 @@ var PrdTools = function PrdTools(_ref) {
     visible = _ref.visible,
     state = _ref.state,
     tableBorder = _ref.tableBorder,
-    tableStripe = _ref.tableStripe;
+    tableStripe = _ref.tableStripe,
+    prefixCls = _ref.prefixCls;
   var _useState = (0, _react.useState)([{
       color: '#006AFF',
       active: true
@@ -62,8 +64,8 @@ var PrdTools = function PrdTools(_ref) {
   }, []);
   return (0, _jsxRuntime.jsxs)(NewDrawer, {
     className: "pro-theme-prd-tools-drawer",
-    width: 320,
-    title: "\u5168\u5C40\u6837\u5F0F\u81EA\u5B9A\u4E49",
+    width: 400,
+    title: "".concat(_locale.default.ProThemeTools.title),
     placement: "right",
     onClose: onClose,
     open: visible,
@@ -77,7 +79,7 @@ var PrdTools = function PrdTools(_ref) {
     }), (0, _jsxRuntime.jsxs)("div", {
       className: "pro-theme-tools-space",
       children: [(0, _jsxRuntime.jsx)("p", {
-        children: "\u4E3B\u9898\u8272"
+        children: "".concat(_locale.default.ProThemeTools.themeColor)
       }), (0, _jsxRuntime.jsx)("ul", {
         className: "pro-theme-color",
         children: active.map(function (item, index) {
@@ -108,7 +110,7 @@ var PrdTools = function PrdTools(_ref) {
       children: [(0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)("p", {
-          children: "\u5E03\u5C40"
+          children: "".concat(_locale.default.ProThemeTools.layout)
         })
       }), (0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
@@ -124,13 +126,13 @@ var PrdTools = function PrdTools(_ref) {
           },
           children: [(0, _jsxRuntime.jsx)(_antd.Radio.Button, {
             value: 0.5,
-            children: "\u7D27\u51D1"
+            children: "".concat(_locale.default.ProThemeTools.layoutMode[0])
           }), (0, _jsxRuntime.jsx)(_antd.Radio.Button, {
             value: 1,
-            children: "\u5E38\u89C4"
+            children: "".concat(_locale.default.ProThemeTools.layoutMode[1])
           }), (0, _jsxRuntime.jsx)(_antd.Radio.Button, {
             value: 1.5,
-            children: "\u5BBD\u677E"
+            children: "".concat(_locale.default.ProThemeTools.layoutMode[2])
           })]
         })
       })]
@@ -139,7 +141,7 @@ var PrdTools = function PrdTools(_ref) {
       children: [(0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)("p", {
-          children: "\u8868\u5355\u6807\u9898"
+          children: "".concat(_locale.default.ProThemeTools.formLabel)
         })
       }), (0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
@@ -149,18 +151,18 @@ var PrdTools = function PrdTools(_ref) {
             var after = e.target.value === 'left' ? 'inline' : 'none';
             var before = e.target.value === 'right' ? 'inline' : 'none';
             // 遍历添加className
-            var formItemLabels = document.querySelectorAll('.ant-form-item-label');
+            var formItemLabels = document.querySelectorAll(".".concat(prefixCls, "-form-item-label"));
             // 遍历元素列表，为每个元素添加新的 class
             formItemLabels.forEach(function (label) {
               var _label$classList, _label$classList$valu, _label$classList2, _label$classList2$val;
               if (!label) {
                 return false;
               }
-              if (e.target.value === 'left' && !((_label$classList = label.classList) === null || _label$classList === void 0 ? void 0 : (_label$classList$valu = _label$classList.value) === null || _label$classList$valu === void 0 ? void 0 : _label$classList$valu.includes('ant-form-item-label-left'))) {
-                label.classList.add('ant-form-item-label-left');
+              if (e.target.value === 'left' && !((_label$classList = label.classList) === null || _label$classList === void 0 ? void 0 : (_label$classList$valu = _label$classList.value) === null || _label$classList$valu === void 0 ? void 0 : _label$classList$valu.includes("".concat(prefixCls, "-form-item-label-left")))) {
+                label.classList.add("".concat(prefixCls, "-form-item-label-left"));
               }
-              if (e.target.value === 'right' && ((_label$classList2 = label.classList) === null || _label$classList2 === void 0 ? void 0 : (_label$classList2$val = _label$classList2.value) === null || _label$classList2$val === void 0 ? void 0 : _label$classList2$val.includes('ant-form-item-label-left'))) {
-                label.classList.remove('ant-form-item-label-left');
+              if (e.target.value === 'right' && ((_label$classList2 = label.classList) === null || _label$classList2 === void 0 ? void 0 : (_label$classList2$val = _label$classList2.value) === null || _label$classList2$val === void 0 ? void 0 : _label$classList2$val.includes("".concat(prefixCls, "-form-item-label-left")))) {
+                label.classList.remove("".concat(prefixCls, "-form-item-label-left"));
               }
             });
             setState((0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
@@ -176,10 +178,10 @@ var PrdTools = function PrdTools(_ref) {
           },
           children: [(0, _jsxRuntime.jsx)(_antd.Radio.Button, {
             value: "left",
-            children: "\u5DE6\u5BF9\u9F50"
+            children: "".concat(_locale.default.ProThemeTools.flex[0])
           }), (0, _jsxRuntime.jsx)(_antd.Radio.Button, {
             value: "right",
-            children: "\u53F3\u5BF9\u9F50"
+            children: "".concat(_locale.default.ProThemeTools.flex[1])
           })]
         })
       })]
@@ -188,13 +190,13 @@ var PrdTools = function PrdTools(_ref) {
       children: [(0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)("p", {
-          children: "\u5927\u5B57\u53F7\u6A21\u5F0F"
+          children: "".concat(_locale.default.ProThemeTools.bigText)
         })
       }), (0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)(_antd.Switch, {
-          checkedChildren: "\u5F00",
-          unCheckedChildren: "\u5173",
+          checkedChildren: "".concat(_locale.default.ProThemeTools.switchText[0]),
+          unCheckedChildren: "".concat(_locale.default.ProThemeTools.switchText[1]),
           checked: state.zauiBigText,
           onClick: function onClick(value) {
             setState((0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
@@ -212,13 +214,13 @@ var PrdTools = function PrdTools(_ref) {
       children: [(0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)("p", {
-          children: "\u8868\u683C\u8FB9\u6846"
+          children: "".concat(_locale.default.ProThemeTools.tableBorder)
         })
       }), (0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)(_antd.Switch, {
-          checkedChildren: "\u5F00",
-          unCheckedChildren: "\u5173",
+          checkedChildren: "".concat(_locale.default.ProThemeTools.switchText[0]),
+          unCheckedChildren: "".concat(_locale.default.ProThemeTools.switchText[1]),
           checked: state.zauiTableBorder,
           onClick: function onClick(value) {
             setState((0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
@@ -235,13 +237,13 @@ var PrdTools = function PrdTools(_ref) {
       children: [(0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)("p", {
-          children: "\u8868\u683C\u6591\u9A6C\u7EB9"
+          children: "".concat(_locale.default.ProThemeTools.tableStripe)
         })
       }), (0, _jsxRuntime.jsx)("div", {
         className: "pro-theme-tools-item",
         children: (0, _jsxRuntime.jsx)(_antd.Switch, {
-          checkedChildren: "\u5F00",
-          unCheckedChildren: "\u5173",
+          checkedChildren: "".concat(_locale.default.ProThemeTools.switchText[0]),
+          unCheckedChildren: "".concat(_locale.default.ProThemeTools.switchText[1]),
           checked: state.zauiStripe,
           onClick: function onClick(value) {
             setState((0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
@@ -272,7 +274,7 @@ var PrdTools = function PrdTools(_ref) {
         }]);
         onReset();
       },
-      children: "\u91CD\u7F6E"
+      children: "".concat(_locale.default.ProThemeTools.reset)
     })]
   });
 };

package/lib/ProThemeTools/component/PrdTools/style/index.less

@@ -1,17 +1,17 @@
 .pro-theme-prd-tools-drawer {
-  .ant-drawer-header {
+  .@{ant-prefix}-drawer-header {
     border-bottom: none;
   }
 
-  .ant-drawer-title {
+  .@{ant-prefix}-drawer-title {
     font-size: var(--zaui-font-size-xl, 18px);
   }
 
-  .ant-drawer-body {
+  .@{ant-prefix}-drawer-body {
     padding: 0 32px 32px;
   }
 
-  .ant-space-vertical {
+  .@{ant-prefix}-space-vertical {
     gap: var(--zaui-space-size-sm, 8px) !important;
   }
 
@@ -118,12 +118,12 @@
     }
   }
 
-  .ant-radio-button-wrapper {
+  .@{ant-prefix}-radio-button-wrapper {
     padding: 0 28px;
   }
 
   .pro-theme-tools-form {
-    .ant-radio-button-wrapper {
+    .@{ant-prefix}-radio-button-wrapper {
       padding: 0 42px;
     }
   }

package/lib/ProThemeTools/index.d.ts

@@ -1,6 +1,6 @@
 import type { ProThemeToolsProps } from './propsType';
 declare const ProThemeTools: {
-    ({ size, className, cacheTime, color, mode, iconFollowTheme, tableBorder, tableStripe, theme, ...props }: ProThemeToolsProps): JSX.Element;
+    ({ size, className, cacheTime, color, mode, iconFollowTheme, prefixCls, tableBorder, tableStripe, theme, ...props }: ProThemeToolsProps): JSX.Element;
     defaultProps: {
         size: number;
         mode: string;

package/lib/ProThemeTools/index.js

@@ -16,7 +16,8 @@ var _react = require("react");
 var _classnames2 = _interopRequireDefault(require("classnames"));
 var _index = require("./utils/index");
 var _component = require("./component");
-var _excluded = ["size", "className", "cacheTime", "color", "mode", "iconFollowTheme", "tableBorder", "tableStripe", "theme"];
+var _locale = _interopRequireDefault(require("../locale"));
+var _excluded = ["size", "className", "cacheTime", "color", "mode", "iconFollowTheme", "prefixCls", "tableBorder", "tableStripe", "theme"];
 /* eslint-disable prefer-const */
 var defaultCacheTime = 1; // 配置保存时间为一天
 var defaultThemeConfig = {
@@ -41,6 +42,8 @@ var ProThemeTools = function ProThemeTools(_ref) {
     color = _ref.color,
     mode = _ref.mode,
     iconFollowTheme = _ref.iconFollowTheme,
+    _ref$prefixCls = _ref.prefixCls,
+    prefixCls = _ref$prefixCls === void 0 ? 'ant' : _ref$prefixCls,
     _ref$tableBorder = _ref.tableBorder,
     tableBorder = _ref$tableBorder === void 0 ? false : _ref$tableBorder,
     _ref$tableStripe = _ref.tableStripe,
@@ -93,7 +96,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
     input.select();
     if (document.execCommand('copy')) {
       document.execCommand('copy');
-      _antd.message.success('复制成功！');
+      _antd.message.success("".concat(_locale.default.ProThemeTools.copySuccess));
     }
     document.body.removeChild(input);
   };
@@ -120,6 +123,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
       setState((0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), localThemeConfig));
       (0, _index.setThemes)(cssVariables);
       _antd.ConfigProvider.config({
+        prefixCls: prefixCls,
         theme: {
           primaryColor: (_localThemeConfig = localThemeConfig) === null || _localThemeConfig === void 0 ? void 0 : _localThemeConfig.zauiBrand
         }
@@ -127,6 +131,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
     } else {
       (0, _index.setThemes)((0, _index.getMapKebabCase)(state));
       _antd.ConfigProvider.config({
+        prefixCls: prefixCls,
         theme: {
           primaryColor: state === null || state === void 0 ? void 0 : state.zauiBrand
         }
@@ -149,7 +154,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
   }, [zauiBrand]);
   // 斑马纹设置
   (0, _react.useEffect)(function () {
-    (0, _index.setTableNoStripe)(zauiStripe);
+    (0, _index.setTableNoStripe)(zauiStripe, prefixCls);
   }, [zauiStripe]);
   // 表格边框设置
   (0, _react.useEffect)(function () {
@@ -181,6 +186,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
         showDrawer();
       }
     }), (0, _jsxRuntime.jsx)(_component.PrdTools, {
+      prefixCls: prefixCls,
       onReset: onReset,
       onClose: onClose,
       onCopy: onCopy,

package/lib/ProThemeTools/propsType.d.ts

@@ -9,6 +9,8 @@ export interface DevToolsPropsType {
     tableBorder?: boolean;
     /** 是否有斑马纹 */
     tableStripe?: boolean;
+    /** 统一样式前缀, 默认ant */
+    prefixCls?: string;
 }
 export interface ProThemeToolsProps {
     size?: number;
@@ -23,6 +25,8 @@ export interface ProThemeToolsProps {
     tableBorder?: boolean;
     /** 是否有斑马纹 */
     tableStripe?: boolean;
+    /** 统一样式前缀, 默认ant */
+    prefixCls?: string;
     [key: string]: any;
 }
 export interface LocalThemeConfigPropsType {