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

package/es/ProThemeTools/component/ProTools/index.js

@@ -1,15 +1,16 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CheckOutlined, CloseOutlined } from '@ant-design/icons';
 import { Button, Drawer, Radio, Switch } from 'antd';
-import { useState, useEffect } from 'react';
-import { setThemes } from '../../utils/index';
-import { useProConfig } from '../../../ProConfigProvider';
-import locale from '../../../locale';
+import React, { useState, useEffect } from 'react';
+import { setThemes } from "../../utils/index";
+import { useProConfig } from "../../../ProConfigProvider";
+import locale from "../../../locale";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var connect = function connect(Component) {
   var ComponentWrapper = function ComponentWrapper(props) {
-    return _jsx(Component, _objectSpread({}, props));
+    return /*#__PURE__*/_jsx(Component, _objectSpread({}, props));
   };
   return ComponentWrapper;
 };
@@ -65,14 +66,14 @@ var ProTools = function ProTools(_ref) {
         payload: {
           theme: {
             primaryColor: zauiBrand,
-            qiankunPrimaryColor: config === null || config === void 0 ? void 0 : (_config$theme = config.theme) === null || _config$theme === void 0 ? void 0 : _config$theme.qiankunPrimaryColor
+            qiankunPrimaryColor: config === null || config === void 0 || (_config$theme = config.theme) === null || _config$theme === void 0 ? void 0 : _config$theme.qiankunPrimaryColor
           },
           forms: {}
         }
       });
     }
   }, []);
-  return _jsxs(NewDrawer, {
+  return /*#__PURE__*/_jsxs(NewDrawer, {
     className: "pro-theme-prd-tools-drawer",
     width: 400,
     title: "".concat(locale.ProThemeTools.title),
@@ -80,20 +81,20 @@ var ProTools = function ProTools(_ref) {
     onClose: onClose,
     open: open,
     closable: false,
-    children: [_jsx("div", {
+    children: [/*#__PURE__*/_jsx("div", {
       className: "pro-drawer-close",
       onClick: onClose,
-      children: _jsx(CloseOutlined, {
+      children: /*#__PURE__*/_jsx(CloseOutlined, {
         className: "close-icon"
       })
-    }), _jsxs("div", {
+    }), /*#__PURE__*/_jsxs("div", {
       className: "pro-theme-tools-space",
-      children: [_jsx("p", {
+      children: [/*#__PURE__*/_jsx("p", {
         children: "".concat(locale.ProThemeTools.themeColor)
-      }), _jsx("ul", {
+      }), /*#__PURE__*/_jsx("ul", {
         className: "pro-theme-color",
         children: active.map(function (item, index) {
-          return _jsx("li", {
+          return /*#__PURE__*/_jsx("li", {
             className: item.active ? 'active' : '',
             onClick: function onClick() {
               var array = active.map(function (activeItem) {
@@ -121,20 +122,20 @@ var ProTools = function ProTools(_ref) {
                 }
               });
             },
-            children: item.active ? _jsx(CheckOutlined, {}) : null
+            children: item.active ? /*#__PURE__*/_jsx(CheckOutlined, {}) : null
           }, item.color);
         })
       })]
-    }), _jsxs("div", {
+    }), /*#__PURE__*/_jsxs("div", {
       className: "pro-theme-tools-space",
-      children: [_jsx("div", {
+      children: [/*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsx("p", {
+        children: /*#__PURE__*/_jsx("p", {
           children: "".concat(locale.ProThemeTools.layout)
         })
-      }), _jsx("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsxs(Radio.Group, {
+        children: /*#__PURE__*/_jsxs(Radio.Group, {
           value: state.zauiSize,
           onChange: function onChange(e) {
             setState(_objectSpread(_objectSpread({}, state), {}, {
@@ -144,28 +145,28 @@ var ProTools = function ProTools(_ref) {
               'zaui-size': e.target.value
             });
           },
-          children: [_jsx(Radio.Button, {
+          children: [/*#__PURE__*/_jsx(Radio.Button, {
             value: 0.5,
             children: "".concat(locale.ProThemeTools.layoutMode[0])
-          }), _jsx(Radio.Button, {
+          }), /*#__PURE__*/_jsx(Radio.Button, {
             value: 1,
             children: "".concat(locale.ProThemeTools.layoutMode[1])
-          }), _jsx(Radio.Button, {
+          }), /*#__PURE__*/_jsx(Radio.Button, {
             value: 1.5,
             children: "".concat(locale.ProThemeTools.layoutMode[2])
           })]
         })
       })]
-    }), _jsxs("div", {
+    }), /*#__PURE__*/_jsxs("div", {
       className: "pro-theme-tools-space pro-theme-tools-form",
-      children: [_jsx("div", {
+      children: [/*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsx("p", {
+        children: /*#__PURE__*/_jsx("p", {
           children: "".concat(locale.ProThemeTools.formLabel)
         })
-      }), _jsx("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsxs(Radio.Group, {
+        children: /*#__PURE__*/_jsxs(Radio.Group, {
           value: state.zauiFormAlign,
           onChange: function onChange(e) {
             setState(_objectSpread(_objectSpread({}, state), {}, {
@@ -184,25 +185,25 @@ var ProTools = function ProTools(_ref) {
               }
             });
           },
-          children: [_jsx(Radio.Button, {
+          children: [/*#__PURE__*/_jsx(Radio.Button, {
             value: "left",
             children: "".concat(locale.ProThemeTools.flex[0])
-          }), _jsx(Radio.Button, {
+          }), /*#__PURE__*/_jsx(Radio.Button, {
             value: "right",
             children: "".concat(locale.ProThemeTools.flex[1])
           })]
         })
       })]
-    }), tableBorder && _jsxs("div", {
+    }), tableBorder && /*#__PURE__*/_jsxs("div", {
       className: "pro-theme-tools-box pro-theme-tools-space pro-theme-tools-small-space",
-      children: [_jsx("div", {
+      children: [/*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsx("p", {
+        children: /*#__PURE__*/_jsx("p", {
           children: "".concat(locale.ProThemeTools.tableBorder)
         })
-      }), _jsx("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsx(Switch, {
+        children: /*#__PURE__*/_jsx(Switch, {
           checkedChildren: "".concat(locale.ProThemeTools.switchText[0]),
           unCheckedChildren: "".concat(locale.ProThemeTools.switchText[1]),
           checked: state.zauiTableBorder,
@@ -216,16 +217,16 @@ var ProTools = function ProTools(_ref) {
           }
         })
       })]
-    }), tableStripe && _jsxs("div", {
+    }), tableStripe && /*#__PURE__*/_jsxs("div", {
       className: "pro-theme-tools-box pro-theme-tools-space pro-theme-tools-small-space",
-      children: [_jsx("div", {
+      children: [/*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsx("p", {
+        children: /*#__PURE__*/_jsx("p", {
           children: "".concat(locale.ProThemeTools.tableStripe)
         })
-      }), _jsx("div", {
+      }), /*#__PURE__*/_jsx("div", {
         className: "pro-theme-tools-item",
-        children: _jsx(Switch, {
+        children: /*#__PURE__*/_jsx(Switch, {
           checkedChildren: "".concat(locale.ProThemeTools.switchText[0]),
           unCheckedChildren: "".concat(locale.ProThemeTools.switchText[1]),
           checked: state.zauiStripe,
@@ -240,7 +241,7 @@ var ProTools = function ProTools(_ref) {
           }
         })
       })]
-    }), _jsx(Button, {
+    }), /*#__PURE__*/_jsx(Button, {
       className: "copy-btn",
       onClick: function onClick() {
         setActive([{

package/es/ProThemeTools/component/index.js

@@ -1 +1 @@
-export { default as ProTools } from './ProTools';
+export { default as ProTools } from "./ProTools";

package/es/ProThemeTools/context/ThemeContext.js

@@ -1,7 +1,15 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import React, { createContext, useContext, useReducer, useCallback } from 'react';
+
+// antd5 主题配置接口
+
+// 主题状态接口
+
+// Action 类型
+
+// Context 接口
 import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useReducer, useCallback } from 'react';
 // 默认主题配置
 var defaultThemeConfig = {
   zauiBrand: '#006AFF',
@@ -18,6 +26,7 @@ var defaultThemeConfig = {
   zauiTableBorder: false,
   zauiStripe: true
 };
+
 // 初始状态
 var initialState = {
   localConfig: defaultThemeConfig,
@@ -28,6 +37,7 @@ var initialState = {
   },
   cssVariables: {}
 };
+
 // Reducer 函数
 function themeReducer(state, action) {
   switch (action.type) {
@@ -58,8 +68,12 @@ function themeReducer(state, action) {
       return state;
   }
 }
+
 // 创建 Context
 var ThemeContext = /*#__PURE__*/createContext(undefined);
+
+// Provider 组件
+
 export var ThemeProvider = function ThemeProvider(_ref) {
   var children = _ref.children;
   var _useReducer = useReducer(themeReducer, initialState),
@@ -103,11 +117,12 @@ export var ThemeProvider = function ThemeProvider(_ref) {
     resetTheme: resetTheme,
     loadFromCache: loadFromCache
   };
-  return _jsx(ThemeContext.Provider, {
+  return /*#__PURE__*/_jsx(ThemeContext.Provider, {
     value: contextValue,
     children: children
   });
 };
+
 // Hook for using theme context
 export var useTheme = function useTheme() {
   var context = useContext(ThemeContext);
@@ -116,5 +131,6 @@ export var useTheme = function useTheme() {
   }
   return context;
 };
+
 // 导出默认配置
 export { defaultThemeConfig };

package/es/ProThemeTools/index.js

@@ -2,31 +2,40 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _isEqual from "lodash/isEqual";
 var _excluded = ["size", "className", "cacheTime", "color", "mode", "iconFollowTheme", "prefixCls", "tableBorder", "tableStripe", "theme", "onChange"];
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable prefer-const */
 import { message } from 'antd';
 import { useEffect, useState } from 'react';
 import { usePrevious, useUpdateEffect, useToggle } from 'ahooks';
 import { ReactSVG } from 'react-svg';
+import { isEqual } from 'lodash';
 import classnames from 'classnames';
-import { getKebabCase, setThemes, setTableBorder, getMapKebabCase, getMapHumpCase, getAntd5ThemeConfig } from './utils/index';
-import settingSvg from '../assets/setting.svg';
-import { ProTools } from './component';
-import locale from '../locale';
-import { useTheme } from './context/ThemeContext';
+import { getKebabCase, setThemes, setTableBorder, getMapKebabCase, getMapHumpCase, getAntd5ThemeConfig } from "./utils/index";
+import settingSvg from "../assets/setting.svg";
+import { ProTools } from "./component";
+import locale from "../locale";
+import { useTheme } from "./context/ThemeContext";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var defaultCacheTime = 1; // 配置保存时间为一天
+
 var defaultThemeConfig = {
   zauiBrand: '#006AFF',
+  // 主题颜色
   zauiText: '#343434',
   zauiFontSize: '14px',
   zauiFormAlign: 'left',
+  // 表单左对齐
   zauiFormRequiredBefore: 'none',
+  // 前面*display
   zauiFormRequiredAfter: 'inline',
+  // 后面*display
   zauiSize: 1,
+  // 间距倍数
   zauiSpaceSizeLg: '32px',
+  // 卡片行间距
   zauiSpaceSizeMd: '16px',
+  // 控件行间距
   zauiBigText: false,
   zauiBaseFontSize: '0px',
   zauiTableBorder: false,
@@ -65,17 +74,21 @@ var ProThemeTools = function ProThemeTools(_ref) {
   var zauiBrand = state.zauiBrand,
     zauiStripe = state.zauiStripe,
     zauiTableBorder = state.zauiTableBorder;
+
   // 重置
   var onReset = function onReset() {
     var resetConfig = _objectSpread(_objectSpread({}, state), defaultThemeConfig);
     setState(resetConfig);
+
     // 更新 Context
     updateLocalConfig(resetConfig);
+
     // 更新 antd 主题
     var antdConfig = getAntd5ThemeConfig({
       'zaui-brand': '#006AFF'
     });
     updateAntdConfig(antdConfig);
+
     // 设置 CSS 变量
     var cssVars = {
       'zaui-brand': '#006AFF',
@@ -94,6 +107,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
     setThemes(cssVars);
     updateCssVariables(cssVars);
   };
+
   // 复制
   var onCopy = function onCopy() {
     var data = JSON.stringify(getMapKebabCase(state, '@'));
@@ -107,6 +121,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
     }
     document.body.removeChild(input);
   };
+
   // 首次从缓存中读取主题配置
   useEffect(function () {
     var themeConfig = localStorage.getItem('themeConfig');
@@ -124,9 +139,11 @@ var ProThemeTools = function ProThemeTools(_ref) {
       }));
       setState(_objectSpread(_objectSpread({}, state), localThemeConfig));
       setThemes(cssVariables);
+
       // 更新 Context
       updateLocalConfig(localThemeConfig);
       updateCssVariables(cssVariables);
+
       // 更新 antd 主题
       var antdConfig = getAntd5ThemeConfig({
         'zaui-brand': (_localThemeConfig = localThemeConfig) === null || _localThemeConfig === void 0 ? void 0 : _localThemeConfig.zauiBrand
@@ -136,6 +153,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
       var cssVars = getMapKebabCase(state);
       setThemes(cssVars);
       updateCssVariables(cssVars);
+
       // 更新 antd 主题
       var _antdConfig = getAntd5ThemeConfig({
         'zaui-brand': state === null || state === void 0 ? void 0 : state.zauiBrand
@@ -143,6 +161,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
       updateAntdConfig(_antdConfig);
     }
   }, []);
+
   // 主题色动态切换
   useEffect(function () {
     if (visible && zauiBrand) {
@@ -153,6 +172,7 @@ var ProThemeTools = function ProThemeTools(_ref) {
       updateAntdConfig(antdConfig);
     }
   }, [zauiBrand, visible]);
+
   // 斑马纹设置
   useEffect(function () {
     var cssVar = {
@@ -161,10 +181,12 @@ var ProThemeTools = function ProThemeTools(_ref) {
     setThemes(cssVar);
     updateCssVariables(cssVar);
   }, [zauiStripe]);
+
   // 表格边框设置
   useEffect(function () {
     setTableBorder(zauiTableBorder);
   }, [zauiTableBorder]);
+
   // 主题配置缓存
   useEffect(function () {
     if (cacheTime) {
@@ -175,36 +197,39 @@ var ProThemeTools = function ProThemeTools(_ref) {
       localStorage.setItem('themeConfig', JSON.stringify(newThemeConfig));
     }
   }, [state, cacheTime]);
+
   // 状态变化时同步到 Context
   useUpdateEffect(function () {
-    if (!_isEqual(state, previousState) && visible) {
+    if (!isEqual(state, previousState) && visible) {
       // 更新本地配置
       updateLocalConfig(state);
+
       // 更新 CSS 变量
       var cssVars = getMapKebabCase(state);
       setThemes(cssVars);
       updateCssVariables(cssVars);
+
       // 更新 antd 主题
       var antdConfig = getAntd5ThemeConfig({
         'zaui-brand': state.zauiBrand
       });
       updateAntdConfig(antdConfig);
-      onChange === null || onChange === void 0 ? void 0 : onChange(state);
+      onChange === null || onChange === void 0 || onChange(state);
     }
   }, [state]);
   var cls = classnames(_defineProperty({
     'pro-theme-tools': true,
     'pro-theme-tools-follow': iconFollowTheme
   }, className, className));
-  return _jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
-    children: [_jsx("div", {
+  return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
+    children: [/*#__PURE__*/_jsx("div", {
       className: cls,
       onClick: toggle,
-      children: _jsx(ReactSVG, {
+      children: /*#__PURE__*/_jsx(ReactSVG, {
         className: "setting-icon",
         src: settingSvg
       })
-    }), _jsx(ProTools, {
+    }), /*#__PURE__*/_jsx(ProTools, {
       prefixCls: prefixCls,
       onReset: onReset,
       onClose: toggle,
@@ -226,5 +251,6 @@ ProThemeTools.defaultProps = {
 };
 ProThemeTools.setThemes = setThemes;
 export default ProThemeTools;
+
 // 导出主题相关组件和类型
-export { ThemeProvider, useTheme } from './context/ThemeContext';
+export { ThemeProvider, useTheme } from "./context/ThemeContext";

package/es/ProThemeTools/utils/index.js

@@ -4,6 +4,7 @@ var antd5ConfigMapping = {
   'zaui-brand': 'colorPrimary'
   // 可以根据需要添加更多映射
 };
+
 /**
  * 将 kebab-case 的主题配置转换为 antd5 的 token 格式
  * @param themes kebab-case 格式的主题配置
@@ -23,6 +24,7 @@ export var convertToAntd5Tokens = function convertToAntd5Tokens(themes, themeMap
     token: tokens
   };
 };
+
 /**
  * 设置主题变量 - antd5 兼容版本
  * 只设置 CSS 变量，不再使用 ConfigProvider.config
@@ -31,6 +33,7 @@ export var setThemes = function setThemes(themes) {
   if (!Object.keys(themes).length) {
     return false;
   }
+
   // 只设置 CSS 变量，主题配置通过 Context 管理
   var list = Object.entries(themes);
   list.forEach(function (item) {
@@ -38,6 +41,7 @@ export var setThemes = function setThemes(themes) {
   });
   return true;
 };
+
 /**
  * 获取 antd5 主题配置
  * @param themes kebab-case 格式的主题配置
@@ -45,6 +49,7 @@ export var setThemes = function setThemes(themes) {
 export var getAntd5ThemeConfig = function getAntd5ThemeConfig(themes) {
   return convertToAntd5Tokens(themes);
 };
+
 /** JS实现驼峰命名与横线命名的转换  */
 export var getKebabCase = function getKebabCase(str) {
   var temp = str.replace(/[A-Z]/g, function (i) {
@@ -55,6 +60,7 @@ export var getKebabCase = function getKebabCase(str) {
   }
   return temp;
 };
+
 /** JS实现对象驼峰命名与横线命名的转换  */
 export var getMapKebabCase = function getMapKebabCase(obj) {
   var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
@@ -62,6 +68,7 @@ export var getMapKebabCase = function getMapKebabCase(obj) {
     return ["".concat(prefix).concat(getKebabCase(item === null || item === void 0 ? void 0 : item[0])), item === null || item === void 0 ? void 0 : item[1]];
   }));
 };
+
 /** JS实现对象横线命名与驼峰命名的转换  */
 export var getMapHumpCase = function getMapHumpCase() {
   var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -73,6 +80,7 @@ export var getMapHumpCase = function getMapHumpCase() {
     return acc;
   }, {});
 };
+
 /**
  * 设置表格斑马纹
  * @param stripe boolean
@@ -101,6 +109,7 @@ export var setTableNoStripe = function setTableNoStripe(stripe) {
     }
   }
 };
+
 /**
  * 设置表格边框
  * @param border boolean