@blueking/chat-x 0.0.52-dev.5 → 2.4.0

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 (58) hide show
  1. package/dist/components/chat-content/flow-agent-content/flow-agent-state.d.ts +1 -1
  2. package/dist/components/chat-content/flow-agent-content/use-flow-node-actions.d.ts +1 -1
  3. package/dist/composables/use-common.d.ts +9 -0
  4. package/dist/index.css +1 -1
  5. package/dist/index.js +2497 -2486
  6. package/dist/index.js.map +1 -1
  7. package/dist/lang/lang.d.ts +3 -2
  8. package/dist/mcp/generated/docs/activity-layout.md +4 -2
  9. package/dist/mcp/generated/docs/activity-message.md +4 -4
  10. package/dist/mcp/generated/docs/ai-selection.md +5 -2
  11. package/dist/mcp/generated/docs/ai-slash-input.md +4 -0
  12. package/dist/mcp/generated/docs/animation-text.md +5 -1
  13. package/dist/mcp/generated/docs/assistant-message.md +1 -1
  14. package/dist/mcp/generated/docs/chat-container.md +3 -1
  15. package/dist/mcp/generated/docs/chat-input.md +1 -0
  16. package/dist/mcp/generated/docs/cite-content.md +6 -2
  17. package/dist/mcp/generated/docs/common-error-content.md +8 -2
  18. package/dist/mcp/generated/docs/delete-tool.md +6 -1
  19. package/dist/mcp/generated/docs/desc-panel.md +5 -1
  20. package/dist/mcp/generated/docs/detail-section.md +3 -1
  21. package/dist/mcp/generated/docs/execution-summary.md +23 -1
  22. package/dist/mcp/generated/docs/file-content.md +8 -2
  23. package/dist/mcp/generated/docs/file-upload-btn.md +3 -1
  24. package/dist/mcp/generated/docs/flow-agent-content.md +24 -15
  25. package/dist/mcp/generated/docs/flow-agent-node-detail.md +5 -2
  26. package/dist/mcp/generated/docs/highlight-keyword.md +9 -31
  27. package/dist/mcp/generated/docs/input-attachment.md +3 -0
  28. package/dist/mcp/generated/docs/input-info-alert.md +3 -0
  29. package/dist/mcp/generated/docs/interrupt-message.md +6 -1
  30. package/dist/mcp/generated/docs/key-value-content.md +6 -1
  31. package/dist/mcp/generated/docs/knowledge-rag-content.md +4 -1
  32. package/dist/mcp/generated/docs/markdown-container.md +3 -0
  33. package/dist/mcp/generated/docs/markdown-content.md +2 -2
  34. package/dist/mcp/generated/docs/mention-tag.md +2 -0
  35. package/dist/mcp/generated/docs/mention-text.md +3 -0
  36. package/dist/mcp/generated/docs/message-container.md +4 -4
  37. package/dist/mcp/generated/docs/preview-toolbar.md +4 -0
  38. package/dist/mcp/generated/docs/reference-content.md +6 -1
  39. package/dist/mcp/generated/docs/reference-doc-content.md +3 -1
  40. package/dist/mcp/generated/docs/simple-table.md +3 -1
  41. package/dist/mcp/generated/docs/text-content.md +5 -1
  42. package/dist/mcp/generated/docs/tool-btn.md +10 -4
  43. package/dist/mcp/generated/docs/toolcall-render.md +8 -8
  44. package/dist/mcp/generated/docs/use-animation-text.md +2 -1
  45. package/dist/mcp/generated/docs/use-artifact-preview.md +11 -1
  46. package/dist/mcp/generated/docs/use-flow-node-actions.md +20 -10
  47. package/dist/mcp/generated/docs/user-question-card.md +31 -0
  48. package/dist/mcp/generated/docs/vnode-renderer.md +3 -3
  49. package/dist/mcp/generated/index.json +93 -100
  50. package/dist/mcp/tools/list-components.js +1 -0
  51. package/dist/mcp/tools/list-components.js.map +1 -1
  52. package/dist/mcp/utils/doc-loader.d.ts +1 -0
  53. package/dist/mcp/utils/doc-loader.js.map +1 -1
  54. package/dist/utils/index.d.ts +1 -0
  55. package/package.json +2 -2
  56. package/skills/blueking-chat-x/references/components/ai-selection.md +1 -1
  57. package/dist/mcp/generated/docs/questions-container.md +0 -88
  58. package/dist/mcp/generated/docs/selection-question.md +0 -91
@@ -74,42 +74,20 @@ ExecutionSummary
74
74
  └── HighlightKeyword(:text) ← inject(keyword)
75
75
  ```
76
76
 
77
- ## 配套 Composables
77
+ ## 配套 Composables(内部,未从包入口导出)
78
78
 
79
- ### useKeywordProvider
79
+ `useKeywordProvider` / `useKeywordInject` / `useKeywordMatch` 在 `src/composables/use-common.ts`,**不能** `from '@blueking/chat-x'`。业务侧把 `HighlightKeyword` 放在 [ChatContainer](/components/setup/chat-container) / [ExecutionSummary](/components/agent/execution-summary) 子树即可,库已注入关键词。
80
80
 
81
- 在上层组件中创建关键词并 `provide`,后代组件通过 `useKeywordInject` 消费:
81
+ 库内或文档站高级用法用相对路径:
82
82
 
83
83
  ```typescript
84
- import { useKeywordProvider } from '@blueking/chat-x';
84
+ import { useKeywordProvider, useKeywordInject, useKeywordMatch } from '../../../src/composables/use-common';
85
85
 
86
86
  const { keyword } = useKeywordProvider();
87
87
  keyword.value = '搜索词';
88
- ```
89
-
90
- ### useKeywordInject
91
-
92
- 在后代组件中注入关键词,返回 `ComputedRef<string> | undefined`:
93
-
94
- ```typescript
95
- import { useKeywordInject } from '@blueking/chat-x';
96
-
97
- const keyword = useKeywordInject();
98
- console.log(keyword?.value); // 当前搜索关键词
99
- ```
100
-
101
- ### useKeywordMatch
102
-
103
- 用于判断组件的可搜索文本是否与当前关键词匹配。内部调用 `useKeywordInject` 获取关键词,根据传入的文本提取函数判断是否命中:
104
-
105
- ```typescript
106
- import { useKeywordMatch } from '@blueking/chat-x';
107
88
 
89
+ const injected = useKeywordInject();
108
90
  const { keywordMatched } = useKeywordMatch(() => [props.title, props.description, props.content]);
109
-
110
- // keywordMatched.value === true 表示命中搜索
111
- // keywordMatched.value === false 表示未命中(可据此隐藏组件)
112
- // keyword 为空时始终返回 true
113
91
  ```
114
92
 
115
93
  `useKeywordMatch` 的典型用途是在 `ExecutionSummary` 的搜索过滤中,让组件自行判断是否匹配搜索词,与 `HighlightKeyword` 配合实现搜索 + 高亮。
@@ -132,9 +110,9 @@ const { keywordMatched } = useKeywordMatch(() => [props.title, props.description
132
110
 
133
111
  | 函数名 | 参数 | 返回值 | 说明 |
134
112
  | -------------------- | ----------------------------------------------- | ------------------------------------------ | --------------------------------------------- |
135
- | `useKeywordProvider` | — | `{ keyword: ShallowRef<string> }` | 创建并 `provide` 关键词,用于上层组件 |
136
- | `useKeywordInject` | — | `ComputedRef<string> \| undefined` | 注入关键词,用于后代组件 |
137
- | `useKeywordMatch` | `getSearchTexts: () => (string \| undefined)[]` | `{ keywordMatched: ComputedRef<boolean> }` | 判断组件文本是否匹配关键词,空关键词返回 true |
113
+ | `useKeywordProvider` | — | `{ keyword: ShallowRef<string> }` | 内部 API,见 `src/composables/use-common.ts` |
114
+ | `useKeywordInject` | — | `ComputedRef<string> \| undefined` | 内部 API,见 `src/composables/use-common.ts` |
115
+ | `useKeywordMatch` | `getSearchTexts: () => (string \| undefined)[]` | `{ keywordMatched: ComputedRef<boolean> }` | 内部 API;空关键词返回 true |
138
116
 
139
117
  ### CSS 类名
140
118
 
@@ -144,6 +122,6 @@ const { keywordMatched } = useKeywordMatch(() => [props.title, props.description
144
122
 
145
123
  ## 关联组件
146
124
 
147
- - [ToolcallRender](/components/agent/toolcall-render) — 工具调用头部高亮
125
+ - [ToolCallRender](/components/agent/toolcall-render) — 工具调用头部高亮
148
126
  - [DescPanel](/components/rendering/desc-panel) — 详情面板键值高亮
149
127
  - [ExecutionSummary](/components/agent/execution-summary) — 执行摘要搜索
@@ -8,6 +8,9 @@ ChatInput 底部附件区布局,承载快捷按钮、文件与发送图标。
8
8
 
9
9
  # InputAttachment 输入附件区
10
10
 
11
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
12
+ > 业务请通过 [ChatInput](/components/input/chat-input) 使用。
13
+
11
14
  > **能力域**:输入交互
12
15
 
13
16
  ## 源码事实
@@ -8,6 +8,9 @@ ChatInput 上方的信息提示条。 源码位置:src/components/chat-input/i
8
8
 
9
9
  # InputInfoAlert 输入提示条
10
10
 
11
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
12
+ > 业务请通过 [ChatInput](/components/input/chat-input) 使用。
13
+
11
14
  > **能力域**:输入交互
12
15
 
13
16
  ## 源码事实
@@ -12,7 +12,12 @@
12
12
  ---
13
13
  <!-- FULL DOC -->
14
14
 
15
- # InterruptMessage 中断消息
15
+ # InterruptMessageRender 中断消息
16
+
17
+ | 名称 | 种类 |
18
+ | --- | --- |
19
+ | `InterruptMessage` | TS 消息类型 |
20
+ | `InterruptMessageRender` | 包入口 Vue 组件 |
16
21
  ## 源码事实
17
22
 
18
23
  - **源码位置**:`src/components/chat-message/interrupt-message/interrupt-message.vue`
@@ -10,6 +10,11 @@
10
10
  <!-- FULL DOC -->
11
11
 
12
12
  # KeyValueContent 键值对内容
13
+
14
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
15
+ > 业务请通过 [UserMessage](/components/message/user-message) / [MessageRender](/components/message/message-render) 使用。
16
+ > 文档站 demo 使用相对路径引入源码;不要写 `import { KeyValueContent } from '@blueking/chat-x'`。
17
+
13
18
  ## 源码事实
14
19
 
15
20
  - **源码位置**:`src/components/chat-content/key-value-content/key-value-content.vue`
@@ -48,7 +53,7 @@ div.ai-key-value-content(flex column,gap: 8px,font-size: 12px,color: #4d
48
53
  </template>
49
54
 
50
55
  <script setup lang="ts">
51
- import { KeyValueContent } from '@blueking/chat-x';
56
+ // KeyValueContent 未从包入口导出;文档站 demo 使用页面顶部相对路径
52
57
 
53
58
  const data = [
54
59
  { key: '名称', value: '蓝鲸智云' },
@@ -14,6 +14,9 @@
14
14
 
15
15
  # KnowledgeRagContent 知识召回内容
16
16
 
17
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
18
+ > 业务请通过 [MessageRender](/components/message/message-render) 渲染 `role: 'activity'`。
19
+
17
20
  > **能力域**:Agent 能力
18
21
 
19
22
  `KnowledgeRagContent` 用于渲染知识召回活动内容,包含活动标题、加载态、Markdown 摘要和引用来源列表。它是 `ActivityMessage` 在 `activityType === 'knowledge_rag'` 时使用的具体内容组件。
@@ -46,7 +49,7 @@
46
49
 
47
50
  <script setup lang="ts">
48
51
  import { ref } from 'vue';
49
- import KnowledgeRagContent from '@blueking/chat-x/src/components/chat-content/knowledge-rag-content/knowledge-rag-content.vue';
52
+ // KnowledgeRagContent 未从包入口导出;文档站 demo 使用页面顶部相对路径
50
53
  import type { KnowledgeRagMessageContent } from '@blueking/chat-x';
51
54
 
52
55
  const collapsed = ref(false);
@@ -11,6 +11,9 @@ markdownItContainer 基于 markdown-it-container,支持字符串或正则匹
11
11
 
12
12
  # markdownItContainer 自定义容器插件
13
13
 
14
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
15
+ > 由 [MarkdownContent](/components/rendering/markdown-content) 内部注册。请用相对路径引入源码,不要写 `import { markdownItContainer } from '@blueking/chat-x'`。
16
+
14
17
  > **分类**:plugin
15
18
 
16
19
  将 `::: 容器名` 开头的块解析为带 `class` 的块级容器,闭合行使用 `:::`。
@@ -28,7 +28,7 @@ AI 消息内容渲染的核心基础组件,集成代码高亮、LaTeX 公式
28
28
  ## 组件结构与渲染流程
29
29
 
30
30
  ```
31
- props.content → completeMarkdownSyntax → md.parse → groupTokens → groupedTokens
31
+ props.content → completeMarkdownSyntax().content → md.parse → groupTokens → groupedTokens
32
32
  │
33
33
  div.ai-markdown-content(contain: layout style)
34
34
  │
@@ -148,7 +148,7 @@ props.content → completeMarkdownSyntax → md.parse → groupTokens → groupe
148
148
  | 机制 | 实现 | 作用 |
149
149
  | ----------------- | -------------------------------------------------------------------------------------------- | ---------------------------------------------------------- |
150
150
  | 极速节流 | `parseMarkdownContent` throttle **5ms**,leading + trailing | 每 5ms 最多解析一次,兼顾实时性与性能 |
151
- | Markdown 语法补全 | `completeMarkdownSyntax(content)` | 自动闭合代码块、行内代码、粗斜体、删除线、链接等未完成语法 |
151
+ | Markdown 语法补全 | `completeMarkdownSyntax(content).content` | 自动闭合代码块、行内代码、粗斜体、删除线、链接等未完成语法 |
152
152
  | LaTeX 防闪烁 | `isIncomplete=true` 且已有渲染结果 → **跳过本次更新** | 正在输入 LaTeX 命令时保持上一帧,避免闪白 |
153
153
  | 子组件 throttle | `handleTokenMounted` throttle 100ms | 限制子组件挂载后触发的滚动到底部频率 |
154
154
  | CSS contain | `.ai-markdown-content { contain: layout style }`<br>`.ai-markdown-body { contain: content }` | 限制重排/重绘范围,减少流式渲染的布局开销 |
@@ -14,6 +14,8 @@ MentionTag 渲染「图标 + 蓝色名称」的内联资源标签:节点数据
14
14
 
15
15
  # MentionTag 资源标签
16
16
 
17
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
18
+
17
19
  > **能力域**:内容渲染
18
20
 
19
21
  ## 源码事实
@@ -13,6 +13,9 @@ MentionText 接收一份 TagSchema 文档(二维数组:行 → 节点),
13
13
 
14
14
  # MentionText 标签文本
15
15
 
16
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
17
+ > 业务请通过 [UserMessage](/components/message/user-message) / [MessageRender](/components/message/message-render) 使用。
18
+
16
19
  > **能力域**:内容渲染
17
20
 
18
21
  ## 源码事实
@@ -1,7 +1,7 @@
1
1
  <!-- AI SUMMARY -->
2
2
  ## 快速了解
3
3
 
4
- 负责消息分组渲染、滚动控制、工具栏和消息插槽透传。 源码位置:src/components/chat-message/message-container/message-container.vue。
4
+ 负责按传入的 `messageGroups` 渲染、滚动控制、工具栏和消息插槽透传。 源码位置:src/components/chat-message/message-container/message-container.vue。
5
5
 
6
6
  ### 关联组件
7
7
  - **message-render** — 按组渲染每条消息时委托 MessageRender
@@ -17,7 +17,7 @@
17
17
 
18
18
  - **源码位置**:`src/components/chat-message/message-container/message-container.vue`
19
19
  - **能力域**:对话搭建
20
- - **能力说明**:负责消息分组渲染、滚动控制、工具栏和消息插槽透传。
20
+ - **能力说明**:负责按传入的 `messageGroups` 渲染、滚动控制、工具栏和消息插槽透传。
21
21
 
22
22
  > **能力域**:对话搭建
23
23
 
@@ -564,7 +564,7 @@ AI 回复状态为 `error` 时,消息以错误样式展示:
564
564
  | 属性名 | 类型 | 默认值 | 说明 |
565
565
  | ------------------------ | -------------------------------------------------------------------------------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
566
566
  | messages | `Message[]` | — | **必填**,消息列表 |
567
- | messageGroups | `MessageGroup[]` | — | 预计算的消息分组;传入时跳过内部分组逻辑,由 `ChatContainer` 通过 `useMessageGroup` 提供 |
567
+ | messageGroups | `MessageGroup[]` | — | **必填**。本组件不分组;由调用方用 `useMessageGroup` 算好后传入。`ChatContainer` 会代为计算。 |
568
568
  | messageStatus | `MessageStatus` | — | 当前整体消息状态,控制底部「停止生成」按钮显示;`ChatContainer` 会结合末尾 Loading 占位推导 `fetching` 等再传入 |
569
569
  | messageTools | `IToolBtn[]` | — | AI 消息左侧工具(复制/引用等)的自定义配置;按 `id` 与内置 `CONST_MESSAGE_TOOLS` 合并(覆盖同 id、追加新 id、`hidden` 过滤),详见「自定义消息工具栏」 |
570
570
  | updateTools | `IToolBtn[]` | — | AI 消息右侧反馈工具(点赞/踩/删除等)的自定义配置;按 `id` 与内置 `CONST_UPDATE_TOOLS` 合并,规则同上 |
@@ -605,7 +605,7 @@ AI 回复状态为 `error` 时,消息以错误样式展示:
605
605
  ```typescript
606
606
  import { MessageRole, MessageStatus, MessageToolsStatus, type Message, type MessageGroup, type IToolBtn } from '@blueking/chat-x';
607
607
 
608
- // 消息组(由 useMessageGroup 生成,也可手动传入 messageGroups)
608
+ // 消息组(必须传入 useMessageGroup 的结果)
609
609
  interface MessageGroup {
610
610
  checked: boolean;
611
611
  isHover: boolean;
@@ -8,6 +8,10 @@
8
8
 
9
9
  # PreviewToolbar 图片预览工具栏
10
10
 
11
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
12
+ > 业务请通过 [ImagePreview](/components/medias/image-preview) 使用。
13
+ > 文档站 demo 使用相对路径引入源码;不要写 `import { PreviewToolbar } from '@blueking/chat-x'`。
14
+
11
15
  > **能力域**:媒体文件
12
16
 
13
17
  ## 源码事实
@@ -11,6 +11,11 @@
11
11
  <!-- FULL DOC -->
12
12
 
13
13
  # ReferenceContent 引用文档内容
14
+
15
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
16
+ > 业务请通过 [ContentRender](/components/rendering/content-render) / [ActivityMessage](/components/message/activity-message) 使用。
17
+ > 文档站 demo 使用相对路径引入源码;不要写 `import { ReferenceContent } from '@blueking/chat-x'`。
18
+
14
19
  ## 源码事实
15
20
 
16
21
  - **源码位置**:`src/components/chat-content/reference-content/reference-content.vue`
@@ -68,8 +73,8 @@ gotoLink(url, event):
68
73
  </template>
69
74
 
70
75
  <script setup lang="ts">
71
- import { ReferenceContent } from '@blueking/chat-x';
72
76
  import type { ReferenceDocumentContent } from '@blueking/chat-x';
77
+ // ReferenceContent 未从包入口导出;文档站 demo 使用页面顶部相对路径
73
78
 
74
79
  const references: ReferenceDocumentContent[] = [
75
80
  { name: '蓝鲸 PaaS 平台文档', url: 'https://bk.tencent.com', originFile: '' },
@@ -13,6 +13,8 @@
13
13
 
14
14
  # ReferenceDocContent 引用文档活动
15
15
 
16
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
17
+
16
18
  > **能力域**:Agent 能力
17
19
 
18
20
  `ReferenceDocContent` 用于渲染“引用 N 篇资料作为参考”这类活动消息。组件基于 `ActivityLayout` 提供折叠外壳,并将文档数组交给 `ReferenceContent` 展示。
@@ -43,7 +45,7 @@
43
45
 
44
46
  <script setup lang="ts">
45
47
  import { ref } from 'vue';
46
- import ReferenceDocContent from '@blueking/chat-x/src/components/chat-content/reference-doc-content/reference-doc-content.vue';
48
+ // ReferenceDocContent 未从包入口导出;文档站 demo 使用页面顶部相对路径
47
49
  import type { ReferenceDocumentContent } from '@blueking/chat-x';
48
50
 
49
51
  const collapsed = ref(false);
@@ -12,6 +12,8 @@ FlowAgent 节点详情中的轻量表格展示组件。 源码位置:src/compo
12
12
 
13
13
  # SimpleTable 简易表格
14
14
 
15
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
16
+
15
17
  > **能力域**:Agent 能力
16
18
 
17
19
  `SimpleTable` 是 FlowAgent 节点详情中的轻量只读表格,用于展示参数名、参数值、插件输出定义等结构化信息。组件只根据 `columns` 和 `data` 渲染表格,不提供排序、筛选、分页或编辑能力。
@@ -41,7 +43,7 @@ FlowAgent 节点详情中的轻量表格展示组件。 源码位置:src/compo
41
43
  </template>
42
44
 
43
45
  <script setup lang="ts">
44
- import SimpleTable from '@blueking/chat-x/src/components/chat-content/flow-agent-content/simple-table.vue';
46
+ // SimpleTable 未从包入口导出;文档站 demo 使用页面顶部相对路径
45
47
 
46
48
  const columns = [
47
49
  { key: 'key', label: '参数名' },
@@ -12,6 +12,10 @@
12
12
  <!-- FULL DOC -->
13
13
 
14
14
  # TextContent 文本内容
15
+
16
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
17
+ > 业务请通过 [ContentRender](/components/rendering/content-render) / [MessageRender](/components/message/message-render) 使用。
18
+ > 文档站 demo 使用相对路径引入源码;不要写 `import { TextContent } from '@blueking/chat-x'`。
15
19
  ## 源码事实
16
20
 
17
21
  - **源码位置**:`src/components/chat-content/text-content/text-content.vue`
@@ -45,7 +49,7 @@ div.ai-text-content
45
49
  </template>
46
50
 
47
51
  <script setup lang="ts">
48
- import { TextContent } from '@blueking/chat-x';
52
+ // TextContent 未从包入口导出;文档站 demo 使用页面顶部相对路径
49
53
  </script>
50
54
  ```
51
55
 
@@ -11,6 +11,10 @@
11
11
  <!-- FULL DOC -->
12
12
 
13
13
  # ToolBtn 工具按钮
14
+
15
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
16
+ > 业务请通过 [MessageTools](/components/feedback/message-tools) 使用。
17
+ > 文档站 demo 使用相对路径引入源码;不要写 `import { ToolBtn } from '@blueking/chat-x'`。
14
18
  ## 源码事实
15
19
 
16
20
  - **源码位置**:`src/components/ai-buttons/tool-btn/tool-btn.vue`
@@ -117,7 +121,7 @@ click 事件:disabled=true 时被 JS 拦截,不触发 emit
117
121
  </template>
118
122
 
119
123
  <script setup lang="ts">
120
- import { ToolBtn } from '@blueking/chat-x';
124
+ // ToolBtn 未从包入口导出;文档站 demo 使用页面顶部相对路径
121
125
  import type { IToolBtn } from '@blueking/chat-x';
122
126
 
123
127
  const handleClick = (data: IToolBtn & { active?: boolean; disabled?: boolean }, event: MouseEvent) => {
@@ -153,7 +157,7 @@ click 事件:disabled=true 时被 JS 拦截,不触发 emit
153
157
 
154
158
  <script setup lang="ts">
155
159
  import { ref } from 'vue';
156
- import { ToolBtn } from '@blueking/chat-x';
160
+ // ToolBtn 未从包入口导出;文档站 demo 使用页面顶部相对路径
157
161
  import type { IToolBtn } from '@blueking/chat-x';
158
162
 
159
163
  const activeId = ref<string | null>(null);
@@ -212,7 +216,8 @@ click 事件:disabled=true 时被 JS 拦截,不触发 emit
212
216
  </template>
213
217
 
214
218
  <script setup lang="ts">
215
- import { ToolBtn, DownloadIcon } from '@blueking/chat-x';
219
+ import { DownloadIcon } from '@blueking/chat-x';
220
+ // ToolBtn 未从包入口导出
216
221
  </script>
217
222
  ```
218
223
 
@@ -234,7 +239,8 @@ click 事件:disabled=true 时被 JS 拦截,不触发 emit
234
239
  </template>
235
240
 
236
241
  <script setup lang="ts">
237
- import { ToolBtn, FullScreenIcon } from '@blueking/chat-x';
242
+ import { FullScreenIcon } from '@blueking/chat-x';
243
+ // ToolBtn 未从包入口导出
238
244
 
239
245
  const handleFullScreen = () => {
240
246
  // 进入全屏逻辑
@@ -11,7 +11,7 @@
11
11
  ---
12
12
  <!-- FULL DOC -->
13
13
 
14
- # ToolcallRender 工具调用渲染器
14
+ # ToolCallRender 工具调用渲染器
15
15
  ## 源码事实
16
16
 
17
17
  - **源码位置**:`src/components/tool-call/toolcall-render/toolcall-render.vue`
@@ -47,14 +47,14 @@
47
47
 
48
48
  ```vue
49
49
  <template>
50
- <ToolcallRender
50
+ <ToolCallRender
51
51
  :tool-call="toolCall"
52
52
  :status="MessageStatus.Complete"
53
53
  />
54
54
  </template>
55
55
 
56
56
  <script setup lang="ts">
57
- import { ToolcallRender, MessageStatus, MessageContentType, type ToolCall } from '@blueking/chat-x';
57
+ import { ToolCallRender, MessageStatus, MessageContentType, type ToolCall } from '@blueking/chat-x';
58
58
 
59
59
  const toolCall: ToolCall = {
60
60
  id: 'call_1',
@@ -171,10 +171,10 @@ durationDisplay = formatDuration(props.duration || toolCall?.toolMessage?.durati
171
171
 
172
172
  ```vue
173
173
  <!-- 方式一:直接传 duration prop(优先) -->
174
- <ToolcallRender :tool-call="toolCall" status="complete" :duration="1200" />
174
+ <ToolCallRender :tool-call="toolCall" status="complete" :duration="1200" />
175
175
 
176
176
  <!-- 方式二(推荐):duration 放在 toolMessage 中,无需额外 prop -->
177
- <ToolcallRender :tool-call="toolCallWithDuration" status="complete" />
177
+ <ToolCallRender :tool-call="toolCallWithDuration" status="complete" />
178
178
  ```
179
179
 
180
180
  ```typescript
@@ -242,7 +242,7 @@ const failedToolCall: ToolCall = {
242
242
 
243
243
  ## 与 AssistantMessage 配合
244
244
 
245
- `ToolcallRender` 通常不需要单独使用,将 `toolCalls` 传给 `AssistantMessage`,会自动为每个工具调用渲染 `ToolcallRender`:
245
+ `ToolCallRender` 通常不需要单独使用,将 `toolCalls` 传给 `AssistantMessage`,会自动为每个工具调用渲染 `ToolCallRender`:
246
246
 
247
247
  ```typescript
248
248
  const assistantMessage = {
@@ -274,7 +274,7 @@ const assistantMessage = {
274
274
 
275
275
  ```vue
276
276
  <template>
277
- <ToolcallRender
277
+ <ToolCallRender
278
278
  v-for="toolCall in assistantMessage.toolCalls"
279
279
  :key="toolCall.id"
280
280
  :tool-call="toolCall"
@@ -338,7 +338,7 @@ interface ToolMessage {
338
338
  role: 'tool';
339
339
  content: string; // 返回内容(通常为 JSON 字符串)
340
340
  status: MessageStatus;
341
- duration: number; // 调用耗时(毫秒),被 ToolcallRender 自动读取
341
+ duration: number; // 调用耗时(毫秒),被 ToolCallRender 自动读取
342
342
  error?: string; // 错误信息(仅当 content 为空时由 ToolMessage 展示)
343
343
  toolCallId: string; // 对应 ToolCall.id
344
344
  }
@@ -122,7 +122,8 @@ useAnimationText 接收 MaybeRef<string> 与可选 AnimationConfig(fadeDuratio
122
122
  </template>
123
123
 
124
124
  <script setup lang="ts">
125
- import { AnimationText } from '@blueking/chat-x';
125
+ // AnimationText 未从包入口导出,见内部组件文档
126
+ // import { useAnimationText } from '@blueking/chat-x' 才是公开 API
126
127
  </script>
127
128
  ```
128
129
 
@@ -67,8 +67,8 @@ import {
67
67
  useCustomTabProvider,
68
68
  useMessageGroup,
69
69
  FILE_ARTIFACT_TAB_NAME,
70
+ t,
70
71
  } from '@blueking/chat-x';
71
- import { t } from '@blueking/chat-x/lang';
72
72
 
73
73
  const { addCustomTab, ensureCustomTab, removeCustomTab } = useCustomTabProvider({ /* ... */ });
74
74
 
@@ -157,6 +157,16 @@ const onArtifactClick = async (file: AIFileInfo) => {
157
157
  | `FILE_ARTIFACT_TAB_NAME` | `'file-artifact'` | 「文件产物」侧栏 Tab 的固定标识,不可关闭 |
158
158
  | `ARTIFACT_PREVIEW_TOKEN` | `Symbol` | provide/inject 注入 Token |
159
159
 
160
+ ## triggerArtifactDownload
161
+
162
+ 从包入口导出,用临时 `<a download>` 触发浏览器下载(面板下载按钮内部使用):
163
+
164
+ ```typescript
165
+ import { triggerArtifactDownload } from '@blueking/chat-x';
166
+
167
+ triggerArtifactDownload(downloadUrl, file.name);
168
+ ```
169
+
160
170
  ## 返回值说明
161
171
 
162
172
  | 属性/方法名 | 类型 | 说明 |
@@ -1,7 +1,7 @@
1
1
  <!-- AI SUMMARY -->
2
2
  ## 快速了解
3
3
 
4
- useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail,返回 getNodeActions 与 isNodePending。 失败节点按 retryable/skippable 展示重试/跳过,详情恒在末尾;点击后进入 pending 防重复提交, 以 task_id:node_id:retry 为键自动收敛;点击 resume 时不传 interrupt。
4
+ useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail,返回 getNodeActions 与 isNodePending。 失败节点按 retryable/skippable 展示重试/跳过,详情恒在末尾;点击后进入 pending 防重复提交, 以 task_id:node_id:retry 为键自动收敛;点击 resume 时不传 interrupt。 hideResumeActions 为 true 时只返回详情,覆盖 Share 分享态与侧栏「执行情况」面板两类只读场景。
5
5
 
6
6
  ### 关联组件
7
7
  - **flow-agent-content** — FlowAgentContent 内部消费,驱动节点行尾按钮组渲染
@@ -11,6 +11,10 @@ useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail,返回 getNodeA
11
11
 
12
12
  # useFlowNodeActions 节点行尾操作
13
13
 
14
+ > **导出状态**:内部实现,未从 `@blueking/chat-x` 包入口导出。
15
+ > 实现位于 `src/components/chat-content/flow-agent-content/use-flow-node-actions.ts`,未进入 `src/composables/index.ts`。
16
+ > 由 [FlowAgentContent](/components/agent/flow-agent-content) 内部消费。
17
+
14
18
  > **分类**:composable
15
19
 
16
20
  将 FlowAgent 节点行尾的「详情(打开侧栏)」与「重试 / 跳过(回传 Agent resume)」聚合为统一的声明式操作列表。`FlowAgentContent` 只需遍历 `getNodeActions` 返回值渲染按钮,显隐与点击行为均收敛于此 composable。
@@ -21,7 +25,7 @@ useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail,返回 getNodeA
21
25
 
22
26
  ```typescript
23
27
  function useFlowNodeActions(options: {
24
- /** 隐藏重试 / 跳过等交互式 resume 操作(分享态只读,仅保留「详情」查看入口) */
28
+ /** 隐藏重试 / 跳过等交互式 resume 操作(分享态、侧栏执行情况面板等只读场景,仅保留「详情」查看入口) */
25
29
  hideResumeActions?: Ref<boolean>;
26
30
  /** resume 回调(与第三方审批取消同一回调,按 payload.operation 分流) */
27
31
  onInterruptResume: Ref<OnInterruptResume | undefined>;
@@ -71,13 +75,16 @@ interface FlowNodeActionVM {
71
75
 
72
76
  | 操作 | `id` | 显隐条件 | 点击行为 |
73
77
  | ---- | ------------------ | ------------------------------------------ | --------------------------------------------- |
74
- | 重试 | `flow_node_retry` | `convergedState === 'failed'` 且 `retryable` | 调用 `onInterruptResume`,**不传** `interrupt` |
75
- | 跳过 | `flow_node_skip` | `convergedState === 'failed'` 且 `skippable` | 同上 |
76
- | 详情 | `detail` | 始终(含 Share 分享态) | 调用 `openNodeDetail(task.raw, node.raw)` |
78
+ | 重试 | `flow_node_retry` | `convergedState === 'failed'` 且 `retryable`,且 `hideResumeActions` 为 `false` | 调用 `onInterruptResume`,**不传** `interrupt` |
79
+ | 跳过 | `flow_node_skip` | `convergedState === 'failed'` 且 `skippable`,且 `hideResumeActions` 为 `false` | 同上 |
80
+ | 详情 | `detail` | 始终(不受 `hideResumeActions` 影响) | 调用 `openNodeDetail(task.raw, node.raw)` |
77
81
 
78
82
  展示顺序:重试 → 跳过 → 详情。
79
83
 
80
- > **分享态过滤**:传入 `hideResumeActions`(`Ref<boolean>`,如 `RenderMode.Share`)为 `true` 时,`getNodeActions` 直接过滤掉重试 / 跳过,仅返回「详情」查看入口;用于只读分享场景放开查看、禁止交互。
84
+ > **只读场景过滤**:`hideResumeActions` 为 `true` 时,`getNodeActions` 直接过滤掉重试 / 跳过,仅返回「详情」查看入口,用于放开查看、禁止交互的场景。`FlowAgentContent` 目前把两类只读场景并入该入参:
85
+ >
86
+ > - `RenderMode.Share` 分享态
87
+ > - 侧栏「执行情况」面板内(`ExecutionSummary` 通过 `EXECUTION_PANEL_TOKEN` 提供上下文,组件用 `useExecutionPanelInject` 读取)
81
88
 
82
89
  ## pending 态与防重复提交
83
90
 
@@ -112,12 +119,15 @@ onInterruptResume?.({
112
119
 
113
120
  ```typescript
114
121
  import { toRef } from 'vue';
115
- import { useFlowNodeActions } from '@blueking/chat-x';
116
- // 或相对路径:'./use-flow-node-actions'
122
+ import { useFlowNodeActions } from '../../src/components/chat-content/flow-agent-content/use-flow-node-actions';
123
+
124
+ // 是否处于侧栏「执行情况」面板内;缺省 false,即对话流内渲染
125
+ // useExecutionPanelInject 来自内部 src/composables/use-common.ts,未从包入口导出
126
+ const isInExecutionPanel = useExecutionPanelInject();
117
127
 
118
128
  const { getNodeActions, isNodePending } = useFlowNodeActions({
119
- // 分享态只读:过滤重试 / 跳过,仅保留详情
120
- hideResumeActions: computed(() => renderMode.value === RenderMode.Share),
129
+ // 分享态与侧栏执行情况面板均只读:过滤重试 / 跳过,仅保留详情
130
+ hideResumeActions: computed(() => renderMode.value === RenderMode.Share || isInExecutionPanel),
121
131
  onInterruptResume: toRef(props, 'onInterruptResume'),
122
132
  openNodeDetail,
123
133
  });
@@ -164,6 +164,37 @@ const payload = buildSkipResumePayload(interrupt);
164
164
  // }
165
165
  ```
166
166
 
167
+ ## useUserQuestion 与选项辅助
168
+
169
+ 以下符号经 interrupt 子 barrel 从 `@blueking/chat-x` 导出,实现在 `src/components/chat-message/interrupt-message/user-question/use-user-question.ts`(不在 `composables/index.ts`)。
170
+
171
+ | 符号 | 说明 |
172
+ | --- | --- |
173
+ | `useUserQuestion` | 答题分页、完成态、`setAnswer` / `buildResolvePayload` / `buildSkipPayload` |
174
+ | `buildSkipResumePayload` | 构造 skip resume(`status: 'cancelled'`,`answers: []`) |
175
+ | `OTHERS_OPTION_LABEL` | Others 选项的固定 `label`(`'others'`) |
176
+ | `toLetter` | 选项序号:0 → A,超过 26 回退数字 |
177
+ | `NormalizedUserQuestionOption` | 选择题内部展示类型(含 `letter` / `isOthers`) |
178
+
179
+ ```typescript
180
+ import {
181
+ OTHERS_OPTION_LABEL,
182
+ toLetter,
183
+ useUserQuestion,
184
+ type NormalizedUserQuestionOption,
185
+ } from '@blueking/chat-x';
186
+
187
+ const {
188
+ questions,
189
+ currentIndex,
190
+ completed,
191
+ setAnswer,
192
+ buildResolvePayload,
193
+ } = useUserQuestion(() => pendingInterrupt);
194
+ ```
195
+
196
+ 自定义 `#question` 面板时,作答有效调用 slot 的 `setAnswer`(即 composable 的 `setAnswer`),无需自己拼 resume。
197
+
167
198
  ## 自定义题目渲染(#question slot)
168
199
 
169
200
  默认每道题由 [UserQuestionChoice](/components/agent/user-question-choice) 渲染;业务可覆盖 `#question` slot 接入自定义表单:
@@ -1,7 +1,7 @@
1
1
  <!-- AI SUMMARY -->
2
2
  ## 快速了解
3
3
 
4
- 将 Markdown token 转成 VNode 的内部渲染桥。 源码位置:src/components/chat-content/vnode-renderer.ts。
4
+ 将 Markdown token 转成 VNode;包入口已导出,通常经 MarkdownContent 使用。 源码位置:src/components/chat-content/vnode-renderer.ts。
5
5
 
6
6
  ### 关联组件
7
7
  - **markdown-content** — MarkdownContent 对普通 token 分组使用本组件渲染
@@ -41,8 +41,8 @@
41
41
  </template>
42
42
 
43
43
  <script setup lang="ts">
44
- import MarkdownIt from '@blueking/chat-x/src/markdown-it/index';
45
- import VNodeRenderer from '@blueking/chat-x/src/components/chat-content/vnode-renderer';
44
+ import { VNodeRenderer } from '@blueking/chat-x';
45
+ // MarkdownIt 未从包入口导出;文档站 demo 使用页面顶部相对路径
46
46
 
47
47
  const md = new MarkdownIt();
48
48
  const tokens = md.parse('这是一段 **加粗文本**。', {});