@blueking/chat-x 0.0.51-beta.5 → 0.0.52-dev.1

package/dist/mcp/generated/docs/mention-tag.md

@@ -0,0 +1,83 @@
+<!-- AI SUMMARY -->
+## 快速了解
+
+MentionTag 渲染「图标 + 蓝色名称」的内联资源标签：节点数据全部落在 data-tag-* 属性上， 既是编辑器 void 节点的识别依据，也让消息里复制的标签能原样还原； description 非空时 hover / 点击弹出「类型：名称 + 描述」气泡；type 为 artifact 且存在产物预览上下文时点击打开侧栏预览。 源码位置：src/components/mention/mention-tag.vue（气泡见 mention-popover.vue 与 create-mention-tippy.ts）。
+
+### 关联组件
+- **mention-text** — 按文档结构批量渲染标签与文本
+- **ai-slash-input** — 编辑器内的 tag 节点由本组件渲染
+- **resource-icon** — 标签左侧图标
+- **file-artifact-panel** — artifact 标签点击后打开的侧栏预览
+
+---
+<!-- FULL DOC -->
+
+# MentionTag 资源标签
+
+> **能力域**：内容渲染
+
+## 源码事实
+
+- **标签**：`src/components/mention/mention-tag.vue`
+- **气泡内容**：`src/components/mention/mention-popover.vue`
+- **气泡配置**：`src/components/mention/create-mention-tippy.ts`
+- **能力说明**：设计稿形态为「图标 + 蓝色文字」内联展示，无背景块；高度 22px，`vertical-align: bottom`。
+
+## data-tag-\* 属性
+
+标签把节点数据全部写在 DOM 属性上，这不是冗余：
+
+| 属性                   | 作用                                                     |
+| ---------------------- | -------------------------------------------------------- |
+| `data-tag-type`        | 与 `contenteditable="false"` 一起作为编辑器 void 节点的识别依据 |
+| `data-tag-value`       | 资源 id，`artifact` 点击预览、`skill` 序列化都取它        |
+| `data-tag-label`       | 展示名，避免从 `textContent` 读取时混入图标带来的空白     |
+| `data-tag-icon`        | 图标 URL（组件形式的图标无法序列化，此时为空）            |
+| `data-tag-description` | 描述文案，让气泡脱离 `menuSources` 独立工作               |
+
+因此从消息里复制一段带标签的文本再粘贴回输入框，标签能被原样还原。
+
+## 交互
+
+- **描述气泡**：`description` 非空时才创建气泡（否则 `onShow` 直接返回 `false`）。标题格式为 `类型：名称`，类型名与菜单分组标题同源（`getMenuTypeLabel`）。
+- **触发方式**：`mouseenter focus click`，展示延迟 300ms、关闭无延迟；`hideOnClick` 关闭并改用 `onClickOutside` 收起，因此再次点击标签不会把气泡收掉，触屏也能点开。
+- **产物预览**：`type` 为 `artifact` 且存在 [useArtifactPreview](/composables/use-artifact-preview) 上下文时，点击标签以 `{ file: { outputId: value } }` 打开侧栏预览。
+- **可交互暗示**：仅在「有描述」或「可预览」时给出 `cursor: pointer` 与名称下划线。
+
+::: info 为什么用指令而不是 `<Tippy>` 组件
+标签渲染在 `contenteditable` 内部，多包一层元素会干扰编辑器对 void 节点的识别与 DOM 比对，因此气泡走 `v-tippy` 指令。
+:::
+
+## 渲染示例
+
+> 前三个标签中「翻译」「天气查询」带描述，hover 可见气泡；`artifact` 标签在有产物预览上下文时可点击。
+
+## API
+
+### Props
+
+| 属性名      | 类型     | 必填 | 说明                                                  |
+| ----------- | -------- | ---- | ----------------------------------------------------- |
+| label       | `string` | ✅   | 标签展示名                                            |
+| value       | `string` | ✅   | 资源 id                                               |
+| type        | `string` | ✅   | 资源类型，决定兜底图标、气泡标题与是否可预览          |
+| icon        | `string` | -    | 图标 URL；缺省时按 `type` 兜底                        |
+| description | `string` | -    | 描述文案，非空时启用气泡                              |
+
+### MentionPopover Props
+
+| 属性名      | 类型     | 必填 | 说明                                 |
+| ----------- | -------- | ---- | ------------------------------------ |
+| title       | `string` | ✅   | 形如「工具：天气查询」               |
+| description | `string` | -    | 描述正文，最大宽度 240px，自动换行   |
+
+### Emits / Slots / Expose
+
+- 无。
+
+## 关联组件
+
+- [MentionText](/components/rendering/mention-text) — 按文档结构批量渲染
+- [AiSlashInput](/components/input/ai-slash-input) — 编辑器内的标签宿主
+- [ResourceIcon](/components/helper/resource-icon) — 标签图标
+- [useArtifactPreview](/composables/use-artifact-preview) — 产物预览上下文

package/dist/mcp/generated/docs/mention-text.md

@@ -0,0 +1,86 @@
+<!-- AI SUMMARY -->
+## 快速了解
+
+MentionText 接收一份 TagSchema 文档（二维数组：行 → 节点），逐行渲染：text 节点输出文本、 tag 节点交给 MentionTag；行间用 <br> 分隔，空白以 pre-wrap 保留。 UserMessage 在 property.docSchema 含标签时用它替代 TextContent。 源码位置：src/components/mention/mention-text.vue。
+
+### 关联组件
+- **mention-tag** — tag 节点的实际渲染者
+- **user-message** — 用户消息在文档含标签时改用本组件回显
+- **text-content** — 纯文本消息仍走 TextContent
+
+---
+<!-- FULL DOC -->
+
+# MentionText 标签文本
+
+> **能力域**：内容渲染
+
+## 源码事实
+
+- **源码位置**：`src/components/mention/mention-text.vue`
+- **能力说明**：把 `TagSchema` 文档渲染成「文本 + 资源标签」，让用户消息里 `@` 选中的资源保持标签形态而不是退化成纯文本。
+- **样式**：`width: fit-content`、`word-break: break-all`、`white-space: pre-wrap`（行间换行由 `<br>` 承担，行内连续空格与纯文本分支表现一致）。
+
+## 数据流：消息里的标签怎么活下来
+
+```
+用户在输入框选中资源
+  → onSendMessage(content, docSchema)   content 仍是纯文本，不改后端契约
+  → 业务侧把 docSchema 存进 message.property.docSchema
+  → UserMessage 检测到文档中存在 tag 节点
+  → 用 MentionText 渲染（否则回退 TextContent）
+```
+
+业务侧不保存 `docSchema` 时一切照旧：历史消息与第三方消息仍走 [TextContent](/components/rendering/text-content) 渲染纯文本。编辑消息后也需要把新的 `docSchema` 写回，否则改完这条消息标签就丢了。
+
+```typescript
+// 发送
+const handleSendMessage = async (content: UserMessage['content'], docSchema: TagSchema) => {
+  messages.value.push({
+    id, messageId: id, role: MessageRole.User, content,
+    property: { docSchema },
+  });
+};
+
+// 编辑确认
+const handleUserInputConfirm = async (message: Message, content: UserMessage['content'], docSchema: TagSchema) => {
+  target.content = content;
+  target.property = { ...target.property, docSchema };
+};
+```
+
+## 渲染示例
+
+## API
+
+### Props
+
+| 属性名 | 类型        | 必填 | 说明                                       |
+| ------ | ----------- | ---- | ------------------------------------------ |
+| doc    | `TagSchema` | ✅   | 发送时随消息一起保存的编辑器文档           |
+
+### Emits / Slots / Expose
+
+- 无。
+
+### 文档结构
+
+```typescript
+type TagSchema = Array<
+  Array<
+    | { type: 'text'; text: string }
+    | {
+        type: 'tag';
+        data: { label: string; value: string; type: string; icon: string; description: string };
+      }
+  >
+>;
+```
+
+外层数组是行，内层数组是行内节点。渲染时第 2 行起前置一个 `<br>`。
+
+## 关联组件
+
+- [MentionTag](/components/rendering/mention-tag) — 单个标签渲染与气泡
+- [UserMessage](/components/message/user-message) — 使用方
+- [TextContent](/components/rendering/text-content) — 无文档时的回退渲染

package/dist/mcp/generated/docs/message-container.md

@@ -543,7 +543,7 @@ AI 回复状态为 `error` 时，消息以错误样式展示：
 
 `MessageContainer` 内部对 `copy` 工具操作进行了特殊处理：当 `tool.id === 'copy'` 时，自动将当前消息组中所有**非 reasoning 消息**的内容拼接后复制到剪贴板，**无需在 `onAgentAction` 中自行实现**。
 
-其他工具操作（`like`、`unlike`、`cite` 等）仍正常转发给 `onAgentAction` 回调。
+其他工具操作（`like`、`unlike`、`share` 等）仍正常转发给 `onAgentAction` 回调。
 
 ## 滚动控制
 

package/dist/mcp/generated/docs/message-render.md

@@ -232,7 +232,7 @@ h(ContentRender, { content: message.content || '', status: message.status }, /*
 
 ## 与 MessageContainer / ChatContainer 配合
 
-自定义 `ChatContainer` 的 `#message` 时，插槽参数只有 `message` / `messageToolsStatus` / `onInterruptResume`。用户消息工具相关回调需由外层自行绑定透传，否则删除/编辑/复制/引用会失效（AI 消息工具栏在 `MessageContainer` 内渲染，不受 `#message` 影响）：
+自定义 `ChatContainer` 的 `#message` 时，插槽参数只有 `message` / `messageToolsStatus` / `onInterruptResume`。用户消息工具相关回调需由外层自行绑定透传，否则删除/编辑/复制会失效（AI 消息工具栏在 `MessageContainer` 内渲染，不受 `#message` 影响）：
 
 ```vue
 <template>

package/dist/mcp/generated/docs/message-tools.md

@@ -30,7 +30,7 @@ AI 消息的操作工具栏组件，由**左侧消息工具区**和**右侧更
 │  .ai-message-tools-container（display: flex，gap: 4px）                 │
 │  ┌────────┐  ┌─────────────────────┐  │  ┌───────────────┐  ┌───────┐ │
 │  │#prepend│  │  messageTools        │  │  │  updateTools  │  │#append│ │
-│  │        │  │  copy cite rebuild…  │  │  │ like unlike…  │  │       │ │
+│  │        │  │  copy rebuild share  │  │  │ like unlike…  │  │       │ │
 │  └────────┘  └─────────────────────┘  │  └───────────────┘  └───────┘ │
 │    插槽区          左侧区域         分隔线    右侧区域          插槽区   │
 └───────────────────────────────────────────────────────────────────────┘
@@ -114,12 +114,23 @@ onAction 返回 string[]（反馈选项列表）
 ```typescript
 const CONST_MESSAGE_TOOLS = [
   { id: 'copy', name: '复制', description: '复制' },
-  { id: 'cite', name: '引用', description: '引用' },
-  { id: 'rebuild', name: '重新生成', description: '重新生成' },
+  { id: 'rebuild', name: '重新生成', description: '重新生成将清空下文内容' },
   { id: 'share', name: '分享', description: '分享' },
 ];
 ```
 
+用户消息的内置列表（`CONST_USER_MESSAGE_TOOLS`，由 [UserMessage](/components/message/user-message) 使用）：
+
+```typescript
+const CONST_USER_MESSAGE_TOOLS = [
+  { id: 'copy', name: '复制', description: '复制' },
+  { id: 'edit', name: '编辑', description: '编辑' },
+  { id: 'delete', name: '删除', description: '删除' },
+];
+```
+
+> `cite`（引用）已从两份内置列表中移除，后续不再支持；`ToolBtn` 仍保留该 id 的图标，业务侧可自行把它作为自定义按钮传入。
+
 ### updateTools（右侧）
 
 ```typescript
@@ -139,7 +150,7 @@ const CONST_UPDATE_TOOLS = [
 | ID             | 图标说明                             |
 | -------------- | ------------------------------------ |
 | `copy`         | 复制                                 |
-| `cite`         | 引用                                 |
+| `cite`         | 引用（不再属于内置列表，可用于自定义按钮） |
 | `rebuild`      | 重新生成                             |
 | `share`        | 分享                                 |
 | `like`         | 点赞（空心）                         |

package/dist/mcp/generated/docs/messages.md

@@ -60,6 +60,9 @@ interface BaseMessage<T extends MessageType, C = string> {
 
   // 消息属性（可选）
   property?: {
+    // 发送时输入框的富文本文档；content 仍是纯文本（不改后端契约），
+    // 有这份文档时用户消息会把 @ 选中的资源原样还原成标签，编辑回填也不会丢标签
+    docSchema?: TagSchema;
     extra?: {
       // 引用内容
       cite:

package/dist/mcp/generated/docs/model-selector.md

@@ -131,7 +131,7 @@ interface IModelOption {
   base_model?: string;
   description?: string; // 选项 hover 的 title 提示
   disabled?: boolean; // 前端扩展字段，禁用项不可选中
-  icon?: string;
+  icon?: Component | string; // 图标 URL 或 Vue 组件，由 ResourceIcon 渲染
   id: number;
   llm_code: string;
   llm_name: string; // 展示名，同时作为选中值
@@ -150,8 +150,10 @@ interface IModelOption {
 2. 选中值为模型的 `llm_name`；能力标签由组件依据 `property` 的 `support_thinking` / `support_thinking_quick` / `support_vision` 派生，文案走内置 i18n。
 3. `description` 会作为选项 hover 的 `title` 提示展示。
 4. 展开面板后会自动聚焦搜索框；列表支持键盘上下选择与 Enter 确认（复用 `useMenuKeydown`）。
+5. 图标由 [ResourceIcon](/components/helper/resource-icon) 渲染（`type="model"`）：支持图片 URL 或 Vue 组件，URL 加载失败自动回退到内置兜底图标；未提供 `icon` 时不渲染图标位。
 
 ## 关联组件
 
 - [ChatInput](/components/input/chat-input)：传入 `models` 后默认在发送按钮左侧渲染本组件，也可通过 `#model-selector` 插槽完全自定义。
-- [ChatContainer](/components/setup/chat-container)：透传 `models` 与 `v-model:selected-model`，并向上 emit `modelChange`。
+- [ChatContainer](/components/setup/chat-container)：透传 `models` 与 `v-model:selected-model`，并向上 emit `modelChange`。
+- [ResourceIcon](/components/helper/resource-icon)：触发器与选项的图标渲染。

package/dist/mcp/generated/docs/overflow-tips.md

@@ -1,13 +1,13 @@
 <!-- AI SUMMARY -->
 ## 快速了解
 
-v-overflow-tips 在元素水平溢出（scrollWidth > clientWidth）时于 mouseenter 懒创建 Tippy，展示完整文本或自定义 text/content。 结合 IntersectionObserver 仅在可见时绑定悬停；隐藏时销毁实例。指令值为 Partial<TippyProps> 与 disabled 等。 DescPanel、ExecutionSummary、ToolcallRender、AiSlashMenu 等用于标题或列表溢出提示。
+v-overflow-tips 在元素水平溢出（scrollWidth > clientWidth）时于 mouseenter 懒创建 Tippy，展示完整文本或自定义 text/content。 结合 IntersectionObserver 仅在可见时绑定悬停；隐藏时销毁实例。指令值为 Partial<TippyProps> 与 disabled 等。 DescPanel、ExecutionSummary、ToolcallRender、InputMenuPanel 等用于标题或列表溢出提示。
 
 ### 关联组件
 - **desc-panel** — 工具描述面板溢出
 - **execution-summary** — 执行摘要标签溢出
 - **toolcall-render** — 工具标题行溢出
-- **chat-input** — AiSlashMenu 资源项（侧栏子模块）
+- **input-menu-panel** — 菜单条目名称溢出
 
 ---
 <!-- FULL DOC -->
@@ -206,4 +206,4 @@ type OverflowTipsValue = Partial<TippyProps> & {
 - [DescPanel](../components/rendering/desc-panel) — 描述区溢出
 - [ExecutionSummary](../components/agent/execution-summary) — 侧栏摘要标签
 - [ToolcallRender](../components/agent/toolcall-render) — 工具调用标题
-- [ChatInput](../components/input/chat-input) — `@` 菜单项（内部 AiSlashMenu）
+- [InputMenuPanel](../components/input/input-menu-panel) — 菜单条目名称溢出

package/dist/mcp/generated/docs/resource-icon.md

@@ -0,0 +1,102 @@
+<!-- AI SUMMARY -->
+## 快速了解
+
+ResourceIcon 统一渲染资源图标：icon 为字符串按 img 加载（加载失败回退内置图标）、 为 Vue 组件直接渲染、缺省时按 type 查内置图标表（artifact 交给 FileIcon 按文件名后缀推导， 未登记类型回退 ModuleIcon）；尺寸由 --ai-icon-size 控制，默认 16px。 源码位置：src/components/resource-icon/resource-icon.vue。
+
+### 关联组件
+- **input-menu-panel** — 菜单条目左侧图标
+- **mention-tag** — 输入框与消息中的资源标签图标
+- **model-selector** — 模型选择器的触发器与选项图标
+- **file-icon** — artifact 类型委托给 FileIcon 按后缀推导
+
+---
+<!-- FULL DOC -->
+
+# ResourceIcon 资源图标
+
+> **能力域**：辅助能力
+
+## 源码事实
+
+- **源码位置**：`src/components/resource-icon/resource-icon.vue`
+- **内置图标表**：`file` → `FileUploadIcon`、`mcp` → `McpIcon`、`tool` → `ToolIcon`、`knowledgebase` / `doc` → `KnowledgeBaseIcon`、`prompt` → `PromptIcon`
+- **特殊分支**：`artifact` 走 [FileIcon](/components/helper/file-icon) 按 `name` 的文件后缀推导
+- **最终兜底**：以上都不命中时渲染 `ModuleIcon`（田字格）
+
+## 渲染优先级
+
+```
+icon 有值？
+├── 字符串 → <img :src="icon">
+│             └── onerror → 降级到「按 type 兜底」
+└── Vue 组件 → <component :is="icon">
+icon 缺省
+├── type === 'artifact' → FileIcon（按 name 后缀）
+├── type 命中内置图标表 → 对应内置图标
+└── 其他 → ModuleIcon
+```
+
+`icon` 变化时会重置失效标记，换成新的 URL 会重新尝试加载。
+
+::: info 内部组件
+本组件不在包入口导出，由菜单、标签与模型选择器内部使用。内置图标（`McpIcon` / `ToolIcon` / `KnowledgeBaseIcon` / `PromptIcon` / `ModuleIcon` / `FileUploadIcon` / `ImageUploadIcon`）从包入口导出，可单独使用，见 [Icons 图标](/icons/)。
+:::
+
+## 用法
+
+```vue
+<template>
+  <!-- 远程图标 -->
+  <ResourceIcon icon="https://example.com/tool.png" name="天气查询" type="tool" />
+  <!-- Vue 组件图标 -->
+  <ResourceIcon :icon="McpIcon" name="database-server" type="mcp" />
+  <!-- 按类型兜底 -->
+  <ResourceIcon name="API 接口文档" type="knowledgebase" />
+  <ResourceIcon name="写文章" type="prompt" />
+  <!-- 会话产物按后缀推导 -->
+  <ResourceIcon name="巡检报告.pdf" type="artifact" />
+</template>
+
+<script setup lang="ts">
+  import { McpIcon } from '@blueking/chat-x';
+</script>
+```
+
+**渲染效果**（均未传 `icon`，展示按类型兜底的结果）
+
+## 控制尺寸
+
+容器宽高与 `font-size` 都取 `var(--ai-icon-size, 16px)`，图片以 `object-fit: contain` 填充并带 2px 圆角。需要改尺寸时覆盖该变量，不要直接改 svg：
+
+```vue
+<template>
+  <span style="--ai-icon-size: 24px">
+    <ResourceIcon name="巡检报告.pdf" type="artifact" />
+  </span>
+</template>
+```
+
+## API
+
+### Props
+
+| 属性名 | 类型                    | 必填 | 说明                                                     |
+| ------ | ----------------------- | ---- | -------------------------------------------------------- |
+| icon   | `Component \| string`   | -    | 图标 URL 或 Vue 组件；缺省时按 `type` 回退               |
+| name   | `string`                | ✅   | 资源名称；`type` 为 `artifact` 时据此推导文件类型图标    |
+| type   | `string`                | ✅   | 资源类型，决定兜底图标                                   |
+
+### Emits / Slots / Expose
+
+- 无。
+
+## 扩展新类型
+
+新增类型只需在组件内的 `TYPE_FALLBACK_ICONS` 表里补一行，不必往模板加分支。`model` 等未登记的类型会落到 `ModuleIcon`，因此 [ModelSelector](/components/input/model-selector) 在模型没有 `icon` 时不会缺图。
+
+## 关联组件
+
+- [InputMenuPanel](/components/input/input-menu-panel) — 菜单条目图标
+- [MentionTag](/components/rendering/mention-tag) — 资源标签图标
+- [ModelSelector](/components/input/model-selector) — 模型图标
+- [FileIcon](/components/helper/file-icon) — `artifact` 类型的实际渲染者

package/dist/mcp/generated/docs/text-content.md

@@ -6,6 +6,7 @@
 ### 关联组件
 - **markdown-content** — 需要富文本时的替代方案
 - **user-message** — 用户消息中纯文本内容展示
+- **mention-text** — 文档含资源标签时的替代渲染
 
 ---
 <!-- FULL DOC -->
@@ -29,11 +30,12 @@ div.ai-text-content
   padding: 8px 12px; border-radius: 4px
   background-color: #e1ecff（浅蓝色气泡）
   word-break: break-all（无空格长文本按字符换行）
+  white-space: pre-wrap（保留 \n 换行与连续空格）
   │
   └── {{ content }}（文本插值，HTML 标签不被解析）
 ```
 
-> **换行说明**：组件无 `white-space: pre-wrap`，`\n` 不会渲染为视觉换行。如需保留换行，需在外层添加 `white-space: pre-wrap` 样式。
+> **换行说明**：内容来自输入框，多行文本以 `\n` 承载，因此组件带 `white-space: pre-wrap`——`\n` 会渲染为视觉换行，连续空格与空行也会保留，无需在外层额外加样式。
 
 ## 基础用法
 
@@ -47,9 +49,9 @@ div.ai-text-content
 </script>
 ```
 
-## 长文本自动换行
+## 长文本与多行
 
-`word-break: break-all` 确保无空格的长字符串（如 URL、哈希值）也能在容器内正常换行：
+`word-break: break-all` 确保无空格的长字符串（如 URL、哈希值）也能在容器内正常换行；`white-space: pre-wrap` 让 `\n` 直接生效：
 
 ## XSS 安全
 
@@ -70,10 +72,12 @@ div.ai-text-content
 | 场景                              | 推荐组件          |
 | --------------------------------- | ----------------- |
 | 纯文本气泡（用户消息、简单提示）  | `TextContent`     |
+| 含 `@` 资源标签的用户消息         | `MentionText`     |
 | 含 Markdown / 代码块 / 公式的内容 | `MarkdownContent` |
 | 工具调用结果描述                  | `DescPanel`       |
 
 ## 关联组件
 
 - [MarkdownContent](/components/rendering/markdown-content) — 富文本替代
+- [MentionText](/components/rendering/mention-text) — 含资源标签文档的渲染
 - [UserMessage](/components/message/user-message) — 用户消息气泡

package/dist/mcp/generated/docs/theme.md

@@ -73,56 +73,48 @@ import { ChatInput, MessageContainer } from '@blueking/chat-x';
 
 ## SCSS 变量
 
-组件库使用以下 SCSS 变量，可以在项目中覆盖：
+组件库在 `src/styles/variables.scss` 中定义了以下 SCSS 变量（构建期生效，仅供库内组件 `@use` 复用；消费方无法在运行时覆盖，需要改色请用 CSS 变量或类名覆盖）：
 
 ### 尺寸变量
 
 ```scss
-// 输入框尺寸
-$chat-input-min-width: 350px;
-$chat-input-max-width: 700px;
+// 输入框宽度（.chat-input-wrapper）
+$chat-input-min-width: 168px;
+$chat-input-max-width: 1000px;
 ```
 
-### 颜色变量
+### 语义色变量
 
 ```scss
-// 主题色
-$primary-color: #3a84ff;
-
-// 文字颜色
-$text-color-primary: #313238;
-$text-color-secondary: #4d4f56;
-$text-color-placeholder: #979ba5;
-
-// 背景色
-$bg-color-white: #fff;
-$bg-color-light: #f5f7fa;
-$bg-color-hover: #f0f1f5;
-
-// 边框色
-$border-color: #dcdee5;
-$border-color-hover: #c4c6cc;
+$color-title: #313238; // 标题 / 主文字
+$color-text: #4d4f56; // 常规文字
+$color-text-secondary: #979ba5; // 次要文字 / 占位
+$color-primary: #3a84ff; // 主题色
+$color-border: #dcdee5; // 边框
+$color-border-light: #eaebf0; // 浅边框 / 线条中
+$color-bg-light: #fafbfd; // 浅背景
+$color-bg-tab: #f0f1f5; // 分段控件 / tab 背景
+$color-bg-hover: #f5f7fa; // 列表 / 卡片 hover 背景
+$color-bg-selected: #e1ecff; // 选中态背景（背景蓝）
+$content-loading-icon-color-list: (#cddffe, #699df4, #1768ef); // 内容加载动画三色
 ```
 
-### Z-Index 变量
+> 旧版用于 `@` 资源标签配色的 `$resourceTypeMap`（tool / skill / shortcut / doc / knowledgebase / mcp 六组配色）随输入区重构一并移除——现在资源标签统一为「图标 + 主题蓝文字」，不再按类型分配底色，详见 [MentionTag](/components/rendering/mention-tag)。
 
-组件库使用分层的 z-index 管理：
+> 其余色值（如 hover 边框 `#c4c6cc`）目前直接写在各组件样式中，未抽为变量。
 
-```scss
-// 基础 z-index
-$chat-z-index: 9999;
-
-// 编辑器 z-index
-$editor-z-index: $chat-z-index + 1;
+### Z-Index 分层
 
-// 编辑器菜单 z-index
-$editor-menu-z-index: $editor-z-index + 1;
+层级由 TS 常量维护（`src/common/constants.ts`），从包入口导出，组件通过 inline style 写成 CSS 变量下发：
 
-// 快捷指令菜单 z-index
-$shortcut-menu-z-index: $editor-menu-z-index + 1;
+```typescript
+import { CHAT_Z_INDEX, EDITOR_MENU_Z_INDEX, SELECTION_Z_INDEX } from '@blueking/chat-x';
 
-// 划选弹窗 z-index
-$selection-z-index: $shortcut-menu-z-index + 1;
+CHAT_Z_INDEX; //           9999  对话主层
+EDITOR_Z_INDEX; //         10000 编辑器
+EDITOR_MENU_Z_INDEX; //    10001 编辑器菜单 / 资源标签气泡
+SHORTCUT_MENU_Z_INDEX; //  10002 快捷指令菜单
+SELECTION_Z_INDEX; //      10003 划词浮窗
 ```
 
 ## CSS 类覆盖

package/dist/mcp/generated/docs/use-artifact-preview.md

@@ -163,7 +163,7 @@ const onArtifactClick = async (file: AIFileInfo) => {
 | ------------------- | ----------------------------------------- | -------------------------------------------------------------------- |
 | activeArtifactId    | `ShallowRef<string>`                      | 当前命中的文件 `outputId`                                            |
 | canResolveArtifactUrl | `ComputedRef<boolean>`                  | 是否具备异步取链能力（有 `onArtifactClick` 时为 true，下载按钮据此显隐） |
-| openPreview         | `(payload: OpenArtifactPreviewPayload) => void` | 由文件卡片触发：以 `file.outputId` 更新命中态、调用 `onOpen`   |
+| openPreview         | `(payload: OpenArtifactPreviewPayload) => void` | 由文件卡片或 `artifact` 资源标签触发：以 `file.outputId` 更新命中态、调用 `onOpen`；入参只需 `{ file: { outputId } }` |
 | resolveArtifactUrls | `(file: AIFileInfo) => Promise<ArtifactUrlResult>` | 调用 `onArtifactClick` 取链；每次重新获取，不缓存；同文件并发去重 |
 | setActiveArtifactId | `(id: string) => void`                    | 直接设置命中文件 `outputId`；侧栏列表内切换选中时使用                |
 
@@ -172,9 +172,13 @@ const onArtifactClick = async (file: AIFileInfo) => {
 ```typescript
 import type { AIFileInfo, ArtifactUrlResult, OnArtifactClick } from '@blueking/chat-x';
 
-/** 打开预览时的入参 */
+/**
+ * 打开预览时的入参。
+ * 命中逻辑只依赖 outputId，因此不要求完整的 AIFileInfo——
+ * 输入框内的 @ 文件标签只持有 id 与名称，无需为了调用而伪造 size / type。
+ */
 type OpenArtifactPreviewPayload = {
-  file: AIFileInfo;
+  file: Pick<AIFileInfo, 'outputId'>;
 };
 
 /**

package/dist/mcp/generated/docs/use-command-selection.md

@@ -54,7 +54,7 @@ import { watch } from 'vue';
 const { commandSelection, GetCursorPosition, GetDocSnapshot, docSnapshot } = useCommandSelection();
 
 // 用户从 @xxx 菜单中选择资源时：
-const insertTagAtCursor = (tag: IAiSlashMenuItem) => {
+const insertTagAtCursor = (tag: IInputMenuItem) => {
   editor.command(GetCursorPosition);
   const { column, line } = commandSelection.value;
   editor.command(DeleteTag, [line, column - keyword.value.length - 1], [line, column]);

package/dist/mcp/generated/docs/use-container-scroll.md

@@ -38,7 +38,8 @@ useContainerScrollProvider(containerRef, bottomRef)
   ├── jumpToBottom()   → autoScrollEnabled=true + container.scrollTop = scrollHeight（瞬时）
   ├── toScrollBottom(behavior?) → autoScrollEnabled=true；
   │     behavior 缺省时：距底部 > INSTANT_SCROLL_DISTANCE(600) → jumpToBottom()
-  │     否则 / 显式 'smooth' → bottomRef.scrollIntoView({ behavior:'smooth', block:'end' })
+  │     否则 / 显式 'smooth' → container.scrollTo({ top: scrollHeight, behavior:'smooth' })
+  │     （只滚消息容器，不用 scrollIntoView，避免带动 window）
   ├── toScrollTop()    → containerRef.scrollTo({ top:0, behavior:'smooth' })
   │
   └── provide(CONTAINER_SCROLL_TOKEN, computed(() => ({

package/dist/mcp/generated/docs/use-flow-node-actions.md

@@ -1,7 +1,7 @@
 <!-- AI SUMMARY -->
 ## 快速了解
 
-useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail，返回 getNodeActions 与 isNodePending。 失败节点按 retryable/skippable 展示重试/跳过，详情恒在末尾；点击后进入 pending 防重复提交， 以 task_id:node_id:retry 为键自动收敛；点击 resume 时不传 interrupt。 hideResumeActions 为 true 时只返回详情，覆盖 Share 分享态与侧栏「执行情况」面板两类只读场景。
+useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail，返回 getNodeActions 与 isNodePending。 失败节点按 retryable/skippable 展示重试/跳过，详情恒在末尾；点击后进入 pending 防重复提交， 以 task_id:node_id:retry 为键自动收敛；点击 resume 时不传 interrupt。
 
 ### 关联组件
 - **flow-agent-content** — FlowAgentContent 内部消费，驱动节点行尾按钮组渲染
@@ -21,7 +21,7 @@ useFlowNodeActions 接收 onInterruptResume 与 openNodeDetail，返回 getNodeA
 
 ```typescript
 function useFlowNodeActions(options: {
-  /** 隐藏重试 / 跳过等交互式 resume 操作（分享态、侧栏执行情况面板等只读场景，仅保留「详情」查看入口） */
+  /** 隐藏重试 / 跳过等交互式 resume 操作（分享态只读，仅保留「详情」查看入口） */
   hideResumeActions?: Ref<boolean>;
   /** resume 回调（与第三方审批取消同一回调，按 payload.operation 分流） */
   onInterruptResume: Ref<OnInterruptResume | undefined>;
@@ -71,16 +71,13 @@ interface FlowNodeActionVM {
 
 | 操作 | `id`               | 显隐条件                                   | 点击行为                                      |
 | ---- | ------------------ | ------------------------------------------ | --------------------------------------------- |
-| 重试 | `flow_node_retry`  | `convergedState === 'failed'` 且 `retryable`，且 `hideResumeActions` 为 `false` | 调用 `onInterruptResume`，**不传** `interrupt` |
-| 跳过 | `flow_node_skip`   | `convergedState === 'failed'` 且 `skippable`，且 `hideResumeActions` 为 `false` | 同上                                          |
-| 详情 | `detail`           | 始终（不受 `hideResumeActions` 影响）        | 调用 `openNodeDetail(task.raw, node.raw)`     |
+| 重试 | `flow_node_retry`  | `convergedState === 'failed'` 且 `retryable` | 调用 `onInterruptResume`，**不传** `interrupt` |
+| 跳过 | `flow_node_skip`   | `convergedState === 'failed'` 且 `skippable` | 同上                                          |
+| 详情 | `detail`           | 始终（含 Share 分享态）                     | 调用 `openNodeDetail(task.raw, node.raw)`     |
 
 展示顺序：重试 → 跳过 → 详情。
 
-> **只读场景过滤**：`hideResumeActions` 为 `true` 时，`getNodeActions` 直接过滤掉重试 / 跳过，仅返回「详情」查看入口，用于放开查看、禁止交互的场景。`FlowAgentContent` 目前把两类只读场景并入该入参：
->
-> - `RenderMode.Share` 分享态
-> - 侧栏「执行情况」面板内（`ExecutionSummary` 通过 `EXECUTION_PANEL_TOKEN` 提供上下文，组件用 `useExecutionPanelInject` 读取）
+> **分享态过滤**：传入 `hideResumeActions`（`Ref<boolean>`，如 `RenderMode.Share`）为 `true` 时，`getNodeActions` 直接过滤掉重试 / 跳过，仅返回「详情」查看入口；用于只读分享场景放开查看、禁止交互。
 
 ## pending 态与防重复提交
 
@@ -118,13 +115,9 @@ import { toRef } from 'vue';
 import { useFlowNodeActions } from '@blueking/chat-x';
 // 或相对路径：'./use-flow-node-actions'
 
-// 是否处于侧栏「执行情况」面板内；缺省 false，即对话流内渲染
-// useExecutionPanelInject 来自内部 src/composables/use-common.ts，未从包入口导出
-const isInExecutionPanel = useExecutionPanelInject();
-
 const { getNodeActions, isNodePending } = useFlowNodeActions({
-  // 分享态与侧栏执行情况面板均只读：过滤重试 / 跳过，仅保留详情
-  hideResumeActions: computed(() => renderMode.value === RenderMode.Share || isInExecutionPanel),
+  // 分享态只读：过滤重试 / 跳过，仅保留详情
+  hideResumeActions: computed(() => renderMode.value === RenderMode.Share),
   onInterruptResume: toRef(props, 'onInterruptResume'),
   openNodeDetail,
 });