@zat-design/sisyphus-react 3.4.5 → 3.4.6-beta.1

package/lib/ProForm/style/index.less

@@ -4,7 +4,7 @@
 @import '../components/base/TextArea/index.less';
 @import '../components/combination/FormList/style/index.less';
 @import '../components/combination/ProTimeLimit/style/index.less';
-@import '../components/combination/ProAddressBar/style/index.less';
+@import '../components/combination/ProCascader/style/index.less';
 @import '../components/combination/ProNumberRange/style/index.less';
 @import '../components/combination/ProModalSelect/style/index.less';
 @import '../components/combination/Group/style/index.less';
@@ -338,6 +338,7 @@
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
+    width: 100%;
   }
 
   .full-form-item {

package/lib/ProForm/utils/index.js

@@ -59,7 +59,7 @@ var useControlled = exports.useControlled = function useControlled(props) {
 var isSelect = exports.isSelect = function isSelect(props) {
   var dataSource = props.dataSource,
     type = props.type;
-  return (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) || ['Select', 'ProSelect', 'ProEnum', 'DatePicker', 'RangePicker', 'ProAddressBar', 'ProTimeLimit', 'ProModalSelect', 'ProTreeModal', 'ProUpload', 'TimePicker'].includes(type);
+  return (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) || ['Select', 'ProSelect', 'ProEnum', 'DatePicker', 'RangePicker', 'ProCascader', 'ProTimeLimit', 'ProModalSelect', 'ProTreeModal', 'ProUpload', 'TimePicker'].includes(type);
 };
 /**
  * Input TextArea 移除前后空格
@@ -143,6 +143,9 @@ var filterInternalFields = exports.filterInternalFields = function filterInterna
   if ((values === null || values === void 0 ? void 0 : values._immutable) || _moment.default.isMoment(values)) {
     return nextValues;
   }
+  if (values instanceof File) {
+    return nextValues;
+  }
   if (Array.isArray(nextValues)) {
     return nextValues.map(function (item) {
       return filterInternalFields(item);

package/lib/ProForm/utils/useChanged.js

@@ -18,9 +18,8 @@ var useChanged = exports.useChanged = function useChanged(_ref) {
     return (0, _lodash.get)(originalValues, name);
   }) : (0, _lodash.get)(originalValues, name);
   var notWatch = !equalWith && (!originalValues || originalValue === undefined);
-  if (notWatch) form = [];
-  var value = _antd.Form.useWatch(namesStr || name, form);
   if (notWatch) return [false];
+  var value = _antd.Form.useWatch(namesStr || name, form);
   var changed = (0, _diffOriginal.diffOriginal)({
     originalValue: originalValue,
     value: value,

package/lib/ProForm/utils/useForm.js

@@ -32,30 +32,42 @@ var useForm = exports.useForm = function useForm(originForm) {
         _key,
         values,
         _values,
+        _error$errorFields,
+        _error$errorFields$,
         _args = arguments;
       return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
+            _context.prev = 0;
             for (_len = _args.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
               rest[_key - 1] = _args[_key];
             }
-            _context.next = 3;
+            _context.next = 4;
             return validateFields.apply(void 0, [nameList].concat(rest));
-          case 3:
+          case 4:
             values = _context.sent;
             if (!nameList) {
-              _context.next = 6;
+              _context.next = 7;
               break;
             }
             return _context.abrupt("return", values);
-          case 6:
+          case 7:
             _values = _getFieldsValue();
             return _context.abrupt("return", _values);
-          case 8:
+          case 11:
+            _context.prev = 11;
+            _context.t0 = _context["catch"](0);
+            if (_context.t0 && (_context.t0 === null || _context.t0 === void 0 ? void 0 : _context.t0.errorFields)) {
+              form === null || form === void 0 ? void 0 : form.scrollToField(_context.t0 === null || _context.t0 === void 0 ? void 0 : (_error$errorFields = _context.t0.errorFields) === null || _error$errorFields === void 0 ? void 0 : (_error$errorFields$ = _error$errorFields[0]) === null || _error$errorFields$ === void 0 ? void 0 : _error$errorFields$.name, {
+                block: 'center',
+                behavior: 'smooth'
+              });
+            }
+          case 14:
           case "end":
             return _context.stop();
         }
-      }, _callee);
+      }, _callee, null, [[0, 11]]);
     }));
     return function _validateFields(_x) {
       return _ref.apply(this, arguments);

package/lib/ProForm/utils/useListChanged.js

@@ -85,10 +85,8 @@ var useListChanged = exports.useListChanged = function useListChanged(params) {
   }) : undefined;
   var noChange = !equalWith && (!originalValues || originalValue === undefined);
   var _form = form;
-  // @ts-ignore
-  if (notWatch) _form = [];
-  var value = _antd.Form.useWatch(namePath, _form);
   if (notWatch || noChange) return [false];
+  var value = _antd.Form.useWatch(namePath, _form);
   var changed = (0, _diffOriginal.diffOriginal)({
     value: value,
     originalValue: originalValue,

package/lib/ProIcon/config/index.d.ts

@@ -8,10 +8,12 @@ export declare const themeMap: {
     '#00BC70': string[];
     '#FF8C16': string[];
     '#A00F20': string[];
+    '#31AF96': string[];
 };
 export declare const themeFillMap: {
     '#006AFF': string[];
     '#00BC70': string[];
     '#FF8C16': string[];
     '#A00F20': string[];
+    '#31AF96': string[];
 };

package/lib/ProIcon/config/index.js

@@ -266,12 +266,14 @@ var themeMap = exports.themeMap = {
   '#006AFF': ['#ADDDFF', '#5FB3D8', '#4181FF'],
   '#00BC70': ['#FFFFFF', '#54DFA7', '#00BC70'],
   '#FF8C16': ['#FFFFFF', '#FFA74E', '#FF8C17'],
-  '#A00F20': ['#FFFFFF', '#E47B7B', '#A00E20']
+  '#A00F20': ['#FFFFFF', '#E47B7B', '#A00E20'],
+  '#31AF96': ['#5FD8C7', '#5FD8C7', '#31AF96']
 };
 // 双色icon预设
 var themeFillMap = exports.themeFillMap = {
   '#006AFF': ['none', '#87F1FC', 'black', '#4181FF'],
   '#00BC70': ['none', '#05FFEC', 'black', '#00BC70'],
   '#FF8C16': ['none', '#FED736', 'black', '#FF8C17'],
-  '#A00F20': ['none', '#FD8357', 'black', '#A00E20']
+  '#A00F20': ['none', '#FD8357', 'black', '#A00E20'],
+  '#31AF96': ['none', '#BBF392', 'black', '#31AF96']
 };

package/lib/ProIcon/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -13,14 +14,17 @@ var _antd = require("antd");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _lodash = require("lodash");
 var _reactSvg = require("react-svg");
+var _react = require("react");
 var _ProConfigProvider = require("../ProConfigProvider");
 var _config2 = require("./config");
 var _utils = require("./utils");
 var _locale = _interopRequireDefault(require("../locale"));
-var _excluded = ["type", "onClick", "size", "color", "className", "style", "spin", "rotate", "theme", "disabled", "mode", "buttonProps", "children", "mapList", "src", "actionMap"];
+var _excluded = ["type", "onClick", "size", "color", "className", "style", "spin", "rotate", "theme", "disabled", "mode", "buttonProps", "children", "mapList", "src", "actionMap", "tooltip"];
 var ProIcon = function ProIcon(props) {
+  var _window, _window2;
   var _useProConfig = (0, _ProConfigProvider.useProConfig)(),
-    state = _useProConfig.state;
+    state = _useProConfig.state,
+    dispatch = _useProConfig.dispatch;
   var config = state.ProIcon,
     antdTheme = state.theme;
   var _config = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, config), props !== null && props !== void 0 ? props : {});
@@ -48,11 +52,28 @@ var ProIcon = function ProIcon(props) {
     mapList = _config$mapList === void 0 ? [] : _config$mapList,
     src = _config.src,
     actionMap = _config.actionMap,
+    tooltip = _config.tooltip,
     reset = (0, _objectWithoutProperties2.default)(_config, _excluded);
-  // 主题色
+  var _useSetState = (0, _ahooks.useSetState)({
+      IconInstance: (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {})
+    }),
+    _useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
+    IconInstance = _useSetState2[0].IconInstance,
+    setState = _useSetState2[1];
+  // 主题色 primaryColor 用于单应用或处于组件库文档内 qiankunPrimaryColor用于主子应用
   var _ref = antdTheme !== null && antdTheme !== void 0 ? antdTheme : {},
     _ref$primaryColor = _ref.primaryColor,
-    primaryColor = _ref$primaryColor === void 0 ? '#006AFF' : _ref$primaryColor;
+    primaryColor = _ref$primaryColor === void 0 ? '#006AFF' : _ref$primaryColor,
+    _ref$qiankunPrimaryCo = _ref.qiankunPrimaryColor,
+    qiankunPrimaryColor = _ref$qiankunPrimaryCo === void 0 ? '#006AFF' : _ref$qiankunPrimaryCo;
+  // 本地存储初始化主题
+  var _useLocalStorageState = (0, _ahooks.useLocalStorageState)('themeConfig'),
+    _useLocalStorageState2 = (0, _slicedToArray2.default)(_useLocalStorageState, 1),
+    themeConfig = _useLocalStorageState2[0];
+  // 文档内部就不用判断window.top !== window.self了
+  var isQiankun =
+  // @ts-ignore
+  ((_window = window) === null || _window === void 0 ? void 0 : _window.__POWERED_BY_QIANKUN__) || ((_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.isMicroApp);
   // 语言
   var language = _locale.default.ProIcon.language;
   // 加载内部icon
@@ -68,6 +89,8 @@ var ProIcon = function ProIcon(props) {
     'pro-icon-btn': disabled
   });
   var _mode = mode || 'icon';
+  // 观察者实例
+  var observer;
   // 特殊情况，如果指定了type，并且没有接收到组件内的mode，那模式就是icon
   if (type && !props.mode) {
     _mode = 'icon';
@@ -79,7 +102,7 @@ var ProIcon = function ProIcon(props) {
   var _type = type;
   var _text = children;
   // svg图标对应文本
-  var iconText = '';
+  var iconText = tooltip || '';
   var typeIsExistAndIncludeEnglish = _type && /[a-zA-Z]/.test(_type);
   // 模式为icon下，对传入的text进行指定语言-icon 映射
   if (isIconMode && !type) {
@@ -120,82 +143,126 @@ var ProIcon = function ProIcon(props) {
   }, reset), {}, {
     children: (0, _jsxRuntime.jsx)(_antd.Tooltip, {
       title: iconText,
-      children: !src ? (0, _jsxRuntime.jsx)("svg", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, svgProps), {}, {
-        onClick: onClick,
-        "aria-hidden": "true",
-        children: (0, _jsxRuntime.jsx)("use", {
-          xlinkHref: "#icon-".concat(_type)
-        })
-      })) : (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, svgProps), {}, {
-        // @ts-ignore
-        onClick: onClick,
-        "aria-hidden": "true",
-        src: src,
-        beforeInjection: function beforeInjection(svg) {
-          if (actionMap && svg) {
-            var _actionMap$themeMap, _actionMap$themeFillM, _actionMap$gradation, _actionMap$fill;
-            // 项目内置的四种主题匹配渐变色
-            var mergeThemeMap = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _config2.themeMap), (_actionMap$themeMap = actionMap.themeMap) !== null && _actionMap$themeMap !== void 0 ? _actionMap$themeMap : {});
-            // 项目内置的四种双色匹配fill
-            var mergeFillThemeMap = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _config2.themeFillMap), (_actionMap$themeFillM = actionMap.themeFillMap) !== null && _actionMap$themeFillM !== void 0 ? _actionMap$themeFillM : {});
-            var _gradList = mergeThemeMap[primaryColor];
-            var _fillList = mergeFillThemeMap[primaryColor];
-            // 渐变操作序列
-            var gradList = (_actionMap$gradation = actionMap === null || actionMap === void 0 ? void 0 : actionMap.gradation) !== null && _actionMap$gradation !== void 0 ? _actionMap$gradation : _gradList;
-            // 填充操作序列
-            var fillList = (_actionMap$fill = actionMap === null || actionMap === void 0 ? void 0 : actionMap.fill) !== null && _actionMap$fill !== void 0 ? _actionMap$fill : _fillList;
-            // 节点收集
-            var nodeMap = {
-              // 渐变色节点收集
-              gradation: [],
-              // 具有fill属性的节点收集
-              fill: []
-            };
-            // 目前只支持处理渐变及fill填充
-            var types = Reflect.ownKeys(nodeMap !== null && nodeMap !== void 0 ? nodeMap : {});
-            types.forEach(function (typeKey) {
-              (0, _utils.recurseGetNodes)(typeKey, svg, nodeMap[typeKey]);
+      children: (0, _jsxRuntime.jsx)(_antd.Button, (0, _objectSpread2.default)({
+        style: {
+          width: size,
+          height: size,
+          border: 'none',
+          borderRadius: 0,
+          padding: 0,
+          verticalAlign: 'baseline'
+        },
+        type: "text",
+        icon: !src ? (0, _jsxRuntime.jsx)("svg", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, svgProps), {}, {
+          onClick: onClick,
+          "aria-hidden": "true",
+          children: (0, _jsxRuntime.jsx)("use", {
+            xlinkHref: "#icon-".concat(_type)
+          })
+        })) : (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, svgProps), {}, {
+          // @ts-ignore
+          onClick: onClick,
+          "aria-hidden": "true",
+          src: src,
+          beforeInjection: function beforeInjection(svg) {
+            (0, _utils.onBeforeInjection)({
+              svg: svg,
+              actionMap: actionMap,
+              primaryColor: isQiankun ? qiankunPrimaryColor : primaryColor
             });
-            if ((gradList === null || gradList === void 0 ? void 0 : gradList.length) > 0) {
-              nodeMap.gradation.forEach(function (item, index) {
-                // 下一步准备替换的
-                var nextStr = gradList[index];
-                // 属性原本的值
-                var originStr = item.getAttribute('stop-color');
-                if (nextStr && originStr !== nextStr) {
-                  item.setAttribute('stop-color', nextStr);
-                }
-              });
-            }
-            if ((fillList === null || fillList === void 0 ? void 0 : fillList.length) > 0) {
-              nodeMap.fill.forEach(function (item, index) {
-                // 默认接收的
-                var receiveStr = fillList[index];
-                // 下一步准备替换的
-                var nextFillStr = receiveStr === 'theme' ? primaryColor : receiveStr;
-                // 属性原本的值
-                var originFill = item.getAttribute('fill');
-                // 如果包含url(则是内链，不作替换处理
-                if (!(originFill && originFill.includes('url(')) && nextFillStr) {
-                  // 不同才替换
-                  if (originFill !== nextFillStr) {
-                    item.setAttribute('fill', nextFillStr);
+          }
+        }))
+      }, buttonProps))
+    })
+  }));
+  (0, _react.useEffect)(function () {
+    // 处于主子应用情况下才会执行下方逻辑，主题色的变更以主框架的为准
+    if (actionMap && isQiankun) {
+      var _themeConfig$data;
+      observer = new MutationObserver(function (mutationsList) {
+        var targetEntries = mutationsList[0];
+        if (targetEntries) {
+          if (targetEntries && targetEntries.target) {
+            var _Object$values, _Object$values$find, _Object$values$find$v3, _targetEntries$target, _targetEntries$target2;
+            var _Object$values$find$v = // @ts-ignore
+              (_Object$values = Object.values((_targetEntries$target = targetEntries === null || targetEntries === void 0 ? void 0 : (_targetEntries$target2 = targetEntries.target) === null || _targetEntries$target2 === void 0 ? void 0 : _targetEntries$target2.attributes) !== null && _targetEntries$target !== void 0 ? _targetEntries$target : {})) === null || _Object$values === void 0 ? void 0 : (_Object$values$find = _Object$values.find(function (item) {
+                return item.nodeName === 'style';
+              })
+              // @ts-ignore
+              ) === null || _Object$values$find === void 0 ? void 0 : (_Object$values$find$v3 = _Object$values$find.value) === null || _Object$values$find$v3 === void 0 ? void 0 : _Object$values$find$v3.match(/--zaui-brand:(.*?);/),
+              _Object$values$find$v2 = (0, _slicedToArray2.default)(_Object$values$find$v, 2),
+              label = _Object$values$find$v2[0],
+              value = _Object$values$find$v2[1];
+            if (label && value) {
+              if (qiankunPrimaryColor !== value) {
+                dispatch({
+                  type: 'set',
+                  payload: {
+                    theme: {
+                      primaryColor: primaryColor,
+                      qiankunPrimaryColor: value === null || value === void 0 ? void 0 : value.trim()
+                    }
                   }
-                }
-              });
+                });
+              }
             }
           }
         }
-      }))
-    })
-  }));
-  return !isExtendButtonMode ? RenderIcon : (0, _jsxRuntime.jsx)(_antd.Button, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({
-    type: isIconMode ? 'text' : (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.type) || 'link',
-    className: proIconClassNames,
-    disabled: disabled,
-    icon: isIconMode ? RenderIcon : null
-  }, reset), buttonProps), {}, {
-    children: _text
-  }));
+      });
+      var zaAccessibilityTarget = document.documentElement;
+      if (window.parent === window) {
+        // 在最顶层的window环境中，可以直接使用document
+        zaAccessibilityTarget = document.documentElement;
+      } else {
+        // 向上遍历直到找到主应用的window
+        var currentWindow = window;
+        while (currentWindow.parent !== currentWindow) {
+          // @ts-ignore
+          currentWindow = currentWindow.parent;
+        }
+        zaAccessibilityTarget = currentWindow.document.documentElement;
+      }
+      observer.observe(zaAccessibilityTarget, {
+        attributes: true,
+        attributeFilter: ['style']
+      });
+      // 未变更时及初始化时
+      var extendFromMainColor = themeConfig === null || themeConfig === void 0 ? void 0 : (_themeConfig$data = themeConfig.data) === null || _themeConfig$data === void 0 ? void 0 : _themeConfig$data.zauiBrand;
+      if (extendFromMainColor && qiankunPrimaryColor !== extendFromMainColor) {
+        dispatch({
+          type: 'set',
+          payload: {
+            theme: {
+              primaryColor: primaryColor,
+              qiankunPrimaryColor: extendFromMainColor
+            }
+          }
+        });
+      }
+    }
+  }, []);
+  (0, _react.useEffect)(function () {
+    return function () {
+      if (observer) {
+        observer.disconnect();
+      }
+    };
+  }, []);
+  (0, _ahooks.useDeepCompareLayoutEffect)(function () {
+    setState({
+      IconInstance: RenderIcon
+    });
+  }, [_config, primaryColor, qiankunPrimaryColor, language, svgProps]);
+  return !isExtendButtonMode ? IconInstance : (0, _jsxRuntime.jsx)(_antd.Tooltip, {
+    title: tooltip,
+    children: (0, _jsxRuntime.jsx)(_antd.Button, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({
+      type: isIconMode ? 'text' : (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.type) || 'link',
+      className: proIconClassNames,
+      disabled: disabled,
+      icon: isIconMode ? RenderIcon : null
+    }, reset), buttonProps), {}, {
+      children: _text
+    }))
+  });
 };
 var _default = exports.default = ProIcon;

package/lib/ProIcon/propsTypes.d.ts

@@ -54,6 +54,11 @@ export interface ProIconProps {
      * @default           false
      */
     disabled?: boolean;
+    /**
+     * @description      提示
+     * @default           -
+     */
+    tooltip?: string | React.ReactNode;
     /**
      * @description      是否跟随主题色
      * @default           false
@@ -80,7 +85,7 @@ export interface ProIconProps {
      */
     mode?: ModeType;
     /**
-     * @description        mode button时 props
+     * @description        mode button时 props 与antd Button接收props一致
      * @default           'link'
      */
     buttonProps?: ButtonProps;

package/lib/ProIcon/utils/index.d.ts

@@ -1 +1,6 @@
 export declare const recurseGetNodes: (type: any, node: any, queue: any) => void;
+export declare const onBeforeInjection: ({ svg, actionMap, primaryColor }: {
+    svg: any;
+    actionMap: any;
+    primaryColor: any;
+}) => void;

package/lib/ProIcon/utils/index.js

@@ -1,9 +1,12 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.recurseGetNodes = void 0;
+exports.recurseGetNodes = exports.onBeforeInjection = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _config = require("../config");
 var recurseGetNodes = exports.recurseGetNodes = function recurseGetNodes(type, node, queue) {
   switch (type) {
     // 渐变
@@ -26,4 +29,62 @@ var recurseGetNodes = exports.recurseGetNodes = function recurseGetNodes(type, n
       recurseGetNodes(type, node.childNodes[i], queue);
     }
   }
+};
+var onBeforeInjection = exports.onBeforeInjection = function onBeforeInjection(_ref) {
+  var svg = _ref.svg,
+    actionMap = _ref.actionMap,
+    primaryColor = _ref.primaryColor;
+  if (actionMap && svg) {
+    var _actionMap$themeMap, _actionMap$themeFillM, _actionMap$gradation, _actionMap$fill;
+    // 项目内置的四种主题匹配渐变色
+    var mergeThemeMap = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _config.themeMap), (_actionMap$themeMap = actionMap.themeMap) !== null && _actionMap$themeMap !== void 0 ? _actionMap$themeMap : {});
+    // 项目内置的四种双色匹配fill
+    var mergeFillThemeMap = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _config.themeFillMap), (_actionMap$themeFillM = actionMap.themeFillMap) !== null && _actionMap$themeFillM !== void 0 ? _actionMap$themeFillM : {});
+    var _gradList = mergeThemeMap[primaryColor];
+    var _fillList = mergeFillThemeMap[primaryColor];
+    // 渐变操作序列
+    var gradList = (_actionMap$gradation = actionMap === null || actionMap === void 0 ? void 0 : actionMap.gradation) !== null && _actionMap$gradation !== void 0 ? _actionMap$gradation : _gradList;
+    // 填充操作序列
+    var fillList = (_actionMap$fill = actionMap === null || actionMap === void 0 ? void 0 : actionMap.fill) !== null && _actionMap$fill !== void 0 ? _actionMap$fill : _fillList;
+    // 节点收集
+    var nodeMap = {
+      // 渐变色节点收集
+      gradation: [],
+      // 具有fill属性的节点收集
+      fill: []
+    };
+    // 目前只支持处理渐变及fill填充
+    var types = Reflect.ownKeys(nodeMap !== null && nodeMap !== void 0 ? nodeMap : {});
+    types.forEach(function (typeKey) {
+      recurseGetNodes(typeKey, svg, nodeMap[typeKey]);
+    });
+    if ((gradList === null || gradList === void 0 ? void 0 : gradList.length) > 0) {
+      nodeMap.gradation.forEach(function (item, index) {
+        // 下一步准备替换的
+        var nextStr = gradList[index];
+        // 属性原本的值
+        var originStr = item.getAttribute('stop-color');
+        if (nextStr && originStr !== nextStr) {
+          item.setAttribute('stop-color', nextStr);
+        }
+      });
+    }
+    if ((fillList === null || fillList === void 0 ? void 0 : fillList.length) > 0) {
+      nodeMap.fill.forEach(function (item, index) {
+        // 默认接收的
+        var receiveStr = fillList[index];
+        // 下一步准备替换的
+        var nextFillStr = receiveStr === 'theme' ? primaryColor : receiveStr;
+        // 属性原本的值
+        var originFill = item.getAttribute('fill');
+        // 如果包含url(则是内链，不作替换处理
+        if (!(originFill && originFill.includes('url(')) && nextFillStr) {
+          // 不同才替换
+          if (originFill !== nextFillStr) {
+            item.setAttribute('fill', nextFillStr);
+          }
+        }
+      });
+    }
+  }
 };

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

@@ -12,9 +12,9 @@ var _react = require("react");
 var _antd = require("antd");
 var _icons = require("@ant-design/icons");
 var _classnames = _interopRequireDefault(require("classnames"));
-var _reactSvg = require("react-svg");
 var _lodash = require("lodash");
 var _fold = _interopRequireDefault(require("../../../assets/fold.svg"));
+var _index = _interopRequireDefault(require("../../../ProIcon/index"));
 var Panel = _antd.Collapse.Panel;
 var ProCollapse = function ProCollapse(props) {
   var title = props.title,
@@ -79,8 +79,11 @@ var ProCollapse = function ProCollapse(props) {
         align: "center",
         children: [(0, _jsxRuntime.jsx)("div", {
           className: "pro-collapse-icon",
-          children: (0, _lodash.isBoolean)(icon) ? (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
-            src: _fold.default
+          children: (0, _lodash.isBoolean)(icon) ? (0, _jsxRuntime.jsx)(_index.default, {
+            src: _fold.default,
+            actionMap: {
+              fill: []
+            }
           }) : icon
         }), title]
       });

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

@@ -16,7 +16,7 @@
     }
     .pro-collapse-level2{
       .@{ant-prefix}-collapse-header {
-        display: block !important;
+        display: flex !important;
       }
     }
   }

package/lib/ProSelect/index.js

@@ -240,7 +240,7 @@ var ProSelect = exports.ProSelect = function ProSelect(props, ref) {
       if (!(0, _lodash.isObject)(value)) {
         return undefined;
       }
-      return value === null || value === void 0 ? void 0 : value[code];
+      return (value === null || value === void 0 ? void 0 : value[code]) || (value === null || value === void 0 ? void 0 : value.value);
     }
     if (labelInValue && selectProps.mode) {
       // 对传入的值做一些基础判断

package/lib/ProStep/components/Step/index.js

@@ -11,7 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _jsxRuntime = require("react/jsx-runtime");
 var _react = _interopRequireWildcard(require("react"));
 var _lodash = require("lodash");
-var _reactSvg = require("react-svg");
+var _index = _interopRequireDefault(require("../../../ProIcon/index"));
 var _catalog = _interopRequireDefault(require("../../../assets/catalog.svg"));
 var _Anchor = _interopRequireDefault(require("../Anchor"));
 var _locale = _interopRequireDefault(require("../../../locale"));
@@ -67,9 +67,10 @@ var Step = exports.Step = function Step(_ref) {
     onMouseLeave: handleMouseLeave,
     children: [(0, _jsxRuntime.jsxs)("div", {
       className: "step-menu",
-      children: [(0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
+      children: [(0, _jsxRuntime.jsx)(_index.default, {
+        src: _catalog.default,
         className: "menu-icon",
-        src: _catalog.default
+        actionMap: {}
       }), onOff && (0, _jsxRuntime.jsx)("div", {
         children: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProStep = _locale.default.ProStep) === null || _locale$ProStep === void 0 ? void 0 : _locale$ProStep.catalogue
       })]

package/lib/ProStep/style/index.less

@@ -27,6 +27,43 @@
     height: 48px;
     font-size: var(--zaui-font-size-lg, 16px);
     border-bottom: 1px solid var(--zaui-line, #dddddd);
+    > .anticon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 48px;
+      height: 24px;
+      > .menu-icon {
+        width: auto !important;
+        height: auto !important;
+        font-size: var(--zaui-font-size-lg-title, 24px);
+        fill: var(--zaui-brand, #006aff);
+        > div {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 48px;
+          height: 24px;
+        }
+      }
+      > button {
+        width: auto !important;
+        height: auto !important;
+        > .menu-icon {
+          width: auto !important;
+          height: auto !important;
+          font-size: var(--zaui-font-size-lg-title, 24px);
+          fill: var(--zaui-brand, #006aff);
+          > div {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 48px;
+            height: 24px;
+          }
+        }
+      }
+    }
 
     > .menu-icon {
       font-size: var(--zaui-font-size-lg-title, 24px);