@hsu-react/ui 0.0.13 → 0.0.15

package/es/components/Search/_utils/calculateButtonGroupAndColumnWidth.js

@@ -1,12 +1,12 @@
 import { measureButtonGroupWidth } from "./measureButtonGroupWidth";
 
 /**
- * 计算按钮组宽度和列宽
- * @param containerRef 容器引用
- * @param buttonGroupRef 按钮组引用
- * @param adaptiveColumnNum 自适应列数
- * @param columnOffsetWidth 列偏移宽度（默认 0）
- * @returns 按钮组宽度和列宽
+ * Computes the button group width and column width
+ * @param containerRef Container ref
+ * @param buttonGroupRef Button group ref
+ * @param adaptiveColumnNum Adaptive column count
+ * @param columnOffsetWidth Column offset width (default 0)
+ * @returns Button group width and column width
  */
 export function calculateButtonGroupAndColumnWidth(containerRef, buttonGroupRef, adaptiveColumnNum) {
   var columnOffsetWidth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
@@ -14,13 +14,13 @@ export function calculateButtonGroupAndColumnWidth(containerRef, buttonGroupRef,
   var columnWidth;
   if (containerRef.current && buttonGroupRef.current) {
     var containerWidth = containerRef.current.offsetWidth;
-    var availableWidth = containerWidth - 30; // 减去padding
-    var gap = 10; // 项之间的间距
+    var availableWidth = containerWidth - 30; // Subtract padding
+    var gap = 10; // Gap between items
 
-    // 计算按钮组宽度
+    // Compute the button group width
     buttonGroupWidth = measureButtonGroupWidth(buttonGroupRef.current);
 
-    // 计算列宽（单个搜索项的默认宽度）
+    // Compute the column width (default width of a single search item)
     if (adaptiveColumnNum > 0) {
       columnWidth = availableWidth - (((availableWidth - adaptiveColumnNum * gap) / (adaptiveColumnNum + 1) - columnOffsetWidth) * adaptiveColumnNum + adaptiveColumnNum * gap);
     }

package/es/components/Search/_utils/calculateVisibleItems.d.ts

@@ -1,13 +1,13 @@
 import { FormItemProps } from "../../FormItem";
 /**
- * 计算当前应该显示的搜索项
- * @param searchItems 所有搜索项
- * @param expand 是否展开
- * @param columnNum 列数
- * @param visibleItemCount 可见项数量（自适应宽度时使用）
- * @param autoAdaptWidth 是否启用自适应宽度
- * @param buttonGroupWidth 按钮组宽度（可选）
- * @param columnWidth 列宽（可选）
- * @returns 当前应该显示的搜索项
+ * Computes the search items that should currently be displayed
+ * @param searchItems All search items
+ * @param expand Whether expanded
+ * @param columnNum Column count
+ * @param visibleItemCount Visible item count (used with adaptive width)
+ * @param autoAdaptWidth Whether adaptive width is enabled
+ * @param buttonGroupWidth Button group width (optional)
+ * @param columnWidth Column width (optional)
+ * @returns The search items that should currently be displayed
  */
 export declare function calculateVisibleItems(searchItems: FormItemProps[], expand: boolean, columnNum: number, visibleItemCount: number, autoAdaptWidth: boolean, buttonGroupWidth?: number, columnWidth?: number): FormItemProps[];

package/es/components/Search/_utils/calculateVisibleItems.js

@@ -1,15 +1,15 @@
 import { shouldDisplayExtraItem } from "./shouldDisplayExtraItem";
 
 /**
- * 计算当前应该显示的搜索项
- * @param searchItems 所有搜索项
- * @param expand 是否展开
- * @param columnNum 列数
- * @param visibleItemCount 可见项数量（自适应宽度时使用）
- * @param autoAdaptWidth 是否启用自适应宽度
- * @param buttonGroupWidth 按钮组宽度（可选）
- * @param columnWidth 列宽（可选）
- * @returns 当前应该显示的搜索项
+ * Computes the search items that should currently be displayed
+ * @param searchItems All search items
+ * @param expand Whether expanded
+ * @param columnNum Column count
+ * @param visibleItemCount Visible item count (used with adaptive width)
+ * @param autoAdaptWidth Whether adaptive width is enabled
+ * @param buttonGroupWidth Button group width (optional)
+ * @param columnWidth Column width (optional)
+ * @returns The search items that should currently be displayed
  */
 export function calculateVisibleItems(searchItems, expand, columnNum, visibleItemCount, autoAdaptWidth, buttonGroupWidth, columnWidth) {
   var visibleItems = searchItems.filter(function (item) {
@@ -19,14 +19,14 @@ export function calculateVisibleItems(searchItems, expand, columnNum, visibleIte
     return item.width !== undefined;
   });
   if (!expand) {
-    // 当有自定义宽度时，使用自适应计算
+    // When there are custom widths, use adaptive calculation
     if (hasCustomWidth && autoAdaptWidth) {
       if (visibleItems.length > visibleItemCount) {
         return visibleItems.slice(0, visibleItemCount);
       }
     } else if (!hasCustomWidth) {
-      // 没有自定义宽度时，使用 columnNum（实际搜索项数量）
-      // 判断按钮组宽度是否大于列宽，如果是，则显示 实际搜索项数量+1
+      // Without custom widths, use columnNum (actual search item count)
+      // If the button group is wider than a column, display actual search item count + 1
       var displayCount = shouldDisplayExtraItem(buttonGroupWidth, columnWidth, columnNum, visibleItems.length) ? columnNum + 1 : columnNum;
       if (visibleItems.length >= displayCount) {
         return visibleItems.slice(0, displayCount);

package/es/components/Search/_utils/cleanSearchData.d.ts

@@ -1,6 +1,6 @@
 /**
- * 清理搜索数据，移除 undefined 值
- * @param data 原始搜索数据
- * @returns 清理后的搜索数据
+ * Cleans search data by removing undefined values
+ * @param data Raw search data
+ * @returns Cleaned search data
  */
 export declare function cleanSearchData<T = Record<string, unknown>>(data: Record<string, unknown>): Partial<T> | undefined;

package/es/components/Search/_utils/cleanSearchData.js

@@ -1,7 +1,7 @@
 /**
- * 清理搜索数据，移除 undefined 值
- * @param data 原始搜索数据
- * @returns 清理后的搜索数据
+ * Cleans search data by removing undefined values
+ * @param data Raw search data
+ * @returns Cleaned search data
  */
 export function cleanSearchData(data) {
   var cleaned = {};

package/es/components/Search/_utils/measureButtonGroupWidth.d.ts

@@ -1,6 +1,6 @@
 /**
- * 计算按钮组的实际宽度（所有子元素宽度总和 + 子元素间距）
- * @param buttonGroupEl 按钮组元素
- * @returns 按钮组宽度；无子元素时返回 undefined
+ * Computes the actual width of the button group (sum of all child element widths + gaps between children)
+ * @param buttonGroupEl Button group element
+ * @returns Button group width; undefined when there are no children
  */
 export declare function measureButtonGroupWidth(buttonGroupEl: HTMLElement | null): number | undefined;

package/es/components/Search/_utils/measureButtonGroupWidth.js

@@ -1,7 +1,7 @@
 /**
- * 计算按钮组的实际宽度（所有子元素宽度总和 + 子元素间距）
- * @param buttonGroupEl 按钮组元素
- * @returns 按钮组宽度；无子元素时返回 undefined
+ * Computes the actual width of the button group (sum of all child element widths + gaps between children)
+ * @param buttonGroupEl Button group element
+ * @returns Button group width; undefined when there are no children
  */
 export function measureButtonGroupWidth(buttonGroupEl) {
   if (!buttonGroupEl) return undefined;
@@ -11,7 +11,7 @@ export function measureButtonGroupWidth(buttonGroupEl) {
   buttonChildren.forEach(function (child) {
     totalWidth += child.offsetWidth;
   });
-  // 加上子元素之间的间距
+  // Add the gaps between child elements
   var childGap = 5;
   totalWidth += (buttonChildren.length - 1) * childGap;
   return totalWidth;

package/es/components/Search/_utils/shouldDisplayExtraItem.d.ts

@@ -1,11 +1,11 @@
 /**
- * 判断收起状态下是否应多显示一个搜索项
+ * Determines whether one extra search item should be displayed in collapsed state
  *
- * 规则：按钮组宽度大于列宽（按钮组独占更宽空间，首行有富余）；
- * 或按钮组宽度小于列宽且可见项刚好比列数多 1（此时收起只会藏起 1 项，不如直接放下）。
- * @param buttonGroupWidth 按钮组宽度
- * @param columnWidth 列宽
- * @param columnNum 搜索项列数（不含按钮组）
- * @param visibleCount 可见搜索项总数
+ * Rules: the button group is wider than a column (the button group takes up more space on its own, leaving spare room in the first row);
+ * or the button group is narrower than a column and the visible items exceed the column count by exactly 1 (collapsing would only hide 1 item, so it's better to just fit it in).
+ * @param buttonGroupWidth Button group width
+ * @param columnWidth Column width
+ * @param columnNum Search item column count (excluding the button group)
+ * @param visibleCount Total number of visible search items
  */
 export declare function shouldDisplayExtraItem(buttonGroupWidth: number | undefined, columnWidth: number | undefined, columnNum: number, visibleCount: number): boolean;

package/es/components/Search/_utils/shouldDisplayExtraItem.js

@@ -1,12 +1,12 @@
 /**
- * 判断收起状态下是否应多显示一个搜索项
+ * Determines whether one extra search item should be displayed in collapsed state
  *
- * 规则：按钮组宽度大于列宽（按钮组独占更宽空间，首行有富余）；
- * 或按钮组宽度小于列宽且可见项刚好比列数多 1（此时收起只会藏起 1 项，不如直接放下）。
- * @param buttonGroupWidth 按钮组宽度
- * @param columnWidth 列宽
- * @param columnNum 搜索项列数（不含按钮组）
- * @param visibleCount 可见搜索项总数
+ * Rules: the button group is wider than a column (the button group takes up more space on its own, leaving spare room in the first row);
+ * or the button group is narrower than a column and the visible items exceed the column count by exactly 1 (collapsing would only hide 1 item, so it's better to just fit it in).
+ * @param buttonGroupWidth Button group width
+ * @param columnWidth Column width
+ * @param columnNum Search item column count (excluding the button group)
+ * @param visibleCount Total number of visible search items
  */
 export function shouldDisplayExtraItem(buttonGroupWidth, columnWidth, columnNum, visibleCount) {
   return buttonGroupWidth !== undefined && columnWidth !== undefined && (buttonGroupWidth > columnWidth || buttonGroupWidth < columnWidth && columnNum + 1 === visibleCount);

package/es/components/Search/index.d.ts

@@ -27,8 +27,8 @@ export type SearchModePropsMap = {
     WithMore: React.ComponentProps<SearchFC["WithMore"]>;
 };
 /**
- * 基础 Search 组件
- * - 标准的搜索表单布局，自适应列数与展开/收起
+ * Base Search component
+ * - Standard search form layout with adaptive column count and expand/collapse
  */
 declare const Search: SearchFC;
 export default Search;

package/es/components/Search/index.js

@@ -12,13 +12,13 @@ import SearchWithFilter from "./SearchWithFilter";
 import SearchWithMore from "./SearchWithMore";
 import SearchBase from "./_components/SearchBase";
 
-// 导出所有可用的 Search 模式键名
+// Export all available Search mode key names
 
-// 导出 Search 模式映射类型
+// Export the Search mode props mapping type
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
- * 基础 Search 组件
- * - 标准的搜索表单布局，自适应列数与展开/收起
+ * Base Search component
+ * - Standard search form layout with adaptive column count and expand/collapse
  */
 var Search = function Search(props) {
   return /*#__PURE__*/_jsx(SearchBase, _objectSpread({}, props));

package/es/components/Search/index.module.scss

@@ -8,7 +8,7 @@
   width: 100%;
   padding: 14px 16px;
 
-  // CF 风格：描边白卡片（随外观切换），去投影
+  // CF style: outlined white card (follows appearance switching), no shadow
   background: var(--cf-surface);
 
   border-radius: 8px;

package/es/components/SecondConf/index.module.scss

@@ -13,7 +13,7 @@
 
     .icon {
       font-size: 50px;
-      color: #ff9900;
+      color: var(--cf-warning);
     }
 
     .content {

package/es/components/Select/AutoCompleteSelect/index.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["prefix", "suffix", "className", "selectClassName", "onFocus", "onBlur", "onSearch", "disabled", "popupClassName", "filterOption", "onChange", "options", "placement", "onDropdownVisibleChange", "popupMatchSelectWidth", "popupMatchContentWidth", "optionFontSize"],
+var _excluded = ["prefix", "suffix", "className", "selectClassName", "onFocus", "onBlur", "onSearch", "disabled", "popupClassName", "filterOption", "onChange", "options", "placement", "onDropdownVisibleChange", "popupMatchSelectWidth", "popupMatchContentWidth", "optionFontSize", "value"],
   _excluded2 = ["label", "value", "disabled"];
 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; }
@@ -15,7 +15,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 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 { AutoComplete } from "antd";
-import React, { useEffect, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import classNames from "classnames";
 import styles from "./index.module.scss";
 import { generateRandomStr } from "hsu-utils";
@@ -48,6 +48,7 @@ var AutoCompleteSelect = function AutoCompleteSelect(props) {
     popupMatchContentWidth = props.popupMatchContentWidth,
     _props$optionFontSize = props.optionFontSize,
     optionFontSize = _props$optionFontSize === void 0 ? 14 : _props$optionFontSize,
+    value = props.value,
     antdAutoCompleteConfig = _objectWithoutProperties(props, _excluded);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -58,23 +59,33 @@ var AutoCompleteSelect = function AutoCompleteSelect(props) {
     _useState4 = _slicedToArray(_useState3, 2),
     open = _useState4[0],
     setOpen = _useState4[1];
-  var _useState5 = useState(false),
+  var _useState5 = useState(""),
     _useState6 = _slicedToArray(_useState5, 2),
-    legacyHasErrorStatus = _useState6[0],
-    setLegacyHasErrorStatus = _useState6[1];
-  var _useState7 = useState(true),
+    searchText = _useState6[0],
+    setSearchText = _useState6[1];
+  var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
-    legacyHasArrowOrClear = _useState8[0],
-    setLegacyHasArrowOrClear = _useState8[1];
+    legacyHasErrorStatus = _useState8[0],
+    setLegacyHasErrorStatus = _useState8[1];
+  var _useState9 = useState(true),
+    _useState10 = _slicedToArray(_useState9, 2),
+    legacyHasArrowOrClear = _useState10[0],
+    setLegacyHasArrowOrClear = _useState10[1];
   var legacyHasSelector = isLegacyHasSelectorBrowser();
   var cls = useMemo(function () {
     return generateRandomStr(10);
   }, []);
+  var handleSearch = useCallback(function (searchValue) {
+    setSearchText(searchValue);
+    onSearch === null || onSearch === void 0 || onSearch(searchValue);
+  }, [onSearch]);
+
+  // Always pass handleSearch so IME composition events stay observed
+  // (an in-progress pinyin input must not wipe out the option list)
   var _useSelectComposition = useSelectComposition({
-      onSearch: onSearch
+      onSearch: handleSearch
     }),
     isComposing = _useSelectComposition.isComposing;
-  useSelectPopupPosition(autoCompleteRef, open, cls);
   var autoCompleteWidth = autoCompleteRef.current ? autoCompleteRef.current.offsetWidth : 0;
   var calculatedPopupWidth = popupMatchContentWidth ? calculatePopupWidth({
     options: options === null || options === void 0 ? void 0 : options.map(function (opt) {
@@ -88,7 +99,7 @@ var AutoCompleteSelect = function AutoCompleteSelect(props) {
     optionFontSize: optionFontSize
   }) : autoCompleteWidth;
 
-  // 转换 options 格式为 AutoComplete 需要的格式
+  // Convert options into the format AutoComplete requires
   var autoCompleteOptions = useMemo(function () {
     return options === null || options === void 0 ? void 0 : options.map(function (option) {
       var label = option.label,
@@ -103,27 +114,51 @@ var AutoCompleteSelect = function AutoCompleteSelect(props) {
     });
   }, [options]);
 
-  // 处理 filterOption
-  var handleFilterOption = useMemo(function () {
-    // 如果提供了自定义 filterOption，优先使用
+  // Filter rule: prefer the custom filterOption, otherwise fall back to a
+  // case-insensitive substring match
+  var matchOption = useMemo(function () {
     if (customFilterOption) {
-      return function (inputValue, option) {
-        return customFilterOption(inputValue, option);
-      };
+      return customFilterOption;
     }
-
-    // 默认过滤逻辑：不区分大小写的包含匹配
     return function (inputValue, option) {
-      if (!isComposing && option) {
-        var _option$value, _ref, _option$label;
-        var searchText = inputValue.toUpperCase();
-        var optionValue = ((_option$value = option.value) !== null && _option$value !== void 0 ? _option$value : "").toString().toUpperCase();
-        var optionLabel = ((_ref = (_option$label = option.label) !== null && _option$label !== void 0 ? _option$label : option.value) !== null && _ref !== void 0 ? _ref : "").toString().toUpperCase();
-        return optionValue.includes(searchText) || optionLabel.includes(searchText);
+      var _option$value, _ref, _option$label;
+      if (!option) {
+        return true;
       }
-      return true;
+      var keyword = inputValue.toUpperCase();
+      var optionValue = ((_option$value = option.value) !== null && _option$value !== void 0 ? _option$value : "").toString().toUpperCase();
+      var optionLabel = ((_ref = (_option$label = option.label) !== null && _option$label !== void 0 ? _option$label : option.value) !== null && _ref !== void 0 ? _ref : "").toString().toUpperCase();
+      return optionValue.includes(keyword) || optionLabel.includes(keyword);
     };
-  }, [customFilterOption, isComposing]);
+  }, [customFilterOption]);
+
+  // Text the filter runs against: the controlled value wins, otherwise use the
+  // internally tracked search keyword
+  var filterText = useMemo(function () {
+    if (value !== undefined && value !== null) {
+      return String(value);
+    }
+    return searchText;
+  }, [value, searchText]);
+
+  // Filter inside the component (antd's own filterOption is turned off) so we
+  // know whether any candidate survives, keeping controlled open in sync
+  var filteredOptions = useMemo(function () {
+    // Skip filtering while composing so an in-progress pinyin input does not
+    // empty the candidate list
+    if (isComposing || !filterText) {
+      return autoCompleteOptions;
+    }
+    return autoCompleteOptions.filter(function (option) {
+      return matchOption(filterText, option);
+    });
+  }, [autoCompleteOptions, filterText, isComposing, matchOption]);
+
+  // In combobox mode antd hides the popup by itself when there is no candidate
+  // and skips onDropdownVisibleChange, so fold "no candidate" into open to stop
+  // the controlled state from drifting and leaving an empty popup behind
+  var mergedOpen = open && filteredOptions.length > 0;
+  useSelectPopupPosition(autoCompleteRef, mergedOpen, cls);
   useEffect(function () {
     if (!legacyHasSelector) {
       return;
@@ -163,7 +198,7 @@ var AutoCompleteSelect = function AutoCompleteSelect(props) {
     return function () {
       observer.disconnect();
     };
-  }, [legacyHasSelector, open]);
+  }, [legacyHasSelector, mergedOpen]);
   return /*#__PURE__*/_jsxs("div", {
     className: classNames(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles.autoCompleteSelect, true), className !== null && className !== void 0 ? className : "", true), styles.focused, focused), styles.disabled, disabled), styles.popupMatchContentWidth, popupMatchContentWidth), styles.legacyHasErrorStatus, legacyHasSelector && legacyHasErrorStatus)),
     ref: autoCompleteRef,
@@ -172,19 +207,23 @@ var AutoCompleteSelect = function AutoCompleteSelect(props) {
     }), /*#__PURE__*/_jsx(AutoComplete, _objectSpread({}, _objectSpread(_objectSpread({
       allowClear: true
     }, antdAutoCompleteConfig), {}, {
+      value: value,
       onFocus: function onFocus(e) {
         setFocused(true);
         _onFocus === null || _onFocus === void 0 || _onFocus(e);
       },
       onBlur: function onBlur(e) {
         setFocused(false);
+        // antd skips onDropdownVisibleChange when there is no candidate,
+        // so collapse the controlled state manually on blur
+        setOpen(false);
         _onBlur === null || _onBlur === void 0 || _onBlur(e);
       },
-      options: autoCompleteOptions,
-      filterOption: handleFilterOption,
+      options: filteredOptions,
+      filterOption: false,
       onChange: onChange,
-      onSearch: onSearch,
-      open: open,
+      onSearch: handleSearch,
+      open: mergedOpen,
       onDropdownVisibleChange: function onDropdownVisibleChange(visible) {
         setOpen(visible);
         _onDropdownVisibleChange === null || _onDropdownVisibleChange === void 0 || _onDropdownVisibleChange(visible);

package/es/components/Select/AutoCompleteSelect/index.module.scss

@@ -8,7 +8,7 @@
   height: 100%;
   padding: 0px 11px;
 
-  // CF 风格：随外观切换的描边输入控件
+  // CF style: outlined input control that follows appearance switching
   border: 1px solid var(--cf-border);
   border-radius: 6px;
 
@@ -49,7 +49,7 @@
   &.focused {
     border-color: var(--primary-color);
 
-    box-shadow: 0 0 0 2px rgba(19, 194, 194, 0.12);
+    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color) 12%, transparent);
 
     outline: 0;
   }
@@ -76,20 +76,20 @@
   }
 
   &:has(:global(.ant-select-status-error)) {
-    border: 1px solid #ff4d4f;
+    border: 1px solid var(--cf-error);
 
     .prefix,
     .suffix {
-      color: #ff4d4f;
+      color: var(--cf-error);
     }
   }
 
   &.legacyHasErrorStatus {
-    border: 1px solid #ff4d4f;
+    border: 1px solid var(--cf-error);
 
     .prefix,
     .suffix {
-      color: #ff4d4f;
+      color: var(--cf-error);
     }
   }
 

package/es/components/Select/IconSelect/index.module.scss

@@ -54,12 +54,12 @@
 
       font-size: 16px;
 
-      border: 1px solid #f0edea;
+      border: 1px solid var(--cf-border-weak);
 
       cursor: pointer;
 
       &.active {
-        background: #dddddd;
+        background: var(--cf-row-hover);
       }
     }
   }

package/es/components/Select/TreeSelect/_utils/getExpandedKeysByLevel.d.ts

@@ -1,8 +1,8 @@
 import { DataNode, SafeKey } from "rc-tree-select/lib/interface";
 /**
- * 根据默认展开层级计算应该展开的节点 keys（用于 TreeSelect）
- * @param treeData 树数据（DataNode 类型）
- * @param level 展开层级（从 1 开始，1 表示第一层，2 表示第二层，以此类推）
- * @returns 应该展开的节点 keys 数组
+ * Compute the node keys that should be expanded based on the default expand level (for TreeSelect)
+ * @param treeData Tree data (DataNode type)
+ * @param level Expand level (starting from 1; 1 means the first level, 2 the second, and so on)
+ * @returns Array of node keys that should be expanded
  */
 export declare const getExpandedKeysByLevel: (treeData: DataNode[], level: number) => SafeKey[];

package/es/components/Select/TreeSelect/_utils/getExpandedKeysByLevel.js

@@ -2,10 +2,10 @@ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol
 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); }
 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; }
 /**
- * 根据默认展开层级计算应该展开的节点 keys（用于 TreeSelect）
- * @param treeData 树数据（DataNode 类型）
- * @param level 展开层级（从 1 开始，1 表示第一层，2 表示第二层，以此类推）
- * @returns 应该展开的节点 keys 数组
+ * Compute the node keys that should be expanded based on the default expand level (for TreeSelect)
+ * @param treeData Tree data (DataNode type)
+ * @param level Expand level (starting from 1; 1 means the first level, 2 the second, and so on)
+ * @returns Array of node keys that should be expanded
  */
 export var getExpandedKeysByLevel = function getExpandedKeysByLevel(treeData, level) {
   if (level < 1 || !(treeData !== null && treeData !== void 0 && treeData.length)) {
@@ -19,7 +19,7 @@ export var getExpandedKeysByLevel = function getExpandedKeysByLevel(treeData, le
       for (_iterator.s(); !(_step = _iterator.n()).done;) {
         var _node$children;
         var node = _step.value;
-        // 如果当前层级小于目标层级，则展开该节点
+        // Expand this node if the current level is below the target level
         if (currentLevel < level && (_node$children = node.children) !== null && _node$children !== void 0 && _node$children.length && node.key !== undefined) {
           expandedKeys.push(node.key);
           traverse(node.children, currentLevel + 1);

package/es/components/Select/TreeSelect/index.module.scss

@@ -6,7 +6,7 @@
   width: 100%;
   height: 100%;
 
-  // CF 风格：随外观切换的描边输入控件
+  // CF style: outlined input control that follows appearance switching
   background: var(--cf-surface);
   border: 1px solid var(--cf-border);
   border-radius: 6px;

package/es/components/Select/_hooks/useSelectComposition.d.ts

@@ -2,7 +2,7 @@ interface UseSelectCompositionProps {
     onSearch?: (value: string) => void;
 }
 /**
- * 管理输入法组合状态
+ * Manage IME composition state
  */
 export declare function useSelectComposition({ onSearch, }: UseSelectCompositionProps): {
     isComposing: boolean;

package/es/components/Select/_hooks/useSelectComposition.js

@@ -6,7 +6,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { useEffect, useState } from "react";
 /**
- * 管理输入法组合状态
+ * Manage IME composition state
  */
 export function useSelectComposition(_ref) {
   var onSearch = _ref.onSearch;

package/es/components/Select/_hooks/useSelectInputOptions.d.ts

@@ -8,7 +8,7 @@ interface UseSelectInputOptionsProps {
     optionsLength: number;
 }
 /**
- * 管理输入选项（当没有匹配项时）
+ * Manage input options (when there are no matching options)
  */
 export declare function useSelectInputOptions({ searchValue, isComposing, onChange, onSearch, optionsLength, }: UseSelectInputOptionsProps): {
     inputOptions: SelectOption<string | number>[];

package/es/components/Select/_hooks/useSelectInputOptions.js

@@ -6,7 +6,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { useEffect, useState } from "react";
 /**
- * 管理输入选项（当没有匹配项时）
+ * Manage input options (when there are no matching options)
  */
 export function useSelectInputOptions(_ref) {
   var searchValue = _ref.searchValue,

package/es/components/Select/_utils/calculatePopupWidth.d.ts

@@ -7,7 +7,7 @@ interface CalculatePopupWidthOptions {
     valueInlabel?: "before" | "after";
 }
 /**
- * 计算弹出层宽度
+ * Calculate popup width
  */
 export declare function calculatePopupWidth({ options, selectWidth, mode, optionFontSize, valueInlabel, }: CalculatePopupWidthOptions): number;
 export {};

package/es/components/Select/_utils/calculatePopupWidth.js

@@ -1,6 +1,6 @@
 import { get_string_size } from "hsu-utils";
 /**
- * 计算弹出层宽度
+ * Calculate popup width
  */
 export function calculatePopupWidth(_ref) {
   var options = _ref.options,

package/es/components/Select/_utils/filterOption.d.ts

@@ -7,7 +7,7 @@ interface FilterOptionParams {
     valueInlabel?: "before" | "after";
 }
 /**
- * 过滤选项
+ * Filter options
  */
 export declare function filterOption({ searchValue, option, isComposing, customFilterOption, valueInlabel, }: FilterOptionParams): boolean;
 export {};

package/es/components/Select/_utils/filterOption.js

@@ -1,5 +1,5 @@
 /**
- * 过滤选项
+ * Filter options
  */
 export function filterOption(_ref) {
   var searchValue = _ref.searchValue,