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

package/es/ProThemeTools/utils/index.js

@@ -1,45 +1,49 @@
-import "antd/es/config-provider/style";
-import _ConfigProvider from "antd/es/config-provider";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-/** 主题配置mapping */
-var configProviderMapping = {
-  'zaui-brand': 'primaryColor'
+/** antd5 主题配置 mapping */
+var antd5ConfigMapping = {
+  'zaui-brand': 'colorPrimary'
+  // 可以根据需要添加更多映射
 };
 /**
- * 取主题配置的mapping值, 返回antd可用的主题配置
- * @param themes
- * @param themeMapping
+ * 将 kebab-case 的主题配置转换为 antd5 的 token 格式
+ * @param themes kebab-case 格式的主题配置
+ * @param themeMapping 自定义映射关系
  */
-export var replaceObject = function replaceObject(themes, themeMapping) {
-  var result = {};
-  Object.keys(themes).forEach(function (key, index) {
+export var convertToAntd5Tokens = function convertToAntd5Tokens(themes, themeMapping) {
+  var mapping = _objectSpread(_objectSpread({}, antd5ConfigMapping), themeMapping);
+  var tokens = {};
+  Object.keys(themes).forEach(function (key) {
     var value = themes[key];
-    var mappingKey = themeMapping[key];
+    var mappingKey = mapping[key];
     if (mappingKey) {
-      result[mappingKey] = value;
+      tokens[mappingKey] = value;
     }
   });
-  return result;
+  return {
+    token: tokens
+  };
 };
 /**
- * 设置主题变量
+ * 设置主题变量 - antd5 兼容版本
+ * 只设置 CSS 变量，不再使用 ConfigProvider.config
  */
-export var setThemes = function setThemes(themes, themeMapping) {
+export var setThemes = function setThemes(themes) {
   if (!Object.keys(themes).length) {
     return false;
   }
-  var mapping = _objectSpread(_objectSpread({}, configProviderMapping), themeMapping);
-  var configProviderThemes = replaceObject(themes, mapping);
-  // 匹配到主题配置执行antd的主题配置
-  if (configProviderThemes && Object.keys(configProviderThemes).length) {
-    _ConfigProvider.config({
-      theme: configProviderThemes
-    });
-  }
+  // 只设置 CSS 变量，主题配置通过 Context 管理
   var list = Object.entries(themes);
   list.forEach(function (item) {
     document.documentElement.style.setProperty("--".concat(item[0]), item[1]);
   });
+  return true;
+};
+/**
+ * 获取 antd5 主题配置
+ * @param themes kebab-case 格式的主题配置
+ */
+export var getAntd5ThemeConfig = function getAntd5ThemeConfig(themes) {
+  return convertToAntd5Tokens(themes);
 };
 /** JS实现驼峰命名与横线命名的转换  */
 export var getKebabCase = function getKebabCase(str) {

package/es/ProTooltip/index.js

@@ -1,12 +1,11 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import "antd/es/tooltip/style";
-import _Tooltip from "antd/es/tooltip";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["text", "mode", "width", "line", "className", "style", "lineHeight", "scrollFollowParent"];
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useSize, useSetState, useDebounce } from 'ahooks';
+import { Tooltip } from 'antd';
 import { useEffect, useRef } from 'react';
 import classnames from 'classnames';
 import { isEllipsisActive } from '../utils';
@@ -66,20 +65,22 @@ var ProTooltip = function ProTooltip(props) {
   var _ref = (_useSize = useSize(localElement)) !== null && _useSize !== void 0 ? _useSize : {},
     _localSizeWidth = _ref.width;
   var isTable = _findTableParent(ref.current);
-  var overlayStyle = mode === 'auto' ? {
+  var rootStyles = mode === 'auto' ? {
     maxWidth: _localSizeWidth
   } : {};
   var multiStyle = isMultiLine ? {
     WebkitLineClamp: line
   } : {};
   var AutoMixinSingle = function AutoMixinSingle() {
-    return isShowToolTip && line === 1 ? _jsx(_Tooltip, _objectSpread(_objectSpread({
+    return isShowToolTip && line === 1 ? _jsx(Tooltip, _objectSpread(_objectSpread({
       title: text,
       getPopupContainer: function getPopupContainer(triggerNode) {
         return triggerNode.parentNode;
       }
     }, restProps), {}, {
-      overlayStyle: overlayStyle,
+      styles: {
+        root: rootStyles
+      },
       children: _jsx("div", _objectSpread(_objectSpread({}, specialProps), {}, {
         style: _objectSpread(_objectSpread({}, multiStyle), {}, {
           width: localWidth,
@@ -108,13 +109,15 @@ var ProTooltip = function ProTooltip(props) {
     });
   };
   var AutoMixinMulti = function AutoMixinMulti() {
-    return isShowToolTip && line > 1 ? _jsx(_Tooltip, _objectSpread(_objectSpread({
+    return isShowToolTip && line > 1 ? _jsx(Tooltip, _objectSpread(_objectSpread({
       title: text,
       getPopupContainer: function getPopupContainer(triggerNode) {
         return triggerNode.parentNode;
       }
     }, restProps), {}, {
-      overlayStyle: overlayStyle,
+      styles: {
+        root: rootStyles
+      },
       children: _jsx("div", _objectSpread(_objectSpread({}, specialProps), {}, {
         style: _objectSpread(_objectSpread({}, multiStyle), {}, {
           width: localWidth,
@@ -247,7 +250,7 @@ var ProTooltip = function ProTooltip(props) {
     });
   };
   var renderTooltipContent = function renderTooltipContent() {
-    return _jsx(_Tooltip, _objectSpread(_objectSpread({
+    return _jsx(Tooltip, _objectSpread(_objectSpread({
       title: text,
       getPopupContainer: function getPopupContainer(triggerNode) {
         // 修复scrollFollowParent为false时tooltip不显示的问题
@@ -255,7 +258,9 @@ var ProTooltip = function ProTooltip(props) {
         return scrollFollowParent ? triggerNode.parentNode : document.body;
       }
     }, restProps), {}, {
-      overlayStyle: mode === 'auto' ? overlayStyle : {},
+      styles: {
+        root: mode === 'auto' ? rootStyles : {}
+      },
       children: renderContentBox()
     }));
   };

package/es/ProTooltip/style/index.less

@@ -1,5 +1,5 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
+/* @root-entry-name: 'default'; */
+/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-tooltip {
   cursor: pointer;

package/es/ProTree/components/AdaptiveTooltip.js

@@ -1,9 +1,8 @@
-import "antd/es/tooltip/style";
-import _Tooltip from "antd/es/tooltip";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Tooltip } from 'antd';
 var AdaptiveTooltip = function AdaptiveTooltip(_ref) {
   var children = _ref.children;
-  return _jsx(_Tooltip, {
+  return _jsx(Tooltip, {
     placement: "rightTop",
     title: _jsx("div", {
       onMouseDown: function onMouseDown(e) {

package/es/ProTree/components/List.js

@@ -1,10 +1,9 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import "antd/es/checkbox/style";
-import _Checkbox from "antd/es/checkbox";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["checkedValues", "disabled", "treeData", "searchStr", "showCodeName", "mode", "fieldNames", "handleOnChange", "handleFilterClose", "optionRender"];
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { memo } from 'react';
+import { Checkbox } from 'antd';
 import SearchTitle from './SearchTitle';
 import CloseIcon from './CloseIcon';
 function List(props) {
@@ -24,7 +23,7 @@ function List(props) {
   var fieldNameValue = fieldNames.value;
   if (mode === 'render') {
     return _jsx(_Fragment, {
-      children: _jsx(_Checkbox.Group, {
+      children: _jsx(Checkbox.Group, {
         disabled: disabled,
         style: {
           width: '100%'
@@ -34,7 +33,7 @@ function List(props) {
           var title = showCodeName ? "".concat(item[fieldNameValue], "-").concat(item[fieldNameLabel]) : item[fieldNameLabel];
           return _jsx("div", {
             className: "pro-tree-checkbox-content",
-            children: _jsx(_Checkbox, {
+            children: _jsx(Checkbox, {
               onChange: function onChange(e) {
                 return handleOnChange(e, item[fieldNameValue]);
               },

package/es/ProTree/components/ProTree.js

@@ -1,27 +1,21 @@
-import "antd/es/checkbox/style";
-import _Checkbox from "antd/es/checkbox";
-import "antd/es/input/style";
-import _Input from "antd/es/input";
-import "antd/es/spin/style";
-import _Spin from "antd/es/spin";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
-import "antd/es/message/style";
-import _message from "antd/es/message";
 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 _isFunction from "lodash/isFunction";
 import _cloneDeep from "lodash/cloneDeep";
 var _excluded = ["value", "onChange", "dataSource", "mode", "code", "useRequest", "allValue", "showCodeName", "checkStrictly", "tags", "placeholder", "labelInValue", "fieldNames", "disabled", "isView", "transformResponse", "optionRender", "onSelect", "loading", "style", "className", "showSearch", "title", "footer", "expandedKeys", "showExpand", "defaultExpandAll"];
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { if (r) i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n;else { var o = function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); }; o("next", 0), o("throw", 1), o("return", 2); } }, _regeneratorDefine2(e, r, n, t); }
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect } from 'react';
 import classNames from 'classnames';
 import { CaretDownOutlined, Loading3QuartersOutlined } from '@ant-design/icons';
 import { useDeepCompareEffect, useSetState, useRequest as useRequestFunc } from 'ahooks';
+import { Checkbox, Input, message, Spin } from 'antd';
 import { ReactSVG } from 'react-svg';
 import { useProConfig } from '../../ProConfigProvider';
 import { TreeView } from './index';
@@ -120,7 +114,7 @@ var ProTree = function ProTree(props) {
           msg = res.message,
           data = res.data;
         if (status !== 200) {
-          _message.error(msg);
+          message.error(msg);
           return;
         }
         var _flatTrees = getFlatTreeData(data, fieldNames);
@@ -360,32 +354,32 @@ var ProTree = function ProTree(props) {
   };
   /** 点击了树节点开始loading,改变自身state并将值通过onchange上传到form */
   var onSelectTreeNode = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(props, info) {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(props, info) {
       var _options$;
       var values, options, option;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
           case 0:
             if (!(disabled || isView)) {
-              _context.next = 2;
+              _context.n = 1;
               break;
             }
-            return _context.abrupt("return", null);
-          case 2:
+            return _context.a(2, null);
+          case 1:
             setState({
               clickShowLoading: loading
             });
             if (!onSelect) {
-              _context.next = 7;
+              _context.n = 3;
               break;
             }
-            _context.next = 6;
+            _context.n = 2;
             return onSelect(props, info);
-          case 6:
+          case 2:
             setState({
               clickShowLoading: false
             });
-          case 7:
+          case 3:
             values = props;
             options = state.flatTreeData.filter(function (item) {
               return values === item[fieldNameValue];
@@ -403,9 +397,8 @@ var ProTree = function ProTree(props) {
             } else {
               onChange && onChange(value, option);
             }
-          case 13:
-          case "end":
-            return _context.stop();
+          case 4:
+            return _context.a(2);
         }
       }, _callee);
     }));
@@ -444,14 +437,14 @@ var ProTree = function ProTree(props) {
   return _jsx("div", {
     className: boxClass,
     style: style,
-    children: _jsx(_Spin, {
+    children: _jsx(Spin, {
       spinning: state.clickShowLoading,
       indicator: antIcon,
       children: _jsxs("div", {
         className: "pro-tree-content",
         children: [_jsxs("div", {
           className: "pro-tree-header-box",
-          children: [showSearch && _jsx(_Input, {
+          children: [showSearch && _jsx(Input, {
             disabled: disabled,
             allowClear: true,
             value: state.searchStr,
@@ -499,7 +492,7 @@ var ProTree = function ProTree(props) {
           className: allValue || footer ? 'pro-tree-footer-box' : '',
           children: [_jsx("div", {
             className: "check-all-box",
-            children: allValue !== undefined ? _jsx(_Checkbox, {
+            children: allValue !== undefined ? _jsx(Checkbox, {
               checked: state.checkAll,
               disabled: disabled,
               onChange: handleAllCheck,

package/es/ProTree/components/ProTreeSelect/index.js

@@ -1,34 +1,28 @@
-import "antd/es/tooltip/style";
-import _Tooltip from "antd/es/tooltip";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import "antd/es/input/style";
-import _Input from "antd/es/input";
-import "antd/es/message/style";
-import _message from "antd/es/message";
 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 "antd/es/tree-select/style";
-import _TreeSelect from "antd/es/tree-select";
 import _debounce from "lodash/debounce";
 import _cloneDeep from "lodash/cloneDeep";
 var _excluded = ["disabled", "code", "dataSource", "defaultDisableValue", "onChange", "useRequest", "transformResponse", "fieldNames", "placeholder", "tooltip", "showSearch", "filterTreeNode", "treeNodeFilterProp", "defaultExpandAll", "expandedKeys", "treeCheckable", "onSearch", "otherProps", "width", "dropdownStyle", "popupClassName", "style", "allowClear", "listHeight", "showCodeName", "className", "checkStrictly", "checkable"],
   _excluded2 = ["children"];
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { if (r) i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n;else { var o = function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); }; o("next", 0), o("throw", 1), o("return", 2); } }, _regeneratorDefine2(e, r, n, t); }
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable react/no-danger */
 /* eslint-disable react/jsx-closing-tag-location */
 import { useDeepCompareEffect, useRequest as useRequestFunc, useSetState } from 'ahooks';
+import { Input, TreeSelect, message, Tooltip } from 'antd';
 import classnames from 'classnames';
 import { useImperativeHandle, forwardRef, useCallback } from 'react';
 import locale from '../../../locale';
 import { useProConfig } from '../../../ProConfigProvider';
 import Container from '../../../ProForm/components/Container';
 import AdaptiveTooltip from '../AdaptiveTooltip';
-var SHOW_PARENT = _TreeSelect.SHOW_PARENT;
+var SHOW_PARENT = TreeSelect.SHOW_PARENT;
 export var ProTreeSelect = function ProTreeSelect(props, ref) {
-  var _useRequest$options;
+  var _useRequest$options, _selectProps$classNam, _selectProps$classNam2, _selectProps$classNam3, _selectProps$styles, _selectProps$styles2, _selectProps$styles2$;
   // 全局属性配置在ConfigProvider
   var _ref = useProConfig('ProTreeSelect') || {},
     _ref$fieldNames = _ref.fieldNames,
@@ -163,7 +157,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
       msg = res.message,
       data = res.data;
     if (status !== 200) {
-      _message.error(msg);
+      message.error(msg);
       return;
     }
     var resultData = transferDataSource(data, showCodeName);
@@ -182,7 +176,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
       msg = _ref4.message,
       data = _ref4.data;
     if (status !== 200) {
-      _message.error(msg);
+      message.error(msg);
       return;
     }
     return data;
@@ -216,7 +210,6 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
     if (fetchFunction === null || fetchFunction === void 0 ? void 0 : fetchFunction.data, useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options2 = useRequest.options) === null || _useRequest$options2 === void 0 ? void 0 : _useRequest$options2.cacheKey) {
       if (transformResponse && typeof transformResponse === 'function') {
         var responseData = transformResponse(fetchFunction.data);
-        // debugger;
         var resultData = transferDataSource(responseData, showCodeName);
         setState({
           selectList: countChild(resultData),
@@ -267,7 +260,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
   if (defaultDisableValue) {
     return _jsx("span", {
       title: defaultDisableValue,
-      children: _jsx(_Input, {
+      children: _jsx(Input, {
         disabled: true,
         defaultValue: defaultDisableValue,
         style: props === null || props === void 0 ? void 0 : props.style
@@ -383,7 +376,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
       });
     }
     if (!children) {
-      return _jsx(_TreeSelect.TreeNode, {
+      return _jsx(TreeSelect.TreeNode, {
         value: value,
         title: title,
         label: searchKey,
@@ -394,7 +387,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
       }, key);
     }
     var sonGrade = grade + 1;
-    return _jsx(_TreeSelect.TreeNode, {
+    return _jsx(TreeSelect.TreeNode, {
       value: value,
       title: title,
       label: searchKey,
@@ -439,27 +432,26 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
     return sourceList;
   }
   var searchTreeEvent = _debounce(/*#__PURE__*/function () {
-    var _ref6 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(searchVal) {
+    var _ref6 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(searchVal) {
       var result;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
           case 0:
             if (searchVal) {
-              _context.next = 3;
+              _context.n = 1;
               break;
             }
             setState({
               selectList: _cloneDeep(origDataSource || [])
             });
-            return _context.abrupt("return", null);
-          case 3:
+            return _context.a(2, null);
+          case 1:
             result = filterTree(_cloneDeep(origDataSource || []), searchVal);
             setState({
               selectList: result || []
             });
-          case 5:
-          case "end":
-            return _context.stop();
+          case 2:
+            return _context.a(2);
         }
       }, _callee);
     }));
@@ -572,7 +564,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
   var dropDownClassName = classnames(_defineProperty(_defineProperty({
     'pro-tree-select-drop-down-container': true
   }, "".concat(innerClass), true), "".concat(popupClassName), popupClassName));
-  var treeProps = _objectSpread({
+  var treeProps = _objectSpread(_objectSpread({
     disabled: disabled,
     showSearch: showSearch,
     treeDefaultExpandAll: defaultExpandAll,
@@ -581,30 +573,39 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
     showCheckedStrategy: SHOW_PARENT,
     value: value,
     onChange: handleChange,
-    dropdownStyle: _objectSpread({
-      maxHeight: 320,
-      paddingTop: '0px',
-      maxWidth: '580px'
-    }, dropdownStyle),
     listHeight: listHeight || 320,
     style: _objectSpread({
       width: width || '100%'
     }, style),
-    popupClassName: dropDownClassName,
     onSearch: searchTreeEvent,
     allowClear: allowClear || true,
-    showArrow: true,
     treeNodeFilterProp: treeNodeFilterProp,
     virtual: true,
     treeCheckStrictly: checkStrictly
-  }, selectProps);
+  }, selectProps), {}, {
+    // 使用新的 API 替代弃用的 popupClassName 和 dropdownStyle
+    classNames: _objectSpread(_objectSpread({}, selectProps === null || selectProps === void 0 ? void 0 : selectProps.classNames), {}, {
+      popup: _objectSpread(_objectSpread({}, selectProps === null || selectProps === void 0 ? void 0 : (_selectProps$classNam = selectProps.classNames) === null || _selectProps$classNam === void 0 ? void 0 : _selectProps$classNam.popup), {}, {
+        root: [selectProps === null || selectProps === void 0 ? void 0 : (_selectProps$classNam2 = selectProps.classNames) === null || _selectProps$classNam2 === void 0 ? void 0 : (_selectProps$classNam3 = _selectProps$classNam2.popup) === null || _selectProps$classNam3 === void 0 ? void 0 : _selectProps$classNam3.root, dropDownClassName].filter(Boolean).join(' ')
+      })
+    }),
+    styles: _objectSpread(_objectSpread({}, selectProps === null || selectProps === void 0 ? void 0 : selectProps.styles), {}, {
+      popup: _objectSpread(_objectSpread({}, selectProps === null || selectProps === void 0 ? void 0 : (_selectProps$styles = selectProps.styles) === null || _selectProps$styles === void 0 ? void 0 : _selectProps$styles.popup), {}, {
+        root: _objectSpread(_objectSpread({
+          maxHeight: 320,
+          paddingTop: '0px',
+          maxWidth: '580px'
+        }, dropdownStyle), selectProps === null || selectProps === void 0 ? void 0 : (_selectProps$styles2 = selectProps.styles) === null || _selectProps$styles2 === void 0 ? void 0 : (_selectProps$styles2$ = _selectProps$styles2.popup) === null || _selectProps$styles2$ === void 0 ? void 0 : _selectProps$styles2$.root)
+      })
+    })
+  });
   if (value === null) {
     delete treeProps.value;
   }
   return _jsx("div", {
     onClick: nodeChangeEvent,
     className: cls,
-    children: _jsx(_TreeSelect, _objectSpread(_objectSpread({
+    children: _jsx(TreeSelect, _objectSpread(_objectSpread({
       placeholder: placeholder || locale.ProForm.treeSelectPlaceholder,
       maxTagPlaceholder: function maxTagPlaceholder(rest) {
         var _rest = rest.map(function (tag) {
@@ -612,7 +613,7 @@ export var ProTreeSelect = function ProTreeSelect(props, ref) {
           return ((tag === null || tag === void 0 ? void 0 : (_tag$label = tag.label) === null || _tag$label === void 0 ? void 0 : (_tag$label$props = _tag$label.props) === null || _tag$label$props === void 0 ? void 0 : _tag$label$props.children) ? tag === null || tag === void 0 ? void 0 : (_tag$label2 = tag.label) === null || _tag$label2 === void 0 ? void 0 : (_tag$label2$props = _tag$label2.props) === null || _tag$label2$props === void 0 ? void 0 : (_tag$label2$props$chi = _tag$label2$props.children) === null || _tag$label2$props$chi === void 0 ? void 0 : (_tag$label2$props$chi2 = _tag$label2$props$chi.props) === null || _tag$label2$props$chi2 === void 0 ? void 0 : (_tag$label2$props$chi3 = _tag$label2$props$chi2.dangerouslySetInnerHTML) === null || _tag$label2$props$chi3 === void 0 ? void 0 : _tag$label2$props$chi3.__html : tag === null || tag === void 0 ? void 0 : (_tag$label3 = tag.label) === null || _tag$label3 === void 0 ? void 0 : (_tag$label3$props = _tag$label3.props) === null || _tag$label3$props === void 0 ? void 0 : (_tag$label3$props$dan = _tag$label3$props.dangerouslySetInnerHTML) === null || _tag$label3$props$dan === void 0 ? void 0 : _tag$label3$props$dan.__html) || tag.label;
         });
         var _str = _rest.join('、');
-        return _jsx(_Tooltip, {
+        return _jsx(Tooltip, {
           title: _jsx("div", {
             children: _str
           }),

package/es/ProTree/components/ProTreeSelect/style/index.less

@@ -1,5 +1,5 @@
-@root-entry-name: 'default';
-@import (reference) '~antd/es/style/themes/index.less';
+/* @root-entry-name: 'default'; */
+/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-tree-select{
     .@{ant-prefix}-select-selector{

package/es/ProTree/components/Tree.js

@@ -1,22 +1,14 @@
-import "antd/es/tree/style";
-import _Tree from "antd/es/tree";
-import "antd/es/popover/style";
-import _Popover from "antd/es/popover";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["checkedValues", "disabled", "searchStr", "originalTreeData", "showCodeName", "checkStrictly", "flatTreeData", "mode", "fieldNames", "tags", "onCheck", "optionRender", "treeData", "showLine", "switcherIcon", "checkable", "menu", "innerExpandKeys", "selectedKey", "disabledMode", "isRadioSelect"];
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { if (r) i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n;else { var o = function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); }; o("next", 0), o("throw", 1), o("return", 2); } }, _regeneratorDefine2(e, r, n, t); }
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/*
- *@Date: 2023-07-25 13:49:35
- * @LastEditTime: 2024-05-20 11:47:45
- *@Author: liudongliang
- *@Description: 树每行节点渲染组件，复选时阻止点击事件冒泡，只有点击树节点文本会向上触发onSelect事件
- */
 /* eslint-disable no-plusplus */
 import React, { useEffect, useState } from 'react';
+import { Tree, Popover } from 'antd';
 import { useSetState } from 'ahooks';
 import { CaretDownOutlined } from '@ant-design/icons';
 import SearchTitle from './SearchTitle';
@@ -110,18 +102,18 @@ function List(props) {
     }
   }, [selectedKey]);
   var onSelect = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(value, item) {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(value, item) {
       var _props$onSelect;
       var val;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
           case 0:
             if (!handing) {
-              _context.next = 2;
+              _context.n = 1;
               break;
             }
-            return _context.abrupt("return", null);
-          case 2:
+            return _context.a(2, null);
+          case 1:
             val = value;
             if (!isRadioSelect && value === currentClickTreeNode) {
               // 如果当前点击了已经选中节点，那么取消选择
@@ -131,15 +123,14 @@ function List(props) {
               currentClickTreeNode: val,
               handing: true
             });
-            _context.next = 7;
+            _context.n = 2;
             return props === null || props === void 0 ? void 0 : (_props$onSelect = props.onSelect) === null || _props$onSelect === void 0 ? void 0 : _props$onSelect.call(props, val, item);
-          case 7:
+          case 2:
             setState({
               handing: false
             });
-          case 8:
-          case "end":
-            return _context.stop();
+          case 3:
+            return _context.a(2);
         }
       }, _callee);
     }));
@@ -278,8 +269,10 @@ function List(props) {
           onClick: function onClick(e) {
             e.stopPropagation();
           },
-          children: (operateButton === null || operateButton === void 0 ? void 0 : operateButton.length) > 1 ? _jsx(_Popover, {
-            overlayClassName: "pro-tree-operate-container",
+          children: (operateButton === null || operateButton === void 0 ? void 0 : operateButton.length) > 1 ? _jsx(Popover, {
+            classNames: {
+              root: 'pro-tree-operate-container'
+            },
             content: _jsx("div", {
               className: "pro-tree-operate-btn-popover",
               onClick: hide,
@@ -356,7 +349,7 @@ function List(props) {
   }
   return _jsx("div", {
     className: disabledMode === 'hide' ? 'hide-disable-node' : '',
-    children: (_treeData === null || _treeData === void 0 ? void 0 : _treeData.length) ? _jsx(_Tree, _objectSpread(_objectSpread(_objectSpread({}, others), additionProps), {}, {
+    children: (_treeData === null || _treeData === void 0 ? void 0 : _treeData.length) ? _jsx(Tree, _objectSpread(_objectSpread(_objectSpread({}, others), additionProps), {}, {
       disabled: disabled,
       style: {
         width: '100%'