@blueking/chat-x 0.0.48-beta.1 → 0.0.49-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/dist/ag-ui/types/constants.d.ts +1 -0
  2. package/dist/ag-ui/types/file.d.ts +23 -0
  3. package/dist/ag-ui/types/index.d.ts +1 -0
  4. package/dist/ag-ui/types/messages.d.ts +2 -0
  5. package/dist/components/chat-message/assistant-message/assistant-message.vue.d.ts +12 -1
  6. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-file-card.vue.d.ts +12 -0
  7. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/artifact-preview-host.vue.d.ts +7 -0
  8. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/preview-strategy.d.ts +9 -0
  9. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/renderers/html-preview.vue.d.ts +6 -0
  10. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/renderers/markdown-preview.vue.d.ts +6 -0
  11. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/renderers/txt-preview.vue.d.ts +6 -0
  12. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/renderers/url-iframe-preview.vue.d.ts +6 -0
  13. package/dist/components/chat-message/assistant-message/message-artifacts/artifact-preview/use-artifact-preview-loader.d.ts +23 -0
  14. package/dist/components/chat-message/assistant-message/message-artifacts/file-artifact-panel.vue.d.ts +12 -0
  15. package/dist/components/chat-message/assistant-message/message-artifacts/file-icon.d.ts +29 -0
  16. package/dist/components/chat-message/assistant-message/message-artifacts/message-artifacts.vue.d.ts +9 -0
  17. package/dist/components/chat-message/interrupt-message/user-question/use-user-question.d.ts +7 -2
  18. package/dist/components/chat-message/user-message/user-message.vue.d.ts +14 -2
  19. package/dist/composables/index.d.ts +1 -0
  20. package/dist/composables/use-artifact-preview.d.ts +56 -0
  21. package/dist/composables/use-custom-tab.d.ts +2 -0
  22. package/dist/composables/use-message-group.d.ts +433 -0
  23. package/dist/icons/file.d.ts +24 -0
  24. package/dist/icons/index.d.ts +1 -0
  25. package/dist/index.css +1 -1
  26. package/dist/index.js +2217 -1689
  27. package/dist/index.js.map +1 -1
  28. package/dist/lang/lang.d.ts +8 -1
  29. package/dist/mcp/generated/docs/activity-message.md +122 -97
  30. package/dist/mcp/generated/docs/assistant-message.md +125 -62
  31. package/dist/mcp/generated/docs/chat-container.md +97 -18
  32. package/dist/mcp/generated/docs/chat-input.md +2 -10
  33. package/dist/mcp/generated/docs/constants.md +3 -1
  34. package/dist/mcp/generated/docs/content-render.md +2 -10
  35. package/dist/mcp/generated/docs/file-artifact-panel.md +275 -0
  36. package/dist/mcp/generated/docs/info-message.md +29 -12
  37. package/dist/mcp/generated/docs/interrupt.md +1 -0
  38. package/dist/mcp/generated/docs/loading-message.md +36 -17
  39. package/dist/mcp/generated/docs/message-container.md +4 -21
  40. package/dist/mcp/generated/docs/message-render.md +47 -59
  41. package/dist/mcp/generated/docs/messages.md +5 -0
  42. package/dist/mcp/generated/docs/reasoning-message.md +17 -20
  43. package/dist/mcp/generated/docs/tool-message.md +61 -45
  44. package/dist/mcp/generated/docs/toolcall-render.md +8 -8
  45. package/dist/mcp/generated/docs/use-artifact-preview.md +232 -0
  46. package/dist/mcp/generated/docs/use-custom-tab.md +18 -5
  47. package/dist/mcp/generated/docs/use-message-group.md +29 -0
  48. package/dist/mcp/generated/docs/user-message.md +185 -121
  49. package/dist/mcp/generated/docs/user-question-card.md +6 -3
  50. package/dist/mcp/generated/index.json +83 -13
  51. package/dist/mcp/index.js +0 -0
  52. package/package.json +20 -21
@@ -145,8 +145,15 @@ export declare const lang: {
145
145
  readonly 单选: "Single";
146
146
  readonly 多选: "Multiple";
147
147
  readonly 其他: "Others";
148
+ readonly 已完成: "Completed";
149
+ readonly 题: "question(s)";
148
150
  readonly 回答内容: "Answers";
149
151
  readonly 已回复: "Replied";
150
152
  readonly '\u8BF7\u8F93\u5165...': "Please enter...";
153
+ readonly 文件产物: "File Artifacts";
154
+ readonly 文件列表: "File List";
155
+ readonly 搜索文件关键字: "Search file keyword";
156
+ readonly 预览加载失败: "Failed to load preview";
157
+ readonly 暂无可预览的文件: "No file to preview";
151
158
  };
152
- export declare const t: (key: keyof typeof lang) => "Send" | "Stop" | "Ask AI" | "Copy" | "Share" | "Like" | "Unsatisfied" | "Delete" | "Quote" | "Regenerate" | "Regenerating will clear the content below" | "Submit" | "Cancel" | "Preview Content" | "Jump to Detail" | "Call Tool:" | "Calling..." | "Call Success" | "Call Failed" | "Tell us your thoughts" | "What makes you satisfied?" | "What makes you dissatisfied?" | "Return Content" | "Edit" | "Deep Thinking" | "Quick Thinking" | "Image to Text" | "Loading image..." | "Failed to load image" | "Thinking..." | "Thinking Completed" | "Thinking Failed" | "Copy Success" | "Copy Failed" | "Return to bottom" | "Stop generating" | "Stopping" | "Duration" | "Parameters" | "Description" | "Execution Status" | "Running" | "Success" | "Failed" | "Pending" | "To Be Executed" | "Details" | "Retry" | "Retrying" | "Skipping" | "The task is retrying and cannot be skipped" | "The task is skipping and cannot be retried" | "Node" | "Node Config" | "Node Output" | "Basic Info" | "Flow Template" | "Node Name" | "Step Name" | "Execution Plan" | "Optional" | "Failure Handler" | "Timeout Control" | "Yes" | "No" | "Input Params" | "Output Params" | "Param Name" | "Param Value" | "Name" | "Structured Output" | "Manual Skip" | "No Data" | "Call MCP:" | "More" | "Algorithm Plan Review Ticket" | "Reviewing" | "Approving" | "Abandoned" | "Approved" | "Cancelled" | "Expired" | "Rejected" | "Revoked" | "Ticket No." | "Submitted At" | "Current Handler" | "None" | "View Ticket Detail" | "Copy Ticket" | "Copy Ticket Link" | "Cancel Approval" | "Approval Cancelled" | "Refresh Ticket Status" | "This ticket has been rejected and cannot be cancelled" | "This ticket has been approved and cannot be cancelled" | "This ticket has been cancelled, no need to click again" | "Approval cannot be cancelled in the current status" | "There are {count} pending approval tickets in the current conversation. To continue, cancel approval first." | "Unsupported interrupt message" | "Searching" | "Search Completed" | "Upload File" | "Select model" | "Search models" | "Requesting..." | "Cancel satisfied" | "Cancel dissatisfied" | "Confirm delete this answer?" | "This operation cannot be undone. Please proceed with caution!" | "Preview" | "Zoom Out" | "Zoom In" | "Rotate" | "Download" | "Sorry, image loading failed. Please try reloading." | "Reset" | "Reload" | "W" | "H" | "Upload Image" | "Search keyword" | "Select date" | "Locate in Chat" | "Select All" | "Confirm" | "Upload Image, up to 3 images supported, max 2.4MB each" | "Hello, I am BlueKing AI Bot" | "Clear Search" | "Search Result is Empty" | "Valid Evidence" | "Full Screen" | "Exit Full Screen" | "Please choose to continue" | "Continue" | "Received: " | "Done" | "Skip" | "Single" | "Multiple" | "Others" | "Answers" | "Replied" | "Please enter..." | "发送" | "停止" | "问问小鲸" | "复制" | "分享" | "点赞" | "不满意" | "删除" | "引用" | "重新生成" | "重新生成将清空下文内容" | "提交" | "取消" | "预览内容" | "跳转详情" | "调用工具:" | "调用中" | "调用成功" | "调用失败" | "说出您的想法" | "什么原因让你满意?" | "什么原因让你不满意?" | "返回内容" | "编辑" | "深度思考" | "快速思考" | "图生文" | "图片加载中..." | "图片加载失败" | "思考中" | "已思考完成" | "思考失败" | "复制成功" | "复制失败" | "返回底部" | "停止生成" | "正在停止" | "耗时" | "参数" | "描述" | "执行情况" | "执行中" | "成功" | "失败" | "挂起" | "待执行" | "详情" | "重试" | "重试中" | "跳过中" | "任务正在重试中,不可跳过" | "任务正在跳过中,不可重试" | "节点" | "节点配置" | "节点输出" | "基础信息" | "流程模板" | "节点名称" | "步骤名称" | "执行方案" | "是否可选" | "失败处理" | "超时控制" | "是" | "否" | "输入参数" | "输出参数" | "参数名" | "参数值" | "名称" | "变量说明" | "结构化输出" | "手动跳过" | "暂无数据" | "调用 MCP:" | "更多" | "算法方案评审单" | "评审中" | "审批中" | "已废弃" | "已批准" | "已通过" | "已取消" | "已过期" | "已拒绝" | "已撤销" | "单据编号" | "提交时间" | "当前处理人" | "无" | "查看单据详情" | "复制单据" | "复制单据链接" | "取消审批" | "已取消审批" | "刷新单据状态" | "单据已取消审批" | "该单据已被拒绝,无法取消" | "该单据已通过,无法取消" | "单据已取消,无需重复点击" | "当前状态无法取消审批" | "当前会话有 {count} 个待审批单,如需继续,请先取消审批" | "暂不支持的中断消息" | "检索中" | "检索完成" | "上传文件" | "选择模型" | "搜索模型关键字" | "请求中..." | "取消满意" | "取消不满意" | "确认删除该回答?" | "删除操作无法撤回,请谨慎操作!" | "预览" | "缩小" | "放大" | "旋转" | "下载" | "抱歉,图片加载失败,可尝试重新加载" | "重置" | "重新加载" | "宽" | "高" | "上传图片" | "搜索 关键字" | "选择日期" | "在对话中定位" | "全选" | "确定" | "上传图片, 最多支持上传 3 个, 最大支持 2.4MB" | "你好,我是小鲸" | "清空搜索" | "搜索结果为空" | "有效证据" | "全屏" | "退出全屏" | "请选择以继续" | "继续" | "收到信息:" | "待审批" | "已审批" | "完成" | "跳过" | "单选" | "多选" | "其他" | "回答内容" | "已回复" | "请输入...";
159
+ export declare const t: (key: keyof typeof lang) => "Send" | "Stop" | "Ask AI" | "Copy" | "Share" | "Like" | "Unsatisfied" | "Delete" | "Quote" | "Regenerate" | "Regenerating will clear the content below" | "Submit" | "Cancel" | "Preview Content" | "Jump to Detail" | "Call Tool:" | "Calling..." | "Call Success" | "Call Failed" | "Tell us your thoughts" | "What makes you satisfied?" | "What makes you dissatisfied?" | "Return Content" | "Edit" | "Deep Thinking" | "Quick Thinking" | "Image to Text" | "Loading image..." | "Failed to load image" | "Thinking..." | "Thinking Completed" | "Thinking Failed" | "Copy Success" | "Copy Failed" | "Return to bottom" | "Stop generating" | "Stopping" | "Duration" | "Parameters" | "Description" | "Execution Status" | "Running" | "Success" | "Failed" | "Pending" | "To Be Executed" | "Details" | "Retry" | "Retrying" | "Skipping" | "The task is retrying and cannot be skipped" | "The task is skipping and cannot be retried" | "Node" | "Node Config" | "Node Output" | "Basic Info" | "Flow Template" | "Node Name" | "Step Name" | "Execution Plan" | "Optional" | "Failure Handler" | "Timeout Control" | "Yes" | "No" | "Input Params" | "Output Params" | "Param Name" | "Param Value" | "Name" | "Structured Output" | "Manual Skip" | "No Data" | "Call MCP:" | "More" | "Algorithm Plan Review Ticket" | "Reviewing" | "Approving" | "Abandoned" | "Approved" | "Cancelled" | "Expired" | "Rejected" | "Revoked" | "Ticket No." | "Submitted At" | "Current Handler" | "None" | "View Ticket Detail" | "Copy Ticket" | "Copy Ticket Link" | "Cancel Approval" | "Approval Cancelled" | "Refresh Ticket Status" | "This ticket has been rejected and cannot be cancelled" | "This ticket has been approved and cannot be cancelled" | "This ticket has been cancelled, no need to click again" | "Approval cannot be cancelled in the current status" | "There are {count} pending approval tickets in the current conversation. To continue, cancel approval first." | "Unsupported interrupt message" | "Searching" | "Search Completed" | "Upload File" | "Select model" | "Search models" | "Requesting..." | "Cancel satisfied" | "Cancel dissatisfied" | "Confirm delete this answer?" | "This operation cannot be undone. Please proceed with caution!" | "Preview" | "Zoom Out" | "Zoom In" | "Rotate" | "Download" | "Sorry, image loading failed. Please try reloading." | "Reset" | "Reload" | "W" | "H" | "Upload Image" | "Search keyword" | "Select date" | "Locate in Chat" | "Select All" | "Confirm" | "Upload Image, up to 3 images supported, max 2.4MB each" | "Hello, I am BlueKing AI Bot" | "Clear Search" | "Search Result is Empty" | "Valid Evidence" | "Full Screen" | "Exit Full Screen" | "Please choose to continue" | "Continue" | "Received: " | "Done" | "Skip" | "Single" | "Multiple" | "Others" | "Completed" | "question(s)" | "Answers" | "Replied" | "Please enter..." | "File Artifacts" | "File List" | "Search file keyword" | "Failed to load preview" | "No file to preview" | "发送" | "停止" | "问问小鲸" | "复制" | "分享" | "点赞" | "不满意" | "删除" | "引用" | "重新生成" | "重新生成将清空下文内容" | "提交" | "取消" | "预览内容" | "跳转详情" | "调用工具:" | "调用中" | "调用成功" | "调用失败" | "说出您的想法" | "什么原因让你满意?" | "什么原因让你不满意?" | "返回内容" | "编辑" | "深度思考" | "快速思考" | "图生文" | "图片加载中..." | "图片加载失败" | "思考中" | "已思考完成" | "思考失败" | "复制成功" | "复制失败" | "返回底部" | "停止生成" | "正在停止" | "耗时" | "参数" | "描述" | "执行情况" | "执行中" | "成功" | "失败" | "挂起" | "待执行" | "详情" | "重试" | "重试中" | "跳过中" | "任务正在重试中,不可跳过" | "任务正在跳过中,不可重试" | "节点" | "节点配置" | "节点输出" | "基础信息" | "流程模板" | "节点名称" | "步骤名称" | "执行方案" | "是否可选" | "失败处理" | "超时控制" | "是" | "否" | "输入参数" | "输出参数" | "参数名" | "参数值" | "名称" | "变量说明" | "结构化输出" | "手动跳过" | "暂无数据" | "调用 MCP:" | "更多" | "算法方案评审单" | "评审中" | "审批中" | "已废弃" | "已批准" | "已通过" | "已取消" | "已过期" | "已拒绝" | "已撤销" | "单据编号" | "提交时间" | "当前处理人" | "无" | "查看单据详情" | "复制单据" | "复制单据链接" | "取消审批" | "已取消审批" | "刷新单据状态" | "单据已取消审批" | "该单据已被拒绝,无法取消" | "该单据已通过,无法取消" | "单据已取消,无需重复点击" | "当前状态无法取消审批" | "当前会话有 {count} 个待审批单,如需继续,请先取消审批" | "暂不支持的中断消息" | "检索中" | "检索完成" | "上传文件" | "选择模型" | "搜索模型关键字" | "请求中..." | "取消满意" | "取消不满意" | "确认删除该回答?" | "删除操作无法撤回,请谨慎操作!" | "预览" | "缩小" | "放大" | "旋转" | "下载" | "抱歉,图片加载失败,可尝试重新加载" | "重置" | "重新加载" | "宽" | "高" | "上传图片" | "搜索 关键字" | "选择日期" | "在对话中定位" | "全选" | "确定" | "上传图片, 最多支持上传 3 个, 最大支持 2.4MB" | "你好,我是小鲸" | "清空搜索" | "搜索结果为空" | "有效证据" | "全屏" | "退出全屏" | "请选择以继续" | "继续" | "收到信息:" | "待审批" | "已审批" | "完成" | "跳过" | "单选" | "多选" | "其他" | "已完成" | "题" | "回答内容" | "已回复" | "请输入..." | "文件产物" | "文件列表" | "搜索文件关键字" | "预览加载失败" | "暂无可预览的文件";
@@ -5,21 +5,25 @@
5
5
 
6
6
  ### 关联组件
7
7
  - **message-render** — 由 MessageRender 在 role 为 activity 时创建
8
- - **assistant-message** — 常与助手回复相邻,描述检索或执行背景
8
+ - **flow-agent-content** — activityType 为 flow_agent 时渲染
9
+ - **knowledge-rag-content** — activityType 为 knowledge_rag 时渲染
10
+ - **reference-doc-content** — activityType 为 reference_document 时渲染
11
+ - **chat-container** — uid / onInterruptResume / 侧栏 Tab 与 ChatContainer 联动
9
12
 
10
13
  ---
11
14
  <!-- FULL DOC -->
12
15
 
13
16
  # ActivityMessage 活动消息
17
+
14
18
  ## 源码事实
15
19
 
16
20
  - **源码位置**:`src/components/chat-message/activity-message/activity-message.vue`
17
21
  - **能力域**:消息系统
18
- - **能力说明**:按 activityType 分发 FlowAgent、知识召回、引用文档等活动内容。
22
+ - **能力说明**:按 `activityType` 分发 FlowAgent、知识召回、引用文档等活动内容;未知类型不渲染。
19
23
 
20
- > **能力域**:消息系统
24
+ > **导出说明**:`ActivityMessage` **未**从 `@blueking/chat-x` 包入口导出(入口同名导出是 TS interface)。消费方请通过 `MessageRender` / `MessageContainer` 渲染 `role: 'activity'`。下文带 `*Comp` 的 demo 为文档站内部相对路径示例。
21
25
 
22
- 活动消息组件,用于展示 AI 的知识检索(Knowledge RAG)过程、参考文档引用列表和 FlowAgent 流程执行情况。通过 `activityType` 切换三种工作模式,点击标题栏可折叠/展开内容区域。
26
+ 活动消息组件,用于展示知识检索(Knowledge RAG)、参考文档引用与 FlowAgent 执行情况。通过 `activityType` 映射到对应子组件;点击标题栏可折叠/展开。
23
27
 
24
28
  组件会将父级传入消息上的 **`uid`** 以 **`message-uid`** 形式透传给各活动子组件(`FlowAgentContent` / `KnowledgeRagContent` / `ReferenceDocContent`),用于侧栏自定义 Tab、`addCustomTab` 的 `data.messageUid` 与主对话区「在对话中定位」联动(详见 [ChatContainer](/components/setup/chat-container))。
25
29
 
@@ -29,45 +33,46 @@
29
33
 
30
34
  组件根据 `activityType` 的值决定渲染模式:
31
35
 
32
- | `activityType` | 模式 | 标题文案 | 图标 | 内容区 |
33
- | ----------------- | -------------- | ------------------------------------ | ---------------- | ----------------------------------- |
34
- | `'knowledge_rag'` | 知识检索模式 | 检索中 / 检索完成(随 status 切换) | Loading / 文档 | Markdown 检索摘要 + 引用列表 |
35
- | `'flow_agent'` | FlowAgent 模式 | 执行情况: 成功 N / 失败 N / 执行中 N | Loading / 箭头 | 任务节点树 + 节点详情(自定义 Tab) |
36
- | 其他任意值 | 引用文档模式 | 引用 N 篇资料作为参考 | 文档图标(固定) | 引用文档列表 |
36
+ | `activityType` | 模式 | 标题文案 | 图标 | 内容区 |
37
+ | ----------------------- | -------------- | ------------------------------------ | ---------------- | ----------------------------------- |
38
+ | `'knowledge_rag'` | 知识检索模式 | 检索中 / 检索完成(随 status 切换) | Loading / 文档 | Markdown 检索摘要 + 引用列表 |
39
+ | `'flow_agent'` | FlowAgent 模式 | 执行情况: 成功 N / 失败 N / 执行中 N | Loading / 箭头 | 任务节点树 + 节点详情(自定义 Tab) |
40
+ | `'reference_document'` | 引用文档模式 | 引用 N 篇资料作为参考 | 文档图标(固定) | 引用文档列表 |
41
+ | 其他未映射值 | — | — | — | **不渲染**(`activityComponent` 为 falsy) |
37
42
 
38
- > **注意:** 只有值严格等于 `'knowledge_rag'` 才进入知识检索模式;严格等于 `'flow_agent'`(`MessageContentType.FlowAgent`)才进入 FlowAgent 模式;其他值均按引用文档模式处理。
43
+ > **注意:** 源码仅映射上述三种 `MessageContentType`;`activityType` 缺失或未知时组件输出为空。
39
44
 
40
45
  ## 引用文档模式
41
46
 
42
- `activityType` 传入 `MessageContentType.ReferenceDocument`(`'reference_document'`)或任意非 `'knowledge_rag'` 的值,`content` 传入文档对象数组。
47
+ `activityType` 必须为 `MessageContentType.ReferenceDocument`(`'reference_document'`),`content` 传入文档对象数组。
43
48
 
44
49
  标题自动显示文档数量,始终展示文档图标,`status` 不影响标题和图标。
45
50
 
46
51
  ```vue
52
+ <!-- 消费方:经 MessageRender 渲染 -->
47
53
  <template>
48
- <ActivityMessage
49
- v-model:collapsed="collapsed"
50
- :content="docs"
51
- status="complete"
52
- :activity-type="MessageContentType.ReferenceDocument"
53
- />
54
+ <MessageRender :message="message" />
54
55
  </template>
55
56
 
56
57
  <script setup lang="ts">
57
- import { ref } from 'vue';
58
- import { ActivityMessage, MessageContentType, MessageStatus } from '@blueking/chat-x';
59
-
60
- const collapsed = ref(false);
61
-
62
- const docs = [
63
- {
64
- name: 'Vue 3 组合式 API 指南',
65
- url: 'https://cn.vuejs.org/guide/extras/composition-api-faq.html',
66
- originFile: 'composition-api.md',
67
- },
68
- { name: 'TypeScript 高级类型手册', url: 'https://www.typescriptlang.org/docs/', originFile: 'ts-advanced.pdf' },
69
- { name: '蓝鲸前端开发规范 v2.0', url: 'https://example.com/bk-standard', originFile: 'bk-standard.docx' },
70
- ];
58
+ import { MessageRender, MessageContentType, MessageRole, MessageStatus } from '@blueking/chat-x';
59
+
60
+ const message = {
61
+ id: '2',
62
+ messageId: '2',
63
+ role: MessageRole.Activity,
64
+ activityType: MessageContentType.ReferenceDocument,
65
+ status: MessageStatus.Complete,
66
+ uid: 'activity-ref-1',
67
+ content: [
68
+ {
69
+ name: 'Vue 3 组合式 API 指南',
70
+ url: 'https://cn.vuejs.org/guide/extras/composition-api-faq.html',
71
+ originFile: 'composition-api.md',
72
+ },
73
+ { name: 'TypeScript 高级类型手册', url: 'https://www.typescriptlang.org/docs/', originFile: 'ts-advanced.pdf' },
74
+ ],
75
+ };
71
76
  </script>
72
77
  ```
73
78
 
@@ -86,28 +91,25 @@
86
91
 
87
92
  ```vue
88
93
  <template>
89
- <ActivityMessage
90
- v-model:collapsed="collapsed"
91
- :content="ragContent"
92
- :status="status"
93
- :activity-type="MessageContentType.KnowledgeRag"
94
- />
94
+ <MessageRender :message="message" />
95
95
  </template>
96
96
 
97
97
  <script setup lang="ts">
98
- import { ref } from 'vue';
99
- import { ActivityMessage, MessageContentType, MessageStatus } from '@blueking/chat-x';
100
-
101
- const collapsed = ref(false);
102
- const status = ref(MessageStatus.Complete);
103
-
104
- const ragContent = {
105
- // 检索摘要(支持 Markdown)
106
- content: '根据知识库检索,Vue 3 引入了 Composition API...',
107
- // 引用文档列表
108
- referenceDocument: [
109
- { name: '知识库文档:Composition API 详解', url: 'https://example.com/kb1', originFile: 'kb1.md' },
110
- ],
98
+ import { MessageRender, MessageContentType, MessageRole, MessageStatus } from '@blueking/chat-x';
99
+
100
+ const message = {
101
+ id: '1',
102
+ messageId: '1',
103
+ role: MessageRole.Activity,
104
+ activityType: MessageContentType.KnowledgeRag,
105
+ status: MessageStatus.Complete,
106
+ uid: 'activity-rag-1',
107
+ content: {
108
+ content: '根据知识库检索,Vue 3 引入了 Composition API...',
109
+ referenceDocument: [
110
+ { name: '知识库文档:Composition API 详解', url: 'https://example.com/kb1', originFile: 'kb1.md' },
111
+ ],
112
+ },
111
113
  };
112
114
  </script>
113
115
  ```
@@ -132,24 +134,20 @@
132
134
 
133
135
  通过 `v-model:collapsed` 控制内容区的折叠状态,点击整个标题栏均可切换。默认为 `false`(展开)。
134
136
 
135
- ```vue
136
- <template>
137
- <!-- 默认展开 -->
138
- <ActivityMessage
139
- v-model:collapsed="collapsed"
140
- :content="docs"
141
- status="complete"
142
- activity-type="reference_document"
143
- />
144
- </template>
137
+ 文档站内部示例(相对路径引入组件本体)可通过 `v-model:collapsed` 控制;消费方一般不直接绑定,折叠状态由活动子组件内部管理。
145
138
 
146
- <script setup lang="ts">
147
- import { ref } from 'vue';
148
- import { ActivityMessage } from '@blueking/chat-x';
139
+ ```vue
140
+ <!-- 文档站内部示例 -->
141
+ <ActivityMessageComp
142
+ v-model:collapsed="collapsed"
143
+ :content="docs"
144
+ status="complete"
145
+ activity-type="reference_document"
146
+ />
147
+ ```
149
148
 
150
- const collapsed = ref(false); // false = 展开,true = 折叠
151
- const docs = [{ name: '参考文档', url: 'https://example.com/doc', originFile: 'doc.pdf' }];
152
- </script>
149
+ ```ts
150
+ const collapsed = ref(false); // false = 展开,true = 折叠
153
151
  ```
154
152
 
155
153
  **渲染效果(展开状态)**
@@ -202,21 +200,15 @@ FlowAgentContent(activityType = 'flow_agent')
202
200
 
203
201
  ```vue
204
202
  <template>
205
- <ActivityMessage
206
- v-model:collapsed="collapsed"
207
- :content="flowContent"
208
- :status="status"
209
- :activity-type="MessageContentType.FlowAgent"
203
+ <MessageRender
204
+ :message="message"
205
+ :on-interrupt-resume="handleInterruptResume"
210
206
  />
211
207
  </template>
212
208
 
213
209
  <script setup lang="ts">
214
- import { ref } from 'vue';
215
- import { ActivityMessage, MessageContentType, MessageStatus } from '@blueking/chat-x';
216
- import type { BkFlowMessageContent } from '@blueking/chat-x';
217
-
218
- const collapsed = ref(false);
219
- const status = ref(MessageStatus.Complete);
210
+ import { MessageRender, MessageContentType, MessageRole, MessageStatus } from '@blueking/chat-x';
211
+ import type { BkFlowMessageContent, OnInterruptResume } from '@blueking/chat-x';
220
212
 
221
213
  const flowContent: BkFlowMessageContent = [
222
214
  {
@@ -241,18 +233,6 @@ FlowAgentContent(activityType = 'flow_agent')
241
233
  skip: false,
242
234
  type: 'ServiceActivity',
243
235
  },
244
- node2: {
245
- id: 'node2',
246
- name: '数据转换',
247
- state: 'FINISHED',
248
- elapsed_time: 45,
249
- start_time: '2025-01-01 10:00:12',
250
- finish_time: '2025-01-01 10:00:57',
251
- loop: 1,
252
- retry: 0,
253
- skip: false,
254
- type: 'ServiceActivity',
255
- },
256
236
  node3: {
257
237
  id: 'node3',
258
238
  name: '结果写入',
@@ -263,11 +243,51 @@ FlowAgentContent(activityType = 'flow_agent')
263
243
  loop: 1,
264
244
  retry: 0,
265
245
  skip: false,
246
+ retryable: true,
247
+ skippable: true,
266
248
  type: 'ServiceActivity',
267
249
  },
268
250
  },
269
251
  },
270
252
  ];
253
+
254
+ const message = {
255
+ id: '3',
256
+ messageId: '3',
257
+ role: MessageRole.Activity,
258
+ activityType: MessageContentType.FlowAgent,
259
+ status: MessageStatus.Complete,
260
+ uid: 'activity-flow-1',
261
+ content: flowContent,
262
+ };
263
+
264
+ const handleInterruptResume: OnInterruptResume = async payload => {
265
+ console.log('节点重试/跳过', payload);
266
+ };
267
+ </script>
268
+ ```
269
+
270
+ ## 未知 activityType(不渲染)
271
+
272
+ 未映射的 `activityType` 不会回退到引用文档模式,组件直接不渲染:
273
+
274
+ ```vue
275
+ <template>
276
+ <MessageRender :message="message" />
277
+ <!-- 页面上无任何活动内容输出 -->
278
+ </template>
279
+
280
+ <script setup lang="ts">
281
+ import { MessageRender, MessageRole, MessageStatus } from '@blueking/chat-x';
282
+
283
+ const message = {
284
+ id: 'x',
285
+ messageId: 'x',
286
+ role: MessageRole.Activity,
287
+ activityType: 'unknown_activity',
288
+ status: MessageStatus.Complete,
289
+ content: [{ name: '不会展示', url: '#', originFile: 'a.md' }],
290
+ };
271
291
  </script>
272
292
  ```
273
293
 
@@ -410,14 +430,15 @@ enum MessageContentType {
410
430
 
411
431
  ### Props
412
432
 
413
- | 属性名 | 类型 | 默认值 | 说明 |
414
- | ------------ | --------------------------------------------------------------------------- | ------ | --------------------------------------------------------- |
415
- | content | `ReferenceDocumentContent[] \| KnowledgeRagContent \| BkFlowMessageContent` | - | 内容数据,格式随 `activityType` 不同 |
416
- | activityType | `'knowledge_rag' \| 'flow_agent' \| 'reference_document' \| string` | - | 活动类型,决定渲染模式(知识检索 / FlowAgent / 引用文档) |
417
- | status | `MessageStatus` | - | 消息状态;在 `knowledge_rag` 模式下影响标题和图标,在 `flow_agent` 模式下影响标题 Loading 状态 |
418
- | id | `string \| number` | - | 消息 ID |
419
- | messageId | `string \| number` | - | 消息唯一标识 |
420
- | onInterruptResume | `OnInterruptResume` | - | `flow_agent` 子组件消费;失败节点「重试 / 跳过」回调,由 `MessageRender` 透传 |
433
+ | 属性名 | 类型 | 默认值 | 说明 |
434
+ | ----------------- | --------------------------------------------------------------------------- | ------ | -------------------------------------------------------------------------------------------- |
435
+ | content | `ReferenceDocumentContent[] \| KnowledgeRagContent \| BkFlowMessageContent` | - | 内容数据,格式随 `activityType` 不同 |
436
+ | activityType | `'knowledge_rag' \| 'flow_agent' \| 'reference_document' \| string` | - | 活动类型;仅三种已知值会渲染,其余不渲染 |
437
+ | status | `MessageStatus` | - | `knowledge_rag` 影响标题/图标;`flow_agent` 影响标题 Loading |
438
+ | id | `string \| number` | - | 消息 ID |
439
+ | messageId | `string \| number` | - | 消息唯一标识 |
440
+ | uid | `string` | - | 透传为子组件 `message-uid`,用于侧栏 Tab / 「在对话中定位」 |
441
+ | onInterruptResume | `OnInterruptResume` | - | 仅 `flow_agent` 子组件消费;失败节点「重试 / 跳过」,由 `MessageRender` 透传 |
421
442
 
422
443
  ### v-model
423
444
 
@@ -425,6 +446,10 @@ enum MessageContentType {
425
446
  | --------- | --------- | ------- | --------------------------- |
426
447
  | collapsed | `boolean` | `false` | 内容折叠状态,`true` 为折叠 |
427
448
 
449
+ ### Events / Slots / Expose
450
+
451
+ 无。
452
+
428
453
  ## 类型定义
429
454
 
430
455
  ```typescript