@hsu-react/ui 0.0.13 → 0.0.14

package/es/components/Chart/chartUtils/calculateAxisConfig.js

@@ -1,23 +1,23 @@
 /**
- * 计算合适的Y轴范围和间隔，确保0是刻度点，且总刻度数固定为6个
- * @param min 最小值
- * @param max 最大值
- * @returns { min, max, interval } Y轴配置
+ * Calculates a suitable Y-axis range and interval, ensuring 0 is a tick point and the total tick count is fixed at 6
+ * @param min minimum value
+ * @param max maximum value
+ * @returns { min, max, interval } Y-axis configuration
  */
 export function calculateAxisConfig(min, max) {
-  // 根据数值大小选择合适的取整基数
+  // Choose a suitable rounding base according to the value's magnitude
   var getNiceNumber = function getNiceNumber(value) {
     if (value === 0) return 1;
     var magnitude = Math.pow(10, Math.floor(Math.log10(Math.abs(value))));
     var normalized = value / magnitude;
 
-    // 选择 1, 2, 5, 10 这样的"整齐"数字
+    // Pick a "nice" number like 1, 2, 5, or 10
     var niceNormalized;
     if (normalized <= 1) niceNormalized = 1;else if (normalized <= 2) niceNormalized = 2;else if (normalized <= 5) niceNormalized = 5;else niceNormalized = 10;
     return niceNormalized * magnitude;
   };
 
-  // 处理无效数据
+  // Handle invalid data
   if (min === Number.POSITIVE_INFINITY || max === Number.NEGATIVE_INFINITY) {
     return {
       min: 0,
@@ -26,7 +26,7 @@ export function calculateAxisConfig(min, max) {
     };
   }
 
-  // 如果数据全部为0，返回默认值（6个刻度：0,1,2,3,4,5）
+  // If all data is 0, return default values (6 ticks: 0,1,2,3,4,5)
   if (min === 0 && max === 0) {
     return {
       min: 0,
@@ -35,22 +35,22 @@ export function calculateAxisConfig(min, max) {
     };
   }
 
-  // 如果数据跨越0（有正有负）
+  // If the data spans 0 (has both positive and negative values)
   if (min < 0 && max > 0) {
     var absMax = Math.abs(max * 1.1);
     var absMin = Math.abs(min * 1.1);
 
-    // 计算总范围，分成5个间隔（6个刻度）
+    // Compute the total range, split into 5 intervals (6 ticks)
     var totalRange = absMax + absMin;
     var _roughInterval = totalRange / 5;
     var _interval = getNiceNumber(_roughInterval);
 
-    // 计算需要多少个刻度能覆盖正负数据
+    // Compute how many ticks are needed to cover the positive and negative data
     var negativeSteps = Math.ceil(absMin / _interval);
     var positiveSteps = Math.ceil(absMax / _interval);
-    var totalSteps = negativeSteps + positiveSteps; // 不包括0
+    var totalSteps = negativeSteps + positiveSteps; // excluding 0
 
-    // 如果总刻度数正好是6个（5个间隔+0）
+    // If the total tick count is exactly 6 (5 intervals + 0)
     if (totalSteps === 5) {
       return {
         min: -negativeSteps * _interval,
@@ -59,7 +59,7 @@ export function calculateAxisConfig(min, max) {
       };
     }
 
-    // 否则，调整为固定5个间隔，按比例分配正负两边
+    // Otherwise, adjust to a fixed 5 intervals, distributed proportionally between the positive and negative sides
     var ratio = absMax / (absMax + absMin);
     var positiveIntervals = Math.round(ratio * 5);
     var negativeIntervals = 5 - positiveIntervals;
@@ -70,7 +70,7 @@ export function calculateAxisConfig(min, max) {
     };
   }
 
-  // 如果全是非负数（固定6个刻度：0到max，分5段）
+  // If all values are non-negative (fixed 6 ticks: 0 to max, split into 5 segments)
   if (min >= 0) {
     var roughMax = max * 1.1;
     var _roughInterval2 = roughMax / 5;
@@ -82,7 +82,7 @@ export function calculateAxisConfig(min, max) {
     };
   }
 
-  // 如果全是负数（固定6个刻度：min到0，分5段）
+  // If all values are negative (fixed 6 ticks: min to 0, split into 5 segments)
   var roughMin = Math.abs(min * 1.1);
   var roughInterval = roughMin / 5;
   var interval = getNiceNumber(roughInterval);

package/es/components/Chart/chartUtils/chartTooltipFormatter.d.ts

@@ -18,7 +18,7 @@ export interface ChartTooltipFormatterProps {
     hideMarker?: boolean;
     textStyle?: Record<string, unknown>;
     unit?: string;
-    /** 多系列时按数值从大到小排序展示（大的在上） */
+    /** For multiple series, display sorted by value in descending order (largest on top) */
     sortDescending?: boolean;
 }
 declare const chartTooltipFormatter: (props: ChartTooltipFormatterProps) => string;

package/es/components/Chart/chartUtils/chartTooltipFormatter.js

@@ -25,7 +25,7 @@ var chartTooltipFormatter = function chartTooltipFormatter(props) {
     return "\n      <div style=\"margin: 0;line-height:1;\">\n        <div style=\"margin: 0;line-height:1;\">\n          ".concat(hideMarker ? "" : "".concat(item === null || item === void 0 ? void 0 : item.marker), "\n          <span style=\"font-size:").concat(textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontSize, "px;color:").concat(textStyle === null || textStyle === void 0 ? void 0 : textStyle.color, ";font-weight:").concat(textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontWeight, ";margin-left:2px\">").concat(item === null || item === void 0 ? void 0 : item.name, "</span>\n          <span style=\"float:right;margin-left:20px;font-size:").concat(textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontSize, "px;color:").concat(textStyle === null || textStyle === void 0 ? void 0 : textStyle.color, ";font-weight:").concat(textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontWeight, "\">").concat(item === null || item === void 0 ? void 0 : item.value).concat(unit ? " ".concat(unit) : "", "</span>\n          <div style=\"clear:both\"></div>\n        </div>\n        <div style=\"clear:both\"></div>\n      </div>\n    ");
   }
 
-  // value 可能是数值、拼了单位的字符串("123次")或带千分位("1,234"），排序前统一还原成数值
+  // value may be a number, a string with a unit appended ("123次"), or one with thousands separators ("1,234"); normalize back to a number before sorting
   var toSortValue = function toSortValue(v) {
     if (typeof v === "number") return v;
     if (Array.isArray(v)) return toSortValue(v[v.length - 1]);

package/es/components/Chart/chartUtils/useDataZoomWindow.d.ts

@@ -1,19 +1,19 @@
 import { DataZoomIndexWindow } from "../_utils/cartesian";
 export interface DataZoomWindowOptions {
-    /** 开关：是否按 dataZoom 当前可见窗口重算坐标轴，默认开启 */
+    /** Toggle: whether to recalculate the axis based on the current visible dataZoom window; enabled by default */
     enabled?: boolean;
 }
 export interface DataZoomWindowResult {
-    /** 当前可见窗口；开关关闭或尚未收到回调时为 null（表示全量） */
+    /** Current visible window; null when disabled or before any callback has been received (meaning the full range) */
     zoomWindow: DataZoomIndexWindow | null;
-    /** 传给 Chart.Bar / Chart.Line 的 onDataZoomWindowChanged；开关关闭时为 undefined（不绑定事件） */
+    /** onDataZoomWindowChanged to pass to Chart.Bar / Chart.Line; undefined when disabled (event not bound) */
     onDataZoomWindowChanged?: (window: DataZoomIndexWindow) => void;
-    /** 按当前可见窗口裁剪系列数据，配合 calculateAxisConfig 只对展示部分重算坐标轴 */
+    /** Slices series data by the current visible window; used with calculateAxisConfig to recalculate the axis for the displayed portion only */
     sliceByZoomWindow: <T>(values?: T[] | null) => T[];
 }
 /**
- * dataZoom 可见窗口管理：配合 Chart.Bar / Chart.Line 的 onDataZoomWindowChanged，
- * 在调用方按"当前可见窗口"裁剪数据后重算 Y 轴 min/max/interval（calculateAxisConfig），
- * 实现滑块拖动/滚轮/自动滚动时坐标轴跟随展示部分动态重算；可与 useLegendSelection 叠加。
+ * dataZoom visible-window management: works with Chart.Bar / Chart.Line's onDataZoomWindowChanged
+ * so the caller can slice data by the "current visible window" and recalculate the Y-axis min/max/interval (calculateAxisConfig),
+ * making the axis dynamically follow the displayed portion during slider dragging / wheel scrolling / auto-scroll; can be combined with useLegendSelection.
  */
 export declare function useDataZoomWindow(options?: DataZoomWindowOptions): DataZoomWindowResult;

package/es/components/Chart/chartUtils/useDataZoomWindow.js

@@ -6,9 +6,9 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { useCallback, useState } from "react";
 /**
- * dataZoom 可见窗口管理：配合 Chart.Bar / Chart.Line 的 onDataZoomWindowChanged，
- * 在调用方按"当前可见窗口"裁剪数据后重算 Y 轴 min/max/interval（calculateAxisConfig），
- * 实现滑块拖动/滚轮/自动滚动时坐标轴跟随展示部分动态重算；可与 useLegendSelection 叠加。
+ * dataZoom visible-window management: works with Chart.Bar / Chart.Line's onDataZoomWindowChanged
+ * so the caller can slice data by the "current visible window" and recalculate the Y-axis min/max/interval (calculateAxisConfig),
+ * making the axis dynamically follow the displayed portion during slider dragging / wheel scrolling / auto-scroll; can be combined with useLegendSelection.
  */
 export function useDataZoomWindow(options) {
   var _options$enabled;
@@ -18,7 +18,7 @@ export function useDataZoomWindow(options) {
     zoomWindow = _useState2[0],
     setZoomWindow = _useState2[1];
   var onDataZoomWindowChanged = useCallback(function (next) {
-    // 窗口未变化时保持原引用，避免重渲染 → 同步回调 → 再重渲染的循环
+    // Keep the original reference when the window is unchanged, avoiding a re-render → sync callback → re-render loop
     setZoomWindow(function (prev) {
       return prev && prev.startIndex === next.startIndex && prev.endIndex === next.endIndex ? prev : next;
     });

package/es/components/Chart/chartUtils/useLegendSelection.d.ts

@@ -1,14 +1,14 @@
 export interface LegendSelectionResult {
-    /** 传给图表 legend.selected，保证重渲染(setOption notMerge)后隐藏状态不丢 */
+    /** Pass to the chart's legend.selected to keep hidden state from being lost after re-render (setOption notMerge) */
     legendSelected: Record<string, boolean>;
-    /** 传给图表 onLegendSelectChanged */
+    /** Pass to the chart's onLegendSelectChanged */
     onLegendSelectChanged: (selected: Record<string, boolean>) => void;
-    /** 判断某系列当前是否可见（未点过的系列默认可见） */
+    /** Checks whether a series is currently visible (series never toggled are visible by default) */
     isSeriesVisible: (name?: string | null) => boolean;
 }
 /**
- * 图例选中状态管理：配合 Chart.Bar / Chart.Line 的 onLegendSelectChanged，
- * 在调用方按"当前可见系列"重算 Y 轴 min/max/interval（calculateAxisConfig），
- * 实现图例隐藏某一项后坐标轴自动重算。
+ * Legend selection state management: works with Chart.Bar / Chart.Line's onLegendSelectChanged
+ * so the caller can recalculate the Y-axis min/max/interval (calculateAxisConfig) based on the "currently visible series",
+ * making the axis automatically recalculate after an item is hidden via the legend.
  */
 export declare function useLegendSelection(): LegendSelectionResult;

package/es/components/Chart/chartUtils/useLegendSelection.js

@@ -12,9 +12,9 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { useCallback, useState } from "react";
 /**
- * 图例选中状态管理：配合 Chart.Bar / Chart.Line 的 onLegendSelectChanged，
- * 在调用方按"当前可见系列"重算 Y 轴 min/max/interval（calculateAxisConfig），
- * 实现图例隐藏某一项后坐标轴自动重算。
+ * Legend selection state management: works with Chart.Bar / Chart.Line's onLegendSelectChanged
+ * so the caller can recalculate the Y-axis min/max/interval (calculateAxisConfig) based on the "currently visible series",
+ * making the axis automatically recalculate after an item is hidden via the legend.
  */
 export function useLegendSelection() {
   var _useState = useState({}),

package/es/components/Chart/chartUtils/yAxisDisplayUnit.d.ts

@@ -1,13 +1,13 @@
 /**
- * 大屏 Y 轴：按「万 / 亿」或 MB/GB/TB 换算时，要求刻度步长换算后 ≥ 1，
- * 避免出现 0.2 万、0.5GB 等小于 1 的刻度文案。
+ * Dashboard (large-screen) Y-axis: when converting to "万 (10^4) / 亿 (10^8)" or MB/GB/TB units,
+ * the converted tick step must be >= 1, avoiding tick labels smaller than 1 such as "0.2万" or "0.5GB".
  */
 export declare const MB_PER_GB = 1024;
 export declare const MB_PER_TB: number;
 export declare function trimAxisNumber(n: number): string;
-/** 中文量级：仅当最大值与刻度间隔都达到该量级时才用「万」「亿」缩放 */
+/** Chinese magnitude: scale by "万" (10^4) / "亿" (10^8) only when both the max value and the tick interval reach that magnitude */
 export declare function chineseMagnitudeDivisor(max: number, interval: number): 1 | 10000 | 100000000;
 export declare function formatChineseMagnitudeTick(value: number, max: number, interval: number): string;
-/** MB 进位：仅当最大值与刻度间隔在该单位下均 ≥ 1 时才升到 GB/TB */
+/** MB tiering: promote to GB/TB only when both the max value and the tick interval are >= 1 in that unit */
 export declare function mbDisplayTier(maxMb: number, intervalMb: number): "MB" | "GB" | "TB";
 export declare function formatMbAxisTick(value: number, maxMb: number, intervalMb: number): string;

package/es/components/Chart/chartUtils/yAxisDisplayUnit.js

@@ -1,6 +1,6 @@
 /**
- * 大屏 Y 轴：按「万 / 亿」或 MB/GB/TB 换算时，要求刻度步长换算后 ≥ 1，
- * 避免出现 0.2 万、0.5GB 等小于 1 的刻度文案。
+ * Dashboard (large-screen) Y-axis: when converting to "万 (10^4) / 亿 (10^8)" or MB/GB/TB units,
+ * the converted tick step must be >= 1, avoiding tick labels smaller than 1 such as "0.2万" or "0.5GB".
  */
 
 export var MB_PER_GB = 1024;
@@ -11,7 +11,7 @@ export function trimAxisNumber(n) {
   return s === "" || s === "-" ? "0" : s;
 }
 
-/** 中文量级：仅当最大值与刻度间隔都达到该量级时才用「万」「亿」缩放 */
+/** Chinese magnitude: scale by "万" (10^4) / "亿" (10^8) only when both the max value and the tick interval reach that magnitude */
 export function chineseMagnitudeDivisor(max, interval) {
   var m = Number.isFinite(max) ? max : 0;
   var iv = Number.isFinite(interval) ? interval : 0;
@@ -27,7 +27,7 @@ export function formatChineseMagnitudeTick(value, max, interval) {
   return trimAxisNumber(v / div);
 }
 
-/** MB 进位：仅当最大值与刻度间隔在该单位下均 ≥ 1 时才升到 GB/TB */
+/** MB tiering: promote to GB/TB only when both the max value and the tick interval are >= 1 in that unit */
 export function mbDisplayTier(maxMb, intervalMb) {
   var m = Number.isFinite(maxMb) ? maxMb : 0;
   var iv = Number.isFinite(intervalMb) ? intervalMb : 0;

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

@@ -16,7 +16,7 @@ export type CommonObj<T = unknown> = Record<string, T>;
  * ChartTypes
  * ChartOptionsType
  *
- * 关联 Group
+ * Associated with Group
  */
 export type ChartTypes = "Line" | "Bar" | "Pie";
 export type ChartOptionsType = ChartLineProps | ChartBarProps | ChartPieProps;
@@ -39,7 +39,7 @@ export interface ChartCommonProps extends ChartsOption {
     style?: ChartCSSProperties;
     insideDataZoom?: echarts.DataZoomComponentOption;
     sliderDataZoom?: echarts.DataZoomComponentOption;
-    /** 图表实例就绪回调，可用于图例自动滚动等 */
+    /** Callback fired when the chart instance is ready; can be used for legend auto-scroll, etc. */
     onChart?: (chart: echarts.ECharts) => void;
 }
 interface ChartType {

package/es/components/Chart/index.js

@@ -15,7 +15,7 @@ import ChartCommon from "./Common";
  * ChartTypes
  * ChartOptionsType
  *
- * 关联 Group
+ * Associated with Group
  */
 
 var Chart = {

package/es/components/Chat/ChatHistory/_components/HistoryGroup/index.module.scss

@@ -8,7 +8,7 @@
 
     font-size: 14px;
     font-weight: bold;
-    color: #b3b3b3;
+    color: var(--cf-text-3);
 
     cursor: default;
   }

package/es/components/Chat/ChatHistory/_components/HistoryItem/index.js

@@ -26,7 +26,7 @@ var HistoryItem = function HistoryItem(_ref) {
     updateTitle = _ref.updateTitle,
     deleteHistory = _ref.deleteHistory,
     _onClick = _ref.onClick;
-  // 重命名相关状态
+  // Rename-related state
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isRenaming = _useState2[0],
@@ -39,29 +39,29 @@ var HistoryItem = function HistoryItem(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     currentTitle = _useState6[0],
     setCurrentTitle = _useState6[1];
-  // 用于跟踪是否刚刚完成重命名，避免立即被外部更新覆盖
+  // Tracks whether a rename has just completed, to avoid being immediately overwritten by external updates
   var justRenamedRef = useRef(false);
 
-  // 删除确认弹窗状态
+  // Delete confirmation modal state
   var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
     deleteModal = _useState8[0],
     setDeleteModal = _useState8[1];
 
-  // 初始化重命名标题
+  // Initialize the rename title
   useEffect(function () {
     if (isRenaming) {
       setRenameTitle(currentTitle);
     }
   }, [isRenaming, currentTitle]);
 
-  // 同步 item.name 的变化到 currentTitle（仅在非重命名状态下）
+  // Sync changes of item.name to currentTitle (only when not renaming)
   useEffect(function () {
     if (!isRenaming && !justRenamedRef.current) {
       var formattedName = formatChatName(item.name);
       setCurrentTitle(formattedName);
     }
-    // 重置重命名标记
+    // Reset the rename flag
     if (justRenamedRef.current) {
       justRenamedRef.current = false;
     }
@@ -73,9 +73,9 @@ var HistoryItem = function HistoryItem(_ref) {
     var newTitle = renameTitle.trim();
     if (newTitle && updateTitle) {
       updateTitle(item.conversationId, newTitle);
-      // 先更新显示的标题，确保立即显示用户输入的名称
+      // Update the displayed title first to immediately show the user-entered name
       setCurrentTitle(newTitle);
-      // 标记刚刚完成重命名，避免立即被外部更新覆盖
+      // Mark that a rename has just completed, to avoid being immediately overwritten by external updates
       justRenamedRef.current = true;
     }
     setIsRenaming(false);

package/es/components/Chat/ChatHistory/_components/HistoryItem/index.module.scss

@@ -26,7 +26,7 @@
   cursor: pointer;
 
   &:hover {
-    background: #0000000a;
+    background: var(--cf-row-hover);
 
     .operation {
       display: flex;
@@ -34,9 +34,9 @@
   }
 
   &.active {
-    background: #0000000a;
+    background: var(--cf-row-hover);
 
-    color: #126dff;
+    color: var(--primary-color);
   }
 
   .operation {
@@ -55,10 +55,10 @@
 
     background-color: transparent;
 
-    color: #0a0a0a;
+    color: var(--cf-text);
 
     &:hover {
-      color: #126dff;
+      color: var(--primary-color);
     }
   }
 }
@@ -69,6 +69,6 @@
   column-gap: 8px;
 
   &.delete {
-    color: #ff4d4f;
+    color: var(--cf-error);
   }
 }

package/es/components/Chat/ChatHistory/_components/NewChatButton/index.module.scss

@@ -5,7 +5,7 @@
 
   padding: 0px 10px;
 
-  background-color: #f9f9f9;
+  background-color: var(--cf-subtle);
 
   .newChat {
     display: flex;
@@ -18,17 +18,17 @@
 
     font-size: 14px;
 
-    background-color: #fff;
+    background-color: var(--cf-surface);
 
     border-radius: 6px;
-    border: 1px solid #0d0d0d0d;
+    border: 1px solid var(--cf-border-weak);
 
     cursor: pointer;
 
     transition: box-shadow 0.3s;
 
     &:hover {
-      box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
+      box-shadow: var(--cf-shadow-2);
     }
   }
 }

package/es/components/Chat/ChatHistory/_utils/index.d.ts

@@ -1,4 +1,4 @@
 /**
- * 格式化聊天名称（截取省略号前的部分）
+ * Format the chat name (take the part before the ellipsis)
  */
 export declare const formatChatName: (name: string) => string;

package/es/components/Chat/ChatHistory/_utils/index.js

@@ -1,5 +1,5 @@
 /**
- * 格式化聊天名称（截取省略号前的部分）
+ * Format the chat name (take the part before the ellipsis)
  */
 export var formatChatName = function formatChatName(name) {
   return name.split("…")[0];

package/es/components/Chat/ChatHistory/index.js

@@ -16,7 +16,7 @@ var ChatHistory = function ChatHistory(props) {
     tools = props.tools;
   var scrollContainerRef = useRef(null);
 
-  // 滚动到底部处理
+  // Handle scrolling to the bottom
   useEffect(function () {
     var scrollContainer = scrollContainerRef.current;
     if (!scrollContainer || !onScrollEnd) return;
@@ -24,7 +24,7 @@ var ChatHistory = function ChatHistory(props) {
       var scrollTop = scrollContainer.scrollTop,
         scrollHeight = scrollContainer.scrollHeight,
         clientHeight = scrollContainer.clientHeight;
-      // 当滚动到底部时（允许 5px 的误差）
+      // When scrolled to the bottom (with a 5px tolerance)
       if (scrollHeight - scrollTop - clientHeight < 5) {
         onScrollEnd();
       }

package/es/components/Chat/ChatHistory/index.module.scss

@@ -9,9 +9,9 @@
   height: 100%;
   padding: 10px 0px;
 
-  background-color: #f9f9f9;
+  background-color: var(--cf-subtle);
 
-  border-right: 1px solid #0d0d0d0d;
+  border-right: 1px solid var(--cf-border-weak);
 
   .tools {
     display: flex;
@@ -39,7 +39,7 @@
     &::-webkit-scrollbar-thumb {
       width: 10px;
 
-      background-color: #0000001a;
+      background-color: var(--cf-border);
 
       border-radius: 10px;
     }

package/es/components/Chat/ChatInput/_components/AgentToggleButton/index.module.scss

@@ -4,26 +4,26 @@
   column-gap: 2px;
   padding: 0 11px;
   border-radius: 4px;
-  border: 1px solid #0e59ef;
+  border: 1px solid var(--primary-color);
   font-size: 14px;
   cursor: pointer;
   transition: all 0.3s;
   height: 100%;
-  background-color: #fff;
+  background-color: var(--cf-surface);
 
   .icon {
     font-size: 22px;
   }
 
   &.active {
-    color: #0e59ef;
-    border-color: #0e59ef;
-    background-color: #0e59ef22;
+    color: var(--primary-color);
+    border-color: var(--primary-color);
+    background-color: color-mix(in srgb, var(--primary-color) 13%, transparent);
   }
 
   &:hover {
-    color: #4c4c4c;
-    border-color: rgba(0, 0, 0, 0.12);
-    background-color: #e0e4ed;
+    color: var(--cf-text);
+    border-color: var(--cf-border);
+    background-color: var(--cf-row-hover);
   }
 }

package/es/components/Chat/ChatInput/_components/FileList/index.module.scss

@@ -11,8 +11,8 @@
     column-gap: 5px;
     padding: 4px 10px;
     font-size: 14px;
-    color: #424242;
-    background: #f2f4f7;
+    color: var(--cf-text);
+    background: var(--cf-subtle);
     border-radius: 3px;
     transition: box-shadow 0.3s, color 0.3s;
     cursor: pointer;
@@ -22,7 +22,7 @@
     }
     
     &:hover {
-      color: #0e59ef;
+      color: var(--primary-color);
     }
   }
 }

package/es/components/Chat/ChatInput/_components/UploadButton/index.js

@@ -60,7 +60,7 @@ var UploadButton = function UploadButton(props) {
           icon: /*#__PURE__*/_jsx(Icon, {
             icon: isUpload ? "eos-icons:loading" : "heroicons-outline:paper-clip",
             fontSize: 22,
-            color: "#ababab"
+            color: "var(--cf-text-3)"
           }),
           onClick: onInterceptClick ? function (e) {
             e.stopPropagation();

package/es/components/Chat/ChatInput/_utils/index.d.ts

@@ -1,13 +1,13 @@
 import { UploadFile } from "antd";
 /**
- * 处理文件上传响应
+ * Handle the file upload response
  */
 export declare const handleUploadResponse: (fileList: UploadFile[], file: UploadFile, index: number) => boolean;
 /**
- * 验证文件大小
+ * Validate the file size
  */
 export declare const validateFileSize: (file: File, maxSize: number) => boolean;
 /**
- * 处理文件列表变更
+ * Handle file list changes
  */
 export declare const processFileList: (fileList: UploadFile[]) => UploadFile[];

package/es/components/Chat/ChatInput/_utils/index.js

@@ -1,7 +1,7 @@
 import { notification } from "antd";
 
 /**
- * 处理文件上传响应
+ * Handle the file upload response
  */
 export var handleUploadResponse = function handleUploadResponse(fileList, file, index) {
   if (file.status === "error") {
@@ -37,7 +37,7 @@ export var handleUploadResponse = function handleUploadResponse(fileList, file,
 };
 
 /**
- * 验证文件大小
+ * Validate the file size
  */
 export var validateFileSize = function validateFileSize(file, maxSize) {
   if (file.size > maxSize * 1024 * 1024) {
@@ -50,7 +50,7 @@ export var validateFileSize = function validateFileSize(file, maxSize) {
 };
 
 /**
- * 处理文件列表变更
+ * Handle file list changes
  */
 export var processFileList = function processFileList(fileList) {
   var processedList = [];

package/es/components/Chat/ChatInput/index.d.ts

@@ -11,13 +11,13 @@ export interface ModelConfig {
     label: string;
     value: string;
     /**
-     * 该模型支持的功能键列表，用于从 agents 中筛选显示的功能
-     * 如果未设置，则显示所有 agents
+     * List of feature keys supported by this model, used to filter which features from agents are displayed
+     * If not set, all agents are displayed
      */
     agents: AgentConfig[];
     /**
-     * 该模型的回答是否包含思考部分
-     * 如果为 false，则不处理和显示思考内容
+     * Whether this model's answers include a thinking section
+     * If false, thinking content is not processed or displayed
      */
     hasThinking?: boolean;
     [key: string]: unknown;
@@ -40,7 +40,7 @@ export interface ChatInputProps {
         setModelType: (value: string) => void;
     };
     agents?: AgentToggleConfig[];
-    /** agents 状态，用于受控模式 */
+    /** agents state, used for controlled mode */
     agentsState?: AgentConfig[];
     onAgentsChange?: (agents: AgentConfig[]) => void;
     placeholder?: string;