@ant-design/pro-components 3.1.0-0 → 3.1.1-1

package/lib/field/components/Select/SearchSelect/index.js

@@ -1,92 +1,78 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _antd = require("antd");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
 var _utils = require("../../../../utils");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["optionItemRender", "mode", "onSearch", "onFocus", "onChange", "autoClearSearchValue", "searchOnFocus", "resetAfterSelect", "fetchDataOnSearch", "optionFilterProp", "optionLabelProp", "className", "disabled", "options", "fetchData", "resetData", "prefixCls", "onClear", "searchValue", "showSearch", "fieldNames", "defaultSearchValue", "preserveOriginalLabel"],
-  _excluded2 = ["className", "optionType"]; // 支持 key, value, label，兼容 UserSearch 中只填写了 key 的情况。
+// 支持 key, value, label，兼容 UserSearch 中只填写了 key 的情况。
+
 /** 用户扩展数据后的值类型 */
+
 /** 可能单选，可能多选 */
-var SearchSelect = function SearchSelect(props, ref) {
-  var optionItemRender = props.optionItemRender,
-    mode = props.mode,
-    onSearch = props.onSearch,
-    _onFocus = props.onFocus,
-    _onChange = props.onChange,
-    _props$autoClearSearc = props.autoClearSearchValue,
-    autoClearSearchValue = _props$autoClearSearc === void 0 ? true : _props$autoClearSearc,
-    _props$searchOnFocus = props.searchOnFocus,
-    searchOnFocus = _props$searchOnFocus === void 0 ? false : _props$searchOnFocus,
-    _props$resetAfterSele = props.resetAfterSelect,
-    resetAfterSelect = _props$resetAfterSele === void 0 ? false : _props$resetAfterSele,
-    _props$fetchDataOnSea = props.fetchDataOnSearch,
-    fetchDataOnSearch = _props$fetchDataOnSea === void 0 ? true : _props$fetchDataOnSea,
-    _props$optionFilterPr = props.optionFilterProp,
-    optionFilterProp = _props$optionFilterPr === void 0 ? 'label' : _props$optionFilterPr,
-    _props$optionLabelPro = props.optionLabelProp,
-    optionLabelProp = _props$optionLabelPro === void 0 ? 'label' : _props$optionLabelPro,
-    className = props.className,
-    disabled = props.disabled,
-    options = props.options,
-    fetchData = props.fetchData,
-    resetData = props.resetData,
-    customizePrefixCls = props.prefixCls,
-    _onClear = props.onClear,
-    propsSearchValue = props.searchValue,
-    showSearch = props.showSearch,
-    fieldNames = props.fieldNames,
-    defaultSearchValue = props.defaultSearchValue,
-    _props$preserveOrigin = props.preserveOriginalLabel,
-    _preserveOriginalLabel = _props$preserveOrigin === void 0 ? false : _props$preserveOrigin,
-    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  var _ref = fieldNames || {},
-    _ref$label = _ref.label,
-    labelPropsName = _ref$label === void 0 ? 'label' : _ref$label,
-    _ref$value = _ref.value,
-    valuePropsName = _ref$value === void 0 ? 'value' : _ref$value,
-    _ref$options = _ref.options,
-    optionsPropsName = _ref$options === void 0 ? 'options' : _ref$options;
-  var _useState = (0, _react.useState)(propsSearchValue !== null && propsSearchValue !== void 0 ? propsSearchValue : defaultSearchValue),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    searchValue = _useState2[0],
-    setSearchValue = _useState2[1];
-  var selectRef = (0, _react.useRef)();
-  (0, _react.useImperativeHandle)(ref, function () {
-    return selectRef.current;
-  });
-  (0, _react.useEffect)(function () {
+
+const SearchSelect = (props, ref) => {
+  const {
+    optionItemRender,
+    mode,
+    onSearch,
+    onFocus,
+    onChange,
+    autoClearSearchValue = true,
+    searchOnFocus = false,
+    resetAfterSelect = false,
+    fetchDataOnSearch = true,
+    optionFilterProp = 'label',
+    optionLabelProp = 'label',
+    className,
+    disabled,
+    options,
+    fetchData,
+    resetData,
+    prefixCls: customizePrefixCls,
+    onClear,
+    searchValue: propsSearchValue,
+    showSearch,
+    fieldNames,
+    defaultSearchValue,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    preserveOriginalLabel: _preserveOriginalLabel = false,
+    ...restProps
+  } = props;
+  const {
+    label: labelPropsName = 'label',
+    value: valuePropsName = 'value',
+    options: optionsPropsName = 'options'
+  } = fieldNames || {};
+  const [searchValue, setSearchValue] = (0, _react.useState)(propsSearchValue ?? defaultSearchValue);
+  const selectRef = (0, _react.useRef)();
+  (0, _react.useImperativeHandle)(ref, () => selectRef.current);
+  (0, _react.useEffect)(() => {
     if (restProps.autoFocus) {
-      var _selectRef$current;
-      selectRef === null || selectRef === void 0 || (_selectRef$current = selectRef.current) === null || _selectRef$current === void 0 || _selectRef$current.focus();
+      selectRef?.current?.focus();
     }
   }, [restProps.autoFocus]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     setSearchValue(propsSearchValue);
   }, [propsSearchValue]);
-  var _useContext = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext),
-    getPrefixCls = _useContext.getPrefixCls;
-  var prefixCls = getPrefixCls('pro-filed-search-select', customizePrefixCls);
+  const {
+    getPrefixCls
+  } = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls('pro-filed-search-select', customizePrefixCls);
 
   // 兼容 renderXXX API。
 
-  var classString = (0, _classnames.default)(prefixCls, className, (0, _defineProperty2.default)({}, "".concat(prefixCls, "-disabled"), disabled));
+  const classString = (0, _clsx.clsx)(prefixCls, className, {
+    [`${prefixCls}-disabled`]: disabled
+  });
 
   // 获取原始 label 的辅助函数
-  var getOriginalLabel = function getOriginalLabel(item, fallbackValue) {
+  const getOriginalLabel = (item, fallbackValue) => {
     // 优先使用 dataItem.label（原始字符串），避免使用 value.label（可能是 optionItemRender 渲染的组件）
     if (item && typeof item.label === 'string' && item.label) {
       return item.label;
@@ -105,8 +91,8 @@ var SearchSelect = function SearchSelect(props, ref) {
     if (fallbackValue && fallbackValue.label) {
       // 如果是 React 元素（Highlight 组件），尝试提取其 props.label
       // 检查多种可能的 React 元素格式
-      var labelValue = fallbackValue.label;
-      if (( /*#__PURE__*/_react.default.isValidElement(labelValue) || labelValue && (0, _typeof2.default)(labelValue) === 'object' && 'props' in labelValue) && labelValue.props && labelValue.props.label) {
+      const labelValue = fallbackValue.label;
+      if (( /*#__PURE__*/_react.default.isValidElement(labelValue) || labelValue && typeof labelValue === 'object' && 'props' in labelValue) && labelValue.props && labelValue.props.label) {
         return String(labelValue.props.label);
       }
       // 如果是字符串，直接返回
@@ -118,57 +104,59 @@ var SearchSelect = function SearchSelect(props, ref) {
     }
     return '';
   };
-  var getMergeValue = function getMergeValue(value, option) {
+  const getMergeValue = (value, option) => {
     if (Array.isArray(value) && Array.isArray(option) && value.length > 0) {
       // 多选情况且用户有选择
 
-      return value.map(function (item, index) {
-        var optionItem = option === null || option === void 0 ? void 0 : option[index];
-        var dataItem = optionItem === null || optionItem === void 0 ? void 0 : optionItem['data-item'];
-        var originalLabel = getOriginalLabel(dataItem, item);
-        return (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, dataItem || {}), item), {}, {
+      return value.map((item, index) => {
+        const optionItem = option?.[index];
+        const dataItem = optionItem?.['data-item'];
+        const originalLabel = getOriginalLabel(dataItem, item);
+        return {
+          ...(dataItem || {}),
+          ...item,
           label: originalLabel || item.label
-        });
+        };
       });
     }
     return [];
   };
-  var genOptions = function genOptions(mapOptions) {
-    return mapOptions.map(function (item, index) {
-      var _item$labelPropsName, _item$optionsPropsNam;
-      var _ref2 = item,
-        itemClassName = _ref2.className,
-        optionType = _ref2.optionType,
-        resetItem = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+  const genOptions = mapOptions => {
+    return mapOptions.map((item, index) => {
+      const {
+        className: itemClassName,
+        optionType,
+        ...resetItem
+      } = item;
 
       // 获取 label，优先使用 labelPropsName，如果没有则使用 text（valueEnum 的情况）
-      var label = (_item$labelPropsName = item[labelPropsName]) !== null && _item$labelPropsName !== void 0 ? _item$labelPropsName : item.text;
-      var value = item[valuePropsName];
-      var itemOptions = (_item$optionsPropsNam = item[optionsPropsName]) !== null && _item$optionsPropsNam !== void 0 ? _item$optionsPropsNam : [];
+      const label = item[labelPropsName] ?? item.text;
+      const value = item[valuePropsName];
+      const itemOptions = item[optionsPropsName] ?? [];
       if (optionType === 'optGroup' || item.options) {
-        return (0, _objectSpread2.default)((0, _objectSpread2.default)({
-          label: label
-        }, resetItem), {}, {
+        return {
+          label: label,
+          ...resetItem,
           data_title: label,
           title: label,
-          key: value !== null && value !== void 0 ? value : "".concat(label === null || label === void 0 ? void 0 : label.toString(), "-").concat(index, "-").concat((0, _utils.nanoid)()),
+          key: value ?? `${label?.toString()}-${index}-${(0, _utils.nanoid)()}`,
           // 防止因key相同导致虚拟滚动出问题
           children: genOptions(itemOptions)
-        });
+        };
       }
-      return (0, _objectSpread2.default)((0, _objectSpread2.default)({
-        title: label
-      }, resetItem), {}, {
+      return {
+        title: label,
+        ...resetItem,
         data_title: label,
-        value: value !== null && value !== void 0 ? value : index,
-        key: value !== null && value !== void 0 ? value : "".concat(label === null || label === void 0 ? void 0 : label.toString(), "-").concat(index, "-").concat((0, _utils.nanoid)()),
+        value: value ?? index,
+        key: value ?? `${label?.toString()}-${index}-${(0, _utils.nanoid)()}`,
         'data-item': item,
-        className: "".concat(prefixCls, "-option ").concat(itemClassName || '').trim(),
-        label: (optionItemRender === null || optionItemRender === void 0 ? void 0 : optionItemRender(item)) || label
-      });
+        className: `${prefixCls}-option ${itemClassName || ''}`.trim(),
+        label: optionItemRender?.(item) || label
+      };
     });
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Select, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Select, {
     ref: selectRef,
     className: classString,
     allowClear: true,
@@ -179,43 +167,43 @@ var SearchSelect = function SearchSelect(props, ref) {
     searchValue: searchValue,
     optionFilterProp: optionFilterProp,
     optionLabelProp: optionLabelProp,
-    onClear: function onClear() {
-      _onClear === null || _onClear === void 0 || _onClear();
+    onClear: () => {
+      onClear?.();
       fetchData(undefined);
       if (showSearch) {
-        onSearch === null || onSearch === void 0 || onSearch('');
+        onSearch?.('');
         setSearchValue('');
       }
-    }
-  }, restProps), {}, {
-    filterOption: restProps.filterOption == false ? false : function (inputValue, option) {
-      var _option$data_title, _option;
+    },
+    ...restProps,
+    filterOption: restProps.filterOption == false ? false : (inputValue, option) => {
       // 当 inputValue 为空或 searchValue 为空时，显示所有选项
       // 这样可以确保 searchOnFocus 时能够显示所有选项
-      var effectiveSearchValue = searchValue === '' ? '' : inputValue || searchValue;
+      const effectiveSearchValue = searchValue === '' ? '' : inputValue || searchValue;
       if (!effectiveSearchValue) {
         return true;
       }
       if (restProps.filterOption && typeof restProps.filterOption === 'function') {
-        return restProps.filterOption(effectiveSearchValue, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, option), {}, {
-          label: option === null || option === void 0 ? void 0 : option.data_title
-        }));
+        return restProps.filterOption(effectiveSearchValue, {
+          ...option,
+          label: option?.data_title
+        });
       }
-      return !!(option !== null && option !== void 0 && (_option$data_title = option.data_title) !== null && _option$data_title !== void 0 && _option$data_title.toString().toLowerCase().includes(effectiveSearchValue.toLowerCase()) || option !== null && option !== void 0 && (_option = option[optionFilterProp]) !== null && _option !== void 0 && _option.toString().toLowerCase().includes(effectiveSearchValue.toLowerCase()));
+      return !!(option?.data_title?.toString().toLowerCase().includes(effectiveSearchValue.toLowerCase()) || option?.[optionFilterProp]?.toString().toLowerCase().includes(effectiveSearchValue.toLowerCase()));
     } // 这里使用pro-components的过滤逻辑
     ,
-    onSearch: showSearch ? function (value) {
+    onSearch: showSearch ? value => {
       if (fetchDataOnSearch) {
         fetchData(value);
       }
-      onSearch === null || onSearch === void 0 || onSearch(value);
+      onSearch?.(value);
       setSearchValue(value);
     } : undefined,
-    onChange: function onChange(value, optionList) {
+    onChange: (value, optionList, ...rest) => {
       // 将搜索框置空 和 antd 行为保持一致
       if (showSearch && autoClearSearchValue) {
         fetchData(undefined);
-        onSearch === null || onSearch === void 0 || onSearch('');
+        onSearch?.('');
         setSearchValue('');
       } else if (showSearch && !autoClearSearchValue) {
         // 当 autoClearSearchValue 为 false 时，保持搜索值不变
@@ -227,42 +215,28 @@ var SearchSelect = function SearchSelect(props, ref) {
           // 我们不需要做任何特殊处理，让 Ant Design 自然处理
         }
       }
-      for (var _len = arguments.length, rest = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
-        rest[_key - 2] = arguments[_key];
-      }
       if (!props.labelInValue) {
-        _onChange === null || _onChange === void 0 || _onChange.apply(void 0, [value, optionList].concat(rest));
+        onChange?.(value, optionList, ...rest);
         return;
       }
       if (mode !== 'multiple' && !Array.isArray(optionList)) {
         // 单选情况且用户选择了选项
-        var dataItem = optionList && optionList['data-item'];
+        let dataItem = optionList && optionList['data-item'];
 
         // 如果 dataItem 不存在，尝试从 options 中查找对应的原始数据
-        var foundDataItem = dataItem;
+        let foundDataItem = dataItem;
         if (!foundDataItem && value && options) {
-          var _value$valuePropsName;
-          var optionValue = (_value$valuePropsName = value[valuePropsName]) !== null && _value$valuePropsName !== void 0 ? _value$valuePropsName : value.value;
-          var findDataItem = function findDataItem(opts) {
-            var _iterator = (0, _createForOfIteratorHelper2.default)(opts),
-              _step;
-            try {
-              for (_iterator.s(); !(_step = _iterator.n()).done;) {
-                var _opt$valuePropsName;
-                var opt = _step.value;
-                var optValue = (_opt$valuePropsName = opt[valuePropsName]) !== null && _opt$valuePropsName !== void 0 ? _opt$valuePropsName : opt.value;
-                if (optValue === optionValue) {
-                  return opt;
-                }
-                if (opt[optionsPropsName] || opt.options) {
-                  var found = findDataItem(opt[optionsPropsName] || opt.options || []);
-                  if (found) return found;
-                }
+          const optionValue = value[valuePropsName] ?? value.value;
+          const findDataItem = opts => {
+            for (const opt of opts) {
+              const optValue = opt[valuePropsName] ?? opt.value;
+              if (optValue === optionValue) {
+                return opt;
+              }
+              if (opt[optionsPropsName] || opt.options) {
+                const found = findDataItem(opt[optionsPropsName] || opt.options || []);
+                if (found) return found;
               }
-            } catch (err) {
-              _iterator.e(err);
-            } finally {
-              _iterator.f();
             }
             return null;
           };
@@ -271,40 +245,43 @@ var SearchSelect = function SearchSelect(props, ref) {
 
         // 如果value值为空则是清空时产生的回调,直接传值就可以了
         if (!value || !foundDataItem) {
-          var originalLabel = getOriginalLabel(foundDataItem, value);
-          var changedValue = value ? (0, _objectSpread2.default)((0, _objectSpread2.default)({}, value), {}, {
+          const originalLabel = getOriginalLabel(foundDataItem, value);
+          const changedValue = value ? {
+            ...value,
             label: originalLabel
-          }) : value;
-          _onChange === null || _onChange === void 0 || _onChange.apply(void 0, [changedValue, optionList].concat(rest));
+          } : value;
+          onChange?.(changedValue, optionList, ...rest);
         } else {
           // 确保使用 dataItem.label（原始字符串），避免使用 value.label（可能是 optionItemRender 渲染的组件）
-          var _originalLabel = getOriginalLabel(foundDataItem, value);
-          _onChange === null || _onChange === void 0 || _onChange.apply(void 0, [(0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, value), foundDataItem), {}, {
-            label: _originalLabel
-          }), optionList].concat(rest));
+          const originalLabel = getOriginalLabel(foundDataItem, value);
+          onChange?.({
+            ...value,
+            ...foundDataItem,
+            label: originalLabel
+          }, optionList, ...rest);
         }
         return;
       }
       // 合并值
-      var mergeValue = getMergeValue(value, optionList);
-      _onChange === null || _onChange === void 0 || _onChange.apply(void 0, [mergeValue, optionList].concat(rest));
+      const mergeValue = getMergeValue(value, optionList);
+      onChange?.(mergeValue, optionList, ...rest);
 
       // 将搜索结果置空，重新搜索
       if (resetAfterSelect) resetData();
     },
-    onFocus: function onFocus(e) {
+    onFocus: e => {
       if (searchOnFocus) {
         // 当 searchOnFocus 为 true 时，应该清空搜索关键词以显示所有选项
         fetchData(undefined);
         // 同时清空搜索值
         if (showSearch) {
-          onSearch === null || onSearch === void 0 || onSearch('');
+          onSearch?.('');
           setSearchValue('');
         }
       }
-      _onFocus === null || _onFocus === void 0 || _onFocus(e);
+      onFocus?.(e);
     },
     options: genOptions(options || [])
-  }));
+  });
 };
 var _default = exports.default = /*#__PURE__*/_react.default.forwardRef(SearchSelect);

package/lib/field/components/Select/index.d.ts

@@ -43,7 +43,7 @@ declare const _default: React.ForwardRefExoticComponent<import("../../../provide
     params?: any;
     /** 组件的全局设置 */
     fieldProps?: any;
-    variant?: "filled" | "outlined" | "borderless" | undefined;
+    variant?: "outlined" | "filled" | "borderless" | undefined;
     id?: string | undefined;
     /** 默认搜素条件 */
     defaultKeyWords?: string | undefined;