@hsu-react/ui 0.0.13 → 0.0.14

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

@@ -56,9 +56,9 @@ var ChatInput = function ChatInput(props) {
     fileList = _useFileList.fileList,
     setFileList = _useFileList.setFileList;
 
-  // 管理 agents 的内部状态（非受控模式）
+  // Manage the internal state of agents (uncontrolled mode)
   var _useState5 = useState(function () {
-      // 初始化状态：优先从当前模型的 agents 获取，否则从传入的 agents 配置中提取，默认 open 为 true
+      // Initialize state: prefer the current model's agents; otherwise derive from the passed-in agents config, with open defaulting to true
       var currentModel = modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelList.find(function (m) {
         return m.value === (modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelType);
       });
@@ -76,14 +76,14 @@ var ChatInput = function ChatInput(props) {
     internalAgentsState = _useState6[0],
     setInternalAgentsState = _useState6[1];
 
-  // 判断是否为受控模式
+  // Determine whether in controlled mode
   var isControlled = externalAgentsState !== undefined;
-  // 使用外部状态或内部状态
+  // Use external state or internal state
   var agentsState = isControlled ? externalAgentsState : internalAgentsState;
 
-  // 当模型切换时，同步更新 agents 状态（仅在非受控模式下）
+  // When the model switches, sync the agents state (only in uncontrolled mode)
   useEffect(function () {
-    if (isControlled) return; // 受控模式下由外部管理状态
+    if (isControlled) return; // In controlled mode, state is managed externally
 
     var currentModel = modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelList.find(function (m) {
       return m.value === (modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelType);
@@ -94,7 +94,7 @@ var ChatInput = function ChatInput(props) {
     }
   }, [modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelType, modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelList, onAgentsChange, isControlled]);
 
-  // 根据当前选中的模型，筛选出该模型支持的功能配置
+  // Based on the currently selected model, filter the feature configs supported by that model
   var currentModel = modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelList.find(function (m) {
     return m.value === (modelConfig === null || modelConfig === void 0 ? void 0 : modelConfig.modelType);
   });
@@ -104,7 +104,7 @@ var ChatInput = function ChatInput(props) {
     });
   }) : agents;
 
-  // 处理 agent 状态切换
+  // Handle agent state toggling
   var handleAgentToggle = function handleAgentToggle(key) {
     var newAgentsState = agentsState === null || agentsState === void 0 ? void 0 : agentsState.map(function (agent) {
       return agent.key === key ? _objectSpread(_objectSpread({}, agent), {}, {
@@ -112,15 +112,15 @@ var ChatInput = function ChatInput(props) {
       }) : agent;
     });
 
-    // 受控模式：只通知外部，由外部更新状态
-    // 非受控模式：更新内部状态
+    // Controlled mode: only notify externally; the external side updates the state
+    // Uncontrolled mode: update internal state
     if (!isControlled) {
       setInternalAgentsState(newAgentsState);
     }
     onAgentsChange === null || onAgentsChange === void 0 || onAgentsChange(newAgentsState);
   };
 
-  // 获取 agent 的激活状态
+  // Get the active state of an agent
   var getAgentActive = function getAgentActive(key) {
     var _agentsState$find$ope, _agentsState$find;
     return (_agentsState$find$ope = (_agentsState$find = agentsState.find(function (agent) {
@@ -128,7 +128,7 @@ var ChatInput = function ChatInput(props) {
     })) === null || _agentsState$find === void 0 ? void 0 : _agentsState$find.open) !== null && _agentsState$find$ope !== void 0 ? _agentsState$find$ope : false;
   };
 
-  // 处理文件列表移除
+  // Handle file removal from the file list
   var handleFileRemove = function handleFileRemove(uid) {
     var newFileList = fileList.filter(function (v) {
       return v.uid !== uid;
@@ -137,13 +137,13 @@ var ChatInput = function ChatInput(props) {
     onFileListChange === null || onFileListChange === void 0 || onFileListChange(newFileList);
   };
 
-  // 处理文件列表变更
+  // Handle file list changes
   var handleFileListChange = function handleFileListChange(newFileList) {
     setFileList(newFileList);
     onFileListChange === null || onFileListChange === void 0 || onFileListChange(newFileList);
   };
 
-  // 处理发送
+  // Handle sending
   var handleSend = function handleSend() {
     if (value.trim() !== "") {
       setValue("");
@@ -151,7 +151,7 @@ var ChatInput = function ChatInput(props) {
     }
   };
 
-  // 处理回车键
+  // Handle the Enter key
   var handleKeyDown = function handleKeyDown(e) {
     if (e.key === "Enter" && !e.shiftKey && !assistanting && value.trim() !== "") {
       e.preventDefault();
@@ -159,7 +159,7 @@ var ChatInput = function ChatInput(props) {
     }
   };
 
-  // 合并上传配置
+  // Merge the upload config
   var mergedUploadConfig = {
     action: uploadConfig === null || uploadConfig === void 0 ? void 0 : uploadConfig.action,
     accept: uploadConfig === null || uploadConfig === void 0 ? void 0 : uploadConfig.accept,
@@ -213,13 +213,18 @@ var ChatInput = function ChatInput(props) {
             }, config.key);
           })]
         }), buttonGroup === null || buttonGroup === void 0 ? void 0 : buttonGroup.map(function (button, idx) {
-          return /*#__PURE__*/_jsx(Tooltip, {
-            title: button.title,
-            children: /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({}, button), {}, {
-              title: "",
-              className: classNames(styles.button, button.className)
-            }), idx)
-          });
+          return (
+            /*#__PURE__*/
+            // key must be set on the outermost element returned by map (Tooltip);
+            // setting it on the inner Button is not seen by React and triggers a "missing key" warning
+            _jsx(Tooltip, {
+              title: button.title,
+              children: /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({}, button), {}, {
+                title: "",
+                className: classNames(styles.button, button.className)
+              }))
+            }, idx)
+          );
         }), uploadEnabled && /*#__PURE__*/_jsx(UploadButton, {
           onFileListChange: handleFileListChange,
           fileList: fileList,

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

@@ -17,8 +17,8 @@
   padding: 10px;
 
   border-radius: 6px;
-  border: 1px solid rgba(0, 0, 0, 0.1);
-  background: #ffffff;
+  border: 1px solid var(--cf-border);
+  background: var(--cf-surface);
 
   .textArea {
     border: none !important;
@@ -51,7 +51,7 @@
 
         .select {
           font-size: 14px;
-          border: 1px solid #d9d9d9;
+          border: 1px solid var(--cf-border);
           border-radius: 4px;
           box-shadow: none;
           opacity: 0.8;
@@ -66,7 +66,7 @@
           }
 
           &[class*="disabled"] {
-            color: #000;
+            color: var(--cf-text);
             background: transparent;
             border: none;
             box-shadow: none;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/Copy/index.js

@@ -28,7 +28,6 @@ var Copy = function Copy(props) {
     var parser = new DOMParser();
     var textContent = (_parser$parseFromStri = parser.parseFromString(html, "text/html")) === null || _parser$parseFromStri === void 0 || (_parser$parseFromStri = _parser$parseFromStri.body) === null || _parser$parseFromStri === void 0 ? void 0 : _parser$parseFromStri.textContent;
     if (textContent) {
-      // const mdText = textContent ? textContent.replace(/\n{2,}/g, '\n') : '';
       var result = clipboard(textContent);
       if (result) {
         message.success("复制成功");

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/Copy/index.module.scss

@@ -8,7 +8,7 @@
 
   font-size: 14px;
   line-height: 18px;
-  color: #5e6772;
+  color: var(--cf-text-2);
 
   cursor: pointer;
 
@@ -18,18 +18,18 @@
 
   .icon {
     font-size: 18px;
-    color: #5e6772;
+    color: var(--cf-text-2);
 
     transition: color 0.3s;
   }
 
   &:hover {
-    color: #060607;
+    color: var(--cf-text);
 
-    background-color: #f3f5fc;
+    background-color: var(--cf-row-hover);
 
     .icon {
-      color: #060607;
+      color: var(--cf-text);
     }
   }
 }

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/LikeDislike/index.module.scss

@@ -13,7 +13,7 @@
 
     font-size: 14px;
     line-height: 18px;
-    color: #5e6772;
+    color: var(--cf-text-2);
 
     cursor: pointer;
 
@@ -21,20 +21,20 @@
 
     .likeIcon {
       font-size: 20px;
-      color: #5e6772;
+      color: var(--cf-text-2);
 
       transition: color 0.3s;
     }
 
     &:hover {
-      color: #060607;
+      color: var(--cf-text);
 
-      background-color: #f3f5fc;
+      background-color: var(--cf-row-hover);
 
       border-radius: 4px;
 
       .likeIcon {
-        color: #060607;
+        color: var(--cf-text);
       }
     }
   }

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.module.scss

@@ -13,7 +13,7 @@
 
     font-size: 14px;
     line-height: 14px;
-    color: #667085;
+    color: var(--cf-text-2);
     white-space: nowrap;
 
     cursor: default;
@@ -26,7 +26,7 @@
       min-width: 0px;
       height: 1px;
 
-      background-color: #e8ebf0;
+      background-color: var(--cf-border);
     }
 
     .quoteIcon {
@@ -48,7 +48,7 @@
       transition: color 0.3s;
 
       &:hover {
-        color: #3976dd;
+        color: var(--primary-color);
       }
     }
   }
@@ -78,8 +78,8 @@
         height: 50%;
 
         background: linear-gradient(
-          rgba(255, 255, 255, 0),
-          rgba(255, 255, 255, 0.91)
+          transparent,
+          color-mix(in srgb, var(--cf-surface) 91%, transparent)
         );
       }
     }
@@ -103,14 +103,14 @@
 
       border-radius: 4px;
 
-      background-color: #f3f5fc;
+      background-color: var(--cf-subtle);
 
       transition: background-color 0.3s, color 0.3s;
 
       &:hover {
         color: #fff;
 
-        background-color: #3976dd;
+        background-color: var(--primary-color);
       }
 
       &.lastRowIndex {

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/index.js

@@ -32,19 +32,19 @@ var AssistantItem = function AssistantItem(props) {
     setExpanded = _useState2[1];
   var prevThinkingRef = useRef(false);
 
-  // 判断是否正在思考中
+  // Determine whether thinking is in progress
   var isThinking = !(item !== null && item !== void 0 && (_item$think = item.think) !== null && _item$think !== void 0 && _item$think.endsWith("</think>")) && !!assistanting;
 
-  // 判断是否有思考内容（排除空标签和标签本身）
+  // Determine whether there is thinking content (excluding empty tags and the tags themselves)
   var hasThink = cleanedThink && cleanedThink.trim().length > 0;
 
-  // 当开始思考时，自动展开；思考结束时，自动收起
+  // Auto-expand when thinking starts; auto-collapse when thinking ends
   useEffect(function () {
     if (isThinking && !prevThinkingRef.current) {
-      // 从非思考状态变为思考状态：展开
+      // Transition from not thinking to thinking: expand
       setExpanded(true);
     } else if (!isThinking && prevThinkingRef.current) {
-      // 从思考状态变为非思考状态：收起
+      // Transition from thinking to not thinking: collapse
       setExpanded(false);
     }
     prevThinkingRef.current = isThinking;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/index.module.scss

@@ -45,20 +45,20 @@
 
   .error {
     font-size: 14px;
-    color: #f5222d;
+    color: var(--cf-error);
 
     border-radius: 4px;
-    border: 1px solid #f5222d;
+    border: 1px solid var(--cf-error);
     padding: 4px 15px;
   }
 
   .noAnswerTip {
     font-size: 14px;
-    color: #8c8c8c;
+    color: var(--cf-text-2);
 
     border-radius: 4px;
-    border: 1px solid #d9d9d9;
+    border: 1px solid var(--cf-border);
     padding: 4px 15px;
-    background-color: #fafafa;
+    background-color: var(--cf-subtle);
   }
 }

package/es/components/Chat/ChatList/_components/Assistant/index.module.scss

@@ -15,7 +15,7 @@
 
         .time {
           font-size: 12px;
-          color: #666;
+          color: var(--cf-text-2);
           font-weight: normal;
         }
       }
@@ -45,7 +45,7 @@
       margin-top: 10px;
 
       font-size: 12px;
-      color: #666;
+      color: var(--cf-text-2);
 
       > div {
         display: flex;
@@ -63,7 +63,7 @@
         cursor: pointer;
 
         &.disabled {
-          color: #ccc;
+          color: var(--cf-text-3);
 
           cursor: not-allowed;
         }

package/es/components/Chat/ChatList/_components/User/index.module.scss

@@ -16,7 +16,7 @@
 
         .time {
           font-size: 12px;
-          color: #666;
+          color: var(--cf-text-2);
           font-weight: normal;
         }
       }
@@ -101,9 +101,9 @@
 
       border-radius: 4px;
 
-      border: 1px solid #e5e5e5;
+      border: 1px solid var(--cf-border);
 
-      background: #ffffff;
+      background: var(--cf-surface);
 
       opacity: 0;
 
@@ -119,16 +119,16 @@
 
         font-size: 18px;
         line-height: 18px;
-        color: #5e6772;
+        color: var(--cf-text-2);
 
         cursor: pointer;
 
         transition: color 0.3s, background-color 0.3s;
 
         &:hover {
-          color: #060607;
+          color: var(--cf-text);
 
-          background-color: #f3f5fc;
+          background-color: var(--cf-row-hover);
 
           border-radius: 4px;
         }

package/es/components/Chat/ChatList/_hooks/useAssistantNavigation.d.ts

@@ -3,7 +3,7 @@ interface UseAssistantNavigationProps {
     itemLength: number;
 }
 /**
- * 管理 Assistant 组件中的导航状态（切换不同的答案）
+ * Manage navigation state in the Assistant component (switching between different answers)
  */
 export declare function useAssistantNavigation({ itemLength, }: UseAssistantNavigationProps): {
     currentIndex: number;

package/es/components/Chat/ChatList/_hooks/useAssistantNavigation.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";
 /**
- * 管理 Assistant 组件中的导航状态（切换不同的答案）
+ * Manage navigation state in the Assistant component (switching between different answers)
  */
 export function useAssistantNavigation(_ref) {
   var itemLength = _ref.itemLength;

package/es/components/Chat/ChatList/_hooks/useCalculateRowIndex.js

@@ -78,7 +78,7 @@ export default function useCalculateRowIndex(containerRef, quoteList) {
     };
     calculateRowIndex();
 
-    // 添加窗口大小调整监听器
+    // Add a window resize listener
     window.addEventListener("resize", calculateRowIndex);
     return function () {
       window.removeEventListener("resize", calculateRowIndex);

package/es/components/Chat/ChatList/_utils/cleanRedactedReasoning.d.ts

@@ -1,6 +1,6 @@
 /**
- * 清理 redacted_reasoning 标签
- * @param text 需要清理的文本
- * @returns 清理后的文本
+ * Clean up redacted_reasoning tags
+ * @param text The text to clean
+ * @returns The cleaned text
  */
 export declare function cleanRedactedReasoning(text: string): string;

package/es/components/Chat/ChatList/_utils/cleanRedactedReasoning.js

@@ -1,7 +1,7 @@
 /**
- * 清理 redacted_reasoning 标签
- * @param text 需要清理的文本
- * @returns 清理后的文本
+ * Clean up redacted_reasoning tags
+ * @param text The text to clean
+ * @returns The cleaned text
  */
 export function cleanRedactedReasoning(text) {
   if (!text) return "";

package/es/components/Checkbox/CheckboxGroup/index.js

@@ -27,7 +27,7 @@ var CheckboxGroup = function CheckboxGroup(props) {
     allMaxHeight = props.allMaxHeight,
     rest = _objectWithoutProperties(props, _excluded);
 
-  // 获取所有非"全部"选项的值
+  // Get the values of all non-"All" options
   var normalValues = useMemo(function () {
     return options === null || options === void 0 ? void 0 : options.map(function (option) {
       if (typeof option === "string" || typeof option === "number") {
@@ -37,7 +37,7 @@ var CheckboxGroup = function CheckboxGroup(props) {
     });
   }, [options]);
 
-  // 计算"全部"选项的状态
+  // Compute the state of the "All" option
   var allChecked = useMemo(function () {
     if (!hasAll || !value || normalValues.length === 0) return false;
     var selectedValues = Array.isArray(value) ? value : [];
@@ -54,19 +54,19 @@ var CheckboxGroup = function CheckboxGroup(props) {
     return selectedCount > 0 && selectedCount < normalValues.length;
   }, [hasAll, value, normalValues]);
 
-  // 处理"全部"选项的点击
+  // Handle clicks on the "All" option
   var handleAllChange = useCallback(function (e) {
     if (!onChange) return;
     if (e.target.checked) {
-      // 选中所有选项
+      // Select all options
       onChange(normalValues);
     } else {
-      // 取消所有选项
+      // Deselect all options
       onChange([]);
     }
   }, [onChange, normalValues]);
 
-  // 处理普通选项的点击
+  // Handle clicks on normal options
   var handleChange = useCallback(function (checkedValues) {
     if (!onChange) return;
     onChange(checkedValues);

package/es/components/Checkbox/CheckboxGroup/index.module.scss

@@ -9,7 +9,7 @@
 
     height: 100%;
 
-    // 当 hasAll 为 true 时，Group 作为子元素
+    // When hasAll is true, the Group is rendered as a child element
     > :global(.ant-checkbox-group) {
       display: flex;
       flex-direction: column;
@@ -31,7 +31,7 @@
     :global(.ant-checkbox-wrapper) {
       :global(.ant-checkbox) {
         :global(.ant-checkbox-inner) {
-          border-color: rgba(204, 204, 204, 1) !important;
+          border-color: var(--cf-border) !important;
 
           background: transparent !important;
 
@@ -54,7 +54,7 @@
             background: rgba(0, 0, 0, 0.04) !important;
 
             &::after {
-              border-color: rgba(204, 204, 204, 1) !important;
+              border-color: var(--cf-border) !important;
             }
           }
 

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

@@ -4,7 +4,7 @@
   &.outline {
     :global(.ant-checkbox) {
       :global(.ant-checkbox-inner) {
-        border-color: rgba(204, 204, 204, 1) !important;
+        border-color: var(--cf-border) !important;
 
         background: transparent !important;
 
@@ -27,7 +27,7 @@
           background: rgba(0, 0, 0, 0.04) !important;
 
           &::after {
-            border-color: rgba(204, 204, 204, 1) !important;
+            border-color: var(--cf-border) !important;
           }
         }
 

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

@@ -2,18 +2,18 @@ import React from "react";
 import { ReactCodeMirrorProps } from "@uiw/react-codemirror";
 export type CodeMirrorLanguageType = "sql" | "json" | "plain";
 export interface CodeMirrorProps extends Omit<ReactCodeMirrorProps, "extensions" | "onError"> {
-    /** 语言类型，支持按需引入 */
+    /** Language type, supports on-demand loading */
     language?: CodeMirrorLanguageType;
-    /** 是否启用语法检查 */
+    /** Whether to enable syntax linting */
     enableLint?: boolean;
-    /** 错误信息回调 */
+    /** Error message callback */
     onLintError?: (error: string | null) => void;
-    /** 是否有错误，用于显示错误边框 */
+    /** Whether there is an error, used to show the error border */
     hasError?: boolean;
-    /** 是否翻译错误信息为中文，默认 false */
+    /** Whether to translate error messages into Chinese, default false */
     translateError?: boolean;
     /**
-     * JSON 校验是否允许根节点为数组 `[...]`，默认 false（仅允许对象 `{...}`）
+     * Whether JSON validation allows the root node to be an array `[...]`, default false (only objects `{...}` are allowed)
      */
     allowJsonArrayRoot?: boolean;
 }

package/es/components/CodeMirror/index.js

@@ -25,9 +25,9 @@ import { linter } from "@codemirror/lint";
 import { sqlLinter, loadSqlParser } from "./linters/sqlLinter";
 import { jsonLinter, loadJsonParser } from "./linters/jsonLinter";
 
-// 支持的语言类型
+// Supported language types
 import { jsx as _jsx } from "react/jsx-runtime";
-// 按需引入语言支持
+// Load language support on demand
 var getLanguageExtension = /*#__PURE__*/function () {
   var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(language) {
     var _yield$import, sql, _yield$import2, json;
@@ -129,18 +129,18 @@ var CodeMirror = function CodeMirror(props) {
               });
               newExtensions.push(linter(lintSource));
             case 19:
-              // 添加错误监听扩展
+              // Add an error listener extension
               if (lintSource) {
                 newExtensions.push(EditorView.updateListener.of(function (update) {
                   if (update.docChanged || update.viewportChanged) {
-                    // 延迟执行以等待 linter 完成
+                    // Delay execution to wait for the linter to finish
                     setTimeout( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
                       var _lintSource, diagnosticsResult, diagnostics, errors, _onLintErrorRef$curre, _onLintErrorRef$curre2, _onLintErrorRef$curre3;
                       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
                         while (1) switch (_context2.prev = _context2.next) {
                           case 0:
                             _context2.prev = 0;
-                            diagnosticsResult = (_lintSource = lintSource) === null || _lintSource === void 0 ? void 0 : _lintSource(update.view); // 处理可能是 Promise 的情况
+                            diagnosticsResult = (_lintSource = lintSource) === null || _lintSource === void 0 ? void 0 : _lintSource(update.view); // Handle the case where the result may be a Promise
                             if (!(diagnosticsResult instanceof Promise)) {
                               _context2.next = 8;
                               break;
@@ -168,7 +168,7 @@ var CodeMirror = function CodeMirror(props) {
                           case 14:
                             _context2.prev = 14;
                             _context2.t1 = _context2["catch"](0);
-                            // 忽略错误
+                            // Ignore errors
                             (_onLintErrorRef$curre3 = onLintErrorRef.current) === null || _onLintErrorRef$curre3 === void 0 || _onLintErrorRef$curre3.call(onLintErrorRef, null);
                           case 17:
                           case "end":
@@ -182,7 +182,7 @@ var CodeMirror = function CodeMirror(props) {
               _context3.next = 23;
               break;
             case 22:
-              // 如果禁用了 lint，清除错误
+              // If lint is disabled, clear the error
               (_onLintErrorRef$curre4 = onLintErrorRef.current) === null || _onLintErrorRef$curre4 === void 0 || _onLintErrorRef$curre4.call(onLintErrorRef, null);
             case 23:
               setExtensions(newExtensions);

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

@@ -22,15 +22,15 @@
   }
 
   &.hasError {
-    border-color: #ff4d4f;
+    border-color: var(--cf-error);
 
     &:hover {
-      border-color: #ff4d4f;
+      border-color: var(--cf-error);
     }
 
     :global(.cm-focused) {
-      border-color: #ff4d4f;
-      box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2);
+      border-color: var(--cf-error);
+      box-shadow: 0 0 0 2px color-mix(in srgb, var(--cf-error) 20%, transparent);
     }
   }
 }