@zat-design/sisyphus-react 4.0.6 → 4.0.8

package/es/ProDrawerForm/components/ProDrawer/index.js

@@ -19,7 +19,7 @@ import { Button, Drawer, Modal } from 'antd';
 import React, { useCallback, useState, useRef, useEffect } from 'react';
 import { useScroll } from 'ahooks';
 import classNames from 'classnames';
-import { isArray } from 'lodash';
+import { isArray, omit } from 'lodash';
 import { ReactSVG } from 'react-svg';
 import closeSvg from "../../../assets/close.svg";
 import locale from "../../../locale";
@@ -252,7 +252,7 @@ var ProDrawer = _ref => {
     closable: false,
     onClose: onCancel,
     zIndex: zIndex
-  }, restDrawerProps), {}, {
+  }, omit(restDrawerProps, 'width')), {}, {
     children: [/*#__PURE__*/_jsx("div", {
       className: "pro-drawer-close",
       onClick: onConfirm,

package/es/ProEditTable/index.js

@@ -463,7 +463,7 @@ var ProEditTable = (_ref, ref) => {
       className: "pro-edit-table-footer",
       children: footerRender
     }) : null, pagination ? /*#__PURE__*/_jsx("div", {
-      id: `pro-edit-table-pagination-${config.name.join('-')}`,
+      id: `pro-edit-table-pagination-${Array.isArray(config.name) ? config.name.filter(Boolean).join('-') : config.name || 'default'}`,
       onClick: () => {
         onPageCheck({
           form,

package/es/ProEnum/index.js

@@ -264,7 +264,7 @@ var ProEnum = props => {
         arr.push(props.optionRender(item));
       });
       return /*#__PURE__*/_jsx(Space, {
-        direction: "vertical",
+        orientation: "vertical",
         size: 4,
         children: arr.map(item => /*#__PURE__*/_jsx(React.Fragment, {
           children: item

package/es/ProForm/components/base/Input/index.js

@@ -1,4 +1,5 @@
-var _excluded = ["label", "form", "placeholder", "fieldName", "otherProps", "desensitization"];
+var _excluded = ["label", "form", "placeholder", "fieldName", "otherProps", "desensitization"],
+  _excluded2 = ["addonBefore", "addonAfter"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -7,7 +8,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import React from 'react';
-import { Input as AntInput } from 'antd';
+import { Input as AntInput, Space, Button } from 'antd';
 import { isFunction, omit } from 'lodash';
 import { useProConfig } from "../../../../ProConfigProvider";
 import Container from "../../Container";
@@ -18,6 +19,7 @@ import { maskStringRangeWithRegex } from "../../../utils/valueType";
 // 参数优先级
 // 组件内默认值 < config默认值 < props
 import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var Input = function Input(props) {
   var label = props.label,
     form = props.form,
@@ -31,43 +33,99 @@ var Input = function Input(props) {
     viewEmpty = _ref.viewEmpty;
   var isView = typeof props.isView === 'boolean' ? props.isView : isViewCon; // 组件可直接接收isView参数, 优先级高
   var initialConfig = useProConfig('Input');
-  if (typeof rest.value === 'number') {
-    var _rest$value, _rest$value$toString;
-    rest.value = rest === null || rest === void 0 || (_rest$value = rest.value) === null || _rest$value === void 0 || (_rest$value$toString = _rest$value.toString) === null || _rest$value$toString === void 0 ? void 0 : _rest$value$toString.call(_rest$value);
+
+  // 提取 addonBefore 和 addonAfter（antd 6 已废弃，需要使用 Space.Compact）
+  var addonBefore = rest.addonBefore,
+    addonAfter = rest.addonAfter,
+    restProps = _objectWithoutProperties(rest, _excluded2);
+  if (typeof restProps.value === 'number') {
+    var _restProps$value, _restProps$value$toSt;
+    restProps.value = restProps === null || restProps === void 0 || (_restProps$value = restProps.value) === null || _restProps$value === void 0 || (_restProps$value$toSt = _restProps$value.toString) === null || _restProps$value$toSt === void 0 ? void 0 : _restProps$value$toSt.call(_restProps$value);
   }
   if (isView) {
     if ((Array.isArray(desensitization) || isFunction(desensitization)) && props !== null && props !== void 0 && props.disabled) {
-      if (typeof rest.value === 'number') {
-        var _rest$value2, _rest$value2$toString;
-        rest.value = rest === null || rest === void 0 || (_rest$value2 = rest.value) === null || _rest$value2 === void 0 || (_rest$value2$toString = _rest$value2.toString) === null || _rest$value2$toString === void 0 ? void 0 : _rest$value2$toString.call(_rest$value2);
+      if (typeof restProps.value === 'number') {
+        var _restProps$value2, _restProps$value2$toS;
+        restProps.value = restProps === null || restProps === void 0 || (_restProps$value2 = restProps.value) === null || _restProps$value2 === void 0 || (_restProps$value2$toS = _restProps$value2.toString) === null || _restProps$value2$toS === void 0 ? void 0 : _restProps$value2$toS.call(_restProps$value2);
       }
       return /*#__PURE__*/_jsx(Container, {
         viewEmpty: viewEmpty,
-        children: maskStringRangeWithRegex(rest.value, desensitization)
+        children: maskStringRangeWithRegex(restProps.value, desensitization)
       });
     }
     return /*#__PURE__*/_jsx(Container, {
       viewEmpty: viewEmpty,
-      children: rest.value
+      children: restProps.value
     });
   }
-  var ComInput = /*#__PURE__*/_jsx(AntInput, _objectSpread(_objectSpread({
+
+  // 构建 Input 组件
+  var buildInput = inputProps => /*#__PURE__*/_jsx(AntInput, _objectSpread(_objectSpread({
     autoComplete: "off",
     placeholder: placeholder || `${locale.ProForm.inputPlaceholder}`
-  }, omit(initialConfig, ['trim', 'upperCase'])), rest));
+  }, omit(initialConfig, ['trim', 'upperCase'])), inputProps));
+
+  // 如果存在 addonBefore 或 addonAfter，使用 Space.Compact 包装
+  if (addonBefore || addonAfter) {
+    // 确保 Input 在 Space.Compact 中能自动扩展宽度
+    var inputPropsWithFlex = _objectSpread(_objectSpread({}, restProps), {}, {
+      style: _objectSpread(_objectSpread({}, restProps.style), {}, {
+        flex: 1
+      })
+    });
+    var _ComInput = buildInput(inputPropsWithFlex);
+
+    // 仅查看模式下进行数据脱敏
+    if ((Array.isArray(desensitization) || isFunction(desensitization)) && props !== null && props !== void 0 && props.disabled) {
+      if (typeof restProps.value === 'number') {
+        var _restProps$value3, _restProps$value3$toS;
+        restProps.value = restProps === null || restProps === void 0 || (_restProps$value3 = restProps.value) === null || _restProps$value3 === void 0 || (_restProps$value3$toS = _restProps$value3.toString) === null || _restProps$value3$toS === void 0 ? void 0 : _restProps$value3$toS.call(_restProps$value3);
+      }
+      var maskedInput = /*#__PURE__*/React.cloneElement(_ComInput, _objectSpread(_objectSpread(_objectSpread({
+        allowClear: true,
+        autoComplete: 'off',
+        placeholder: placeholder || `${locale.ProForm.inputPlaceholder}`
+      }, omit(initialConfig, ['trim', 'upperCase'])), inputPropsWithFlex), {}, {
+        value: maskStringRangeWithRegex(restProps.value, desensitization)
+      }));
+      return /*#__PURE__*/_jsxs(Space.Compact, {
+        block: true,
+        className: "pro-form-input-space-compact",
+        children: [addonBefore ? /*#__PURE__*/_jsx(Button, {
+          disabled: true,
+          children: addonBefore
+        }) : null, maskedInput, addonAfter ? /*#__PURE__*/_jsx(Button, {
+          disabled: true,
+          children: addonAfter
+        }) : null]
+      });
+    }
+    return /*#__PURE__*/_jsxs(Space.Compact, {
+      block: true,
+      className: "pro-form-input-space-compact",
+      children: [addonBefore ? /*#__PURE__*/_jsx(Button, {
+        disabled: true,
+        children: addonBefore
+      }) : null, _ComInput, addonAfter ? /*#__PURE__*/_jsx(Button, {
+        disabled: true,
+        children: addonAfter
+      }) : null]
+    });
+  }
+  var ComInput = buildInput(restProps);
 
   // 仅查看模式下进行数据脱敏
   if ((Array.isArray(desensitization) || isFunction(desensitization)) && props !== null && props !== void 0 && props.disabled) {
-    if (typeof rest.value === 'number') {
-      var _rest$value3, _rest$value3$toString;
-      rest.value = rest === null || rest === void 0 || (_rest$value3 = rest.value) === null || _rest$value3 === void 0 || (_rest$value3$toString = _rest$value3.toString) === null || _rest$value3$toString === void 0 ? void 0 : _rest$value3$toString.call(_rest$value3);
+    if (typeof restProps.value === 'number') {
+      var _restProps$value4, _restProps$value4$toS;
+      restProps.value = restProps === null || restProps === void 0 || (_restProps$value4 = restProps.value) === null || _restProps$value4 === void 0 || (_restProps$value4$toS = _restProps$value4.toString) === null || _restProps$value4$toS === void 0 ? void 0 : _restProps$value4$toS.call(_restProps$value4);
     }
     return /*#__PURE__*/React.cloneElement(ComInput, _objectSpread(_objectSpread(_objectSpread({
       allowClear: true,
       autoComplete: 'off',
       placeholder: placeholder || `${locale.ProForm.inputPlaceholder}`
-    }, omit(initialConfig, ['trim', 'upperCase'])), rest), {}, {
-      value: maskStringRangeWithRegex(rest.value, desensitization)
+    }, omit(initialConfig, ['trim', 'upperCase'])), restProps), {}, {
+      value: maskStringRangeWithRegex(restProps.value, desensitization)
     }));
   }
   return ComInput;

package/es/ProForm/components/combination/FormList/components/BlockFields.js

@@ -47,7 +47,7 @@ var BlockFields = props => {
   // 左侧标题布局
   if (titlePosition === 'left') {
     return /*#__PURE__*/_jsx(Space, {
-      direction: "vertical",
+      orientation: "vertical",
       className: cls,
       id: id,
       children: /*#__PURE__*/_jsxs("div", {
@@ -98,7 +98,7 @@ var BlockFields = props => {
 
   // 默认顶部标题布局
   return /*#__PURE__*/_jsx(Space, {
-    direction: "vertical",
+    orientation: "vertical",
     className: cls,
     id: id,
     children: /*#__PURE__*/_jsx(ProCollapse, {

package/es/ProForm/components/combination/Group/utils/index.d.ts

@@ -75,38 +75,28 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
     confirm?: boolean | import("antd").ModalFuncProps | import("../../../render/propsType").FunctionArgs<any, boolean | import("antd").ModalFuncProps>;
     show?: boolean | ReactiveFunction<any, boolean>;
     component?: React.ReactNode | ReactiveFunction<any, React.ReactNode>;
-    className?: string;
     trim?: boolean;
     normalize?: (value: any, prevValue: any, allValues: import("@rc-component/form/lib/interface").Store) => any;
     children?: React.ReactNode | ((form: FormInstance<any>) => React.ReactNode);
-    isView?: boolean;
-    style?: React.CSSProperties;
-    prefixCls?: string;
-    rootClassName?: string;
     id?: string;
-    vertical?: boolean;
-    status?: "" | "error" | "success" | "warning" | "validating";
+    className?: string;
     hidden?: boolean;
+    style?: React.CSSProperties;
     onReset?: () => void;
-    htmlFor?: string;
-    valueType?: import("../../../render/propsType").ProFormValueType;
-    trigger?: string;
-    viewRender?: (value: any, record: any, { form, index, namePath, }: {
-        [key: string]: any;
-        form: FormInstance<any>;
-        index?: number;
-    }) => string | React.ReactElement<any, any>;
-    desensitization?: [number, number] | ReactiveFunction<any, [number, number]>;
-    layout?: import("antd/es/form/Form").FormItemLayout;
-    help?: React.ReactNode;
-    preserve?: boolean;
-    viewType?: import("../../../render/propsType").ViewType;
+    prefixCls?: string;
+    rootClassName?: string;
+    status?: "" | "warning" | "error" | "success" | "validating";
     validateTrigger?: string | false | string[];
+    preserve?: boolean;
+    labelCol?: import("antd").ColProps;
+    wrapperCol?: import("antd").ColProps;
     colon?: boolean;
+    htmlFor?: string;
     labelAlign?: import("antd/es/form/interface").FormLabelAlign;
-    labelCol?: import("antd").ColProps;
+    vertical?: boolean;
     getValueFromEvent?: (...args: import("@rc-component/form/lib/interface").EventArgs) => any;
     shouldUpdate?: import("@rc-component/form/lib/Field").ShouldUpdate<any>;
+    trigger?: string;
     validateDebounce?: number;
     valuePropName?: string;
     getValueProps?: ((value: any) => Record<string, unknown>) & ((value: any) => Record<string, unknown>);
@@ -115,15 +105,25 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
     onMetaChange?: (meta: import("@rc-component/form/lib/Field").MetaEvent) => void;
     isListField?: boolean;
     isList?: boolean;
+    upperCase?: boolean;
+    desensitization?: [number, number] | ReactiveFunction<any, [number, number]>;
+    isView?: boolean;
     noStyle?: boolean;
     hasFeedback?: boolean | {
         icons: import("antd/es/form/FormItem").FeedbackIcons;
     };
-    validateStatus?: "" | "error" | "success" | "warning" | "validating";
-    wrapperCol?: import("antd").ColProps;
+    validateStatus?: "" | "warning" | "error" | "success" | "validating";
+    layout?: import("antd/es/form/Form").FormItemLayout;
+    help?: React.ReactNode;
     fieldId?: string;
+    valueType?: import("../../../render/propsType").ProFormValueType;
     switchValue?: [any, any];
-    upperCase?: boolean;
+    viewRender?: (value: any, record: any, { form, index, namePath, }: {
+        [key: string]: any;
+        form: FormInstance<any>;
+        index?: number;
+    }) => string | React.ReactElement<any, any>;
+    viewType?: import("../../../render/propsType").ViewType;
     toISOString?: boolean;
     toCSTString?: boolean;
     clearNotShow?: boolean;
@@ -141,7 +141,7 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
  * 创建组件属性
  */
 export declare const createComponentProps: (column: FlexibleGroupColumnType, formItemProps: any) => {
-    componentProps: import("lodash").Omit<any, "format" | "valueType" | "precision" | "switchValue" | "dependNames" | "toISOString" | "toCSTString" | "clearNotShow">;
+    componentProps: import("lodash").Omit<any, "format" | "precision" | "valueType" | "switchValue" | "dependNames" | "toISOString" | "toCSTString" | "clearNotShow">;
     formItemTransform: {
         getValueProps: any;
         normalize: any;

package/es/ProForm/components/render/ChangedWrapper.js

@@ -87,8 +87,6 @@ var ChangedWrapper = props => {
       originalValues: isNestedField ? originalValues : undefined
     }, children.props), rest));
   }
-
-  // eslint-disable-next-line react-hooks/rules-of-hooks
   var tipOpenCalc = () => {
     if (!toolTip) return false;
 
@@ -119,7 +117,7 @@ var ChangedWrapper = props => {
     placement: "topLeft",
     autoAdjustOverflow: false,
     title: /*#__PURE__*/_jsxs(Space, {
-      direction: "vertical",
+      orientation: "vertical",
       className: "changed-tooltip",
       children: [/*#__PURE__*/_jsxs(Space, {
         align: "start",

package/es/ProForm/style/index.less

@@ -177,6 +177,12 @@
     margin-left: @zaui-space-size-sm;
   }
 
+  .pro-form-input-space-compact{
+    .@{ant-prefix}-btn{
+      color: #333;
+    }
+  }
+
   .@{ant-prefix}-form-item-has-error {
     .group-separator {
       color: #ff4d4f;
@@ -186,6 +192,18 @@
     .site-input-split {
       border-color: @zaui-danger;
     }
+    .pro-form-input-space-compact{
+      .@{ant-prefix}-btn{
+        color: @zaui-danger;
+        border-color: @zaui-danger;
+      }
+    }
+    .pro-tree-modal{
+      .pro-enum-input-addonAfter{
+        border-color: @zaui-danger;
+        color: @zaui-danger;
+      }
+    }
   }
 
   .site-input-group-wrapper {

package/es/ProIcon/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["type", "onClick", "size", "color", "className", "style", "spin", "rotate", "theme", "disabled", "mode", "buttonProps", "children", "mapList", "src", "actionMap", "tooltip", "buttonIcon"];
+var _excluded = ["type", "onClick", "size", "color", "className", "style", "spin", "rotate", "theme", "disabled", "mode", "buttonProps", "children", "mapList", "component", "src", "actionMap", "tooltip", "buttonIcon"];
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -17,7 +17,7 @@ import { Button, Tooltip, Space } from 'antd';
 import classNames from 'classnames';
 import { uniqBy } from 'lodash';
 import { ReactSVG } from 'react-svg';
-import { useEffect } from 'react';
+import React, { useEffect } from 'react';
 import { useProConfig } from "../ProConfigProvider";
 import { iconMap } from "./config";
 import { onBeforeInjection } from "./utils";
@@ -55,6 +55,7 @@ var ProIcon = props => {
     children = _config.children,
     _config$mapList = _config.mapList,
     mapList = _config$mapList === void 0 ? [] : _config$mapList,
+    component = _config.component,
     src = _config.src,
     actionMap = _config.actionMap,
     tooltip = _config.tooltip,
@@ -145,37 +146,126 @@ var ProIcon = props => {
       height: size
     }, rotateStyle), style)
   };
-  var icon = !src ? /*#__PURE__*/_jsx("svg", _objectSpread(_objectSpread({}, svgProps), {}, {
-    style: _objectSpread({
-      color
-    }, svgProps === null || svgProps === void 0 ? void 0 : svgProps.style),
-    onClick: onClick,
-    "aria-hidden": "true",
-    children: /*#__PURE__*/_jsx("use", {
-      xlinkHref: `#icon-${_type}`
-    })
-  })) : /*#__PURE__*/_jsx(ReactSVG, _objectSpread(_objectSpread({}, svgProps), {}, {
-    // @ts-ignore
-    onClick: onClick,
-    "aria-hidden": "true",
-    src: src,
-    beforeInjection: svg => {
-      onBeforeInjection({
-        svg,
-        actionMap,
-        primaryColor: isQiankun ? qiankunPrimaryColor : primaryColor
+
+  // 渲染 icon 的优先级：component > src > type
+  var icon;
+  if (component) {
+    // 判断 component 的类型
+    if (typeof component === 'string') {
+      // 字符串类型：当作 SVG 文件路径处理，使用 ReactSVG 加载
+      icon = /*#__PURE__*/_jsx(ReactSVG, {
+        className: proIconClassNames
+        // @ts-ignore
+        ,
+        onClick: onClick,
+        src: component,
+        beforeInjection: svg => {
+          // 设置 SVG 的宽高
+          svg.setAttribute('width', String(size));
+          svg.setAttribute('height', String(size));
+          svg.setAttribute('aria-hidden', 'true');
+
+          // 应用旋转
+          if (rotate) {
+            var transform = svg.getAttribute('transform') || '';
+            svg.setAttribute('transform', `${transform} rotate(${rotate})`);
+            svg.style.transform = `rotate(${rotate}deg)`;
+          }
+
+          // 应用颜色 - 设置 fill 和 currentColor
+          if (color) {
+            svg.setAttribute('fill', color);
+            svg.style.color = color;
+            // 遍历所有路径元素，设置 fill
+            var paths = svg.querySelectorAll('path, circle, rect, polygon, ellipse');
+            paths.forEach(path => {
+              var currentFill = path.getAttribute('fill');
+              // 只修改使用 currentColor 或没有设置 fill 的元素
+              if (!currentFill || currentFill === 'currentColor') {
+                path.setAttribute('fill', color);
+              }
+            });
+          } else {
+            // 没有指定颜色时，使用 currentColor
+            svg.style.color = 'currentColor';
+          }
+
+          // 应用自定义样式
+          if (style) {
+            Object.keys(style).forEach(key => {
+              svg.style[key] = style[key];
+            });
+          }
+
+          // 应用 actionMap 的主题配置
+          onBeforeInjection({
+            svg,
+            actionMap,
+            primaryColor: isQiankun ? qiankunPrimaryColor : primaryColor
+          });
+        }
       });
-      if (color) {
-        svg.setAttribute('fill', color);
+    } else {
+      // 处理自定义组件
+      var componentProps = _objectSpread(_objectSpread({}, svgProps), {}, {
+        style: _objectSpread({
+          color
+        }, svgProps === null || svgProps === void 0 ? void 0 : svgProps.style),
+        onClick,
+        'aria-hidden': 'true'
+      });
+
+      // 判断是组件类型还是组件实例
+      if ( /*#__PURE__*/React.isValidElement(component)) {
+        // 组件实例：使用 cloneElement
+        icon = /*#__PURE__*/React.cloneElement(component, componentProps);
+      } else {
+        // 组件类型：直接渲染
+        var ComponentType = component;
+        icon = /*#__PURE__*/_jsx(ComponentType, _objectSpread({}, componentProps));
       }
     }
-  }));
+  } else if (src) {
+    // 使用 ReactSVG 加载外部 SVG
+    icon = /*#__PURE__*/_jsx(ReactSVG, _objectSpread(_objectSpread({}, svgProps), {}, {
+      // @ts-ignore
+      onClick: onClick,
+      "aria-hidden": "true",
+      src: src,
+      beforeInjection: svg => {
+        onBeforeInjection({
+          svg,
+          actionMap,
+          primaryColor: isQiankun ? qiankunPrimaryColor : primaryColor
+        });
+        if (color) {
+          svg.setAttribute('fill', color);
+        }
+      }
+    }));
+  } else {
+    // 使用 symbol icon
+    icon = /*#__PURE__*/_jsx("svg", _objectSpread(_objectSpread({}, svgProps), {}, {
+      style: _objectSpread({
+        color
+      }, svgProps === null || svgProps === void 0 ? void 0 : svgProps.style),
+      onClick: onClick,
+      "aria-hidden": "true",
+      children: /*#__PURE__*/_jsx("use", {
+        xlinkHref: `#icon-${_type}`
+      })
+    }));
+  }
+
+  // 判断 RenderIcon 是否会被外层 Button 包裹
+  // 如果会被包裹（isExtendButtonMode && isIconMode），则内部不使用 Button，避免 button 嵌套
+  var willBeWrappedByButton = isExtendButtonMode && isIconMode;
   var RenderIcon = /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
     className: "anticon"
   }, reset), {}, {
     children: /*#__PURE__*/_jsx(Tooltip, {
       title: iconText,
-      children: buttonIcon ? /*#__PURE__*/_jsx(Button, _objectSpread({
+      children: buttonIcon && !willBeWrappedByButton ? /*#__PURE__*/_jsx(Button, _objectSpread({
         style: {
           width: size,
           height: size,

package/es/ProIcon/propsTypes.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, ReactNode, MouseEventHandler } from 'react';
+import { CSSProperties, ReactNode, MouseEventHandler, ComponentType, ReactElement } from 'react';
 import { ButtonProps } from 'antd/lib/button';
 /**
  * 图标模式
@@ -69,24 +69,30 @@ interface ProIconActionMapType {
     fill?: string[];
 }
 export interface ProIconType {
+    /**
+     * 自定义 SVG 组件
+     * @description 自定义 SVG React 组件或 SVG 文件路径，支持传入组件类型、组件实例或字符串路径，优先级高于 src 和 type
+     * @default undefined
+     */
+    component?: ComponentType<any> | ReactElement | string;
     /**
      * 图标路径
      * @description 本地import引入的图标路径
-     * @default ""
+     * @default undefined
      */
     src?: string;
     /**
      * 图标名称
      * @description 图标的类型名称，用于识别特定图标
-     * @default undefined
+     * @default null
      */
-    type?: string;
+    type?: string | null;
     /**
      * 图标大小
      * @description 图标的大小，同时设置图标的width以及height
-     * @default 14
+     * @default '1em'
      */
-    size?: number;
+    size?: number | string;
     /**
      * 旋转角度
      * @description 图标旋转角度（IE9 无效）
@@ -126,7 +132,7 @@ export interface ProIconType {
     /**
      * 点击事件
      * @description 图标的点击事件处理函数
-     * @default () => {}
+     * @default undefined
      */
     onClick?: MouseEventHandler<SVGSVGElement>;
     /**
@@ -138,7 +144,7 @@ export interface ProIconType {
     /**
      * 自定义样式
      * @description 计算后的svg元素样式，优先级高于size/color/rotate属性
-     * @default undefined
+     * @default {}
      */
     style?: CSSProperties;
     /**
@@ -150,13 +156,13 @@ export interface ProIconType {
     /**
      * 按钮属性
      * @description mode为button时的按钮属性，与antd Button接收props一致
-     * @default { type: 'link' }
+     * @default {}
      */
     buttonProps?: ButtonProps;
     /**
      * 图标映射表
      * @description 图标与中英文文本的映射表
-     * @default 项目内默认映射
+     * @default []
      */
     mapList?: ProIconMapType[];
     /**
@@ -168,7 +174,7 @@ export interface ProIconType {
     /**
      * 按钮图标标记
      * @description 内部使用，标记图标作为按钮使用
-     * @default undefined
+     * @default true
      */
     buttonIcon?: boolean;
 }

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

@@ -181,7 +181,7 @@ var ProCollapse = props => {
           rotate: isActive ? -90 : 90
         });
       },
-      expandIconPosition: "end",
+      expandIconPlacement: "end",
       defaultActiveKey: folding ? [] : ['1'],
       onChange: onChange,
       items: getCollapseItems()

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

@@ -12,7 +12,6 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-/* eslint-disable react/no-array-index-key */
 import { Space, Divider, Breadcrumb, Tooltip, Modal } from 'antd';
 import React, { memo, useEffect, useState, useRef } from 'react';
 import { tools } from '@zat-design/utils';
@@ -143,10 +142,7 @@ var ProHeader = props => {
           return /*#__PURE__*/_jsxs(Space, {
             size: 4,
             align: params !== null && params !== void 0 && params.tag ? 'baseline' : 'center',
-            children: [params !== null && params !== void 0 && params.link ?
-            /*#__PURE__*/
-            // eslint-disable-next-line jsx-a11y/anchor-is-valid
-            _jsx("a", {
+            children: [params !== null && params !== void 0 && params.link ? /*#__PURE__*/_jsx("a", {
               onClick: () => {
                 var newWindow = window.open(params.link);
                 newWindow.opener = null;
@@ -292,7 +288,7 @@ var ProHeader = props => {
     if (Array.isArray(actionRender) && actionRender.length) {
       return /*#__PURE__*/_jsx(Space, {
         separator: /*#__PURE__*/_jsx(Divider, {
-          type: "vertical"
+          orientation: "vertical"
         }),
         children: actionRender.map((item, index) => {
           var _item$props;

package/es/ProSelect/index.js

@@ -212,7 +212,7 @@ export var ProSelect = (props, ref) => {
         arr.push(props.optionRender(item));
       });
       return /*#__PURE__*/_jsx(Space, {
-        direction: "vertical",
+        orientation: "vertical",
         size: 4,
         children: arr.map(item => /*#__PURE__*/_jsx(React.Fragment, {
           children: item

package/es/ProTable/components/RenderColumn/index.js

@@ -144,7 +144,7 @@ var RenderColumn = props => {
         placement: "topLeft",
         autoAdjustOverflow: false,
         title: /*#__PURE__*/_jsx(Space, {
-          direction: "vertical",
+          orientation: "vertical",
           className: "changed-tooltip",
           children: props !== null && props !== void 0 && props.isChanged && !(props !== null && props !== void 0 && props.isAddCell) ? /*#__PURE__*/_jsxs(_Fragment, {
             children: [/*#__PURE__*/_jsxs(Space, {