@blueking/chat-x 0.0.20 → 0.0.22

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

@@ -44,10 +44,8 @@ ai-chat-container
     └── main（主内容区）
         ├── MessageContainer（有消息时）
         │   └── 消息列表 + 工具栏
-        ├── 欢迎页（无消息时）
-        │   ├── AIBluekingBannerIcon
-        │   ├── 欢迎标题
-        │   └── welcome 插槽（默认：开场白 ContentRender）
+        ├── 欢迎页（无消息时，容器 .ai-welcome-content）
+        │   └── welcome 插槽（默认：Banner + 欢迎标题 + 开场白 ContentRender；自定义则整块替换）
         ├── SelectionFooter（分享模式时）
         ├── ShortcutRender（有快捷指令时）
         └── ChatInput（默认状态）
@@ -227,7 +225,7 @@ ai-chat-container
 </template>
 ```
 
-> **注意**：使用 `welcome` 插槽后，默认的 `openingRemark` 渲染（`ContentRender`）将被替换，需要自行处理开场白展示逻辑。
+> **注意**：使用 `welcome` 插槽后，将**整块替换**默认欢迎区（含 Banner 图标、默认欢迎标题与 `openingRemark` 的 `ContentRender` 渲染），需自行编排完整欢迎页；插槽参数 `openingRemark` 仍可用于读取传入的开场白文本。
 
 **渲染效果**
 
@@ -332,7 +330,7 @@ ChatContainer 的 Props 继承自 `ChatInputProps` 和 `MessageContainerProps`
 | commonTippyOptions | `AITippyProps`                                                               | —        | 通用 Tippy 配置，传入的选项会注入到所有使用 `v-overflow-tips` 的子组件中                                                                      |
 | openingRemark      | `string`                                                                     | —        | 开场白，无消息时显示，支持 Markdown                                                                                                           |
 | placement          | `'left' \| 'right'`                                                          | `'left'` | 侧边栏位置                                                                                                                                    |
-| resizeProps        | `{ disabled?: boolean; initialDivide?: number; max?: number; min?: number }` | —        | 透传给内部 `ResizeLayout` 的可选配置，与默认 `collapsible: false`、`immediate: true`、`min: 400` 合并；`placement` 始终取自本组件 `placement` |
+| resizeProps        | `{ disabled?: boolean; initialDivide?: number \| string; max?: number; min?: number }` | —        | 透传给内部 `ResizeLayout` 的可选配置，与默认 `collapsible: false`、`immediate: true`、`min: 400` 合并；`placement` 始终取自本组件 `placement`；`initialDivide` 可为像素数字或百分比等字符串（与 bkui ResizeLayout 一致） |
 | onCustomTabChange  | `(tab: CustomTab) => Promise<any>`                                           | —        | 自定义 Tab 切换回调，返回值作为 Tab 组件 props                                                                                                |
 
 > 完整 Props 列表请参考 [ChatInput](./chat-input.md) 和 [MessageContainer](./message-container.md) 文档。
@@ -364,7 +362,7 @@ ChatContainer 的 Props 继承自 `ChatInputProps` 和 `MessageContainerProps`
 | codeHeader | `{ language: string; token: Token[] }` | 代码块头部自定义操作区域，透传给 MessageRender → ContentRender → MarkdownContent → CodeContent |
 | default    | 消息列表相关绑定（messages 等）        | 自定义消息列表区域                                                                             |
 | message    | `{ message, messageToolsStatus }`      | 自定义单条消息渲染                                                                             |
-| welcome    | `{ openingRemark: string }`            | 自定义欢迎页内容，替换默认的 openingRemark 渲染，无消息时显示                                  |
+| welcome    | `{ openingRemark: string }`            | 无消息时自定义欢迎页；传入则替换默认 Banner、标题与开场白区域（整块替换）                      |
 
 ### Expose
 

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

@@ -43,6 +43,8 @@ props.content → completeMarkdownSyntax → md.parse → groupTokens → groupe
                     └──── handleTokenMounted（throttle 100ms）→ containerScroll.toScrollBottom()
 ```
 
+`VNodeRenderer` 的 `options` 中包含与当前 `MarkdownIt` 实例一致的 `mditOptions`（即 `md.options`），以便 `tokensToVNodes` 调用 `renderer.rules` 时第三参与 markdown-it 原生规则签名一致。
+
 ### Token 分组（groupTokens）
 
 `groupTokens` 使用栈将扁平 Token 数组转为分组数组，每组对应一个顶层 DOM 节点（段落、标题、列表、代码块等）：
@@ -93,6 +95,10 @@ props.content → completeMarkdownSyntax → md.parse → groupTokens → groupe
 
 ## 表格
 
+## 对齐容器（markdown-it-container）
+
+支持 `::: hljs-left` / `::: hljs-center` / `::: hljs-right` 自定义容器，内容渲染在带对应 class 的块级容器中，由内置样式控制 `text-align`：
+
 ## LaTeX 公式
 
 公式由 `LatexContent`（KaTeX）渲染，支持行内 `$...$` 和块级 `$$...$$`：
@@ -179,6 +185,7 @@ props.content → completeMarkdownSyntax → md.parse → groupTokens → groupe
 | `markdown-it-task-checkbox` | `- [x]`             | 任务列表             |
 | `markdownItMermaid`         | ` ```mermaid `      | Mermaid 图表 token   |
 | `markdownItLatex`           | `$...$` / `$$...$$` | KaTeX 数学公式 token |
+| `markdownItContainer`       | `::: hljs-left` 等  | 自定义对齐容器（class 与 highlight.js 命名对齐） |
 
 ### 安全性
 

package/dist/mcp/generated/docs/use-custom-tab.md

@@ -29,6 +29,7 @@ function useCustomTabProvider<T extends Record<string, unknown>>(options: {
   addCustomTab: (tab: CustomTab<T>) => void;
   removeCustomTab: (tabName: string) => void;
   selectCustomTab: (tab: CustomTab<T>) => void;
+  resetCustomTab: () => void;
 };
 ```
 
@@ -43,6 +44,7 @@ function useCustomTabConsumer<T extends Record<string, unknown>>():
       addCustomTab: (tab: CustomTab<T>) => void;
       removeCustomTab: (tabName: string) => void;
       selectCustomTab: (tab: CustomTab<T>) => void;
+      resetCustomTab: () => void;
     };
 ```
 
@@ -53,7 +55,8 @@ function useCustomTabConsumer<T extends Record<string, unknown>>():
 ```typescript
 import { useCustomTabProvider, EXECUTION_TAB_NAME } from '@blueking/chat-x';
 
-const { tabs, selectedTab, isCollapse, addCustomTab, removeCustomTab, selectCustomTab } = useCustomTabProvider({
+const { tabs, selectedTab, isCollapse, addCustomTab, removeCustomTab, selectCustomTab, resetCustomTab } =
+  useCustomTabProvider({
   onTabChange: async tab => {
     // Tab 切换时加载数据
     const data = await fetchTabData(tab.name);
@@ -100,6 +103,7 @@ tabManager?.removeCustomTab('node-detail-123');
 | addCustomTab    | `(tab: CustomTab) => void`  | 添加 Tab（同名 Tab 不重复添加）                   |
 | removeCustomTab | `(tabName: string) => void` | 移除指定 Tab                                      |
 | selectCustomTab | `(tab: CustomTab) => void`  | 切换到指定 Tab，触发 `onTabChange` 回调           |
+| resetCustomTab  | `() => void`                  | 重置为仅保留「执行情况」Tab、折叠侧栏并选中默认 Tab；`ChatContainer` 在卸载时调用，避免残留自定义 Tab |
 
 ## 类型定义
 

package/dist/plugins/markdown-container.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Markdown-it 自定义容器插件
+ * 支持 ::: name ... ::: 语法，渲染为带 class 的 div 容器
+ * name 支持字符串精确匹配和正则匹配
+ *
+ * 用法示例:
+ *   md.use(markdownItContainer, 'warning', { ... })
+ *   md.use(markdownItContainer, /^hljs-(left|center|right)$/, { ... })
+ *
+ * Markdown 语法:
+ *   ::: hljs-left
+ *   左对齐内容
+ *   :::
+ */
+import type { MarkdownItConstructor as MarkdownIt } from '../markdown-it';
+import type { Options, Renderer, Token } from '../markdown-it';
+export type ContainerOptions = {
+    marker?: string;
+    render?: RenderFunction;
+    validate?: ValidateFunction;
+};
+type RenderFunction = (tokens: Token[], idx: number, options: Options, env: unknown, slf: Renderer) => string;
+type ValidateFunction = (params: string, markup: string) => boolean;
+export declare const markdownItContainer: (md: MarkdownIt, name: RegExp | string, options?: ContainerOptions) => void;
+export default markdownItContainer;

package/dist/utils/tokens-to-vnodes.d.ts

@@ -1,5 +1,5 @@
 import { type VNode } from 'vue';
-import type { Renderer, Token } from '../markdown-it';
+import type { Options, Renderer, Token } from '../markdown-it';
 export interface TokenToVNodeOptions {
     /**
      * 对应 markdown-it 的 highlight 选项
@@ -7,6 +7,11 @@ export interface TokenToVNodeOptions {
      */
     highlight?: ((str: string, lang: string, attrs?: any) => string) | null;
     html?: boolean;
+    /**
+     * 与产生 tokens 的 MarkdownIt 实例的 `options` 一致，供 `renderer.rules` 第三参使用
+     * （markdown-it 的 rule 签名为 (tokens, idx, options, env, self)，并非 Renderer 上的字段）
+     */
+    mditOptions?: Options;
     renderer?: Renderer;
     /**
      * HTML 净化函数，用于处理 innerHTML 的内容
@@ -20,7 +25,8 @@ type TokenAttrs = [string, string][];
 export declare const tokensToVNodes: (tokens: Token[], options?: TokenToVNodeOptions) => VNode[];
 /**
  * 将 markdown-it 的 attrs 数组转换为 Vue h 函数需要的 props 对象
- * 优化：增加 key 参数，用于优化 Vue Diff 性能
+ * - 支持同一属性多次出现：`class` 以空格拼接，`style` 以分号拼接（与常见 HTML 合并语义一致）
+ * - 增加 key 参数，用于优化 Vue Diff 性能
  */
 export declare const attrsToStyleAndProps: (attrs: null | TokenAttrs, extraClass?: string, key?: number | string) => Record<string, any>;
 export declare const renderFence: (token: Token, options: TokenToVNodeOptions, key: string) => VNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blueking/chat-x",
-  "version": "0.0.20",
+  "version": "0.0.22",
   "description": "蓝鲸智云 AI Chat 组件库 —— 遵循 AG-UI，为 AI Agent 和人类开发者共同设计的对话 UI 组件库。",
   "main": "index.js",
   "scripts": {

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

@@ -1,216 +0,0 @@
-<!-- AI SUMMARY -->
-## 快速了解
-
-汇总 MessageRole、MessageStatus、MessageContentType、MessageToolsStatus、MessageState、Z-Index 与 CONST_MESSAGE_TOOLS 等导出常量。 用于构造消息、配置 MessageContainer 工具栏与输入态，以及层级与默认快捷指令。与类型 messages 配套使用。
-
-### 关联组件
-- **message-tools** — 默认工具 ID 与展示
-- **chat-input** — MessageState 与快捷指令
-- **message-container** — 工具栏与消息态
-
----
-<!-- FULL DOC -->
-
-# 常量枚举
-
-> **分类**：type
-
-`@blueking/chat-x` 导出的常量和枚举类型。
-
-## 消息相关
-
-### MessageRole
-
-消息角色枚举：
-
-```typescript
-enum MessageRole {
-  User = 'user',
-  Assistant = 'assistant',
-  System = 'system',
-  Developer = 'developer',
-  Guide = 'guide',
-  Hidden = 'hidden',
-  HiddenAssistant = 'hidden-assistant',
-  HiddenGuide = 'hidden-guide',
-  HiddenSystem = 'hidden-system',
-  HiddenUser = 'hidden-user',
-  Info = 'info',
-  Loading = 'loading',
-  Pause = 'pause',
-  Placeholder = 'placeholder',
-  Reasoning = 'reasoning',
-  TemplateAssistant = 'template-assistant',
-  TemplateGuide = 'template-guide',
-  TemplateHidden = 'template-hidden',
-  TemplateSystem = 'template-system',
-  TemplateUser = 'template-user',
-  Tool = 'tool',
-  Activity = 'activity',
-}
-```
-
-### MessageStatus
-
-消息状态枚举：
-
-```typescript
-enum MessageStatus {
-  Pending = 'pending',
-  Streaming = 'streaming',
-  Complete = 'complete',
-  Error = 'error',
-  Stop = 'stop',
-  Disabled = 'disabled',
-}
-```
-
-### MessageContentType
-
-消息内容类型枚举：
-
-```typescript
-enum MessageContentType {
-  Binary = 'binary',
-  Function = 'function',
-  KeyValue = 'key-value',
-  KnowledgeRag = 'knowledge-rag',
-  Other = 'other',
-  ReferenceDocument = 'reference-document',
-  Text = 'text',
-}
-```
-
-### MessageToolsStatus
-
-消息工具栏状态枚举：
-
-```typescript
-enum MessageToolsStatus {
-  Disabled = 'disabled', // 禁用状态，按钮显示但不可点击
-  Hidden = 'hidden', // 隐藏状态，工具栏完全隐藏
-}
-```
-
-## 输入状态
-
-### MessageState
-
-输入框消息状态：
-
-```typescript
-const MessageState = {
-  ACTIVE: 'active',
-  DISABLED: 'disabled',
-  LOADING: 'loading',
-} as const;
-```
-
-## Z-Index 常量
-
-```typescript
-// 全局 chat-x 组件 Z-Index
-const CHAT_Z_INDEX = 9999;
-
-// 编辑器组件 Z-Index
-const EDITOR_Z_INDEX = 10000;
-
-// 编辑器菜单 Z-Index
-const EDITOR_MENU_Z_INDEX = 10001;
-
-// 快捷指令菜单 Z-Index
-const SHORTCUT_MENU_Z_INDEX = 10002;
-
-// 划选弹窗 Z-Index
-const SELECTION_Z_INDEX = 10003;
-```
-
-## 默认工具按钮
-
-### CONST_MESSAGE_TOOLS
-
-消息工具按钮列表：
-
-```typescript
-const CONST_MESSAGE_TOOLS: IToolBtn[] = [
-  { id: 'copy', name: '复制', description: '复制' },
-  { id: 'cite', name: '引用', description: '引用' },
-  { id: 'rebuild', name: '重新生成', description: '重新生成' },
-  { id: 'share', name: '分享', description: '分享' },
-];
-```
-
-### CONST_USER_MESSAGE_TOOLS
-
-用户消息工具按钮列表：
-
-```typescript
-const CONST_USER_MESSAGE_TOOLS: IToolBtn[] = [
-  { id: 'copy', name: '复制', description: '复制' },
-  { id: 'cite', name: '引用', description: '引用' },
-  { id: 'edit', name: '编辑', description: '编辑' },
-  { id: 'delete', name: '删除', description: '删除' },
-];
-```
-
-### CONST_UPDATE_TOOLS
-
-更新工具按钮列表（点赞/不满意）：
-
-```typescript
-const CONST_UPDATE_TOOLS: IToolBtn[] = [
-  { id: 'like', name: '点赞', description: '点赞' },
-  { id: 'unlike', name: '不满意', description: '不满意' },
-  { id: 'delete', name: '删除', description: '删除' },
-];
-```
-
-## 默认快捷指令
-
-### DEFAULT_SHORTCUTS
-
-默认快捷指令列表：
-
-```typescript
-const DEFAULT_SHORTCUTS: Shortcut[] = [{ id: 'ask-whale', name: '问问小鲸' }];
-```
-
-## 使用示例
-
-```typescript
-import {
-  MessageRole,
-  MessageStatus,
-  MessageContentType,
-  MessageToolsStatus,
-  CHAT_Z_INDEX,
-  CONST_MESSAGE_TOOLS,
-  DEFAULT_SHORTCUTS,
-} from '@blueking/chat-x';
-
-// 创建消息
-const message = {
-  id: '1',
-  messageId: 1,
-  role: MessageRole.User,
-  content: '你好',
-  status: MessageStatus.Complete,
-};
-
-// 检查消息状态
-if (message.status === MessageStatus.Streaming) {
-  console.log('消息正在流式输出中...');
-}
-
-// 使用默认工具按钮
-console.log(
-  '可用工具:',
-  CONST_MESSAGE_TOOLS.map(t => t.name),
-);
-```
-
-## 关联组件
-
-- [MessageTools](../components/molecular/message-tools.md) — 消息工具栏
-- [ChatInput](../components/molecular/chat-input.md) — 输入与状态
-- [MessageContainer](../components/molecular/message-container.md) — 工具与消息展示

package/dist/mcp/generated/docs/markdown-latex.md

@@ -1,208 +0,0 @@
-<!-- AI SUMMARY -->
-## 快速了解
-
-markdownItLatex 为 markdown-it 插件，解析 $...$、$$...$$、\\(...\\)、\\[...\\] 为 math_inline / math_block token，可选 LatexOption.replaceAlignStart。 不负责渲染，KaTeX 在 LatexContent 中异步渲染。与 Markdown 管道、ContentRender 中的公式展示链路配合。
-
-### 关联组件
-- **latex-content** — 消费 math token 并 KaTeX 渲染
-- **markdown-content** — Markdown 渲染管线
-- **content-render** — 消息内容统一渲染入口
-
----
-<!-- FULL DOC -->
-
-# markdownItLatex LaTeX 解析插件
-
-> **分类**：plugin
-
-Markdown-it LaTeX 解析插件，用于解析 LaTeX 数学公式语法。
-
-## 功能说明
-
-此插件只负责解析 LaTeX 语法，将其转换为 `math_inline` 和 `math_block` token。实际的 KaTeX 渲染在 `LatexContent` 组件中完成。
-
-## 支持的语法
-
-| 语法      | 类型     | 示例                   |
-| --------- | -------- | ---------------------- |
-| `$...$`   | 行内公式 | `$E = mc^2$`           |
-| `$$...$$` | 块级公式 | `$$\sum_{i=1}^{n} i$$` |
-| `\(...\)` | 行内公式 | `\(E = mc^2\)`         |
-| `\[...\]` | 块级公式 | `\[\sum_{i=1}^{n} i\]` |
-
-## 基础用法
-
-```typescript
-import MarkdownIt from 'markdown-it';
-import { markdownItLatex } from '@blueking/chat-x';
-
-const md = new MarkdownIt().use(markdownItLatex);
-
-// 解析包含 LaTeX 的 Markdown
-const tokens = md.parse(`
-行内公式：$E = mc^2$
-
-块级公式：
-
-$$
-\\int_0^\\infty e^{-x^2} dx = \\frac{\\sqrt{\\pi}}{2}
-$$
-`);
-```
-
-## 配置选项
-
-```typescript
-import MarkdownIt from 'markdown-it';
-import { markdownItLatex, type LatexOption } from '@blueking/chat-x';
-
-const options: LatexOption = {
-  replaceAlignStart: true, // 将 align* 替换为 aligned（KaTeX 不支持 align*）
-};
-
-const md = new MarkdownIt().use(markdownItLatex, options);
-```
-
-### 配置项
-
-| 属性名            | 类型      | 默认值 | 说明                             |
-| ----------------- | --------- | ------ | -------------------------------- |
-| replaceAlignStart | `boolean` | `true` | 是否将 `align*` 替换为 `aligned` |
-
-## Token 类型
-
-插件会生成以下两种 token：
-
-### math_inline
-
-行内数学公式 token：
-
-```typescript
-{
-  type: 'math_inline',
-  tag: 'math',
-  content: 'E = mc^2',
-  markup: '$',
-  meta: { displayMode: false }
-}
-```
-
-### math_block
-
-块级数学公式 token：
-
-```typescript
-{
-  type: 'math_block',
-  tag: 'math',
-  content: '\\sum_{i=1}^{n} i = \\frac{n(n+1)}{2}',
-  markup: '$$',
-  block: true,
-  map: [startLine, endLine]
-}
-```
-
-## 公式示例
-
-### 基础公式
-
-```markdown
-行内公式：$E = mc^2$
-
-块级公式：
-
-$$
-E = mc^2
-$$
-```
-
-### 复杂公式
-
-```markdown
-$$
-\\frac{-b \\pm \\sqrt{b^2 - 4ac}}{2a}
-$$
-```
-
-### 矩阵
-
-```markdown
-$$
-\\begin{pmatrix}
-a & b \\\\
-c & d
-\\end{pmatrix}
-$$
-```
-
-### 多行公式
-
-```markdown
-$$
-\\begin{aligned}
-f(x) &= x^2 + 2x + 1 \\\\
-     &= (x + 1)^2
-\\end{aligned}
-$$
-```
-
-## 转义处理
-
-插件会正确处理转义的分隔符：
-
-```markdown
-这不是公式：\$100
-
-这是公式：$x = 100$
-```
-
-## 与 KaTeX 配合
-
-渲染由 `LatexContent` 组件完成，使用 KaTeX 库：
-
-```vue
-<template>
-  <LatexContent :token="latexTokens" />
-</template>
-
-<script setup lang="ts">
-  import { LatexContent } from '@blueking/chat-x';
-
-  // latexTokens 是包含 math_inline 或 math_block 的 token 数组
-</script>
-```
-
-## KaTeX 支持说明
-
-KaTeX 支持的功能：
-
-- 大多数 LaTeX 数学符号
-- 分数、根号、指数
-- 矩阵和数组
-- 括号和分隔符
-- 希腊字母和运算符
-- 上下标和大型运算符
-
-KaTeX 限制：
-
-- 不支持 `align*` 环境（插件会自动替换为 `aligned`）
-- 部分 LaTeX 宏不支持
-
-## 使用场景
-
-- AI 数学问答
-- 技术文档展示
-- 教育类应用
-- 科学计算结果展示
-
-## 注意事项
-
-1. **双反斜杠**：在 JavaScript 字符串中，`\` 需要写成 `\\`
-2. **环境支持**：建议使用 `aligned` 替代 `align*`
-3. **性能考虑**：KaTeX 渲染在组件中异步进行，避免阻塞主线程
-
-## 关联组件
-
-- [LatexContent](../components/atomic/latex-content.md) — KaTeX 渲染
-- [MarkdownContent](../components/atomic/markdown-content.md) — Markdown 内容
-- [ContentRender](../components/molecular/content-render.md) — 内容渲染