@chaoswise/ui 3.1.7 → 3.1.8

package/lib/CWSelect/index.js

@@ -33,7 +33,58 @@ import update from "immutability-helper";
 import PropTypes from "prop-types";
 import { useIntl } from "../locales";
 import useStyle from "./index.style";
+
+/**
+ * 多选模式的默认配置选项
+ * @type {Object}
+ * @property {boolean} showCheckbox - 是否显示复选框
+ * @property {boolean} showSelectAll - 是否显示全选选项
+ * @property {boolean} isCheckboxMultipleHasSelectAll - 复选框多选模式是否包含全选功能
+ */
+var DEFAULT_MULTIPLE_OPTIONS = {
+  showCheckbox: false,
+  showSelectAll: true,
+  isCheckboxMultipleHasSelectAll: true
+};
+
+/**
+ * 安全获取嵌套对象属性值的辅助函数
+ * @param {Object} obj - 目标对象
+ * @param {Array} path - 属性路径数组
+ * @param {*} defaultValue - 默认值
+ * @returns {*} 获取到的值或默认值
+ */
+var getNestedValue = function getNestedValue(obj, path) {
+  var defaultValue = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  try {
+    var _path$reduce;
+    return (_path$reduce = path.reduce(function (current, key) {
+      return current === null || current === void 0 ? void 0 : current[key];
+    }, obj)) !== null && _path$reduce !== void 0 ? _path$reduce : defaultValue;
+  } catch (_unused) {
+    return defaultValue;
+  }
+};
+
+/**
+ * 检查是否为有效数组（非空数组）的辅助函数
+ * @param {*} arr - 待检查的值
+ * @returns {boolean} 是否为有效数组
+ */
+var isValidArray = function isValidArray(arr) {
+  return Array.isArray(arr) && arr.length > 0;
+};
+
+/**
+ * CWSelect 组件 - 增强版的 Select 选择器
+ * 支持多选、拖拽排序、复选框模式、标签自定义等功能
+ *
+ * @param {Object} props - 组件属性
+ * @param {React.Ref} ref - 组件引用
+ * @returns {React.Component} CWSelect 组件
+ */
 var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
+  // 解构 props，设置默认值
   var selectLabel = props.selectLabel,
     label = props.label,
     prefix = props.prefix,
@@ -59,14 +110,12 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
     maxTagTextLength = props.maxTagTextLength,
     dropdownRender = props.dropdownRender,
     _props$multipleOption = props.multipleOptions,
-    multipleOptions = _props$multipleOption === void 0 ? {
-      showCheckbox: false,
-      showSelectAll: true,
-      isCheckboxMultipleHasSelectAll: true
-    } : _props$multipleOption,
+    multipleOptions = _props$multipleOption === void 0 ? DEFAULT_MULTIPLE_OPTIONS : _props$multipleOption,
     children = props.children,
     maxCount = props.maxCount,
     rest = _objectWithoutProperties(props, _excluded);
+
+  // 获取国际化和样式相关的 hooks
   var intl = useIntl();
   var _useConfigContext = useConfigContext(),
     getPrefixCls = _useConfigContext.getPrefixCls;
@@ -76,124 +125,227 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
     wrapCSSVar = _useStyle2[0],
     hashId = _useStyle2[1],
     cssVarCls = _useStyle2[2];
-  var keyIndexMap = useRef({});
+
+  // 状态管理
+  var keyIndexMapRef = useRef({}); // 存储键值索引映射，避免重新渲染
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
     allInstance = _useState2[0],
-    setAllInstance = _useState2[1];
+    setAllInstance = _useState2[1]; // 所有实例数组
   var _useState3 = useState([]),
     _useState4 = _slicedToArray(_useState3, 2),
     allOptions = _useState4[0],
-    setAllOptions = _useState4[1];
+    setAllOptions = _useState4[1]; // 所有选项数组
   var _useState5 = useState([]),
     _useState6 = _slicedToArray(_useState5, 2),
     activeKey = _useState6[0],
-    setActiveKey = _useState6[1];
-  var _prefix = useMemo(function () {
+    setActiveKey = _useState6[1]; // 当前激活的键值数组
+
+  /**
+   * 计算前缀标签，优先级：prefix > label > selectLabel
+   */
+  var computedPrefix = useMemo(function () {
     return prefix || label || selectLabel;
   }, [prefix, label, selectLabel]);
-  var _showCheckbox = useMemo(function () {
+
+  /**
+   * 判断是否应该显示复选框
+   * 条件：多选模式 && (showCheckbox 为 true 或 multipleOptions.showCheckbox 为 true)
+   */
+  var shouldShowCheckbox = useMemo(function () {
     return mode === "multiple" && (showCheckbox || multipleOptions.showCheckbox);
   }, [mode, showCheckbox, multipleOptions.showCheckbox]);
-  var _showCheckAll = useMemo(function () {
-    return multipleOptions.isCheckboxMultipleHasSelectAll && !("maxCount" in props);
-  }, [multipleOptions.isCheckboxMultipleHasSelectAll, maxCount]);
-  useEffect(function () {
-    if (mode) {
-      getMapFromArray(defaultValue);
-    }
-  }, [defaultValue]);
-  useEffect(function () {
-    if (mode) {
-      getMapFromArray(value);
-    }
-  }, [value]);
+
+  /**
+   * 判断是否应该显示全选功能
+   * 条件：配置允许全选 && 没有设置最大选择数量 && 显示复选框
+   */
+  var shouldShowCheckAll = useMemo(function () {
+    return multipleOptions.isCheckboxMultipleHasSelectAll && !("maxCount" in props) && shouldShowCheckbox;
+  }, [multipleOptions.isCheckboxMultipleHasSelectAll, props, shouldShowCheckbox]);
+
+  /**
+   * 从数组值构建键值索引映射的函数
+   * @param {Array|*} _value - 输入值
+   */
   var getMapFromArray = useCallback(function (_value) {
-    setActiveKey(_value || []);
-    if (!_value) return;
-    var value = Array.isArray(_value) ? _value : [_value];
-    keyIndexMap.current = {};
-    var allKeys = value.map(function (item, index) {
-      var key = labelInValue ? item.value : item;
-      keyIndexMap.current[key] = {
-        index: index
-      };
+    var normalizedValue = _value || [];
+    setActiveKey(normalizedValue);
+
+    // 如果没有值，清空映射和实例
+    if (!_value) {
+      keyIndexMapRef.current = {};
+      setAllInstance([]);
+      return;
+    }
+
+    // 确保值是数组格式
+    var valueArray = Array.isArray(_value) ? _value : [_value];
+    var newKeyIndexMap = {};
+
+    // 构建键值数组和索引映射
+    var allKeys = valueArray.map(function (item, index) {
+      var key = labelInValue ? item === null || item === void 0 ? void 0 : item.value : item;
+      if (key !== undefined && key !== null) {
+        newKeyIndexMap[key] = {
+          index: index
+        };
+      }
       return key;
+    }).filter(function (key) {
+      return key !== undefined && key !== null;
     });
+    keyIndexMapRef.current = newKeyIndexMap;
+    // 使用 setTimeout 避免同步更新导致的性能问题
     setTimeout(function () {
       return setAllInstance(allKeys);
-    });
+    }, 0);
   }, [labelInValue]);
-  var _onChange = function _onChange(newValue, option) {
+
+  /**
+   * 监听默认值变化，初始化键值映射
+   */
+  useEffect(function () {
+    if (mode && defaultValue !== undefined) {
+      getMapFromArray(defaultValue);
+    }
+  }, [defaultValue, mode, getMapFromArray]);
+
+  /**
+   * 监听值变化，更新键值映射
+   */
+  useEffect(function () {
+    if (mode && value !== undefined) {
+      getMapFromArray(value);
+    }
+  }, [value, mode, getMapFromArray]);
+
+  /**
+   * 处理值变化的回调函数
+   * @param {*} newValue - 新值
+   * @param {*} option - 选项数据
+   */
+  var handleChange = useCallback(function (newValue, option) {
     onChange(newValue, option);
-    setAllOptions(option);
-    if (value) return;
-    if (mode) {
+    setAllOptions(Array.isArray(option) ? option : []);
+
+    // 只有在非受控模式下才更新内部状态
+    if (!("value" in props) && mode) {
       getMapFromArray(newValue);
     }
-  };
-  var onPreventMouseDown = function onPreventMouseDown(e) {
+  }, [onChange, props, mode, getMapFromArray]);
+
+  /**
+   * 阻止鼠标按下事件的默认行为和冒泡
+   * @param {Event} e - 事件对象
+   */
+  var handlePreventMouseDown = useCallback(function (e) {
     e.preventDefault();
     e.stopPropagation();
-  };
-  var renderTag = useCallback(function (props) {
-    var _disabled = rest.disabled || props.disabled;
+  }, []);
+
+  /**
+   * 渲染普通标签的函数
+   * @param {Object} tagProps - 标签属性
+   * @returns {React.Component|null} 标签组件
+   */
+  var renderTag = useCallback(function (tagProps) {
+    if (!(tagProps !== null && tagProps !== void 0 && tagProps.value)) return null;
+    var isDisabled = rest.disabled || tagProps.disabled;
     return /*#__PURE__*/React.createElement(CustomTag, {
-      tagProps: props,
-      key: props.value,
+      tagProps: tagProps,
+      key: tagProps.value,
       maxTagTextLength: maxTagTextLength,
       tagLabelRender: tagLabelRender,
-      closeIcon: !_disabled
+      closeIcon: !isDisabled
     });
   }, [maxTagTextLength, tagLabelRender, rest.disabled]);
+
+  /**
+   * 移动节点的函数，用于拖拽排序
+   * @param {number} dragIndex - 拖拽项索引
+   * @param {number} hoverIndex - 悬停项索引
+   */
   var moveNode = useCallback(function (dragIndex, hoverIndex) {
-    var dropChange = allInstance[dragIndex];
-    var dragChange = allInstance[hoverIndex];
-    var dragSortInstance = update(allInstance, {
-      $splice: [[dragIndex, 1, dragChange], [hoverIndex, 1, dropChange]]
+    // 如果索引相同或实例数组无效，直接返回
+    if (dragIndex === hoverIndex || !isValidArray(allInstance)) return;
+    var dragItem = allInstance[dragIndex];
+    var hoverItem = allInstance[hoverIndex];
+    if (!dragItem || !hoverItem) return;
+
+    // 使用 immutability-helper 进行不可变更新
+    var newInstance = update(allInstance, {
+      $splice: [[dragIndex, 1], [hoverIndex, 0, dragItem]]
     });
-    var dragAllOptions = dragSortInstance.map(function (item) {
-      var findOption = allOptions.find(function (i) {
-        return i.value === item;
+
+    // 重新排序选项数组
+    var newOptions = newInstance.map(function (item) {
+      return allOptions.find(function (option) {
+        return (option === null || option === void 0 ? void 0 : option.value) === item;
       });
-      return findOption;
-    });
-    onDragEnd(dragSortInstance);
-    _onChange(dragSortInstance, dragAllOptions, true);
-  }, [allInstance]);
+    }).filter(Boolean);
+    onDragEnd(newInstance);
+    handleChange(newInstance, newOptions);
+  }, [allInstance, allOptions, onDragEnd, handleChange]);
+
+  /**
+   * 标签下拉框覆盖层内容，用于显示超出最大数量的标签
+   */
   var tagDropdownOverlay = useMemo(function () {
+    if (!isValidArray(allInstance) || maxTagCount === undefined) {
+      return [];
+    }
+
+    // 获取超出最大数量的标签
     return allInstance.slice(maxTagCount).map(function (key) {
-      var props = keyIndexMap.current[key];
-      if (!props) return null;
-      var _disabled = rest.disabled || props.disabled;
+      var tagProps = keyIndexMapRef.current[key];
+      if (!tagProps) return null;
+      var isDisabled = rest.disabled || tagProps.disabled;
       return /*#__PURE__*/React.createElement(CustomTag, {
-        tagProps: props,
+        tagProps: tagProps,
         key: key,
         maxTagTextLength: maxTagTextLength,
         tagLabelRender: tagLabelRender,
-        closeIcon: !_disabled
+        closeIcon: !isDisabled
       });
-    });
+    }).filter(Boolean);
   }, [allInstance, maxTagCount, tagLabelRender, maxTagTextLength, rest.disabled]);
-  var _tagRender = function _tagRender(props) {
-    var node = keyIndexMap.current[props.value];
-    if (node) {
-      keyIndexMap.current[props.value] = _objectSpread(_objectSpread({}, keyIndexMap.current[props.value]), props);
+
+  /**
+   * 自定义标签渲染函数
+   * 处理拖拽、标签数量限制等逻辑
+   * @param {Object} tagProps - 标签属性
+   * @returns {React.Component|null} 渲染的标签组件
+   */
+  var customTagRender = useCallback(function (tagProps) {
+    if (!(tagProps !== null && tagProps !== void 0 && tagProps.value)) return null;
+    var currentNode = keyIndexMapRef.current[tagProps.value];
+
+    // 更新键值索引映射
+    if (currentNode) {
+      keyIndexMapRef.current[tagProps.value] = _objectSpread(_objectSpread({}, currentNode), tagProps);
     }
+
+    // 拖拽模式：返回可拖拽的标签
     if (allowDrag) {
-      var _disabled = rest.disabled || props.disabled;
+      var isDisabled = rest.disabled || tagProps.disabled;
       return /*#__PURE__*/React.createElement(DragTag, {
-        tagProps: keyIndexMap.current[props.value],
+        tagProps: keyIndexMapRef.current[tagProps.value],
         maxTagTextLength: maxTagTextLength,
         tagLabelRender: tagLabelRender,
-        closeIcon: !_disabled,
+        closeIcon: !isDisabled,
         moveNode: moveNode
       });
     }
+
+    // 无限制标签数量：直接渲染标签
     if (maxTagCount === undefined) {
-      return renderTag(props);
+      return renderTag(tagProps);
     }
-    if (node && node.index === maxTagCount) {
+
+    // 处理超出数量的标签：显示 "+N" 的聚合标签
+    if ((currentNode === null || currentNode === void 0 ? void 0 : currentNode.index) === maxTagCount) {
+      var extraCount = Math.max(0, Object.keys(keyIndexMapRef.current).length - maxTagCount);
       return /*#__PURE__*/React.createElement(_Tooltip, {
         overlayClassName: "".concat(prefixCls, "-tag-tooltip-wrapper"),
         overlay: tagDropdownOverlay,
@@ -202,90 +354,142 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
         className: "".concat(prefixCls, "-custom-tag"),
         type: "custom_type01",
         closeIcon: !rest.disabled,
-        onMouseDown: onPreventMouseDown,
-        onClose: function onClose(e) {
-          var filterAllInstance = activeKey.slice(0, maxTagCount);
-          var filterAllOptions = allOptions.slice(0, maxTagCount);
-          _onChange(filterAllInstance, filterAllOptions);
-          onDeselect(activeKey.slice(maxTagCount), allOptions.slice(maxTagCount));
+        onMouseDown: handlePreventMouseDown,
+        onClose: function onClose() {
+          // 关闭聚合标签时，移除所有超出数量的标签
+          var filteredInstance = activeKey.slice(0, maxTagCount);
+          var filteredOptions = allOptions.slice(0, maxTagCount);
+          var removedKeys = activeKey.slice(maxTagCount);
+          var removedOptions = allOptions.slice(maxTagCount);
+          handleChange(filteredInstance, filteredOptions);
+          onDeselect(removedKeys, removedOptions);
         }
-      }, "+", Object.keys(keyIndexMap.current).slice(maxTagCount).length));
+      }, "+", extraCount));
     }
-    if (node && node.index < maxTagCount) {
-      return renderTag(props);
+
+    // 正常显示的标签（在最大数量范围内）
+    if ((currentNode === null || currentNode === void 0 ? void 0 : currentNode.index) < maxTagCount) {
+      return renderTag(tagProps);
     }
-  };
-  var onCheckAllChange = function onCheckAllChange(e, currentDataSource, originDataSource) {
-    var _activeKey = [];
-    var activeDataSource = [];
+    return null;
+  }, [allowDrag, maxTagCount, renderTag, moveNode, tagDropdownOverlay, prefixCls, rest.disabled, handlePreventMouseDown, activeKey, allOptions, handleChange, onDeselect, maxTagTextLength, tagLabelRender]);
+
+  /**
+   * 处理全选/取消全选的回调函数
+   * @param {Event} e - 复选框事件
+   * @param {Array} currentDataSource - 当前数据源
+   * @param {Array} originDataSource - 原始数据源
+   */
+  var handleCheckAllChange = useCallback(function (e, currentDataSource, originDataSource) {
+    if (!isValidArray(currentDataSource)) return;
+    var isChecked = e.target.checked;
+
+    // 获取原始激活的数据源
     var originActiveDataSource = originDataSource.filter(function (item) {
-      return activeKey.find(function (i) {
-        return labelInValue ? i.value === item.value : i === item.value;
+      return activeKey.some(function (activeItem) {
+        return labelInValue ? (activeItem === null || activeItem === void 0 ? void 0 : activeItem.value) === (item === null || item === void 0 ? void 0 : item.value) : activeItem === (item === null || item === void 0 ? void 0 : item.value);
       });
     });
-    var currentDataSourceKey = currentDataSource.map(function (item) {
+
+    // 转换当前数据源为键值格式
+    var currentDataSourceKeys = currentDataSource.map(function (item) {
       return labelInValue ? {
-        value: item.value,
-        label: item.children
-      } : item.value;
-    });
-    if (e.target.checked) {
-      activeDataSource = Array.from(new Set([].concat(_toConsumableArray(originActiveDataSource), _toConsumableArray(currentDataSource))));
-      _activeKey = Array.from(new Set([].concat(_toConsumableArray(activeKey), _toConsumableArray(currentDataSourceKey))));
-      onSelect(currentDataSourceKey, currentDataSource);
+        value: item === null || item === void 0 ? void 0 : item.value,
+        label: item === null || item === void 0 ? void 0 : item.children
+      } : item === null || item === void 0 ? void 0 : item.value;
+    }).filter(Boolean);
+    var newActiveKey = [];
+    var newActiveDataSource = [];
+    if (isChecked) {
+      // 全选：合并原有选中项和当前数据源
+      newActiveDataSource = Array.from(new Set([].concat(_toConsumableArray(originActiveDataSource), _toConsumableArray(currentDataSource))));
+      newActiveKey = Array.from(new Set([].concat(_toConsumableArray(activeKey), _toConsumableArray(currentDataSourceKeys))));
+      onSelect(currentDataSourceKeys, currentDataSource);
     } else {
-      activeDataSource = originActiveDataSource.filter(function (item) {
-        return !currentDataSource.find(function (i) {
-          return i.value === item.value;
+      // 取消全选：从原有选中项中移除当前数据源
+      newActiveDataSource = originActiveDataSource.filter(function (item) {
+        return !currentDataSource.some(function (current) {
+          return (current === null || current === void 0 ? void 0 : current.value) === (item === null || item === void 0 ? void 0 : item.value);
         });
       });
-      _activeKey = activeKey.filter(function (item) {
-        return !currentDataSourceKey.find(function (i) {
-          return labelInValue ? item.value === i.value : item === i;
+      newActiveKey = activeKey.filter(function (item) {
+        return !currentDataSourceKeys.some(function (current) {
+          return labelInValue ? (item === null || item === void 0 ? void 0 : item.value) === (current === null || current === void 0 ? void 0 : current.value) : item === current;
         });
       });
-      onDeselect(currentDataSourceKey, currentDataSource);
+      onDeselect(currentDataSourceKeys, currentDataSource);
     }
-    _onChange(_activeKey, activeDataSource);
-  };
-  var customDropdownRender = function customDropdownRender(originNode) {
-    var _originNode$_owner, _originNode$_owner2, _originNode$_owner3;
-    var flattenOptions = (originNode === null || originNode === void 0 || (_originNode$_owner = originNode._owner) === null || _originNode$_owner === void 0 || (_originNode$_owner = _originNode$_owner.dependencies) === null || _originNode$_owner === void 0 || (_originNode$_owner = _originNode$_owner.firstContext) === null || _originNode$_owner === void 0 || (_originNode$_owner = _originNode$_owner.memoizedValue) === null || _originNode$_owner === void 0 ? void 0 : _originNode$_owner.flattenOptions) || [];
-    var originDataSource = (originNode === null || originNode === void 0 || (_originNode$_owner2 = originNode._owner) === null || _originNode$_owner2 === void 0 || (_originNode$_owner2 = _originNode$_owner2.dependencies) === null || _originNode$_owner2 === void 0 || (_originNode$_owner2 = _originNode$_owner2.firstContext) === null || _originNode$_owner2 === void 0 || (_originNode$_owner2 = _originNode$_owner2.memoizedValue) === null || _originNode$_owner2 === void 0 ? void 0 : _originNode$_owner2.options) || [];
+    handleChange(newActiveKey, newActiveDataSource);
+  }, [activeKey, labelInValue, onSelect, onDeselect, handleChange]);
+
+  /**
+   * 自定义下拉框渲染函数
+   * 处理复选框模式下的全选功能和空状态显示
+   * @param {React.ReactNode} originNode - 原始下拉框节点
+   * @returns {React.ReactNode} 自定义渲染的下拉框内容
+   */
+  var customDropdownRender = useCallback(function (originNode) {
+    // 从 React 内部属性中获取下拉框的状态数据
+    var memoizedProps = getNestedValue(originNode, ["_owner", "return", "memoizedProps", "value"], {});
+    var flattenOptions = memoizedProps.flattenOptions || [];
+    var originDataSource = memoizedProps.options || [];
+    var activeValues = Array.from(memoizedProps.rawValues || []);
+
+    // 提取有效的数据源（过滤掉分组选项）
     var dataSource = flattenOptions.filter(function (item) {
-      return item.hasOwnProperty("groupOption");
+      return item && Object.prototype.hasOwnProperty.call(item, "groupOption");
     }).map(function (item) {
       return item.data;
+    }).filter(Boolean);
+
+    // 空状态处理：没有数据时显示空状态提示
+    if (!isValidArray(dataSource)) {
+      var emptyContent = rest.notFoundContent || /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-show-checkbox-empty")
+      }, intl.get("812f44fc-ed3c-4bd3-8ad5-35cd2996c5ae").d("未查找到任何结果"));
+      return emptyContent;
+    }
+
+    // 计算全选状态
+    var dataSourceValues = dataSource.map(function (item) {
+      return item === null || item === void 0 ? void 0 : item.value;
+    }).filter(Boolean);
+    var filterActiveValues = dataSourceValues.filter(function (value) {
+      return activeValues.includes(value);
     });
-    var activeValues = Array.from(originNode === null || originNode === void 0 || (_originNode$_owner3 = originNode._owner) === null || _originNode$_owner3 === void 0 || (_originNode$_owner3 = _originNode$_owner3.dependencies) === null || _originNode$_owner3 === void 0 || (_originNode$_owner3 = _originNode$_owner3.firstContext) === null || _originNode$_owner3 === void 0 || (_originNode$_owner3 = _originNode$_owner3.memoizedValue) === null || _originNode$_owner3 === void 0 ? void 0 : _originNode$_owner3.rawValues);
-    var filterActiveValues = dataSource.map(function (item) {
-      return item.value;
-    }).filter(function (item) {
-      return activeValues.includes(item);
-    });
-    var notFoundContent = rest.notFoundContent || /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-show-checkbox-empty")
-    }, intl.get("812f44fc-ed3c-4bd3-8ad5-35cd2996c5ae").d("未查找到任何结果"));
-    return !dataSource.length ? notFoundContent : /*#__PURE__*/React.createElement(React.Fragment, null, _showCheckAll && /*#__PURE__*/React.createElement("div", {
+    var isAllSelected = filterActiveValues.length === dataSource.length && dataSource.length > 0;
+    var isIndeterminate = filterActiveValues.length > 0 && !isAllSelected;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, shouldShowCheckAll && /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-check-all"),
-      onMouseDown: onPreventMouseDown
+      onMouseDown: handlePreventMouseDown
     }, /*#__PURE__*/React.createElement(_Checkbox, {
-      indeterminate: filterActiveValues.length && filterActiveValues.length !== dataSource.length,
-      checked: filterActiveValues.length === dataSource.length,
+      indeterminate: isIndeterminate // 半选状态
+      ,
+      checked: isAllSelected // 全选状态
+      ,
       onChange: function onChange(e) {
-        return onCheckAllChange(e, dataSource, originDataSource);
+        return handleCheckAllChange(e, dataSource, originDataSource);
       },
       style: {
         width: "100%"
       }
     }, intl.get("3991a1d0-65a8-45ca-94a4-f89fbd9f8555").d("全选"), "\uFF08", filterActiveValues.length, "/", dataSource.length, "\uFF09")), originNode);
-  };
-  var renderCheckboxItem = function renderCheckboxItem(child) {
-    var isChecked = labelInValue ? activeKey.map(function (item) {
-      return item.value;
-    }).includes(child.props.value) : activeKey.includes(child.props.value);
+  }, [shouldShowCheckAll, prefixCls, handlePreventMouseDown, handleCheckAllChange, intl, rest.notFoundContent]);
+
+  /**
+   * 渲染复选框选项的函数
+   * @param {React.ReactElement} child - 子选项元素
+   * @returns {React.ReactElement|null} 渲染的复选框选项
+   */
+  var renderCheckboxItem = useCallback(function (child) {
+    if (!(child !== null && child !== void 0 && child.props)) return null;
+    var childValue = child.props.value;
+    // 判断当前选项是否被选中
+    var isChecked = labelInValue ? activeKey.some(function (item) {
+      return (item === null || item === void 0 ? void 0 : item.value) === childValue;
+    }) : activeKey.includes(childValue);
     return /*#__PURE__*/React.createElement("div", {
-      key: child.key,
+      key: child.key || childValue,
       className: "".concat(prefixCls, "-checkbox-item")
     }, /*#__PURE__*/React.createElement(_Checkbox, {
       disabled: child.props.disabled,
@@ -293,62 +497,131 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
     }), /*#__PURE__*/React.createElement("span", {
       className: "".concat(prefixCls, "-item-children")
     }, child.props.children));
-  };
-  var finalChildren = children;
-  if (_showCheckbox) {
-    finalChildren = React.Children.map(children, function (child) {
-      if (Array.isArray(child.props.children)) {
+  }, [activeKey, labelInValue, prefixCls]);
+
+  /**
+   * 处理子元素，在复选框模式下为每个选项添加复选框
+   */
+  var processedChildren = useMemo(function () {
+    if (!shouldShowCheckbox || !children) return children;
+    return React.Children.map(children, function (child) {
+      var _child$props, _child$props2;
+      if (!child) return null;
+
+      // 处理选项组（OptGroup）
+      if (Array.isArray((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.children)) {
         var groupChildren = React.Children.map(child.props.children, function (optGroupChild) {
-          return /*#__PURE__*/React.cloneElement(optGroupChild, {}, renderCheckboxItem(optGroupChild));
-        });
-        return /*#__PURE__*/React.cloneElement(child, {}, groupChildren);
+          var _optGroupChild$props;
+          if (!optGroupChild) return null;
+          return /*#__PURE__*/React.cloneElement(optGroupChild, {
+            key: optGroupChild.key || ((_optGroupChild$props = optGroupChild.props) === null || _optGroupChild$props === void 0 ? void 0 : _optGroupChild$props.value)
+          }, renderCheckboxItem(optGroupChild));
+        }).filter(Boolean);
+        return /*#__PURE__*/React.cloneElement(child, {
+          key: child.key
+        }, groupChildren);
       }
-      return /*#__PURE__*/React.cloneElement(child, {}, renderCheckboxItem(child));
-    });
-  }
+
+      // 处理普通选项
+      return /*#__PURE__*/React.cloneElement(child, {
+        key: child.key || ((_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.value)
+      }, renderCheckboxItem(child));
+    }).filter(Boolean);
+  }, [shouldShowCheckbox, children, renderCheckboxItem]);
+
+  /**
+   * 计算最终的 value 值
+   * 受控模式：使用传入的 value
+   * 非受控模式：根据是否显示复选框或允许拖拽来决定使用 activeKey 还是 value
+   */
+  var finalValue = useMemo(function () {
+    if ("value" in props) {
+      return value;
+    }
+    return shouldShowCheckbox || allowDrag ? activeKey : value;
+  }, [props, value, shouldShowCheckbox, allowDrag, activeKey]);
+
+  // 渲染组件
   return wrapCSSVar(/*#__PURE__*/React.createElement(DndProvider, {
     backend: HTML5Backend
   }, /*#__PURE__*/React.createElement(Select, _extends({
     ref: ref,
-    prefix: _prefix,
+    prefix: computedPrefix,
     defaultValue: defaultValue,
-    value: "value" in props ? value : showCheckbox || allowDrag ? activeKey : value,
+    value: finalValue,
     mode: mode,
-    onChange: _onChange,
-    tagRender: tagRender || _tagRender,
+    onChange: handleChange,
+    tagRender: tagRender || customTagRender,
     menuItemSelectedIcon: null,
     onSelect: onSelect,
     onDeselect: onDeselect,
-    children: finalChildren,
-    dropdownRender: dropdownRender !== null && dropdownRender !== void 0 ? dropdownRender : _showCheckbox ? customDropdownRender : null,
+    dropdownRender: dropdownRender !== null && dropdownRender !== void 0 ? dropdownRender : shouldShowCheckbox ? customDropdownRender : null,
     labelInValue: labelInValue,
     maxCount: maxCount
-  }, rest))));
+  }, rest), processedChildren)));
 });
+
+// PropTypes 类型定义
 CWSelect.propTypes = {
   allowClear: PropTypes.bool,
+  // 是否允许清除
   disabled: PropTypes.bool,
+  // 是否禁用
   dropdownRender: PropTypes.func,
+  // 自定义下拉框渲染函数
   labelInValue: PropTypes.bool,
+  // 是否把 label 包装到 value 中
   maxTagCount: PropTypes.number,
+  // 最大标签显示数量
   maxTagTextLength: PropTypes.number,
+  // 标签文本最大长度
   mode: PropTypes.oneOf(["multiple", "tags"]),
+  // 选择模式
   notFoundContent: PropTypes.node,
+  // 无数据时的内容
   tagLabelRender: PropTypes.func,
+  // 标签文本渲染函数
   menuItemSelectedIcon: PropTypes.node,
+  // 选中项图标
   onChange: PropTypes.func,
+  // 值变化回调
   onDeselect: PropTypes.func,
+  // 取消选中回调
   onPopupScroll: PropTypes.func,
+  // 下拉框滚动回调
   onSearch: PropTypes.func,
+  // 搜索回调
   onSelect: PropTypes.func,
+  // 选中回调
   loading: PropTypes.bool,
+  // 是否加载中
   tagRender: PropTypes.func,
+  // 自定义标签渲染函数
   allowDrag: PropTypes.bool,
+  // 是否允许拖拽
   onDragEnd: PropTypes.func,
+  // 拖拽结束回调
   showCheckbox: PropTypes.bool,
+  // 是否显示复选框
   listHeight: PropTypes.number,
+  // 列表高度
   selectLabel: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  label: PropTypes.oneOfType([PropTypes.string, PropTypes.node])
+  // 选择器标签
+  label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  // 标签
+  multipleOptions: PropTypes.shape({
+    // 多选配置选项
+    showCheckbox: PropTypes.bool,
+    // 是否显示复选框
+    showSelectAll: PropTypes.bool,
+    // 是否显示全选
+    isCheckboxMultipleHasSelectAll: PropTypes.bool // 复选框多选是否包含全选
+  })
 };
+
+// 设置组件显示名称
+CWSelect.displayName = "CWSelect";
+
+// 克隆原始 Select 组件的属性
 cloneComProps(Select, CWSelect);
 export default CWSelect;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chaoswise/ui",
   "packageName": "chaoswiseUI",
-  "version": "3.1.7",
+  "version": "3.1.8",
   "description": "公共UI库",
   "keywords": [
     "ui",