Merge branch 'master' of http://192.168.0.200/knowledge-base-bj/deerflow-server into xhy

fix(roundtable): 文件卡截断、Step3 完整 HTML 与跨标签页登录体验

See merge request knowledge-base-bj/deerflow-server!85

.claude/launch.json

@@ -0,0 +1,12 @@
+{
+  "version": "0.0.1",
+  "configurations": [
+    {
+      "name": "md-viewer-frontend",
+      "runtimeExecutable": "npx",
+      "runtimeArgs": ["ng", "serve", "--port", "4200"],
+      "port": 4200,
+      "cwd": "F:\\angular\\md-viewer\\frontend"
+    }
+  ]
+}

.gitignore

@@ -84,5 +84,20 @@ offline-backend-20260512/backend/tests/*
 deploy
 .history
 
+# Repo-root offline dependency pack (local only)
+/dist/
+
+# Frontend offline pack working directories
+frontend-web/.offline-pack-build/
+frontend-web/.offline-extract-test/
+
+.codegraph
+codegraph.mdc
+
+docs/aidev-docs
+docs/backups
 # Frontend skills components must be tracked (excluded from the broad skills/ ignore above)
 !frontend-web/src/components/workspace/skills/
+
+# uv lockfile (not tracked per project preference)
+offline-backend-20260512/backend/uv.lock

NEW_CHAT_STREAM_FORMAT.md

@@ -0,0 +1,474 @@
+# New Chat 接口流式返回格式说明
+
+## 接口概览
+
+- **路径**：`POST /new_chat`
+- **传输协议**：Server-Sent Events (SSE)
+- **Content-Type**：`text/event-stream`
+- **协议基础**：Vercel AI SDK Data Stream Protocol
+
+---
+
+## 请求格式
+
+```json
+{
+  "chat_id": 123,
+  "search_space_id": 456,
+  "user_query": "用户问题",
+  "pic_query": [{"image_url": "/tmp/xxx.png"}],
+  "model_name": "gpt-4o",
+  "enable_citations": true,
+}
+```
+
+| 字段 | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `chat_id` | int | ✅ | 会话 ID，同时作为 LangGraph 的 thread_id |
+| `search_space_id` | int | ✅ | 搜索空间 ID |
+| `user_query` | string | ✅ | 用户问题 |
+| `pic_query` | list\|null | ❌ | 图片路径列表，格式 `[{"image_url": "..."}]` |
+| `model_name` | string\|null | ❌ | 指定模型名称（插件场景使用） |
+| `enable_citations` | bool | ❌ | 是否启用引用（默认 true） |
+| `messages` | list\|null | ❌ | 历史消息列表 |
+| `attachments` | list\|null | ❌ | 上传附件（已解析为 Markdown） |
+| `mentioned_document_ids` | list\|null | ❌ | 前端 @ 引用的文档 ID 列表 |
+
+---
+
+## 响应 Headers
+
+```
+Content-Type: text/event-stream
+Cache-Control: no-cache
+Connection: keep-alive
+X-Accel-Buffering: no
+```
+
+---
+
+## SSE 数据帧格式
+
+每条消息均为标准 SSE 格式：
+
+```
+data: {JSON 对象}\n\n
+```
+
+流结束时发送：
+
+```
+data: [DONE]\n\n
+```
+
+---
+
+## 事件类型详解
+
+### 1. 消息生命周期
+
+#### `start` — 消息开始
+
+```json
+{"type": "start", "messageId": "msg_abc123"}
+```
+
+| 字段 | 说明 |
+|------|------|
+| `messageId` | 本次消息的唯一 ID |
+
+---
+
+#### `finish` — 消息结束
+
+```json
+{"type": "finish"}
+```
+
+---
+
+#### `[DONE]` — 流终止标记
+
+```
+data: [DONE]
+```
+
+> 这是流中最后一帧，为纯字符串，不是 JSON。
+
+---
+
+### 2. 步骤控制（多轮工具调用）
+
+#### `start-step` — 步骤开始
+
+```json
+{"type": "start-step"}
+```
+
+#### `finish-step` — 步骤结束
+
+```json
+{"type": "finish-step"}
+```
+
+> 每次 LLM 调用算一个 step。工具调用期间会有多个 step 交替出现。
+
+---
+
+### 3. 文本块（start / delta / end 模式）
+
+#### `text-start` — 文本块开始
+
+```json
+{"type": "text-start", "id": "text_abc123"}
+```
+
+#### `text-delta` — 文本增量内容
+
+```json
+{"type": "text-delta", "id": "text_abc123", "delta": "Hello, "}
+```
+
+#### `text-end` — 文本块结束
+
+```json
+{"type": "text-end", "id": "text_abc123"}
+```
+
+---
+
+### 4. 推理块（Reasoning，适用于 DeepSeek R1 等思维链模型）
+
+#### `reasoning-start` — 推理块开始
+
+```json
+{"type": "reasoning-start", "id": "reasoning_abc123"}
+```
+
+#### `reasoning-delta` — 推理增量内容
+
+```json
+{"type": "reasoning-delta", "id": "reasoning_abc123", "delta": "让我先思考..."}
+```
+
+#### `reasoning-end` — 推理块结束
+
+```json
+{"type": "reasoning-end", "id": "reasoning_abc123"}
+```
+
+> 触发时机：
+> - 模型返回 `additional_kwargs.reasoning_content`（DeepSeek R1 原生）
+> - 模型输出中包含 `<think>...</think>` 标签（自动剥离）
+
+---
+
+### 5. 工具调用
+
+#### `tool-input-start` — 工具调用开始
+
+```json
+{"type": "tool-input-start", "toolCallId": "call_abc123", "toolName": "search_knowledge_base"}
+```
+
+#### `tool-input-delta` — 工具输入流式内容（增量）
+
+```json
+{"type": "tool-input-delta", "toolCallId": "call_abc123", "inputTextDelta": "San Fra"}
+```
+
+#### `tool-input-available` — 工具输入完整参数
+
+```json
+{
+  "type": "tool-input-available",
+  "toolCallId": "call_abc123",
+  "toolName": "search_knowledge_base",
+  "input": {"query": "机器学习入门"}
+}
+```
+
+#### `tool-output-available` — 工具执行结果
+
+```json
+{
+  "type": "tool-output-available",
+  "toolCallId": "call_abc123",
+  "output": {"status": "completed", "result_length": 1234}
+}
+```
+
+> 注意：`search_knowledge_base` 只返回摘要（不含全文），`write_todos`、`link_preview`、`display_image`、`scrape_webpage`、`generate_podcast` 会返回完整 output 供前端渲染组件。
+
+---
+
+### 6. 来源引用
+
+#### `source-url` — URL 来源
+
+```json
+{
+  "type": "source-url",
+  "sourceId": "https://example.com",
+  "url": "https://example.com",
+  "title": "示例页面"
+}
+```
+
+#### `source-document` — 文档来源
+
+```json
+{
+  "type": "source-document",
+  "sourceId": "doc_123",
+  "mediaType": "file",
+  "title": "报告.pdf",
+  "description": "第三季度报告"
+}
+```
+
+---
+
+### 7. 文件
+
+```json
+{"type": "file", "url": "https://example.com/image.png", "mediaType": "image/png"}
+```
+
+---
+
+### 8. 自定义数据（`data-*` 类型）
+
+#### `data-terminal-info` — 终端信息提示
+
+```json
+{
+  "type": "data-terminal-info",
+  "data": {
+    "text": "知识库搜索已完成",
+    "type": "success"
+  }
+}
+```
+
+`type` 枚举值：`info` | `error` | `success` | `warning`
+
+---
+
+#### `data-further-questions` — 推荐追问问题
+
+```json
+{
+  "type": "data-further-questions",
+  "data": {
+    "questions": ["问题1", "问题2", "问题3"]
+  }
+}
+```
+
+---
+
+#### `data-thinking-step` — 思考步骤（思维链 UI 展示）
+
+```json
+{
+  "type": "data-thinking-step",
+  "data": {
+    "id": "thinking-1",
+    "title": "正在搜索知识库",
+    "status": "in_progress",
+    "items": ["Query: 机器学习入门"]
+  }
+}
+```
+
+| 字段 | 说明 |
+|------|------|
+| `id` | 步骤唯一 ID（格式 `thinking-N`） |
+| `title` | 步骤标题 |
+| `status` | `pending` \| `in_progress` \| `completed` |
+| `items` | 步骤详情列表（可选） |
+
+> 同一个 `id` 的步骤事件会被重复发送以更新状态（先 `in_progress` 后 `completed`）。
+
+**常见步骤标题对照：**
+
+| 工具 / 场景 | 标题 |
+|------------|------|
+| 初始分析 | 正在理解您的请求 / 正在分析您的内容 |
+| `search_knowledge_base` | 查询个人知识库中 |
+| `search_web` | 网查搜索中 |
+| `link_preview` | 正在获取链接预览 |
+| `display_image` | 正在分析图片 |
+| `scrape_webpage` | 正在抓取网页 |
+| `write_todos`（首次） | 正在创建计划 |
+| `write_todos`（更新） | 正在更新进度 |
+| `generate_podcast` | 正在生成播客 |
+
+---
+
+### 9. 错误
+
+```json
+{
+  "type": "error",
+  "errorText": "API rate limit exceeded",
+  "errorType": "llm",
+  "errorCode": "rate_limit"
+}
+```
+
+| 字段 | 说明 |
+|------|------|
+| `errorText` | 错误描述文本 |
+| `errorType` | 错误类型（见下表） |
+| `errorCode` | 具体错误代码（可选） |
+
+**errorType 枚举：**
+
+| 值 | 含义 |
+|----|------|
+| `llm` | LLM / API 错误（模型不存在、限流、密钥错误等） |
+| `network` | 网络连通性错误 |
+| `timeout` | 请求超时 |
+| `authentication` | 鉴权 / 权限错误 |
+| `rate_limit` | 速率限制 |
+| `validation` | 输入验证错误 |
+| `internal` | 内部服务器错误 |
+| `unknown` | 未知错误 |
+
+---
+
+### 10. 中断（Human-in-the-loop）
+
+```json
+{
+  "type": "interrupt",
+  "messageId": "msg_abc123",
+  "interrupt": {
+    "action_requests": [...],
+    "review_configs": [...]
+  },
+  "payload": {"expertAgentId": 42}
+}
+```
+
+---
+
+## 完整流示例（普通问答）
+
+```
+data: {"type":"start","messageId":"msg_abc123"}
+
+data: {"type":"start-step"}
+
+data: {"type":"data-thinking-step","data":{"id":"thinking-1","title":"正在理解您的请求","status":"in_progress","items":["Processing: 什么是向量数据库？"]}}
+
+data: {"type":"data-thinking-step","data":{"id":"thinking-1","title":"正在理解您的请求","status":"completed","items":["Processing: 什么是向量数据库？"]}}
+
+data: {"type":"text-start","id":"text_xyz789"}
+
+data: {"type":"text-delta","id":"text_xyz789","delta":"向量数据库是"}
+
+data: {"type":"text-delta","id":"text_xyz789","delta":"一种专为存储和检索"}
+
+data: {"type":"text-delta","id":"text_xyz789","delta":"高维向量而设计的数据库..."}
+
+data: {"type":"text-end","id":"text_xyz789"}
+
+data: {"type":"finish-step"}
+
+data: {"type":"finish"}
+
+data: [DONE]
+```
+
+---
+
+## 完整流示例（含工具调用）
+
+```
+data: {"type":"start","messageId":"msg_abc123"}
+
+data: {"type":"start-step"}
+
+data: {"type":"data-thinking-step","data":{"id":"thinking-1","title":"正在理解您的请求","status":"in_progress","items":["Processing: 搜索最新 AI 论文"]}}
+
+data: {"type":"data-thinking-step","data":{"id":"thinking-1","title":"正在理解您的请求","status":"completed","items":["Processing: 搜索最新 AI 论文"]}}
+
+data: {"type":"data-thinking-step","data":{"id":"thinking-2","title":"查询个人知识库中","status":"in_progress","items":["Query: 最新 AI 论文"]}}
+
+data: {"type":"tool-input-start","toolCallId":"call_xxx","toolName":"search_knowledge_base"}
+
+data: {"type":"tool-input-available","toolCallId":"call_xxx","toolName":"search_knowledge_base","input":{"query":"最新 AI 论文"}}
+
+data: {"type":"data-thinking-step","data":{"id":"thinking-2","title":"Searching knowledge base","status":"completed","items":["Query: 最新 AI 论文","Found relevant information (2048 chars)"]}}
+
+data: {"type":"tool-output-available","toolCallId":"call_xxx","output":{"status":"completed","result_length":2048}}
+
+data: {"type":"data-terminal-info","data":{"text":"知识库搜索已完成","type":"success"}}
+
+data: {"type":"text-start","id":"text_xyz789"}
+
+data: {"type":"text-delta","id":"text_xyz789","delta":"根据知识库中的内容..."}
+
+data: {"type":"text-end","id":"text_xyz789"}
+
+data: {"type":"finish-step"}
+
+data: {"type":"finish"}
+
+data: [DONE]
+```
+
+---
+
+## 完整流示例（含推理过程）
+
+```
+data: {"type":"start","messageId":"msg_abc123"}
+
+data: {"type":"start-step"}
+
+data: {"type":"reasoning-start","id":"reasoning_r01"}
+
+data: {"type":"reasoning-delta","id":"reasoning_r01","delta":"让我先分析这个问题..."}
+
+data: {"type":"reasoning-delta","id":"reasoning_r01","delta":"需要考虑以下几个方面..."}
+
+data: {"type":"reasoning-end","id":"reasoning_r01"}
+
+data: {"type":"text-start","id":"text_xyz789"}
+
+data: {"type":"text-delta","id":"text_xyz789","delta":"综合分析后，结论是..."}
+
+data: {"type":"text-end","id":"text_xyz789"}
+
+data: {"type":"finish-step"}
+
+data: {"type":"finish"}
+
+data: [DONE]
+```
+
+---
+
+## 标准消息流顺序
+
+```
+start
+  └─ start-step
+       ├─ [data-thinking-step × N]   思考步骤（可多次）
+       ├─ [reasoning-start/delta/end] 推理过程（可选）
+       ├─ [tool-input-start]          工具调用开始（可多次）
+       ├─ [tool-input-available]      工具参数确认
+       ├─ [tool-output-available]     工具结果
+       ├─ [data-terminal-info]        终端提示（可多次）
+       ├─ [source-url / source-document] 来源引用（可选）
+       ├─ text-start
+       │    └─ text-delta × N         流式文本
+       └─ text-end
+     finish-step
+finish
+[DONE]
+```

docs/superpowers/plans/2026-06-01-iframe-chat-page.md

@@ -0,0 +1,139 @@
+# Iframe Chat Page Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Add a standalone `/page/workspace/chats_iframe/*` chat page that reuses the existing thread system and history, while showing only `你好` and no input box before the first user message.
+
+**Architecture:** Keep the existing workspace shell and chat runtime intact, then add a new route pair and a copied page component dedicated to the iframe path. The new page keeps the original chat behavior once a thread already has messages, but it owns its empty-state rendering and URL transition to `/page/workspace/chats_iframe/:thread_id`.
+
+**Tech Stack:** React, TypeScript, React Router, Next navigation shim, existing LangGraph thread hooks
+
+---
+
+### Task 1: Add the iframe chat routes
+
+**Files:**
+- Modify: `frontend-web/src/pages/WorkspaceRoutes.tsx`
+
+- [ ] **Step 1: Add `chats_iframe/new` and `chats_iframe/:thread_id` routes that render the new page inside the existing workspace layout and chat runtime**
+
+```tsx
+      <Route
+        path="chats_iframe/new"
+        element={
+          <WorkspaceLayout {...layoutProps}>
+            <ChatRuntime>
+              <IframeChatPage />
+            </ChatRuntime>
+          </WorkspaceLayout>
+        }
+      />
+      <Route
+        path="chats_iframe/:thread_id"
+        element={
+          <WorkspaceLayout {...layoutProps}>
+            <ChatRuntime>
+              <IframeChatPage />
+            </ChatRuntime>
+          </WorkspaceLayout>
+        }
+      />
+```
+
+- [ ] **Step 2: Ensure the new route imports compile cleanly**
+
+Run: `rg -n "IframeChatPage|chats_iframe" frontend-web/src/pages/WorkspaceRoutes.tsx`
+Expected: `WorkspaceRoutes.tsx` contains one import for `IframeChatPage` and both `chats_iframe` route entries.
+
+### Task 2: Add a standalone iframe chat page
+
+**Files:**
+- Create: `frontend-web/src/pages/IframeChatPage.tsx`
+- Reference: `frontend-web/src/pages/ChatPage.tsx`
+
+- [ ] **Step 1: Copy the current `ChatPage` implementation into `IframeChatPage` and preserve the existing chat runtime integration**
+
+```tsx
+export default function IframeChatPage() {
+  const routeBase = useRouteBase();
+  const router = useRouter();
+  const [showFollowups, setShowFollowups] = useState(false);
+  const [hasStartedConversation, setHasStartedConversation] = useState(false);
+  const { threadId, setThreadId, isNewThread, setIsNewThread, isMock } =
+    useThreadChat();
+  // keep the rest of the existing chat hooks and handlers aligned with ChatPage
+}
+```
+
+- [ ] **Step 2: Change the thread creation URL replacement to stay on the iframe route family**
+
+```tsx
+    onStart: (createdThreadId) => {
+      setThreadId(createdThreadId);
+      setIsNewThread(false);
+      history.replaceState(
+        null,
+        "",
+        `${window.location.pathname}${window.location.search}#${routeBase}/chats_iframe/${createdThreadId}`,
+      );
+    },
+```
+
+- [ ] **Step 3: Replace the default landing state with a simple `你好` view and do not render the input box while the iframe page is still a brand-new untouched chat**
+
+```tsx
+                {isLandingState && mounted ? (
+                  <div className="flex min-h-[240px] items-center justify-center">
+                    <div className="text-2xl font-medium">你好</div>
+                  </div>
+                ) : null}
+                {!isLandingState &&
+                  (mounted ? (
+                    <div className="w-full -translate-y-4">
+                      <InputBox
+                        className="w-full"
+                        isNewThread={false}
+                        threadId={threadId}
+                        autoFocus={false}
+                        status={thread.error ? "error" : thread.isLoading ? "streaming" : "ready"}
+                        context={settings.context}
+                        disabled={env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true" || isUploading}
+                        onContextChange={(context) => setSettings("context", context)}
+                        promptPrefix={promptPrefixProp}
+                        onFollowupsVisibilityChange={setShowFollowups}
+                        onSubmit={handleSubmit}
+                        onStop={handleStop}
+                      />
+                    </div>
+                  ) : (
+                    <div aria-hidden="true" className="bg-background/5 h-32 w-full -translate-y-4 rounded-3xl border" />
+                  ))}
+```
+
+- [ ] **Step 4: Keep message rendering, thread title, export, token usage, todos, artifact triggers, and all post-first-message behavior identical to the original page**
+
+Run: `rg -n "MessageList|ThreadTitle|ArtifactTrigger|TokenUsageIndicator|TodoList" frontend-web/src/pages/IframeChatPage.tsx`
+Expected: The new page still renders the same core chat primitives used by `ChatPage`.
+
+### Task 3: Verify the new page compiles
+
+**Files:**
+- Test: `frontend-web/src/pages/IframeChatPage.tsx`
+- Test: `frontend-web/src/pages/WorkspaceRoutes.tsx`
+
+- [ ] **Step 1: Run the frontend build**
+
+Run: `cmd /c npm run build`
+Expected: Build succeeds without TypeScript or bundling errors related to `IframeChatPage` or `chats_iframe`.
+
+- [ ] **Step 2: Spot-check the changed routes in the built source**
+
+Run: `rg -n "chats_iframe" frontend-web/src/pages`
+Expected: Matches appear in `WorkspaceRoutes.tsx` and `IframeChatPage.tsx`.
+
+- [ ] **Step 3: Commit after verification**
+
+```bash
+git add docs/superpowers/plans/2026-06-01-iframe-chat-page.md frontend-web/src/pages/WorkspaceRoutes.tsx frontend-web/src/pages/IframeChatPage.tsx
+git commit -m "feat: add iframe chat page routes"
+```

docs/superpowers/specs/2026-05-20-router-subagent-design.md

@@ -0,0 +1,229 @@
+# 问答模式路由智能体设计方案
+
+> **状态**：部分实现 ✓
+> - ✅ `subagent_mode` 注入机制已实现（`build_run_config`、`_CONTEXT_CONFIGURABLE_KEYS`）
+> - ✅ DeerFlow 运行时 `subagent_mode` 加载已实现（`make_lead_agent`）
+> - ✅ `router_quality_tool.py` 已创建
+> - ✅ 子 Agent 目录结构已创建（7个子 Agent 的 SOUL.md 和 config.yaml）
+> - ✅ 路由器 SOUL.md 已更新
+> - ⏳ 集成测试和质检提示词测试待完成
+
+## 1. 背景与目标
+
+路由器智能体（`f0e75f44f7594053ba1567ed89258f35`）根据用户问题判断最合适的问答模式（fast/rag/bigMode/moreModes/taskChat/hxchat/deerFlow），选择后需要调用相应子 Agent 执行，路由器对执行结果进行**完整性质检**，通过则流式输出到前端，不通过则重新匹配模式并再次执行。
+
+## 2. 整体流程
+
+```
+用户问题
+    │
+    ▼
+┌──────────────────────────────┐
+│ 路由器智能体                  │
+│ (已有 SOUL.md)                │
+│ ① 判断最佳模式                │
+└─────────────┬────────────────┘
+              │ 选择模式
+              ▼
+┌──────────────────────────────┐
+│ 子 Agent 执行                 │
+│ (完整执行完毕，结果缓存)        │
+└─────────────┬────────────────┘
+              │ 执行完毕
+              ▼
+┌──────────────────────────────┐
+│ 路由器质检                    │
+│ LLM 判断结果是否完整覆盖用户问题 │
+└─────────────┬────────────────┘
+              │
+         ③ 质检结果
+         ┌────┴────┐
+         │通过      │不通过
+         ▼         ▼
+     流式输出   重新匹配模式
+     到前端     (最多重试2次)
+```
+
+- **最大重试次数**：每个问题最多 2 次重试（总共最多 3 次执行），超过后强制输出当前结果并标注"结果可能不完整"
+
+## 3. 目录结构
+
+```
+.deer-flow/agents/f0e75f44f7594053ba1567ed89258f35/
+├── SOUL.md                     ← 路由器智能体（已有）
+├── config.yaml                 ← 路由器配置
+└── subagents/
+    ├── fast/
+    │   ├── SOUL.md             ← 快速问答子 Agent
+    │   └── config.yaml         ← tool_groups 声明
+    ├── rag/
+    │   ├── SOUL.md
+    │   └── config.yaml
+    ├── bigMode/
+    │   ├── SOUL.md
+    │   └── config.yaml
+    ├── moreModes/
+    │   ├── SOUL.md
+    │   └── config.yaml
+    ├── taskChat/
+    │   ├── SOUL.md
+    │   └── config.yaml
+    ├── hxchat/
+    │   ├── SOUL.md
+    │   └── config.yaml
+    └── deerFlow/
+        ├── SOUL.md
+        └── config.yaml
+```
+
+**父子关系**：子 Agent 目录放在路由器下二级 `subagents/`，通过目录层级体现父子结构。
+
+## 4. 子 Agent 配置
+
+### 4.1 config.yaml 格式
+
+```yaml
+id: rag
+name: 知识库问答子Agent
+description: 从知识库检索并返回引用
+tool_groups:
+  - knowledge          # 知识库检索工具组
+  - file:read          # 只读文件工具
+skills: []
+model: deepseek-chat
+```
+
+### 4.2 tool_groups 说明
+
+- tool_groups 在系统级 `config.yaml` 中统一定义（`tool_groups` 列表）
+- 子 Agent 的 config.yaml 通过 `tool_groups` 字段声明自己可以使用哪些工具组
+- 工具组示例：web（网页搜索）、knowledge（知识库检索）、file:read、file:write、bash 等
+
+## 5. 调用方式
+
+### 5.1 复用 Gateway API（方案 A — 推荐）
+
+路由器通过 DeerFlow 现有 `/api/threads/{thread_id}/runs/stream` 接口调用子 Agent：
+
+```
+POST /api/threads/{thread_id}/runs/stream
+{
+  "assistant_id": "f0e75f44f7594053ba1567ed89258f35",
+  "context": {
+    "subagent_mode": "rag"          ← 路由器注入子模式
+  },
+  "input": {
+    "messages": [...]
+  },
+  "stream_mode": ["values"]
+}
+```
+
+**执行步骤**：
+1. 路由器启动一个 run，assistant_id 指向路由器本身
+2. 路由器通过 `context.subagent_mode` 告知 DeerFlow 运行时本次应加载哪个子 Agent
+3. DeerFlow 运行时加载 `subagents/{subagent_mode}/SOUL.md` 和对应的 tool_groups
+4. 子 Agent 完整执行，结果缓存在 StreamBridge 中
+5. 执行完毕后，路由器读取完整结果
+
+**context.subagent_mode 注入机制**：
+- `build_run_config` 中新增 `subagent_mode` 到 `_CONTEXT_CONFIGURABLE_KEYS`
+- `make_lead_agent` 读取 `configurable.subagent_mode`，如果存在则加载对应子 Agent 的 SOUL.md 和工具配置
+- 如果 `subagent_mode` 不存在，则正常运行路由器自己的 SOUL.md
+
+### 5.2 质检提示词
+
+路由器在子 Agent 执行完毕后，用 LLM 进行完整性质检：
+
+```
+你是一个质检员。上游子 Agent 已根据问题执行完毕。
+请判断以下结果是否完整覆盖了用户问题的所有子问题。
+
+用户原始问题：{original_question}
+
+子 Agent 执行结果：
+{agent_output}
+
+请只返回 JSON 格式：
+{
+  "passed": true/false,
+  "reason": "判断理由（10字内）",
+  "missing_parts": ["缺失的子问题1", "缺失的子问题2"]  // 如果 passed=false
+}
+```
+
+**质检维度**：完整性（结果是否覆盖了用户问题的所有子问题）
+
+## 6. 关键代码改动
+
+### 6.1 DeerFlow 运行时改动 ✓
+
+**文件**：`packages/harness/deerflow/agents/lead_agent/agent.py`
+
+已实现：
+- `make_lead_agent` 读取 `configurable.subagent_mode`（第362-394行）
+- 如果存在，加载 `.deer-flow/agents/{agent_id}/subagents/{subagent_mode}/SOUL.md` 和对应 `config.yaml`
+- 工具绑定使用子 Agent 的 tool_groups，而非父 Agent 的
+
+### 6.2 build_run_config 改动 ✓
+
+**文件**：`app/gateway/services.py`
+
+已实现：
+- `_CONTEXT_CONFIGURABLE_KEYS` 已包含 `subagent_mode`（第149-171行）
+- `merge_run_context_overrides` 将 `subagent_mode` 透传到 configurable
+
+### 6.3 路由器 SOUL.md 改动 ✓
+
+**文件**：`.deer-flow/agents/f0e75f44f7594053ba1567ed89258f35/SOUL.md`
+
+已更新：
+- 角色扩展：增加"在确定模式后，调用相应子 Agent 执行并对结果进行质检"的职责
+- 工具描述：已声明 router_quality_check 工具
+
+### 6.4 新增路由器质检工具 ✓
+
+**文件**：`packages/harness/deerflow/tools/builtins/router_quality_tool.py`
+
+已实现：
+```python
+@tool("router_quality_check", parse_docstring=True, return_direct=True)
+def router_quality_check(original_question: str, agent_output: str) -> str:
+    """质检工具 — 判断子 Agent 输出是否完整覆盖用户问题"""
+```
+
+## 7. 数据流
+
+```
+用户问题
+    │
+    ▼
+路由器 SOUL.md 判断模式
+    │
+    ▼
+启动子 Agent Run（context.subagent_mode = rag）
+    │
+    ▼
+子 Agent SOUL.md + tool_groups 执行
+    │
+    ▼
+StreamBridge 缓存完整结果
+    │
+    ▼
+路由器调用 router_quality_check 质检
+    │
+    ├── passed=true → 流式输出到前端
+    └── passed=false → 重新匹配模式（最多2次重试）
+```
+
+## 8. 测试计划
+
+- **单元测试**：`tests/test_router_subagent.py` — 测试模式判断、质检逻辑、重试机制
+- **集成测试**：手动调用 `/api/threads/{thread_id}/runs/stream`，验证完整流程
+- **质检提示词测试**：针对不同问题类型测试质检结果的准确性
+
+## 9. 依赖项
+
+- 路由器复用现有 Gateway API，无需新建接口
+- 质检使用 LLM（deepseek-chat 或配置中指定的模型）
+- tool_groups 机制依赖系统级 config.yaml 中的工具组定义

frontend-web/.env.development

@@ -26,9 +26,14 @@ VITE_AIPI_KNOWLEDGE_IFRAME_SKIN=red
 VITE_AIPI_MOPECHAT_URL=https://ch1.b.uat.4.cn/likun_b1_mope
 VITE_AIPI_BACKENP_URL=https://knowledgetoolserver.b.uat.4.cn
 # 我的笔记前端
-VITE_AIPI_FRONTEND_URL= xxx
+VITE_AIPI_FRONTEND_URL=https://knowledgetoolserver.b.uat.4.cn
 VITE_AIPI_CONSUMER_URL=https://ch1.b.uat.4.cn/consumer
+# MaxKey 鉴权（getTokenByOnlineTicket）
+VITE_AUTH_BASE_URL=https://auth.y.sit.4.cn
 VITE_AIPI_PGLINKTO_URL=https://pg.b.uat.4.cn
 VITE_AIPI_XKLINKTO_URL=https://kz.b.uat.4.cn
 # 可选：Canvas 独立 LangGraph 地址（不设则回退到 VITE_LANGGRAPH_BASE_URL）
 # VITE_CANVAS_LANGGRAPH_BASE_URL=
+
+# 我的笔记是否显示，侧边栏
+VITE_STUDIO_ENABLED=false

frontend-web/.env.development.local.example

@@ -17,6 +17,7 @@ VITE_AIPI_KNOWLEDGE_IFRAME_SKIN=red
 VITE_AIPI_MOPECHAT_URL=https://ch1.b.uat.4.cn/likun_b1_mope
 VITE_AIPI_BACKENP_URL=https://knowledgetoolserver.b.uat.4.cn
 VITE_AIPI_CONSUMER_URL=https://ch1.b.uat.4.cn/consumer
+VITE_AUTH_BASE_URL=https://auth.y.sit.4.cn
 VITE_AIPI_PGLINKTO_URL=https://pg.b.uat.4.cn
 VITE_AIPI_XKLINKTO_URL=https://kz.b.uat.4.cn
 

frontend-web/.env.example

@@ -5,13 +5,14 @@
 # ├─────────────────┼──────────────────────────────────────────────────┤
 # │ pnpm dev        │ .env.development + .env.development.local        │
 # │ pnpm build      │ .env.production + .env.production.local          │
+# │ pnpm build:network │ .env.network + .env.network.local（内网地址） │
 # │ scripts/start-* │ 脚本注入的环境变量会覆盖上述文件（见下方说明）      │
 # └─────────────────┴──────────────────────────────────────────────────┘
 #
 # 推荐：
 # - 日常本地开发：改 .env.development（已提交，团队默认 UAT 地址）
 # - 本机连 127.0.0.1:8001：复制 .env.development.local.example → .env.development.local
-# - 内网打包部署：改 .env.production 后再执行 pnpm build
+# - 内网打包部署：改 .env.network 后执行 pnpm build:network（或改 .env.production 后 pnpm build）
 #
 # 若浏览器直连后端报 CORS，请在 Gateway 配置 CORS_ORIGINS，包含前端源站，例如：
 #   CORS_ORIGINS=http://127.0.0.1:5173,http://localhost:5173,http://127.0.0.1:5174
@@ -24,6 +25,10 @@
 # --- 生产打包（见 .env.production）---
 # 部署前修改 .env.production 中的地址，再执行 pnpm build
 
+# MaxKey 鉴权根地址（无界 onlineTicket 换 token）
+# VITE_AUTH_BASE_URL=https://auth.y.sit.4.cn
+# VITE_AIPI_CONSUMER_URL=https://ch1.b.uat.4.cn/consumer
+
 # VITE_AIPI_B2ACTOR_URL=https://ty.b.uat.4.cn
 # VITE_AIPI_B2ACTOR_XWT_PATH=/fromB/toXWT?isFrame=1
 # VITE_AIPI_KNOWLEDGE_IFRAME_API_URL=https://ch1.b.uat.4.cn/knowes/api/iframeKnowledgeUrl

frontend-web/.env.network

@@ -0,0 +1,32 @@
+# 内网 / 局域网生产打包（npm run build:network 或 pnpm build:network）
+# 打包前请将 192.168.1.100 改为实际服务器 IP；变量会写入 dist，运行时不可再改
+
+# Gateway / DeerFlow API（与 offline-backend DEPLOY 文档一致）
+VITE_BACKEND_BASE_URL=http://47.88.25.99:7001
+VITE_LANGGRAPH_BASE_URL=http://47.88.25.99:7001/api
+
+# 轻应用「新建笔记」系列接口
+VITE_NOTE_API_BASE_URL=http://192.168.1.100:8000
+# CMZS 后端接口
+VITE_API_BASE_URL=http://192.168.1.100/zncm
+# 佳来模型对话接口
+VITE_AIPI_CHAT_URL=http://192.168.1.100/gpt
+# 多轮检索接口
+VITE_AIPI_GENERATE_CHAT_URL=http://192.168.1.100/jialai_b1_chat
+VITE_AIPI_TASK_CHAT_URL=http://192.168.1.100/qq_b1_chat
+VITE_AIPI_KNOWLEDGE_URL=http://192.168.1.100/knowlibrary
+VITE_AIPI_B1COH_URL=http://192.168.1.100/web
+VITE_AIPI_B2ACTOR_URL=http://192.168.1.100
+VITE_AIPI_B2ACTOR_XWT_PATH=/fromB/toXWT?isFrame=1
+VITE_AIPI_KNOWLEDGE_IFRAME_API_URL=http://192.168.1.100/knowes/api/iframeKnowledgeUrl
+VITE_AIPI_KNOWLEDGE_IFRAME_SKIN=red
+VITE_AIPI_MOPECHAT_URL=http://192.168.1.100/likun_b1_mope
+VITE_AIPI_BACKENP_URL=http://192.168.1.100
+VITE_AIPI_CONSUMER_URL=http://192.168.1.100/consumer
+# MaxKey 鉴权（getTokenByOnlineTicket，内网部署请改为实际地址）
+VITE_AUTH_BASE_URL=https://auth.y.sit.4.cn
+VITE_AIPI_PGLINKTO_URL=http://192.168.1.100
+VITE_AIPI_XKLINKTO_URL=http://192.168.1.100
+
+# 可选：Canvas 独立 LangGraph 地址
+# VITE_CANVAS_LANGGRAPH_BASE_URL=

frontend-web/.env.production

@@ -21,8 +21,11 @@ VITE_AIPI_KNOWLEDGE_IFRAME_SKIN=red
 VITE_AIPI_MOPECHAT_URL=https://ch1.b.uat.4.cn/likun_b1_mope
 VITE_AIPI_BACKENP_URL=https://knowledgetoolserver.b.uat.4.cn
 VITE_AIPI_CONSUMER_URL=https://ch1.b.uat.4.cn/consumer
+# MaxKey 鉴权（getTokenByOnlineTicket）
+VITE_AUTH_BASE_URL=https://auth.y.uat.4.cn
 VITE_AIPI_PGLINKTO_URL=https://pg.b.uat.4.cn
 VITE_AIPI_XKLINKTO_URL=https://kz.b.uat.4.cn
+VITE_AIPI_FRONTEND_URL=https://knowledgetoolserver.b.uat.4.cn
 
 # 可选：Canvas 独立 LangGraph 地址
 # VITE_CANVAS_LANGGRAPH_BASE_URL=

frontend-web/.env.sit

@@ -0,0 +1,30 @@
+# SIT 环境打包（pnpm build:sit / npm run build:sit）— 接口地址为 UAT 的 sit 版本
+# 打包后变量会写入 dist，运行时不可再改
+
+# Gateway / DeerFlow API
+VITE_BACKEND_BASE_URL=https://ch1.b.sit.4.cn/deerflow
+VITE_LANGGRAPH_BASE_URL=https://ch1.b.sit.4.cn/deerflow/api
+
+# 轻应用「新建笔记」系列接口
+VITE_NOTE_API_BASE_URL=https://your-intranet-host/note-api
+# 佳来模型对话接口
+VITE_AIPI_CHAT_URL=https://ch1.b.sit.4.cn/gpt
+# 多轮检索接口
+VITE_AIPI_GENERATE_CHAT_URL=https://ch1.b.sit.4.cn/jialai_b1_chat
+VITE_AIPI_TASK_CHAT_URL=https://ch1.b.sit.4.cn/qq_b1_chat
+VITE_AIPI_KNOWLEDGE_URL=https://chlib.b.sit.4.cn/knowlibrary
+VITE_AIPI_B1COH_URL=https://ch1.b.sit.4.cn/web
+VITE_AIPI_B2ACTOR_URL=https://ty.b.sit.4.cn
+VITE_AIPI_B2ACTOR_XWT_PATH=/fromB/toXWT?isFrame=1
+VITE_AIPI_KNOWLEDGE_IFRAME_API_URL=https://ch1.b.sit.4.cn/knowes/api/iframeKnowledgeUrl
+VITE_AIPI_KNOWLEDGE_IFRAME_SKIN=red
+VITE_AIPI_MOPECHAT_URL=https://ch1.b.sit.4.cn/likun_b1_mope
+VITE_AIPI_BACKENP_URL=https://knowledgetoolserver.b.sit.4.cn
+VITE_AIPI_CONSUMER_URL=https://ch1.b.sit.4.cn/consumer
+# MaxKey 鉴权（getTokenByOnlineTicket）
+VITE_AUTH_BASE_URL=https://auth.y.sit.4.cn
+VITE_AIPI_PGLINKTO_URL=https://pg.b.sit.4.cn
+VITE_AIPI_XKLINKTO_URL=https://kz.b.sit.4.cn
+
+# 可选：Canvas 独立 LangGraph 地址
+# VITE_CANVAS_LANGGRAPH_BASE_URL=

frontend-web/docs/ai-writing-右侧编辑器-滑词与段落菜单.md

@@ -0,0 +1,228 @@
+# AI 写作 · 右侧文本编辑器（滑词 / 段落菜单）
+
+> 说明 AI 写作页、开放画布中文稿右侧编辑器的实现方式：**编辑器本体基于 Tiptap v3**；选中文本浮层（「滑词」）与段落悬停按钮为**自研 React 组件**，未使用 `@tiptap/extension-bubble-menu` 官方 BubbleMenu。
+
+---
+
+## 一、功能概览
+
+| 交互 | 用户感知 | 组件 | 触发方式 |
+|------|----------|------|----------|
+| **滑词** | 拖选一段文字后，选区上方出现工具条（AI 改写、加粗、斜体、下划线、H1、复制） | `WritingBubbleMenu` | Tiptap `selectionUpdate` + 浏览器 `window.getSelection()` |
+| **段落菜单** | 鼠标移入某段/标题/引用块时，段落左侧出现 ✨ 按钮，点击可 AI 改写整段 | `WritingParagraphMenu` | 编辑器 DOM `mousemove` + ProseMirror `posAtCoords` |
+| **AI 改写面板** | 点击「AI 改写」后弹出润色/扩写等操作与预览 | `WritingAiMenu` / `WritingRewritePreview` | 由 `TextArtifactRenderer` + `useWritingRewrite` 串联 |
+
+画布线程页（`/page/canvas/:thread_id`）与 AI 写作页（`/page/workspace/ai-writing`）右侧草稿**共用同一套** `TextArtifactRenderer` 与菜单组件。
+
+---
+
+## 二、在 AI 写作中的挂载路径
+
+```mermaid
+flowchart TB
+  AIWritingPage --> CanvasResizableLayout
+  CanvasResizableLayout --> AIWritingDraftPanel
+  AIWritingDraftPanel --> DraftStreamingPreview
+  AIWritingDraftPanel --> TextArtifactRenderer
+  DraftStreamingPreview["DraftStreamingPreview<br/>（流式只读 Markdown）"]
+  TextArtifactRenderer --> WritingBubbleMenu
+  TextArtifactRenderer --> WritingParagraphMenu
+  TextArtifactRenderer --> TiptapEditor
+  TextArtifactRenderer --> WritingAiMenu
+```
+
+| 阶段 | 右侧展示 | 滑词 / 段落菜单 |
+|------|----------|-----------------|
+| 草稿流式生成中（`writing_draft` / `revising` 且有 section 流） | `DraftStreamingPreview`（ReactMarkdown 只读） | **不可用** |
+| 成稿可编辑（`isDraftEditable === true`） | `TextArtifactRenderer` + Tiptap | **可用** |
+| 流式结束但尚未 editable | `TextArtifactRenderer` 且 `isStreaming={true}` | **不可用**（`editable: false`） |
+
+相关状态由 [CanvasUIContext.tsx](../src/open-canvas/contexts/CanvasUIContext.tsx) 的 `isDraftStreaming`、`isDraftEditable` 控制；注释中「禁用编辑/润色/滑词」即指生成完成前不进入可编辑渲染器。
+
+入口文件：
+
+- [AIWritingDraftPanel.tsx](../src/open-canvas/components/ai-writing/AIWritingDraftPanel.tsx) — 决定流式预览 vs `TextArtifactRenderer`
+- [TextArtifactRenderer.tsx](../src/open-canvas/components/artifact/TextArtifactRenderer.tsx) — 挂载编辑器与两套浮层菜单
+
+---
+
+## 三、技术栈：编辑器 vs 浮层
+
+### 3.1 Tiptap 编辑器（有使用）
+
+| 包 | 用途 |
+|----|------|
+| `@tiptap/react` | `useEditor`、`EditorContent` |
+| `@tiptap/starter-kit` | 段落、标题、加粗、斜体、下划线等 |
+| `@tiptap/extension-placeholder` | 空文档占位符 |
+| `tiptap-markdown` | Markdown ↔ 文档互转 |
+| 自研 `AiHighlightExtension` | AI 改写前高亮选区（ProseMirror Decoration） |
+
+扩展注册见 [TiptapExtensions.ts](../src/open-canvas/editor/TiptapExtensions.ts)；实例创建见 [useWritingEditor.ts](../src/open-canvas/hooks/useWritingEditor.ts)。
+
+### 3.2 浮层菜单（自研，非 Tiptap 官方插件）
+
+| 包 | 是否用于滑词/段落菜单 |
+|----|----------------------|
+| `@tiptap/extension-bubble-menu` | **未使用**（`package.json` 中有依赖，代码未 import） |
+| `@tiptap/react` 的 `<BubbleMenu>` | **未使用** |
+
+两套菜单均采用：
+
+1. 监听 Tiptap / DOM 事件更新位置与选区；
+2. `createPortal(..., document.body)` 挂到 `document.body`，避免被右侧滚动容器 `overflow` 裁切；
+3. `position: fixed` + `getBoundingClientRect()` 定位。
+
+命名上的 `WritingBubbleMenu` 仅表示「气泡式选区工具条」，实现上与 Tiptap 官方 Bubble Menu 扩展无关。
+
+---
+
+## 四、核心文件索引
+
+| 文件 | 职责 |
+|------|------|
+| [TiptapEditor.tsx](../src/open-canvas/editor/TiptapEditor.tsx) | `EditorContent` 渲染容器 |
+| [TiptapExtensions.ts](../src/open-canvas/editor/TiptapExtensions.ts) | StarterKit、Placeholder、Markdown、AiHighlight |
+| [AiHighlightExtension.ts](../src/open-canvas/editor/AiHighlightExtension.ts) | `setAiHighlight` / `clearAiHighlight` 命令 |
+| [useWritingEditor.ts](../src/open-canvas/hooks/useWritingEditor.ts) | 创建 editor、同步外部 markdown、editable |
+| [WritingBubbleMenu.tsx](../src/open-canvas/components/artifact/WritingBubbleMenu.tsx) | **滑词** 选区浮层 |
+| [WritingParagraphMenu.tsx](../src/open-canvas/components/artifact/WritingParagraphMenu.tsx) | **段落** 左侧 ✨ 按钮 |
+| [WritingAiMenu.tsx](../src/open-canvas/components/artifact/WritingAiMenu.tsx) | AI 改写操作菜单 |
+| [WritingRewritePreview.tsx](../src/open-canvas/components/artifact/WritingRewritePreview.tsx) | 改写结果预览 |
+| [useWritingRewrite.ts](../src/open-canvas/hooks/useWritingRewrite.ts) | 调用润色 API、写回编辑器 |
+| [apply-rewrite.ts](../src/open-canvas/utils/apply-rewrite.ts) | 将改写结果应用到 ProseMirror 选区 |
+| [CanvasUIContext.tsx](../src/open-canvas/contexts/CanvasUIContext.tsx) | `writingSelection` 全局状态 |
+| [selection.ts](../src/open-canvas/types/selection.ts) | `WritingSelection` 类型定义 |
+
+---
+
+## 五、滑词：`WritingBubbleMenu`
+
+### 5.1 行为
+
+- 用户在编辑器内拖选非空文本时显示浮层；选区为空或位于 `codeBlock` 内时隐藏。
+- 浮层按钮：`AI 改写`、`B` / `I` / `U`、`H1`、复制。
+- 按钮 `onMouseDown` 使用 `e.preventDefault()`，避免点击时编辑器失焦导致选区丢失。
+
+### 5.2 实现要点
+
+```text
+editor.on("selectionUpdate") 
+  → 读取 editor.state.selection (from, to, empty)
+  → window.getSelection() + Range.getBoundingClientRect() 算屏幕坐标
+  → setWritingSelection({ from, to, text }) 写入 CanvasUIContext
+  → createPortal 渲染工具条，useLayoutEffect 做贴边 / 上方空间不足时翻到选区下方
+```
+
+关键代码位置：[WritingBubbleMenu.tsx](../src/open-canvas/components/artifact/WritingBubbleMenu.tsx) 中 `useEffect` 监听 `selectionUpdate` 与 `blur`。
+
+点击「AI 改写」时：
+
+1. `editor.commands.setAiHighlight(from, to)` 高亮选区；
+2. 调用父组件传入的 `onAiRewrite()`，由 `TextArtifactRenderer` 打开 `WritingAiMenu`。
+
+---
+
+## 六、段落菜单：`WritingParagraphMenu`
+
+### 6.1 行为
+
+- 鼠标在编辑器内移动时，检测光标下的**块级节点**；
+- 仅对 `paragraph`、`heading`、`blockquote` 且文本非空时，在块左侧显示 ✨ 按钮；
+- 鼠标离开编辑器或移出可改写块后，延迟约 **380ms** 隐藏（`HIDE_DELAY`），并在按钮与正文之间留有 hover 桥接区，避免移向按钮时闪烁消失。
+
+### 6.2 实现要点
+
+```text
+editor.view.dom mousemove
+  → editor.view.posAtCoords({ left, top })
+  → doc.resolve(pos).before(depth) 定位块起点
+  → editor.view.nodeDOM(nodeStart) 取 DOM 矩形
+  → createPortal 固定定位按钮在块左侧 (BTN_SIZE=24, BTN_GAP=6)
+```
+
+点击 ✨ 时：
+
+1. `setTextSelection` 选中整段 ProseMirror 范围（`nodeFrom` ~ `nodeTo`）；
+2. `setAiHighlight` + `setWritingSelection`；
+3. 触发与滑词相同的 `onAiRewrite()` 流程。
+
+关键代码位置：[WritingParagraphMenu.tsx](../src/open-canvas/components/artifact/WritingParagraphMenu.tsx)。
+
+---
+
+## 七、AI 改写数据流
+
+```mermaid
+sequenceDiagram
+  participant User
+  participant Menu as BubbleMenu / ParagraphMenu
+  participant Ctx as CanvasUIContext
+  participant Renderer as TextArtifactRenderer
+  participant API as rewrite API
+
+  User->>Menu: 选中文本或点段落 ✨
+  Menu->>Ctx: setWritingSelection
+  Menu->>Renderer: onAiRewrite()
+  Renderer->>Renderer: phase = menu, WritingAiMenu
+  User->>Renderer: 选择润色/扩写等
+  Renderer->>API: useWritingRewrite.rewrite
+  API-->>Renderer: 流式结果
+  Renderer->>Renderer: WritingRewritePreview
+  User->>Renderer: 接受改写
+  Renderer->>Renderer: applyReplace / applyInsert
+```
+
+- 选区信息类型：`WritingSelection`（`from`、`to`、`text`），见 [selection.ts](../src/open-canvas/types/selection.ts)。
+- 与画布聊天侧选区 `CanvasTextSelection` 分离；后者用于快捷操作栏等，不用于 Tiptap 改写。
+
+---
+
+## 八、与顶部工具栏、目录栏的关系
+
+同一 `TextArtifactRenderer` 编辑模式下还包含：
+
+| 组件 | 作用 |
+|------|------|
+| [WritingToolbar.tsx](../src/open-canvas/components/artifact/WritingToolbar.tsx) | 顶部固定格式栏、导出等 |
+| [DraftOutlineSidebar.tsx](../src/open-canvas/components/artifact/DraftOutlineSidebar.tsx) | 左侧标题目录，点击滚动到对应 heading |
+
+滑词 / 段落菜单与工具栏互不替代：工具栏面向全局格式；浮层面向**当前选区或当前段落**的快捷操作与 AI 改写入口。
+
+---
+
+## 九、开发与改造建议
+
+### 9.1 若要改用官方 Bubble Menu
+
+1. 在 [TiptapExtensions.ts](../src/open-canvas/editor/TiptapExtensions.ts) 或组件层引入 `@tiptap/react` 的 `BubbleMenu`（或注册 `@tiptap/extension-bubble-menu`）；
+2. 将 [WritingBubbleMenu.tsx](../src/open-canvas/components/artifact/WritingBubbleMenu.tsx) 内手写 `selectionUpdate` + Portal 逻辑替换为官方组件的 `shouldShow` / `tippyOptions`（v3 API 以官方文档为准）；
+3. **段落左侧按钮**仍建议保留自研 `WritingParagraphMenu`（官方 Bubble Menu 只覆盖选区，不覆盖 hover 段落场景）。
+
+### 9.2 新增浮层按钮
+
+- **滑词**：在 `WritingBubbleMenu` 的 `BubbleButton` 列表中增加，使用 `editor.chain().focus()....run()`。
+- **段落**：在 `WritingParagraphMenu` 的 `handleClick` 或拆出多按钮布局；注意 `REWRITABLE_TYPES` 与 hover 延迟逻辑。
+
+### 9.3 流式阶段禁止交互
+
+不要在 `DraftStreamingPreview` 中挂载 Tiptap 菜单：流式阶段 token 高频更新，挂载 `useWritingEditor` 易引发更新风暴（见 [DraftStreamingPreview.tsx](../src/open-canvas/components/ai-writing/DraftStreamingPreview.tsx) 文件头注释）。应等 `isDraftEditable` 后再走 `TextArtifactRenderer`。
+
+---
+
+## 十、相关文档
+
+- [前端开发.md](./前端开发.md) §25.4 — Canvas / AI 写作路由与组件总表
+- [ai-writing-用户自带大纲-测试用例.md](./ai-writing-用户自带大纲-测试用例.md) — AI 写作业务流程测试（含右侧草稿层级校验）
+
+---
+
+## 十一、依赖版本（摘录）
+
+以 [package.json](../package.json) 为准，编辑器相关主要为：
+
+- `@tiptap/core`、`@tiptap/react`、`@tiptap/starter-kit`：`^3.23.4`
+- `@tiptap/extension-bubble-menu`：已安装但未接入滑词实现
+- `tiptap-markdown`：Markdown 扩展
+
+升级 Tiptap 大版本前，请对照官方迁移指南，并重点回归：`WritingBubbleMenu` 选区坐标、`WritingParagraphMenu` 的 `posAtCoords`、以及 `AiHighlightExtension` 与 StarterKit 扩展名冲突（勿重复注册 `underline`）。

frontend-web/docs/ai-writing-用户自带大纲-测试用例.md

@@ -0,0 +1,274 @@
+# AI 写作 ·「用户自带大纲」手动测试用例
+
+> 功能：用户在 AI 写作表单粘贴已有大纲后，系统**完全按用户大纲生成正文**，兼容一/二/三级目录。
+> 入口页面：`http://localhost:5173/#/page/workspace/ai-writing`（或 `2026` 端口经 nginx）
+
+---
+
+## 一、测试目标
+
+验证三件事：
+1. **识别**——用户粘贴的各种格式大纲，能被正确解析成 章节(##) → 小节(###) → 子要点(####) 三级结构。
+2. **保真**——生成的大纲标题、层级**与用户粘贴的完全一致**，不增、不删、不改写。
+3. **兼容**——只有一级 / 一+二级 / 一+二+三级 三种深度都能正确生成对应层级的正文。
+
+---
+
+## 二、前置条件
+
+| 项 | 要求 |
+|----|------|
+| 服务 | 后端（Gateway 8001）+ 前端（Vite 5174/5173）均已启动，可正常发起一次普通 AI 写作 |
+| 模型 | 写作模型已在表单可选、能正常输出（先用不带大纲的普通流程跑通一次作为基线） |
+| 账号 | 已登录（或无鉴权模式） |
+| 入口 | 进入 `/page/workspace/ai-writing`，能看到「写作配置选项」表单 |
+
+---
+
+## 三、通用操作步骤
+
+除非用例另有说明，每条用例都按以下步骤执行：
+
+1. 进入 AI 写作页面，点开**「已有大纲（可选）」** 旁的「我已有大纲，直接粘贴 ▾」。
+2. 在「写作意图」填一句话（如：`写一篇关于新能源汽车出口的分析文章`）。
+3. 把用例里的**「输入大纲」**整段粘贴进「已有大纲」输入框。
+4. 文章类型 / 目标字数 / 素材来源保持默认即可。
+5. 点击「开始 AI 写作」。
+6. 等待流程走到 **PAUSE-2「大纲确认」**，对照**「预期大纲结构」**核对左侧/卡片里的大纲。
+7. 点「确认」继续，等正文生成完，对照**「预期正文层级」**核对右侧草稿的标题层级。
+
+> 关键校验点都在第 6 步（大纲确认卡）。正文层级（第 7 步）作为二次确认。
+
+---
+
+## 四、测试用例
+
+### TC-01　Markdown 三级 + 文章标题
+
+**输入大纲：**
+```
+# 新能源汽车出口为何高速增长
+## 引言
+### 出口数据创新高
+#### 同比增幅
+#### 全球排名变化
+### 市场背景
+## 增长动因
+### 成本优势
+```
+
+**预期大纲结构：**
+- 文章标题 = `新能源汽车出口为何高速增长`（首个孤立 `#` 被识别为标题，不作为章节）
+- 章节1 `引言`
+  - 小节 `出口数据创新高` → 子要点：`同比增幅`、`全球排名变化`
+  - 小节 `市场背景`（无子要点）
+- 章节2 `增长动因`
+  - 小节 `成本优势`
+
+**预期正文层级：** `#` 文章标题 → `##` 引言/增长动因 → `###` 小节 → `####` 同比增幅/全球排名变化，各级都有正文。
+
+---
+
+### TC-02　中文编号三级（一、/（一）/ 1.）
+
+**输入大纲：**
+```
+一、引言
+（一）背景
+（二）意义
+二、现状分析
+（一）市场数据
+1. 国内市场
+2. 海外市场
+```
+
+**预期大纲结构：**
+- 章节1 `引言` → 小节 `背景`、`意义`
+- 章节2 `现状分析` → 小节 `市场数据` → 子要点 `国内市场`、`海外市场`
+- 标题留空 → 用「写作意图」兜底（卡片标题约等于意图前 30 字）
+
+**校验重点：** `一、` > `（一）` > `1.` 的层级顺序正确（符合中文公文惯例）。
+
+---
+
+### TC-03　阿拉伯小数点编号（1. / 1.1 / 1.1.1）
+
+**输入大纲：**
+```
+1. 引言
+1.1 研究背景
+1.2 研究意义
+2. 现状
+2.1 行业概况
+```
+
+**预期大纲结构：**
+- 章节1 `引言` → 小节 `研究背景`、`研究意义`
+- 章节2 `现状` → 小节 `行业概况`
+
+---
+
+### TC-04　缩进 bullet 表示层级
+
+**输入大纲：**
+```
+- 引言
+  - 背景
+  - 意义
+- 现状
+  - 数据
+    - 细节展开
+```
+
+**预期大纲结构：**
+- 章节1 `引言` → 小节 `背景`、`意义`
+- 章节2 `现状` → 小节 `数据` → 子要点 `细节展开`
+
+**校验重点：** 缩进深度正确映射成层级。
+
+---
+
+### TC-05　只有一级目录（平铺 Markdown）
+
+**输入大纲：**
+```
+## 引言
+## 现状
+## 对策
+## 结论
+```
+
+**预期大纲结构：** 4 个章节 `引言/现状/对策/结论`，**均无小节**。
+**预期正文层级：** 每个章节 `##` 标题下是一整段连贯正文（不出现 `###`）。
+
+**校验重点：** 一级目录场景不报错、不被强行拆出多余小节。
+
+---
+
+### TC-06　只有一级目录（中文编号）
+
+**输入大纲：**
+```
+一、引言
+二、现状
+三、结论
+```
+
+**预期大纲结构：** 3 个章节 `引言/现状/结论`，无小节。与 TC-05 等价，验证另一种一级写法。
+
+---
+
+### TC-07　纯文本平铺（无任何标记）
+
+**输入大纲：**
+```
+引言
+现状
+对策
+总结
+```
+
+**预期大纲结构：** 4 个章节 `引言/现状/对策/总结`（每行一个短标题 → 一级章节）。
+
+**校验重点：** 无编号无缩进的短标题列表也能识别为一级大纲。
+
+---
+
+### TC-08　格式混乱 / 散文化（走 LLM 兜底）
+
+**输入大纲：**
+```
+我想写一篇分析今年AI大模型发展趋势的文章，重点关注国内企业的布局。
+希望先讲背景，再讲现状，最后给出展望。
+```
+
+**预期行为：**
+- 确定性解析判定为「散文」→ 自动走 **LLM 归一兜底**，整理成一份结构化大纲。
+- 大纲确认卡能正常显示一份大纲（不报错、不卡死）。
+- 大纲内容应贴近原意（背景 / 现状 / 展望之类），**但不要求逐字一致**（这一条是兜底鲁棒性，不是保真用例）。
+
+**校验重点：** 流程不崩、能产出可用大纲。
+
+---
+
+### TC-09　保真校验（标题原样保留）
+
+**输入大纲：**
+```
+一、A股市场2024年回顾与展望
+（一）宏观经济（GDP/CPI）影响
+（二）流动性与利率
+二、行业轮动主线
+```
+
+**预期大纲结构：** 标题文本**逐字保留**，仅编号被剥离：
+- 章节1 `A股市场2024年回顾与展望`
+  - 小节 `宏观经济（GDP/CPI）影响`、`流动性与利率`
+- 章节2 `行业轮动主线`
+
+**校验重点：** 标题里的中文括号、英文缩写、年份等**不被改写**。
+
+---
+
+### TC-10　大纲确认卡里再编辑 / 重新规划
+
+**前置：** 先用 TC-02 的大纲跑到「大纲确认」卡。
+
+**操作：**
+1. 在确认卡里**手动改一个小节标题**（如把 `背景` 改成 `行业背景`）→ 点「确认」。
+2. 或点「重新规划」并填修改要求（如 `给"现状分析"再加一个小节`）。
+
+**预期行为：**
+- 手动改后确认：正文按改后的大纲生成。
+- 重新规划：基于**用户这份大纲**做编辑式调整（在原结构上加/改），而不是从零另起一份无关大纲。
+
+**校验重点：** 自带大纲 → 确认 → 编辑 这条回路正常，不会丢掉用户原始结构。
+
+---
+
+### TC-11　回归：不填大纲（默认流程不受影响）
+
+**操作：** 「已有大纲」**留空**，只填写作意图，正常发起。
+
+**预期行为：** 与功能上线前完全一致——系统自动检索素材、**自动规划大纲**（大纲由 AI 生成，非用户提供）。
+
+**校验重点：** 增量功能不污染老流程。
+
+---
+
+### TC-12　素材关联（仍走检索）
+
+**前置：** 素材来源选「知识库」，用 TC-02 的大纲发起，等检索出素材并确认。
+
+**预期行为：**
+- 走到大纲时，用户的章节会被**关联上检索到的素材**（正文里能体现素材中的事实/数据）。
+- 关联**只填素材、不改大纲标题与结构**。
+
+**校验重点：** 「自带大纲」与「检索素材」能共存——大纲是用户的，正文有素材支撑。
+
+---
+
+## 五、缺陷记录模板
+
+| 用例 | 输入大纲（摘要） | 预期 | 实际 | 是否通过 | 备注 |
+|------|------------------|------|------|----------|------|
+| TC-01 | Markdown 三级 | 标题+2章节+子要点 | | ☐ | |
+| TC-02 | 一、/（一）/1. | 中文三级 | | ☐ | |
+| TC-03 | 1./1.1/1.1.1 | 阿拉伯三级 | | ☐ | |
+| TC-04 | 缩进 bullet | 缩进三级 | | ☐ | |
+| TC-05 | 平铺 ## | 4 章节无小节 | | ☐ | |
+| TC-06 | 平铺 一、 | 3 章节无小节 | | ☐ | |
+| TC-07 | 纯文本平铺 | 4 章节 | | ☐ | |
+| TC-08 | 散文 | LLM 兜底产出大纲 | | ☐ | |
+| TC-09 | 带括号/缩写标题 | 标题逐字保留 | | ☐ | |
+| TC-10 | 确认卡编辑/重规划 | 在原大纲上调整 | | ☐ | |
+| TC-11 | 留空 | 走自动规划 | | ☐ | |
+| TC-12 | 检索+自带大纲 | 素材关联不改结构 | | ☐ | |
+
+---
+
+## 六、备注
+
+- TC-01~07、09 的解析逻辑已有**自动化单测**覆盖（`backend/tests/test_ai_writing_outline_parser.py`，19 个用例），本文档侧重**端到端真机表现**（流式展示、确认卡渲染、正文层级、素材关联）。
+- 若某条解析结果与预期不符，先看大纲确认卡里的**结构**是否正确（定位是解析问题还是正文生成问题）。
+- 相关后端实现：`packages/harness/deerflow/agents/ai_writing/outline_parser.py`（解析）、`nodes/writer_outline.py`（自带大纲分支 + 素材关联）。

frontend-web/docs/embed-iframe-chat.md

@@ -0,0 +1,436 @@
+# 工作台问答 · iframe 嵌入开发说明
+
+本文档说明如何将 DeerFlow **通用工作台问答**（与 `/page/workspace/chats/*` 同一套 LangGraph 流式能力）以**普通 iframe** 形式嵌入第三方页面，并在**父页面无法读取子 frame 内 `thread_id`** 的前提下，轮询「本次问答是否已结束」。
+
+后端公开 API 实现见：`offline-backend-20260512/backend/app/gateway/routers/public_embed.py`  
+数据表：`embed_sessions`（迁移 `20260602_01`）
+
+---
+
+## 0. 速读
+
+| 角色 | 要做的事 |
+|------|----------|
+| **父页面** | 自己生成 `sessionId`（UUID），拼进 iframe `src`；用 `sessionId` 调公开 API 轮询 `finished` |
+| **iframe（DeerFlow）** | 打开 `/embed/chats/...`，自动登录、自动发问、登记 `sessionId → thread_id` |
+| **不需要** | 无界（wujie）、父页面拿 `thread_id`、DeerFlow 登录态 Cookie |
+
+**完成条件**：`GET .../sessions/{sessionId}/status` 返回 `finished === true`（且无进行中的 run，非澄清中断）。
+
+---
+
+## 1. 背景与约束
+
+### 1.1 业务目标
+
+- 第三方系统用 **iframe** 嵌 DeerFlow 问答 UI。
+- 传入：**问题文案**、**用户名**（走现有 `login/username`）、**主题色**。
+- 展示：**消息列表** + **沙箱/产物侧栏**（与主聊天相同的 `ChatBox`）；**隐藏**页面左侧栏、Workspace 侧栏、底部输入框。
+- 进入后 **自动发送** 首条用户消息并走流式问答。
+
+### 1.2 为何需要 `sessionId`
+
+iframe 与父页面通常 **跨域**，父页面 **不能** 读取子应用 URL 里的 `thread_id`（hash 路由在子 frame 内）。  
+因此约定：
+
+1. **父页面**在打开 iframe 前生成全局唯一的 `sessionId`；
+2. **子页面**在创建/确定 `thread_id` 后，调用后端 **登记接口** 写入 `session_id → thread_id`；
+3. **父页面**只凭 `sessionId` 查询状态，必要时响应里会带上 `thread_id`（可选使用）。
+
+---
+
+## 2. 端到端流程
+
+```mermaid
+sequenceDiagram
+  participant Parent as 父页面
+  participant Iframe as DeerFlow iframe
+  participant API as Gateway /api/public/embed
+
+  Parent->>Parent: sessionId = crypto.randomUUID()
+  Parent->>Iframe: iframe src 含 sessionId、message、username、theme
+  Iframe->>Iframe: loginByUsername + 自动 sendMessage
+  Iframe->>API: POST /sessions { session_id, thread_id }
+  loop 每 1–3s
+    Parent->>API: GET /sessions/{sessionId}/status
+    API-->>Parent: registered, finished, thread_id
+  end
+```
+
+---
+
+## 3. 前端路由与页面
+
+### 3.1 路由（独立于 `/page/*`）
+
+在 `App.tsx` 注册，**不经过** `PageRoutes` / `PageSidebar`，因此无外层导航与 Workspace 侧栏。
+
+| 路由 | 组件 | 说明 |
+|------|------|------|
+| `/embed/chats/:thread_id` | `EmbedChatPage`（外包 `ChatRuntime`） | `thread_id` 可为 `new` 或已有 UUID |
+
+示例（HashRouter，注意 `#`）：
+
+```
+http://localhost:5173/#/embed/chats/new?sessionId=...&message=...&username=guest&theme=red
+```
+
+开发环境端口以本地 Vite 为准（如 5173 / 5174）。
+
+### 3.2 URL 查询参数
+
+| 参数 | 必填 | 说明 |
+|------|------|------|
+| `sessionId` 或 `session_id` | **是** | 父页面生成的关联 id，8–128 位，仅字母数字 `_` `-` |
+| `message` / `question` / `text` | 建议 | 首条用户问题；有则进入后自动发送 |
+| `username` / `userName` | 否 | 默认 `guest`，对应 `POST /api/v1/auth/login/username` |
+| `theme` | 否 | `dark-blue` → 深色；`red` 等 → 浅色（与 `LoginPage` 一致） |
+
+缺少 `sessionId` 时，嵌入页会提示错误，不会发起登记。
+
+### 3.3 相关源码
+
+| 路径 | 职责 |
+|------|------|
+| [src/pages/EmbedChatPage.tsx](../src/pages/EmbedChatPage.tsx) | 嵌入页：登录、自动发问、登记 session、仅消息列表 + ChatBox |
+| [src/core/embed/params.ts](../src/core/embed/params.ts) | 从 URL 解析嵌入参数 |
+| [src/core/embed/status-api.ts](../src/core/embed/status-api.ts) | 登记 / 轮询 API 封装 |
+| [src/App.tsx](../src/App.tsx) | 路由注册 |
+
+### 3.4 UI 行为说明
+
+- **隐藏**：`PageSidebar`、`WorkspaceSidebar`、`InputBox`、顶栏标题栏等（相对完整 `ChatPage`）。
+- **保留**：`MessageList`、流式指示、澄清卡片（若 agent 触发 `ask_clarification`）、右侧 **产物/沙箱**（`ChatBox` 内 60/40 分栏逻辑与主聊天一致）。
+- **线程 id**：新建会话时客户端先分配 UUID，`onStart` 后 `history.replaceState` 更新 hash 为 `/embed/chats/{真实id}`（与主聊天 `ChatPage` 相同手法，避免整页重载）。
+
+---
+
+## 4. 公开 HTTP API（无需鉴权）
+
+前缀：`/api/public/embed/`（走 Gateway，与 `VITE_BACKEND_BASE_URL` 一致，默认 `http://127.0.0.1:8001`）。
+
+CSRF / Auth 中间件对 `/api/public/` 放行；请求 **不需要** Cookie。
+
+### 4.1 登记映射（iframe 内自动调用）
+
+```http
+POST /api/public/embed/sessions
+Content-Type: application/json
+
+{
+  "session_id": "parent-generated-uuid",
+  "thread_id": "e9c7d09e-821d-421f-ae24-e5ddfe0cff5b"
+}
+```
+
+**响应：**
+
+```json
+{
+  "session_id": "parent-generated-uuid",
+  "thread_id": "e9c7d09e-821d-421f-ae24-e5ddfe0cff5b",
+  "registered": true
+}
+```
+
+同一 `session_id` 再次 POST 会 **更新** `thread_id`（例如 `onStart` 后 id 变化）。
+
+### 4.2 轮询状态（父页面使用）
+
+```http
+GET /api/public/embed/sessions/{session_id}/status
+```
+
+**尚未登记**（iframe 仍在加载或未 POST）：
+
+```json
+{
+  "session_id": "parent-generated-uuid",
+  "registered": false,
+  "thread_id": null,
+  "finished": false,
+  "thread_status": "pending",
+  "has_active_run": false,
+  "latest_run_status": null
+}
+```
+
+**已登记且问答进行中：**
+
+```json
+{
+  "session_id": "parent-generated-uuid",
+  "registered": true,
+  "thread_id": "e9c7d09e-821d-421f-ae24-e5ddfe0cff5b",
+  "finished": false,
+  "thread_status": "idle",
+  "has_active_run": true,
+  "latest_run_status": "running"
+}
+```
+
+**已登记且已结束：**
+
+```json
+{
+  "session_id": "parent-generated-uuid",
+  "registered": true,
+  "thread_id": "e9c7d09e-821d-421f-ae24-e5ddfe0cff5b",
+  "finished": true,
+  "thread_status": "idle",
+  "has_active_run": false,
+  "latest_run_status": "success"
+}
+```
+
+#### 字段说明
+
+| 字段 | 含义 |
+|------|------|
+| `registered` | 是否已收到 iframe 的 POST 登记 |
+| `finished` | **父页面应以此为准**：无 inflight run，且线程非 running/busy，且非 `interrupted`（澄清等待用户） |
+| `thread_status` | 从 checkpoint 推导：`idle` / `interrupted` / `error` 等 |
+| `has_active_run` | 是否存在 pending/running 的 LangGraph run |
+| `latest_run_status` | 该线程最近一次 run 的状态：`success` / `error` / … |
+| `thread_id` | 解析出的 DeerFlow 线程 id（父页面可选用，非必须） |
+
+### 4.3 获取生成结果（父页面使用）
+
+问答结束后（建议先确认 `finished === true`），拉取本次模型输出：
+
+```http
+GET /api/public/embed/sessions/{session_id}/result
+```
+
+**尚未登记：**
+
+```json
+{
+  "session_id": "parent-generated-uuid",
+  "registered": false,
+  "thread_id": null,
+  "finished": false,
+  "thread_status": "pending",
+  "has_active_run": false,
+  "latest_run_status": null,
+  "messages": [],
+  "generated_text": "",
+  "generated_files": []
+}
+```
+
+**已登记且已有内容：**
+
+```json
+{
+  "session_id": "parent-generated-uuid",
+  "registered": true,
+  "thread_id": "e9c7d09e-821d-421f-ae24-e5ddfe0cff5b",
+  "finished": true,
+  "thread_status": "idle",
+  "has_active_run": false,
+  "latest_run_status": "success",
+  "messages": [
+    { "type": "human", "content": "请总结要点", "id": "..." },
+    { "type": "ai", "content": "根据分析，要点如下：...", "id": "..." }
+  ],
+  "generated_text": "根据分析，要点如下：...",
+  "generated_files": [
+    "/mnt/user-data/outputs/summary.md",
+    "/mnt/user-data/outputs/chart.png"
+  ]
+}
+```
+
+#### 结果字段说明
+
+| 字段 | 含义 |
+|------|------|
+| `messages` | 完整消息列表（与 checkpoint 中序列化结构一致，含 human / ai / tool 等） |
+| `generated_text` | 所有 `ai` / `assistant` 消息正文按顺序拼接（段落间空一行） |
+| `generated_files` | 本次会话产物的虚拟路径列表（与 UI 产物栏 `artifacts` 一致） |
+
+未结束时也可调用，会返回当前已有内容；`finished` 仍为 false 表示可能还会继续生成。
+
+### 4.4 按 thread_id 查询（可选）
+
+调试或父页面已持有 thread_id 时：
+
+```http
+GET /api/public/embed/threads/{thread_id}/status
+GET /api/public/embed/threads/{thread_id}/result
+```
+
+状态接口响应不含 `messages` / `generated_text` / `generated_files`；结果接口字段与 §4.3 相同（无 `session_id` / `registered`）。
+
+### 4.5 前端封装
+
+```ts
+import {
+  getEmbedSessionResult,
+  getEmbedSessionStatus,
+  registerEmbedSession,
+} from "@/core/embed/status-api";
+
+// 父页面（或你们自己的脚本）
+const status = await getEmbedSessionStatus(sessionId);
+if (status.registered && status.finished) {
+  const result = await getEmbedSessionResult(sessionId);
+  console.log(result.generated_text, result.generated_files);
+}
+
+// 仅 iframe 内需要
+await registerEmbedSession(sessionId, threadId);
+```
+
+`fetch` 使用 `credentials: "omit"`，不携带 DeerFlow 会话。
+
+---
+
+## 5. 父页面集成示例
+
+### 5.1 拼接 iframe
+
+```html
+<iframe
+  id="deerflow-embed"
+  title="DeerFlow 问答"
+  style="width:100%;height:600px;border:0"
+></iframe>
+```
+
+```javascript
+const sessionId = crypto.randomUUID();
+const base = "http://localhost:5173"; // 换成你们部署的前端 origin
+const params = new URLSearchParams({
+  sessionId,
+  message: "请根据附件总结要点",
+  username: "guest",
+  theme: "red",
+});
+document.getElementById("deerflow-embed").src =
+  `${base}/#/embed/chats/new?${params.toString()}`;
+```
+
+### 5.2 轮询直到结束
+
+```javascript
+const API = "http://127.0.0.1:8001"; // VITE_BACKEND_BASE_URL
+
+async function pollUntilFinished(sessionId) {
+  const res = await fetch(
+    `${API}/api/public/embed/sessions/${encodeURIComponent(sessionId)}/status`,
+    { credentials: "omit" },
+  );
+  if (!res.ok) throw new Error(`status HTTP ${res.status}`);
+  const data = await res.json();
+  if (!data.registered) return { done: false, reason: "pending" };
+  if (data.finished) return { done: true, data };
+  return { done: false, reason: "running" };
+}
+
+const timer = setInterval(async () => {
+  try {
+    const poll = await pollUntilFinished(sessionId);
+    if (poll.done) {
+      clearInterval(timer);
+      const output = await fetch(
+        `${API}/api/public/embed/sessions/${encodeURIComponent(sessionId)}/result`,
+        { credentials: "omit" },
+      ).then((r) => r.json());
+      console.log("问答已结束", output.generated_text, output.generated_files);
+    }
+  } catch (e) {
+    console.error(e);
+  }
+}, 2000);
+```
+
+### 5.3 跨域注意
+
+父页面从浏览器 `fetch` Gateway（如 `http://127.0.0.1:8001`）时，**Origin 必须是后端 CORS 白名单里的完整地址**（含协议、主机、端口），与 API 地址是否写 `localhost` / `127.0.0.1` 无关。
+
+**本地开发**（前端默认 `5174`）请在 Gateway 环境变量中配置：
+
+```bash
+# offline-backend-20260512/.env 或启动脚本注入
+GATEWAY_CORS_ORIGINS=http://localhost:5174,http://127.0.0.1:5174,http://localhost:5173,http://127.0.0.1:5173
+```
+
+修改后**重启 Gateway**（`make dev` / `make gateway`）。若父页面部署在其它域名，把该域名的 origin 一并加入逗号分隔列表。
+
+临时调试（勿用于公网生产）：
+
+```bash
+GATEWAY_CORS_ALLOW_ALL=1
+```
+
+常见报错：`No 'Access-Control-Allow-Origin' header` → 当前页面的 origin 未出现在 `GATEWAY_CORS_ORIGINS` 中。
+
+### 5.4 其它部署注意
+
+---
+
+## 6. 部署与数据库
+
+1. **跑迁移**（SQL 持久化后端）：
+
+   ```bash
+   cd offline-backend-20260512/backend
+   # 按项目惯例执行 alembic upgrade head
+   ```
+
+   表：`embed_sessions(session_id PK, thread_id, created_at, updated_at)`。
+
+2. **重启 Gateway**，确认路由已挂载：`public_embed.router`（`app/gateway/app.py`）。
+
+3. **前端构建** 后，将嵌入地址配给第三方；`VITE_BACKEND_BASE_URL` 指向可达的 Gateway。
+
+无 SQL 时开发环境会退化为 **内存** `MemoryEmbedSessionStore`（进程重启后映射丢失）；生产请使用持久化库。
+
+---
+
+## 7. 安全说明
+
+- `sessionId` 与 `thread_id` 均视为 **不透明能力令牌**：知晓即可查询状态（公开 API **无登录**）。
+- 建议：父系统自行生成不可猜测的 UUID；敏感场景在贵司 API 网关再加鉴权或 IP 限制。
+- 登记接口为 **POST upsert**，不校验「session 是否属于某租户」——若需多租户隔离，请在业务层约定 `sessionId` 命名空间或增加网关校验。
+
+---
+
+## 8. 与主聊天 `/page/workspace/chats` 的差异
+
+| 项目 | 主聊天 | iframe 嵌入 |
+|------|--------|-------------|
+| 路由 | `/page/workspace/chats/:id` | `/embed/chats/:id` |
+| 布局 | 完整 Workspace + 输入框 | 仅消息区 + 产物栏 |
+| 登录 | 常规登录流 | URL `username` 自动 `login/username` |
+| 首条消息 | 用户输入 | URL `message` 自动发送 |
+| 完成态查询 | 无公开 API | `sessionId` + `/api/public/embed/sessions/.../status` |
+
+能力上仍走同一 `useThreadStream` + `lead_agent` 流式链路，沙箱与产物行为与主聊天一致。
+
+---
+
+## 9. 常见问题
+
+**Q：`registered` 一直为 false？**  
+A：检查 iframe URL 是否带 `sessionId`；子页是否登录成功；Network 里是否有 `POST /api/public/embed/sessions` 且 200。
+
+**Q：`finished` 一直 false？**  
+A：可能仍在流式生成（`has_active_run: true`），或 agent 进入澄清（`thread_status: interrupted`）。嵌入模式无底部输入框，澄清需产品侧另行处理或避免触发澄清类工具。
+
+**Q：父页面能否不用轮询？**  
+A：当前标准方案为公开 GET 轮询。若同源可考虑 `postMessage` 扩展（未默认实现）。
+
+**Q：能否继续用已有 thread_id 嵌入？**  
+A：可以：`#/embed/chats/{thread_id}?sessionId=...`，可选再带 `message` 追加一轮；登记会在已知 id 上 upsert。
+
+---
+
+## 10. 变更记录
+
+| 日期 | 说明 |
+|------|------|
+| 2026-06-02 | 初版：iframe 嵌入路由、`sessionId` 映射表、公开登记与状态 API |
+| 2026-06-02 | 新增 `GET /sessions/{session_id}/result`：返回 messages、generated_text、generated_files |

frontend-web/docs/multi-agent-backend-dev.md

@@ -649,6 +649,31 @@ JSON 列在 repo（`sql.py`）里用 `json.dumps/loads` 手动序列化（与 `a
 
 ---
 
+## 7B. 业务链条持久化（`roundtable_chains.py`，2026-06）
+
+「业务链条」是用户在配置页编排的**可复用、命名、有序**的智能体编排模板；选中后 Step 2 由总控**按链条顺序派活**（前端编排，后端零改动）。链条持久化仿 §7A，新增一张表 + 一组 CRUD 路由。完整前后端设计见 `frontend-web/docs/multi-agent-business-chain-dev.md`。
+
+### 7B.1 数据模型（`deerflow.persistence.roundtable_chains`）
+
+- 表 **`roundtable_chains`**：`id`(PK str64) / `user_id`(idx) / `title`(512) / `description`(512, nullable) / `seats`(**`PortableLongText`** JSON：有序 `[{agent_id,name,description}, ...]`，`seats[0]` 先发言) / `created_at` / `updated_at`(**`BeijingDateTime`**)。
+- ORM `RoundtableChainRow` 登记进 `persistence/models/__init__.py`，启动 `Base.metadata.create_all` 自动建表；store `make_roundtable_chain_store(sf)` 接到 `app.state.roundtable_chain_store`（`deps.py`）。
+
+### 7B.2 路由（`app/gateway/routers/roundtable_chains.py`，前缀 `/api/roundtable-chains`）
+
+| 方法 | 路径 | 说明 |
+|------|------|------|
+| GET | `` | 当前用户全部链条（含 seats，按 `updated_at` 倒序） |
+| POST | `` | 新建（可带客户端 `id`）；校验席位 `2 ≤ N ≤ 8` + 去重 |
+| GET | `/{id}` | 取单条；非属主 → 404 |
+| PUT | `/{id}` | partial 更新（`exclude_unset`）；带 seats 时同样校验 |
+| DELETE | `/{id}` | 204；非属主 → 404 |
+
+- 鉴权/属主用 `_current_user_id(request)`，跨用户一律 404，与 `roundtable_drafts` 一致。
+- 席位约束 `MIN_SEATS=2 / MAX_SEATS=8` 与前端 `CHAIN_MIN/MAX_SEATS`、推荐弹窗 `MIN/MAX_SELECTED` 对齐；前端配置页保存前先校验，后端 `_validate_seats` 兜底（400）。
+- 前端 `api/chains.ts` 直接打这组路由（snake↔camel 边界映射）；测试 `tests/test_roundtable_chains.py`（CRUD + 部分更新 + 跨用户隔离）。
+
+---
+
 ## 8. 内置席位 SOUL 设计要点
 
 每个 `roundtable-*`（除 intent / recommender）遵循统一结构：角色定位、核心职责、输出风格（emoji + 简短结论）、边界（只产出本席位、等总控派活）。

frontend-web/docs/multi-agent-business-chain-dev.md

@@ -0,0 +1,400 @@
+# 业务链条模式 · 需求与分步实现文档
+
+> 面向「智能体推荐弹窗」的扩展：在现有**智能推荐**之外，新增**业务链条选择**与**业务链条配置**两块能力；选定业务链条后，Step 2 圆桌研讨**按链条内的固定顺序**逐个发言（而非现在的总控派活）。
+>
+> 配套阅读：
+> - 前端总览：`multi-agent-frontend-dev.md`（推荐弹窗 §6.2、Step 2 编排 §5.4、草稿持久化 §5.7）
+> - 后端总览：`multi-agent-backend-dev.md`（Step 2 §6、草稿/历史持久化 §7A）
+>
+> 本文档约定：**「席位 / 智能体」**指一个 agent；**「业务链条 / chain」**指一组有序排列的 agent 配置，是可命名、可复用、可持久化的实体。
+
+---
+
+## 0. 需求原文拆解
+
+用户原始诉求逐条拆成可实现条目：
+
+| # | 原始诉求 | 拆解 |
+|---|----------|------|
+| 1 | 推荐弹窗要有「模式选择」 | 弹窗顶部加模式切换（智能推荐 / 业务链条），两种模式互斥，确认后都产出**有序**的 `SelectedAgent[]` |
+| 2 | 「智能推荐」就是现在这个 | 现有 `RecommendAgentsDialog` 整体收进「智能推荐」模式，行为不变 |
+| 3 | 「业务链条选择」是卡片列表 | 卡片 = 标题 + 一排智能体名 tag；tag 不同颜色；tag 之间有**向左箭头**连接，表达链条次序 |
+| 4 | 业务链条需要一个**配置页面** | 左侧智能体列表（复用 `GET /api/agents`），右侧有序长条卡片（名称 + 描述）；支持右侧内部拖拽排序、左→右拖入指定位置 |
+| 5 | 配置页用弹窗还是新页面？ | **本文档决策：独立路由页面**（理由见 §2.1） |
+| 6 | 选定链条后，Step 2 用链条内智能体研讨 | 复用既有 Step 2 init/stream；**总控（leader）按链条顺序逐个派活**（§6） |
+| 7 | 规划成分步可实现的需求文档 | 见 §7 分阶段实现 |
+
+---
+
+## 1. 目标与非目标
+
+### 1.1 目标
+- 推荐弹窗成为「**席位来源选择器**」：无论智能推荐还是业务链条，最终都向 `onConfirm` 交付一个**有序的 `{ agent_id, name }[]`** + 一个 `orchestrationMode`。
+- 业务链条是**用户可创建、命名、保存、复用、删除**的有序智能体编排模板。
+- Step 2 支持两种编排：
+  - `recommend` 模式 → 现有总控**自由派活**循环（不动）。
+  - `chain` 模式 → 总控仍是派活方，但**被约束按链条顺序逐个派活**（新增）。
+
+### 1.2 非目标（本期不做，留扩展点）
+- 链条内每个席位的 per-seat prompt/temperature 真实覆盖（仍仅前端记录，沿用现状）。
+- 链条的分支 / 条件流转（只做线性顺序链）。
+- 链条跨用户共享 / 市场（先做「本人私有链条」）。
+- 链条版本管理 / 协作编辑。
+
+---
+
+## 2. 关键设计决策
+
+### 2.1 决策 A：配置页面用「独立路由页面」而非弹窗 ✅
+
+**结论：业务链条的「编辑/管理」用独立路由页面 `/page/workspace/roundtable/chains`；业务链条的「选择」仍内嵌在推荐弹窗里（卡片列表）。**
+
+理由：
+
+| 维度 | 弹窗 | 独立页面 ✅ |
+|------|------|------------|
+| 双栏 + 拖拽 + 长条卡片 | 弹窗宽度（`sm:max-w-3xl`）+ `max-h-[85vh]` 拖拽空间局促，左右栏挤 | 整屏宽度，拖拽手感好 |
+| 复用入口 | 只能从推荐弹窗进 | 可从侧栏、推荐弹窗「管理链条」按钮、深链接进入 |
+| 可深链接/刷新 | 不可 | `/roundtable/chains` 可直达、可分享 |
+| 推荐弹窗内嵌编辑器 | 弹窗套弹窗 / 模式套编辑，状态复杂 | 关注点分离：弹窗只「选」，页面只「编」 |
+
+**分工**：
+- **推荐弹窗**：模式选择 + 业务链条**选择**（只读卡片列表，可点「去配置」跳到页面）。
+- **配置页面**：业务链条的**增删改**（双栏拖拽编辑器 + 链条列表管理）。
+
+> 备选：若产品坚持不加路由，可改为**全屏 Dialog（`max-w-[90vw] h-[90vh]`）**承载编辑器，从推荐弹窗内打开。结构与页面版一致，仅外壳不同。本文档按「独立页面」实现，§7 标注了切换成本。
+
+### 2.2 决策 B：链条持久化 —— 后端 MySQL（确定） ✅
+
+**结论：业务链条存后端 MySQL，仿 `roundtable_drafts`（§7A）新建 `roundtable_chains` 表 + `/api/roundtable-chains` 路由，按登录用户隔离、跨设备保留。** 不走 localStorage。
+
+理由：链条是可复用、需跨设备/会话保留的模板，与草稿/推荐历史性质一致；草稿当年正是因 localStorage 换设备即丢才迁后端（§7A），链条不重复踩坑。
+
+落地：
+- 表/路由设计见 §5.2，是「复制 §7A 草稿持久化、把字段换成 chain」的机械工作。
+- 前端 `api/chains.ts` 直接打后端接口（snake_case↔camelCase 在这层收口，仿 `api/drafts.ts`），**不提供 localStorage 实现**。
+- 后端表必须先于前端 UI 落地（§7 阶段 0 即包含后端表/路由）。
+
+### 2.3 决策 C：拖拽库选型 —— `@dnd-kit`
+
+仓库**当前无任何拖拽库**（`package.json` 无 `@dnd-kit` / `react-dnd` / `sortablejs`；`@xyflow/react` 是节点图，不适合列表排序）。
+
+| 方案 | 取舍 |
+|------|------|
+| **`@dnd-kit/core` + `@dnd-kit/sortable`**（推荐） | React 19 友好、可访问性好、跨容器拖入 + 列表排序 + 插入指示器开箱即用；新增 ~30KB gzip 依赖 |
+| 原生 HTML5 DnD（零依赖兜底） | 不加依赖，但跨容器插入位置指示、键盘可达性都要手写，易出 bug |
+
+**建议**：新增 `@dnd-kit/core`、`@dnd-kit/sortable`、`@dnd-kit/utilities`。若产品方禁止新增依赖，退回原生 HTML5 DnD（§7 阶段 2 标注差异）。
+
+### 2.4 决策 D：Step 2「总控按链条顺序派活」，后端零改动 ✅
+
+**形态：总控（leader）仍是唯一派活方，但每一轮被前端约束「只能派给链条里的下一个席位」，逐个走完整条链，最后由总控收口。** 区别于 recommend 模式的「总控自由决定派给谁」。
+
+为什么后端无需改动：
+- Step 2 后端 `streamMultiAgent({ agentType: "leader" })` 每轮返回 `dispatched = [[agent, task], ...]`；`agentType: "special"` 单独驱动某席位跑一轮。这两个原语已足够。
+- 每个 special 跑完，后端 `_broadcast` 会把「子智能体 X 完成…交付内容为:…」append 进**其它所有席位 + 总控 thread** 的历史（后端 §6.4），所以链路上下文天然累积。
+- chain 模式只是**改变前端怎么提示 leader、以及怎么校验它的派活**——把每轮 leader 的提示词约束成「请向链条第 i 位【X】派活」，并对返回的 `dispatched` 做「必须命中链条下一席位」的校验/纠偏。**后端路由、SOUL、表结构都不动。**
+
+→ chain 模式 = 在 `useStep2Orchestration` 里新增 `runChainOrchestration`：按链条游标逐位调 leader（约束派给该位）→ 拿到 task → 调 special → 下一位 → 链尾后调一次 leader 收口。详见 §6。
+
+> 与「前端绕过 leader 直接顺序 special」的区别：本方案**保留总控在每一步的协调/串接职责**（leader 结合前序进展为下一席位编写针对性任务、并在派活说明里承上启下），更符合「总控按链条顺序派活」的语义，圆桌可视化里总控气泡也照常出现。
+
+---
+
+## 3. 数据模型与类型
+
+新增前端类型，建议放 `frontend-web/src/roundtable-planning/lib/business-chain.ts`：
+
+```ts
+/** 业务链条里的一个有序席位。 */
+export interface ChainSeat {
+  agent_id: string;
+  /** 落库时的快照名/描述，避免 agent 改名后链条显示错乱；展示优先用实时 agent 数据，回退到快照。 */
+  name: string;
+  description?: string;
+}
+
+/** 一条可复用的业务链条。 */
+export interface BusinessChain {
+  id: string;
+  title: string;
+  description?: string;
+  /** 有序席位列表；seats[0] 是第一个发言者。 */
+  seats: ChainSeat[];
+  createdAt?: string;
+  updatedAt?: string;
+}
+
+/** 推荐弹窗确认后回传给主页面的统一结果。 */
+export interface SeatSelectionResult {
+  /** 有序席位（与现有 handleConfirmAgents 入参兼容）。 */
+  agents: Array<{ agent_id: string; name: string }>;
+  /** 决定 Step 2 走哪种编排。 */
+  mode: "recommend" | "chain";
+  /** chain 模式下带上来源链条（用于草稿快照 / Step 2 展示链名）。 */
+  chain?: Pick<BusinessChain, "id" | "title">;
+}
+```
+
+**约束**：链条席位数沿用圆桌的 `2 ≤ N ≤ 8`（`MIN_SELECTED`/`MAX_SELECTED`），配置页保存时校验。
+
+**tag 配色**：复用 `roundtable-constants.ts::getAvatarTypeFor(agentId, index)`，得到 `blue|purple|emerald|amber|pink|human`，再映射到已有的 avatar 配色 token（与圆桌可视化、Step 2 气泡同一套色板，视觉统一）。
+
+---
+
+## 4. 现有代码改动点速查
+
+| 位置 | 改动 | 说明 |
+|------|------|------|
+| `components/RecommendAgentsDialog.tsx` | 包一层「模式选择」外壳，现有内容收进「智能推荐」Tab | `onConfirm` 签名从 `agents[]` 升级为 `SeatSelectionResult`（或加可选第二参 `mode`，见 §7 阶段 3 的兼容策略） |
+| `pages/RoundtablePlanningPage.tsx` | `handleConfirmAgents` 接收 `mode`，存到新状态 `orchestrationMode` | 透传给 `useStep2Orchestration` |
+| `hooks/useStep2Orchestration.ts` | 新增 `runChainOrchestration` + `orchestrationMode` 分支 | init effect 里按 mode 选择 `runOrchestration` 或 `runChainOrchestration` |
+| `lib/roundtable-constants.ts` | 复用 `getAvatarTypeFor` / `SelectedAgent` | 不改，仅引用 |
+| `hooks/useDraftPersistence.ts` + `api/drafts.ts` | Step2 快照新增 `orchestrationMode` + `chain` 字段 | 草稿能记住「这次是链条模式」 |
+| `pages/WorkspaceRoutes.tsx` | 注册 `roundtable/chains` 路由 | 仿 `roundtable/planning` |
+| `components/page-sidebar.tsx`（如有侧栏入口） | 加「业务链条」入口（可选） | 也可只从推荐弹窗进 |
+| `api/chains.ts`（新增） | 链条 CRUD 客户端 | 直接打后端 `/api/roundtable-chains` |
+| 后端 `roundtable_chains` | 表 + 路由（MySQL） | 仿 `roundtable_drafts`，**必做** |
+
+---
+
+## 5. 链条持久化 API 设计
+
+### 5.1 前端客户端 `api/chains.ts`（直接打后端）
+
+```ts
+listChains(): Promise<BusinessChain[]>          // 当前用户全部链条
+getChain(id: string): Promise<BusinessChain>
+createChain(input: Omit<BusinessChain,"id"|"createdAt"|"updatedAt">): Promise<BusinessChain>
+updateChain(id: string, patch: Partial<BusinessChain>): Promise<BusinessChain>
+deleteChain(id: string): Promise<void>
+```
+
+- 实现用 `apiFetch` 打 `/api/roundtable-chains`（§5.2），snake_case↔camelCase 在这层收口（仿 `api/drafts.ts`）。
+- 不提供 localStorage 实现；后端表是前端 UI 的硬依赖。
+
+### 5.2 后端表 + 路由（仿 §7A `roundtable_drafts`）
+
+- 表 `roundtable_chains`：`id`(PK) / `user_id`(idx) / `title`(512) / `description`(text) / `seats`(`PortableLongText`，存 `ChainSeat[]` JSON) / `created_at` / `updated_at`(`BeijingDateTime`)。
+- 路由 `app/gateway/routers/roundtable_chains.py`，前缀 `/api/roundtable-chains`：`GET ``（列表）/ `POST ``（建）/ `GET /{id}` / `PUT /{id}`（partial，`exclude_unset`）/ `DELETE /{id}`。
+- 鉴权/属主：`_current_user_id(request)`，跨用户访问一律 404，与 `roundtable_drafts` 完全一致。
+- 启动 `Base.metadata.create_all` 自动建表（MySQL 生产 / sqlite 本地走同一套 SQLAlchemy 代码，`PortableLongText` 各自降级），登记进 `persistence/models/__init__.py`，store 接到 `app.state` 并 `include_router`。
+
+> 整体是「复制 §7A 的草稿持久化、把字段换成 chain」的机械工作，风险低。
+
+---
+
+## 6. Step 2 链条模式编排设计（`runChainOrchestration`）
+
+### 6.1 与现有 `runOrchestration` 的差异
+
+| 维度 | `runOrchestration`（recommend） | `runChainOrchestration`（chain，新增） |
+|------|--------------------------------|----------------------------------------|
+| 谁派活 | 总控 leader | 总控 leader（**不变**） |
+| 派给谁由谁定 | leader 自由决定 | 前端按链条游标**约束 leader 只能派给下一席位** |
+| 发言顺序 | leader 每轮自由派 | **链条数组的固定顺序** |
+| 循环结构 | `while` 直到 leader 返回 `[]` 共识 / MAX_CYCLES | 按链条游标走一趟（每位：leader 派活 → special 交付） |
+| 收口 | leader 返回 `[]` 即共识 | 链尾后再调一次 leader 做总结收口，产出 `lastLeaderContent` + `hasConsensus` |
+
+> **核心**：leader 始终在场，只是**每轮的派活目标被前端钉死成链条的下一席位**——前端在 leader 的 `newMessage` 里写明「本轮请通过 `agent_orchestration` 仅向【X】派活」，并对 `leaderRes.dispatched` 做命中校验/纠偏。
+
+### 6.2 伪代码
+
+```
+runChainOrchestration(seedMessage, ids, coord, chainSeats):
+  isOrchestrating = true
+  cancel = false
+  N = chainSeats.length
+
+  for (let i = 0; i < N; i++):           // 链条游标，逐位推进
+    if cancel: break
+    seat = chainSeats[i]
+    seatMeta = agentNameToRole[seat.agent_id]
+
+    // ── (a) 总控派活给「链条下一席位」──────────────────────────
+    highlightSpeaker(null)               // leader 阶段不高亮任何 sub
+    leaderBubble = appendStreamingDialogue("总控协调", confidence:"链条派活中")
+    leaderTask = buildChainLeaderTask({
+      seedMessage,                       // 任务目标/约束（首轮）
+      position: i, total: N,
+      nextSeat: seat,                    // 「本轮请仅向【X(seat.agent_id)】派活」
+      isFirst: i === 0,
+    })
+    leaderRes = await streamMultiAgent(leader, ids, coord, leaderTask, model=globalModel)
+
+    // 约束/纠偏：取 dispatched 中命中 seat.agent_id 的那条 task；
+    // 若 leader 没派或派错（派给非 seat、或派给多个），前端兜底：
+    //   - 命中就用它给出的 task 文本（保留总控的承上启下措辞）；
+    //   - 没命中则用 leader 的正文 content 作为兜底 task，或回退到模板 task。
+    task = pickChainTask(leaderRes, seat) 
+    // leader 若返回 clarification → 暂停链条，走与现状一致的澄清条（§6.3）
+    finalizeDialogue(leaderBubble, leaderRes.content, "派活说明")
+
+    // ── (b) 被派席位交付（special，顺序、不并行）──────────────────
+    markSpeakerStreaming(seatMeta.speakerId)
+    seatBubble = appendStreamingDialogue(seatMeta.displayName, confidence:"调度中")
+    perSeatModel = agentConfigs[seatMeta.speakerId]?.model || globalModel
+    specRes = await streamMultiAgent(special, ids, seat.agent_id, task, model=perSeatModel)
+    finalizeDialogue(seatBubble, specRes.content, "子智能体交付")
+    markSpeakerIdle(seatMeta.speakerId)
+    // 后端 _broadcast 已把本席位交付注入其余 thread 历史 → 下一席位天然可见
+
+  if cancel: return
+
+  // ── (c) 总控收口：综合全链交付，产出最终结论 ──────────────────
+  leaderBubble = appendStreamingDialogue("总控协调", confidence:"汇总链条结论")
+  leaderRes = await streamMultiAgent(leader, ids, coord,
+                "各链条席位已按顺序完成发言，请综合所有交付，输出最终方案，不要再派活。")
+  finalizeDialogue(leaderBubble, leaderRes.content, "全案盖印")
+  setLastLeaderContent(leaderRes.content)
+  setHasConsensus(true); setConsensusPercentage(100)
+  isOrchestrating = false
+```
+
+要点：
+- **派活方仍是总控**，符合「总控按链条顺序派活」的语义；圆桌可视化里每位席位前都先出现一个总控派活气泡，再出现该席位交付气泡。
+- **约束手段是 prompt + 前端校验，不动后端**：`buildChainLeaderTask` 把「本轮只能派给【X】」写进 leader 的 `newMessage`；`pickChainTask` 对 `leaderRes.dispatched` 做命中校验，派错/未派时兜底，保证链条游标严格推进。
+- **复用现有三段式气泡 / 高亮 / abort 基建**（`appendStreamingDialogue` / `finalizeDialogue` / `markSpeakerStreaming` / `activeAbortersRef` / `orchestrationCancelRef`），只是驱动顺序不同。
+- **special 仍是顺序**（不并行），与现状不变量一致（文件顶部注释 §1）。
+- **收口 leader 调用默认开**（产出 Step 3 结论）；若链条末位本身是「总结陈述」类，可关掉收口，直接拿末位交付当 `lastLeaderContent`。配置位 `chainNeedsLeaderSummary`（默认 true）。
+
+### 6.3 澄清 / 挂起 / 恢复 / 干预
+- **澄清**：链条中途某轮 leader 返回 `clarification` → 与现状一致，暂停链条、底部弹澄清条；用户回答后从**当前游标**继续（需记录 `chainCursor`）。
+- **挂起/恢复**：`isRoundTableRunning` toggle 复用现有机制；恢复时从 `chainCursor` 续跑。MVP 若不做断点续跑，可先只支持「整体停止 / 从头重跑」，UI 文案说明（扩展点，§7 阶段 4 标注）。
+- **干预**：可在两席位之间插入一条用户指令，由下一轮 leader 派活前消化。MVP 同上可后置。
+
+### 6.4 多轮链条（扩展点，非 MVP）
+单趟遍历是 MVP。若要「链条跑完后总控判断是否再来一轮」，可在收口 leader 处复用 `dispatched===[]?` 判定：收口 leader 若仍派活则回到链条头再跑一轮，直到共识或 MAX_CYCLES。MVP 不做，避免复杂度。
+
+### 6.5 init 复用
+chain 模式的 Step 2 init **完全复用** `initMultiAgent`：`agentNames = chainSeats.map(s => s.agent_id)`（**按链条顺序**传入，使 `buildRoleTemplates` 的 seat id 顺序 = 链条顺序，且后端注入 coordinator 的「可调度席位清单」也按此序）。init effect 里按 `orchestrationMode` 决定 init 完成后调 `runOrchestration` 还是 `runChainOrchestration`。
+
+---
+
+## 7. 分阶段实现计划
+
+> 每阶段都可独立交付、独立验收。建议顺序：**数据层 → 配置页 → 弹窗模式 → 链条选择 → Step2 编排 → 持久化兼容与收尾**。
+
+### 阶段 0 · 后端链条表 + 脚手架（1.5 天） ✅ 已完成
+**目标**：打地基（含后端持久化），不含前端 UI。
+- [x] **后端**：仿 §7A `roundtable_drafts` 新建 `roundtable_chains` 表 + `/api/roundtable-chains` 路由（§5.2）：
+  - [x] `persistence/roundtable_chains/`（model + sql repo + `make_roundtable_chain_store`），登记进 `persistence/models/__init__.py`。
+  - [x] `app/gateway/routers/roundtable_chains.py`（GET 列表 / POST / GET{id} / PUT{id} / DELETE），鉴权属主同 `roundtable_drafts`；席位 2–8 + 去重校验。
+  - [x] `deps.py` 接 `app.state.roundtable_chain_store`，`app.py` `include_router`。
+  - [x] 后端测试 `tests/test_roundtable_chains.py`：CRUD + 部分更新 + 跨用户隔离（5 用例全过）。
+- [x] **前端**：新增 `lib/business-chain.ts`（`ChainSeat` / `BusinessChain` / `SeatSelectionResult`，§3）+ `api/chains.ts`（直接打后端，§5.1）。
+- [x] （决策 C）安装 `@dnd-kit/core` `@dnd-kit/sortable` `@dnd-kit/utilities`。
+- **验收**：✅ 后端 5 用例通过；✅ 表注册进 `Base.metadata`、路由 `/api/roundtable-chains` 加载正常；✅ ruff 0 错；✅ 前端 typecheck 新增文件 0 错。
+
+### 阶段 1 · 业务链条配置页面（2–3 天） ✅ 已完成
+**目标**：能创建/编辑/保存/删除链条。
+- [x] 路由：`WorkspaceRoutes.tsx` 注册 `roundtable/chains`（套 `WorkspaceLayout`；本页**不需要** `ChatRuntime`，无沙箱依赖）。
+- [x] 页面 `roundtable-planning/pages/BusinessChainEditorPage.tsx`：
+  - [x] 顶部：链条列表下拉（`<select>` 列出已存链条 + 新建项）/ 新建按钮 / 标题+描述输入 / 保存 / 删除（`window.confirm`）。
+  - [x] **左栏**：候选智能体（`listAgents()` + `filterRecommendCandidates`），竖排卡片，可拖、可点「＋」快捷加入；已加入的置灰「已加入」。
+  - [x] **右栏**：有序长条卡片（序号 tag + 名称 + 描述 + 移除），`SortableContext` 内拖拽排序；空态有占位提示。
+  - [x] 拖拽用 `@dnd-kit`：左栏 `useDraggable`，右栏 `useDroppable` + `SortableContext`/`useSortable`，`onDragEnd` 计算插入 index（pool→右栏按落点插入；seat→seat `arrayMove`）；`DragOverlay` 跟手卡片。
+  - [x] 校验：`2 ≤ seats ≤ 8`（前端禁用保存 + toast，后端 `_validate_seats` 兜底），重复 agent 去重提示。
+- [x] 保存走 `api/chains.ts`（create 用 `nanoid()` 客户端 id，update 走同一 id）。
+- **验收**：✅ typecheck 0 新增错误（76 个预存量错误均在无关模块）。**人工验收待跑**：新建「情报→方案→风险→总结」链保存 → 刷新后下拉重载 → 右栏拖拽排序 → 左栏拖入指定位 → 2–8 边界禁用保存。
+- **切换成本备注**：若改全屏 Dialog 方案，编辑器组件原样复用，仅去掉路由、外面套 `Dialog`。
+- **入口说明**：圆桌本身未在侧栏（`sidebar-menu.ts` 入口被注释），本页暂经直链 `/page/workspace/roundtable/chains` 或顶栏「返回圆桌」往返；阶段 3 推荐弹窗「去配置」按钮会导航到此。
+- **视觉（后续重画）**：本页**不**套圆桌 `roundtable-planning` scope，直接遵循《浅红色/深蓝色 UI 规范》——用 app 语义 token（光 `--primary` 红 hue27 / 暗 蓝 hue259，已内置自适应）+ 规范小圆角（输入/按钮/tag/卡片内项 2px = `R_CTRL`，分栏/面板 4px = `R_CARD`）+ 克制阴影（`PANEL_SHADOW`）。筛选框复用通用 `TagSearchBar`，配色随 app 中性 token，不再被红 scope 染色。
+
+### 阶段 2 · 推荐弹窗「模式选择」外壳（1 天） ✅ 已完成
+**目标**：弹窗顶部模式切换，智能推荐行为不变。
+- [x] `RecommendAgentsDialog` 顶部加**分段按钮**模式切换：`智能推荐 | 业务链条`（active 态品牌色 + 卡底；DialogDescription 随模式切换文案）。
+- [x] 现有全部内容原样收进「智能推荐」面板（`{mode === "recommend" && (<>…</>)}` 包裹，**零行为变更**）。
+- [x] 「业务链条」面板放占位：居中提示 + 「去配置业务链条」按钮（`handleGoConfig` → 关弹窗 + 跳 `roundtable/chains`）。
+- [x] `onConfirm` 统一升级为回传 `SeatSelectionResult`（含 `mode`）：智能推荐确认回传 `{ agents, mode: "recommend" }`；主页面 `handleConfirmAgents` 同步改签名取 `result.agents`（`result.mode` 预留给阶段 4）。
+- **验收**：✅ typecheck 0 新增错误（总数仍 76）；智能推荐分支 JSX/逻辑原样保留（流式/勾选/进入研讨未改）；模式切换只切显示、`state`/`selectedIds` 不卸载 → 候选池不丢。**人工验收待跑**：切到业务链条→再切回，推荐结果与勾选仍在。
+
+### 阶段 3 · 业务链条选择卡片列表（1.5 天） ✅ 已完成
+**目标**：弹窗「业务链条」面板里选链条。新增 `components/BusinessChainPicker.tsx`，替换阶段 2 的占位。
+- [x] 进入该 Tab 时 `listChains()` 拉本人链条 + `listAgents()` 取存活 id/名称，渲染**卡片列表**：
+  - [x] 卡片标题（链条 title）+ 「N 席」徽章 + 选中 ✓；描述行。
+  - [x] 标题下一排**智能体名 tag**：按链条顺序**从左到右**、不同颜色（`getAvatarTypeFor`→`chainTagClasses`），tag 之间插 `→`（`ArrowRightIcon`）箭头连接（`seats[0]` 最左、先发言）。
+  - [x] 底部「配置链条」按钮（跳 `roundtable/chains`）。
+- [x] 空态：无链条时引导「去配置页面创建第一条业务链条」+ 按钮。
+- [x] 选中一条 → 高亮（`ring-primary`）；底部「进入研讨」`onConfirm({ agents: 存活席位有序, mode:"chain", chain:{id,title} })`。
+- [x] 链条里有 agent 已不存在（被删）→ 该 tag 置灰删除线 + `title` 提示 + 卡片下方 amber 警告；confirm 按**存活席位**过滤；存活 < `CHAIN_MIN_SEATS` 则禁用「进入研讨」并提示。agent 列表加载失败时 `existingIds=null` → 不误判删除。
+- **验收**：✅ typecheck 0 新增错误（总数仍 76）。卡片渲染标题 + 彩色 tag + ← 箭头；选链 → `onConfirm(mode:"chain")` → `handleConfirmAgents` 按链条顺序 `setSelectedAgents` → Step 2 左侧「参与角色」顺序 = 链条顺序（**按顺序派活在阶段 4**）。**人工 UI 验收待跑**。
+- **箭头方向**（已确认）：tag 左→右排列、`→`（`ArrowRightIcon`）连接，`seats[0]` 最左、先发言，箭头顺读即链条研讨顺序。
+
+### 阶段 4 · Step 2 链条顺序编排（2–3 天） ✅ 已完成
+**目标**：chain 模式按链顺序逐席发言。**后端零改动。**
+- [x] 主页面新增 `orchestrationMode` 状态，`handleConfirmAgents` 从 `SeatSelectionResult.mode` 写入（chain 模式 toast 带链名）；`handleStartNewTask` 复位为 `recommend`；透传给 `useStep2Orchestration`。chain 顺序 = `selectedAgents`（确认时已按链条顺序写入），无需单独 `chainSeats`。
+- [x] `useStep2Orchestration` 新增 `runChainOrchestration`（§6.2）+ `orchestrationModeRef`/`selectedAgentsRef`；复用现有三段式气泡/高亮/abort 基建。
+- [x] 新增 `runActiveOrchestration` 分发器：init / 恢复 / 干预 / 澄清回复 4 处调用点统一改走它，按 `orchestrationModeRef` 选 `runOrchestration`（recommend）或 `runChainOrchestration`（chain）。
+- [x] `runChainOrchestration`：按 `selectedAgents` 游标，每位先 leader 约束派活（`buildChainLeaderTask` 钉死目标席位 + `pickChainTask` 命中校验/纠偏，派错/未派都兜底推进）→ 再对**该席位**跑 special；中途 leader 若 `clarification` 则暂停（MVP 回复后整链重跑）。
+- [x] `initMultiAgent` 的 `agentNames` 即 `roundtableAgentIds`（由 `selectedAgents` 派生，已是链条顺序，§6.5）。
+- [x] 收口 leader（`finishedAllSeats` 时触发），产出 `lastLeaderContent` + `hasConsensus=true` + `consensusPercentage=100` 解锁 Step 3。
+- **验收**：✅ typecheck 0 新增错误（总数仍 76）；✅ 唯一直接引用 `runOrchestration` 的是 dispatcher。逻辑层：每席「总控派活气泡 → 席位交付气泡」、严格顺序、单 special 在跑、`_broadcast` 注入前序上下文、leader 纠偏推进、跑完解锁 Step 3、abort 可中断。**人工 UI 验收待跑**。
+- **MVP 边界**：chain 模式的「挂起→断点续跑」「逐席间干预」未做断点续跑，`clarification`/恢复/干预当前为**整链重跑**（`chainCursor` 列为扩展点）。
+
+### 阶段 5 · 草稿持久化兼容 + 收尾（1 天） ✅ 已完成
+**目标**：草稿记住模式，回归不破。
+- [x] `Step2Snapshot`（`useStep2Orchestration.ts`）+ `DraftStep2Snapshot`（`api/drafts.ts`）新增 `orchestrationMode?: "recommend"|"chain"` 与 `chain?: {id,title}|null`。
+- [x] 恢复路径：`orchestrationMode`/`chainMeta` 是**主页面 state**，`getStep2Snapshot` 写入；**包裹版 `hydrateStep2`** 在加载时 `setOrchestrationMode(snapshot.orchestrationMode ?? "recommend")` + `setChainMeta(snapshot.chain ?? null)` 再调 `step2.hydrateFromDraft`；老草稿无字段 → 默认 `recommend`（向后兼容）。`handleStartNewTask` 复位两者。
+- [x] 文档回写：`multi-agent-frontend-dev.md` §5.7（快照形状 + `orchestrationMode/chain` 说明）、§6.2（席位来源选择器导语）；`multi-agent-backend-dev.md` 新增 §7B（`roundtable_chains` 表/路由）。
+- **验收**：✅ `pnpm typecheck` 0 新增错误（总数仍 76）。逻辑：chain 会话保存草稿 → 重载 `orchestrationMode="chain"` + 链信息恢复；老草稿（无字段）默认 recommend 照常加载。**人工 UI 验收 + `pnpm build` 待跑**。
+
+### 工期粗估
+| 阶段 | 估时 |
+|------|------|
+| 0 后端链条表 + 脚手架 | 1.5d |
+| 1 配置页 | 2–3d |
+| 2 弹窗模式壳 | 1d |
+| 3 链条选择卡片 | 1.5d |
+| 4 Step2 链编排 | 2–3d |
+| 5 持久化兼容收尾 | 1d |
+| **合计** | **约 9–11 人日**（含后端 `roundtable_chains` 表/路由） |
+
+---
+
+## 8. 验收清单（端到端）
+
+1. 推荐弹窗顶部有「智能推荐 / 业务链条」切换；智能推荐与现状逐像素一致。
+2. 配置页 `/page/workspace/roundtable/chains` 左栏列出智能体、右栏有序长条卡片；左→右拖入指定位、右栏内拖拽排序均生效；2–8 校验生效；保存/重载/删除正常。
+3. 业务链条卡片：标题 + 彩色智能体 tag + ← 箭头连接，渲染正确。
+4. 选定链条 → Step 2 席位顺序 = 链条顺序，并**按顺序逐个发言**，后序能看到前序交付。
+5. chain 跑完解锁 Step 3；草稿记住 chain 模式并可重载。
+6. 删除链条中引用的 agent 后，选择端有降级提示，不崩。
+
+---
+
+## 9. 风险与开放问题
+
+| # | 项 | 说明 / 建议 |
+|---|----|-------------|
+| 1 | 配置页：弹窗 vs 页面 | 本文档定为**独立页面**（§2.1）。若产品要弹窗，编辑器组件可复用，仅换外壳。**请确认。** |
+| 2 | 链条持久化 | **已定：后端 MySQL `roundtable_chains`**（§2.2 / §5.2），仿草稿持久化。 |
+| 3 | Step 2 链编排 | **已定：总控按链条顺序派活**（§2.4 / §6），后端零改动。 |
+| 4 | 新增 `@dnd-kit` 依赖 | 若禁止新增依赖，退原生 HTML5 DnD（手感与可达性下降）。**请确认。** |
+| 5 | ← 箭头方向 / tag 阅读顺序 | 默认 `seats[0]` 在最左、先发言；箭头仅作视觉连接。**请确认是否要「从右往左读」。** |
+| 6 | chain 模式是否需要收口 leader 总结 | 默认需要（产出 Step 3 结论）。若末位席位自带总结可关掉。 |
+| 7 | leader 派活纠偏策略 | leader 派错/未派时前端兜底推进游标（§6.2 `pickChainTask`）；可加 toast 提示「已按链条强制推进」。 |
+| 8 | chain 模式断点续跑 / 逐席干预 | MVP 不做，列为扩展点（§6.3 / §7 阶段 4）。 |
+| 9 | 链条是否私有 | 本期仅本人私有（仿草稿按 `user_id` 隔离）。共享/市场留扩展。 |
+
+---
+
+## 10. 路径速查（新增/改动）
+
+| 资源 | 路径 | 状态 |
+|------|------|------|
+| 链条类型 | `frontend-web/src/roundtable-planning/lib/business-chain.ts` | 新增 |
+| 链条 API 客户端 | `frontend-web/src/roundtable-planning/api/chains.ts` | 新增 |
+| 配置页 | `frontend-web/src/roundtable-planning/pages/BusinessChainEditorPage.tsx` | 新增 |
+| 链条选择面板 | `frontend-web/src/roundtable-planning/components/BusinessChainPicker.tsx` | 新增 |
+| 链条卡片 | `frontend-web/src/roundtable-planning/components/BusinessChainCard.tsx` | 新增 |
+| 推荐弹窗（加模式壳） | `frontend-web/src/roundtable-planning/components/RecommendAgentsDialog.tsx` | 改 |
+| 主页面（mode 透传） | `frontend-web/src/roundtable-planning/pages/RoundtablePlanningPage.tsx` | 改 |
+| Step2 编排（加 chain） | `frontend-web/src/roundtable-planning/hooks/useStep2Orchestration.ts` | 改 |
+| 草稿快照（加 mode） | `hooks/useDraftPersistence.ts` + `api/drafts.ts` | 改 |
+| 路由注册 | `frontend-web/src/pages/WorkspaceRoutes.tsx` | 改 |
+| 后端链条持久化 | `offline-backend-20260512/backend/packages/harness/deerflow/persistence/roundtable_chains/` | 新增 |
+| 后端链条路由 | `offline-backend-20260512/backend/app/gateway/routers/roundtable_chains.py` | 新增 |
+| 后端 store 接线 | `offline-backend-20260512/backend/app/gateway/deps.py`（`app.state.roundtable_chain_store`）+ `app.py` | 改 |
+</content>
+</invoke>

frontend-web/docs/multi-agent-frontend-dev.md

@@ -439,8 +439,9 @@ isOrchestrating = false
 > **重大变更**：草稿从浏览器 `localStorage` 迁到**后端 MySQL**，按登录用户隔离、跨设备/会话保留。旧 `utils/drafts.ts` 已删除；`useDraftPersistence` 仍保持对外接口不变（列表项含 `name`，由后端 `title` 映射而来），主页面无需改动。后端表/路由见 backend doc「圆桌草稿持久化」。
 
 - **API 客户端 `api/drafts.ts`**：`listDrafts()`（轻量元数据）/ `getDraft(id)`（全量 step1+step2）/ `createDraft` / `updateDraft`（partial）/ `deleteDraft` / `deriveDraftName`。snake_case↔camelCase 映射在这一层收口（后端 `furthest_step/created_at/updated_at` ↔ 前端 `furthestStep/...`）。
-- **快照形状**：`DraftStep1Snapshot.{intentThreadId, intentReady, interactiveMessages, timelineEntries}`、`DraftStep2Snapshot.{selectedAgents, threadIds, coordinatorName, step2RoundtableDialogues, lastLeaderContent, hasConsensus, consensusPercentage, budgetLimit, seatStubMessages}`；以 JSON 整存进后端 `step1`/`step2`（`PortableLongText`/LONGTEXT，避免大对话超 64KB）。
+- **快照形状**：`DraftStep1Snapshot.{intentThreadId, intentReady, interactiveMessages, timelineEntries}`、`DraftStep2Snapshot.{selectedAgents, threadIds, coordinatorName, step2RoundtableDialogues, lastLeaderContent, hasConsensus, consensusPercentage, budgetLimit, seatStubMessages, orchestrationMode?, chain?}`；以 JSON 整存进后端 `step1`/`step2`（`PortableLongText`/LONGTEXT，避免大对话超 64KB）。
   - **`selectedAgents`（2026-06 修复）**：本次研讨实际选中的席位。**不存的话加载草稿后 Step 2/3 左侧「参与角色」会回退到 `DEFAULT_SELECTED_AGENTS`（默认 6 个）而非当时真正选的那几个** —— `roleTemplates`/`agentNameToRole` 都由 `selectedAgents` 派生。`useStep2Orchestration.hydrateFromDraft` 在该字段非空时 `setSelectedAgents`，老草稿（无此字段）保持当前值不强行覆盖。
+  - **`orchestrationMode?` / `chain?`（2026-06 业务链条）**：Step 2 编排模式（`recommend`=总控自由派活 / `chain`=按业务链条顺序派活）+ 来源链条 `{id,title}`。是**主页面 state**，由页面在 `getStep2Snapshot` 写入、在**包裹版 `hydrateStep2`** 里读出后 `setOrchestrationMode`/`setChainMeta`（step2 hook 的 `hydrateFromDraft` 不直接消费）。老草稿无字段 → 默认 `recommend`。业务链条完整设计见 `multi-agent-business-chain-dev.md`。
 - `deriveDraftName({intentReady, interactiveMessages})`：优先 `intentReady.objective`，否则第一个 user 消息，否则 `未命名草稿 <时间>`，截断 40 字。**仅在 create 时写一次**（见下方 bug 修复）。
 - **列表加载**：挂载时 `useEffect` 调 `listDrafts()`；增删改后 `refreshList()` 重拉。
 - **自动保存策略**：仅在「前进」步骤切换时保存（1→2、2→3），后退不触发。
@@ -481,6 +482,8 @@ isOrchestrating = false
 
 ### 6.2 `RecommendAgentsDialog`
 
+> **席位来源选择器（2026-06 业务链条）**：弹窗顶部加了**模式分段切换** `智能推荐 | 业务链条`。智能推荐 = 本节描述的现状（零行为变更，整体收进 `{mode==="recommend"}` 分支）；业务链条 = `BusinessChainPicker`（选一条已配置链条，卡片标题 + 彩色席位 tag + `→` 箭头）。`onConfirm` 统一回传 `SeatSelectionResult{ agents, mode, chain? }`；`mode==="chain"` 时 Step 2 由总控**按链条顺序派活**（`useStep2Orchestration.runChainOrchestration`）。配置页与编排详见 `multi-agent-business-chain-dev.md`。
+
 - **新增 `draftId` prop（2026-06）**：本次推荐归属的草稿/会话 id。由主页面在打开弹窗前 `await drafts.ensureDraft(1)` 拿到并传入（见 §6.6）。`null` 时退化为「直接推荐、不存历史」的旧行为。
 - 打开时管线（`start(forceFresh=false)`）：`listAgents() → filterRecommendCandidates()` → **若 `draftId` 有历史 → `listRecommendHistory()` 取最近一次直接展示（不重跑模型）**；否则 `streamRecommend()` 跑新推荐。
 - 阶段 UI（`InternalState.phase`）：

frontend-web/docs/前端开发.md

@@ -49,6 +49,7 @@ frontend-web/
    │  ├─ ScheduledTaskRunDetailPage.tsx
    │  ├─ PublicSharePage.tsx        免登录分享只读
    │  ├─ PublicScheduledTaskPage.tsx
+   │  ├─ EmbedChatPage.tsx          iframe 嵌入问答（见 docs/embed-iframe-chat.md）
    │  ├─ LoginPage.tsx              用户名直登（开发/内网用）
    │  └─ ...
    ├─ core/                         「领域核心」: API 客户端、领域 hooks、类型
@@ -186,6 +187,7 @@ ReactDOM.createRoot(#root)
 /login/:username        LoginPage（按用户名直登）
 /landing                LandingPage
 /share/:shareCode       PublicSharePage（免登录只读）
+/embed/chats/:thread_id EmbedChatPage（iframe 嵌入问答，见 docs/embed-iframe-chat.md）
 /public/scheduled-tasks/:taskId   PublicScheduledTaskPage（免登录）
 /page/*                 PageRoutes（含侧边栏与 Header）
 *                       NotFoundPage
@@ -664,6 +666,7 @@ const { models, tokenUsageEnabled, isLoading } = useModels();
 
 - 创建分享：[components/workspace/thread-share-dialogs.tsx](../src/components/workspace/thread-share-dialogs.tsx) + `core/thread-shares/`
 - 只读页 `PublicSharePage`（路由 `/share/:shareCode`）/ `PublicScheduledTaskPage`（`/public/scheduled-tasks/:taskId`），不需要登录
+- iframe 嵌入问答 `EmbedChatPage`（`/embed/chats/:thread_id`）：第三方用普通 iframe 嵌套，父页面用 `sessionId` 轮询公开 API 判断问答是否结束，详见 [embed-iframe-chat.md](./embed-iframe-chat.md)
 - 后端会用 share token 做权限校验，前端通过 `apiFetch` 自动带
 
 ---
@@ -1138,6 +1141,7 @@ setSettings("context", { model_name: "gpt-5" }); // 仅当前线程
 | `/landing` | App.tsx | LandingPage.tsx |
 | `/share/:shareCode` | App.tsx | PublicSharePage.tsx |
 | `/public/scheduled-tasks/:taskId` | App.tsx | PublicScheduledTaskPage.tsx |
+| `/embed/chats/:thread_id` | App.tsx | EmbedChatPage.tsx（[embed-iframe-chat.md](./embed-iframe-chat.md)） |
 | `/page/workspace/*` | PageRoutes.tsx → WorkspaceRoutes.tsx | ChatsPage / ChatPage / AgentsPage / NewAgentPage / AgentChatPage / SkillsPage / SkillEvolutionPage / MemoryPage / ScheduledTasksPage / ScheduledTaskRunDetailPage / AdminUserHubPage / AdminScheduledTasksPage / TagsPage / RecommendedQuestionsPage / PromptPrefixSettingsPage / LlmMetricsPage |
 | `/page/strategy/*` | PageRoutes.tsx → StrategyRoutes.tsx | GeneralQA + LightApp* + 复用 Workspace 页面 |
 | `/page/canvas/*` | PageRoutes.tsx → open-canvas/routes/OpenCanvasRoutes.tsx | CanvasHomePage / CanvasThreadPage / AIWritingPage / ArticleTypesConfigPage |

frontend-web/package.json

@@ -6,6 +6,8 @@
   "scripts": {
     "dev": "vite",
     "build": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build",
+    "build:sit": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode sit",
+    "build:network": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode network",
     "preview": "vite preview",
     "typecheck": "tsc --noEmit"
   },
@@ -17,6 +19,9 @@
     "@codemirror/lang-markdown": "^6.5.0",
     "@codemirror/lang-python": "^6.2.1",
     "@codemirror/language-data": "^6.5.2",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
     "@langchain/core": "^1.1.15",
     "@langchain/langgraph-sdk": "^1.5.3",
     "@radix-ui/react-avatar": "^1.1.11",

frontend-web/src/App.tsx

@@ -2,6 +2,7 @@ import { useMemo } from "react";
 import { Navigate, Route, Routes } from "react-router-dom";
 import { ThemeProvider as NextThemesProvider } from "next-themes";
 
+import { FontScaleApplier } from "@/components/font-scale";
 import { QueryClientProvider } from "@/components/query-client-provider";
 import { AuthSyncWatcher } from "@/core/auth/sync";
 import { I18nProvider } from "@/core/i18n/context";
@@ -16,6 +17,8 @@ import LoginPage from "./pages/LoginPage";
 import PageRoutes from "./pages/PageRoutes";
 import PublicScheduledTaskPage from "./pages/PublicScheduledTaskPage";
 import PublicSharePage from "./pages/PublicSharePage";
+import EmbedChatPage from "./pages/EmbedChatPage";
+import { ChatRuntime } from "./pages/WorkspaceRoutes";
 import { NotFoundPage } from "./pages/NotFoundPage";
 
 function AppProviders({ children }: { children: React.ReactNode }) {
@@ -39,6 +42,7 @@ function AppProviders({ children }: { children: React.ReactNode }) {
           <ThemeProvider>
             <ChatProvider>
               <AuthSyncWatcher />
+              <FontScaleApplier />
               {children}
             </ChatProvider>
           </ThemeProvider>
@@ -64,6 +68,15 @@ export function App() {
             path="/public/scheduled-tasks/:taskId"
             element={<PublicScheduledTaskPage />}
           />
+          {/* Embedded workspace Q&A — no page/workspace sidebars; parent passes message/username/theme */}
+          <Route
+            path="/embed/chats/:thread_id"
+            element={
+              <ChatRuntime>
+                <EmbedChatPage />
+              </ChatRuntime>
+            }
+          />
           <Route path="/page/*" element={<PageRoutes />} />
           <Route path="*" element={<NotFoundPage />} />
         </Routes>

frontend-web/src/components/font-scale.tsx

@@ -0,0 +1,45 @@
+"use client";
+
+import { useEffect } from "react";
+
+import { useLocalSettings } from "@/core/settings";
+
+/**
+ * 基准字号 = 16px，对应《深蓝色 UI 规范》§2.1.2 后台系统正文字号（16px Regular）。
+ * 用户在「外观 → 字号」里选择的倍数通过 CSS 变量 `--ui-font-scale` 生效：globals.css
+ * 只把 Tailwind 的 `--text-*` 字号 token 乘以该倍数，**不动间距 token**，所以放大 / 缩小
+ * 的只有文字本身，padding / margin / 宽高等布局尺寸保持不变，不会把页面挤错位。
+ * `fontScale === 1` 即默认 16px。
+ */
+export const BASE_FONT_PX = 16;
+
+export const FONT_SCALE_OPTIONS: { value: number; label: string; px: number }[] =
+  [
+    { value: 0.875, label: "小", px: 14 },
+    { value: 1, label: "标准", px: 16 },
+    { value: 1.125, label: "大", px: 18 },
+    { value: 1.25, label: "特大", px: 20 },
+  ];
+
+/**
+ * 把用户选择的字号倍数写到 <html> 的 `--ui-font-scale` CSS 变量。挂在应用根部，
+ * 保证刷新后即时生效、全局统一。只设变量、不直接改 font-size，因此布局不受影响。
+ * 不渲染任何 DOM。
+ */
+export function FontScaleApplier() {
+  const [settings] = useLocalSettings();
+  const { fontScale } = settings.display;
+
+  useEffect(() => {
+    const scale =
+      typeof fontScale === "number" && Number.isFinite(fontScale) && fontScale > 0
+        ? fontScale
+        : 1;
+    const root = document.documentElement;
+    root.style.setProperty("--ui-font-scale", String(scale));
+    // 清掉旧实现可能残留的根级 font-size 内联样式（旧版用它做整页缩放）。
+    root.style.removeProperty("font-size");
+  }, [fontScale]);
+
+  return null;
+}

frontend-web/src/components/ui/button.tsx

@@ -14,7 +14,7 @@ const buttonVariants = cva(
         destructive:
           "cursor-pointer bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
         outline:
-          "cursor-pointer border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+          "cursor-pointer border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-[#213D5E] dark:bg-[#022248] dark:text-[#CCD2DA] dark:hover:border-[#213D5E] dark:hover:bg-[#0a2f58] dark:hover:text-[#CCD2DA] dark:[&_svg]:text-[#CCD2DA]",
         secondary:
           "cursor-pointer bg-secondary text-secondary-foreground hover:bg-secondary/80",
         ghost:

frontend-web/src/components/ui/empty.tsx

@@ -34,7 +34,7 @@ const emptyMediaVariants = cva(
     variants: {
       variant: {
         default: "bg-transparent",
-        icon: "bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6",
+        icon: "bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6 dark:text-[#55A6FE]  dark:bg-[#022248]",
       },
     },
     defaultVariants: {
@@ -62,7 +62,7 @@ function EmptyTitle({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
       data-slot="empty-title"
-      className={cn("text-lg font-medium tracking-tight", className)}
+      className={cn("text-lg font-medium tracking-tight dark:text-[#AACEFF]", className)}
       {...props}
     />
   );
@@ -73,7 +73,7 @@ function EmptyDescription({ className, ...props }: React.ComponentProps<"p">) {
     <div
       data-slot="empty-description"
       className={cn(
-        "text-muted-foreground [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4",
+        "text-muted-foreground [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4 dark:text-[#55A6FE]",
         className,
       )}
       {...props}

frontend-web/src/components/ui/input.tsx

@@ -3,6 +3,14 @@ import * as React from "react";
 import { cn } from "@/lib/utils";
 
 function Input({ className, type, ...props }: React.ComponentProps<"input">) {
+  const usesDarkNativePicker =
+    type === "number" ||
+    type === "date" ||
+    type === "datetime-local" ||
+    type === "time" ||
+    type === "month" ||
+    type === "week";
+
   return (
     <input
       type={type}
@@ -10,7 +18,8 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
       className={cn(
         "h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base outline-none transition-[color,box-shadow] md:text-sm",
         "border-input placeholder:text-muted-foreground",
-        "dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEFF] dark:placeholder:text-[#566B7F] rounded-[4px] text-[16px]",
+        "dark:border-[#1B477E] dark:bg-[#0D2D54] dark:text-[#AACEFF] dark:placeholder:text-[#566B7F] dark:rounded-[4px] dark:text-[16px] md:dark:text-[16px]",
+        usesDarkNativePicker && "dark:[color-scheme:dark]",
         "file:text-foreground selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] dark:focus-visible:border-[#3b82f6] dark:focus-visible:ring-[#3b82f6]/30",
         "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",

frontend-web/src/components/ui/select.tsx

@@ -36,7 +36,8 @@ const SelectTrigger = React.forwardRef<
       data-slot="select-trigger"
       data-size={size}
       className={cn(
-        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit cursor-pointer items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex w-fit cursor-pointer items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEE2] dark:data-[placeholder]:text-[#566B7F] dark:hover:bg-[#022248] dark:[&_svg:not([class*='text-'])]:text-[#AACEFF] dark:focus-visible:border-[#3b82f6] dark:focus-visible:ring-[#3b82f6]/30",
         className,
       )}
       {...props}
@@ -61,7 +62,7 @@ const SelectContent = React.forwardRef<
         ref={ref}
         data-slot="select-content"
         className={cn(
-          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
+          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEFF]",
           position === "popper" &&
             "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
           className,
@@ -95,7 +96,10 @@ function SelectLabel({
   return (
     <SelectPrimitive.Label
       data-slot="select-label"
-      className={cn("text-muted-foreground px-2 py-1.5 text-xs", className)}
+      className={cn(
+        "text-muted-foreground px-2 py-1.5 text-xs dark:text-[#566B7F]",
+        className,
+      )}
       {...props}
     />
   );
@@ -111,6 +115,7 @@ const SelectItem = React.forwardRef<
       data-slot="select-item"
       className={cn(
         "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        "dark:text-[#AACEFF] dark:focus:bg-[#0062D9] dark:focus:text-white dark:data-[highlighted]:bg-[#0062D9] dark:data-[highlighted]:text-white dark:[&_svg:not([class*='text-'])]:text-[#AACEFF] dark:focus:[&_svg:not([class*='text-'])]:text-white dark:data-[highlighted]:[&_svg:not([class*='text-'])]:text-white",
         className,
       )}
       {...props}
@@ -151,7 +156,7 @@ function SelectScrollUpButton({
     <SelectPrimitive.ScrollUpButton
       data-slot="select-scroll-up-button"
       className={cn(
-        "flex cursor-default items-center justify-center py-1",
+        "flex cursor-default items-center justify-center py-1 dark:text-[#AACEFF]",
         className,
       )}
       {...props}
@@ -169,7 +174,7 @@ function SelectScrollDownButton({
     <SelectPrimitive.ScrollDownButton
       data-slot="select-scroll-down-button"
       className={cn(
-        "flex cursor-default items-center justify-center py-1",
+        "flex cursor-default items-center justify-center py-1 dark:text-[#AACEFF]",
         className,
       )}
       {...props}

frontend-web/src/components/ui/switch.tsx

@@ -13,7 +13,7 @@ function Switch({
     <SwitchPrimitive.Root
       data-slot="switch"
       className={cn(
-        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-[#55A6FE] dark:data-[state=checked]:bg-[#0062D9] inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
         className,
       )}
       {...props}

frontend-web/src/components/ui/tabs.tsx

@@ -32,7 +32,8 @@ const tabsListVariants = cva(
       variant: {
         default:
           "bg-muted dark:group-data-[orientation=horizontal]/tabs:h-8! dark:items-stretch dark:gap-0 dark:overflow-hidden dark:rounded-[2px] dark:border dark:border-[#55A6FE] dark:bg-[#022248] dark:p-0",
-        line: "gap-1 bg-transparent",
+        line:
+          "gap-1 bg-transparent dark:group-data-[orientation=horizontal]/tabs:h-8! dark:items-stretch dark:gap-0 dark:overflow-visible dark:rounded-[2px] dark:border dark:border-[#55A6FE] dark:bg-[#022248] dark:p-0",
       },
     },
     defaultVariants: {
@@ -70,13 +71,16 @@ const TabsTrigger = React.forwardRef<
       className={cn(
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-sm group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         "dark:text-muted-foreground dark:hover:text-foreground",
-        "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent",
+        "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent",
         "data-[state=active]:bg-background data-[state=active]:text-foreground",
-        "dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-input dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-input/30 dark:group-data-[variant=line]/tabs-list:data-[state=active]:text-foreground",
+        "dark:group-data-[variant=line]/tabs-list:relative dark:group-data-[variant=line]/tabs-list:!h-full dark:group-data-[variant=line]/tabs-list:self-stretch dark:group-data-[variant=line]/tabs-list:flex-none dark:group-data-[variant=line]/tabs-list:rounded-none dark:group-data-[variant=line]/tabs-list:border-0 dark:group-data-[variant=line]/tabs-list:bg-transparent dark:group-data-[variant=line]/tabs-list:px-4 dark:group-data-[variant=line]/tabs-list:!py-0 dark:group-data-[variant=line]/tabs-list:!leading-none dark:group-data-[variant=line]/tabs-list:text-[#CCD2DA] dark:group-data-[variant=line]/tabs-list:shadow-none dark:group-data-[variant=line]/tabs-list:hover:text-[#CCD2DA] dark:group-data-[variant=line]/tabs-list:focus-visible:ring-0 dark:group-data-[variant=line]/tabs-list:[&_svg]:text-[#CCD2DA]",
-        "dark:group-data-[variant=default]/tabs-list:relative dark:group-data-[variant=default]/tabs-list:!h-full dark:group-data-[variant=default]/tabs-list:self-stretch dark:group-data-[variant=default]/tabs-list:flex-none dark:group-data-[variant=default]/tabs-list:rounded-none dark:group-data-[variant=default]/tabs-list:border-0 dark:group-data-[variant=default]/tabs-list:bg-transparent dark:group-data-[variant=default]/tabs-list:px-4 dark:group-data-[variant=default]/tabs-list:!py-0 dark:group-data-[variant=default]/tabs-list:!leading-none dark:group-data-[variant=default]/tabs-list:shadow-none dark:group-data-[variant=default]/tabs-list:focus-visible:ring-0 dark:group-data-[variant=default]/tabs-list:[&_svg]:text-[#CCD2DA]",
+        "dark:group-data-[variant=line]/tabs-list:not(:first-child):border-l dark:group-data-[variant=line]/tabs-list:not(:first-child):border-[#1d3961] dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-l-0",
+        "dark:group-data-[variant=line]/tabs-list:data-[state=active]:rounded-none dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-0 dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-[#0062D9] dark:group-data-[variant=line]/tabs-list:data-[state=active]:text-[#FFFFFF] dark:group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none dark:group-data-[variant=line]/tabs-list:data-[state=active]:[&_svg]:text-[#FFFFFF]",
+        "dark:group-data-[variant=default]/tabs-list:flex dark:group-data-[variant=default]/tabs-list:min-h-0 dark:group-data-[variant=default]/tabs-list:!h-full dark:group-data-[variant=default]/tabs-list:flex-1 dark:group-data-[variant=default]/tabs-list:self-stretch dark:group-data-[variant=default]/tabs-list:rounded-none dark:group-data-[variant=default]/tabs-list:border-0 dark:group-data-[variant=default]/tabs-list:bg-transparent dark:group-data-[variant=default]/tabs-list:px-4 dark:group-data-[variant=default]/tabs-list:!py-0 dark:group-data-[variant=default]/tabs-list:!leading-none dark:group-data-[variant=default]/tabs-list:text-[#CCD2DA] dark:group-data-[variant=default]/tabs-list:shadow-none dark:group-data-[variant=default]/tabs-list:hover:text-[#CCD2DA] dark:group-data-[variant=default]/tabs-list:focus-visible:ring-0 dark:group-data-[variant=default]/tabs-list:[&_svg]:text-[#CCD2DA]",
         "dark:group-data-[variant=default]/tabs-list:not(:first-child):border-l dark:group-data-[variant=default]/tabs-list:not(:first-child):border-[#1d3961] dark:group-data-[variant=default]/tabs-list:data-[state=active]:border-l-0",
-        "dark:group-data-[variant=default]/tabs-list:data-[state=active]:rounded-none dark:group-data-[variant=default]/tabs-list:data-[state=active]:border-0 dark:group-data-[variant=default]/tabs-list:data-[state=active]:bg-[#0062D9] dark:group-data-[variant=default]/tabs-list:data-[state=active]:text-[#FFFFFF] dark:group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none dark:group-data-[variant=default]/tabs-list:data-[state=active]:[&_svg]:text-[#FFFFFF] dark:group-data-[variant=default]/tabs-list:hover:text-[#CCD2DA]",
+        "dark:group-data-[variant=default]/tabs-list:data-[state=active]:rounded-none dark:group-data-[variant=default]/tabs-list:data-[state=active]:border-0 dark:group-data-[variant=default]/tabs-list:data-[state=active]:bg-[#0062D9] dark:group-data-[variant=default]/tabs-list:data-[state=active]:text-[#FFFFFF] dark:group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none dark:group-data-[variant=default]/tabs-list:data-[state=active]:hover:text-[#FFFFFF] dark:group-data-[variant=default]/tabs-list:data-[state=active]:[&_svg]:text-[#FFFFFF]",
-        "after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100",
+        "group-data-[variant=line]/tabs-list:after:pointer-events-none group-data-[variant=line]/tabs-list:after:absolute group-data-[variant=line]/tabs-list:after:inset-x-2 group-data-[variant=line]/tabs-list:after:bottom-[-5px] group-data-[variant=line]/tabs-list:after:h-0.5 group-data-[variant=line]/tabs-list:after:bg-foreground group-data-[variant=line]/tabs-list:after:opacity-0 group-data-[variant=line]/tabs-list:after:transition-opacity group-data-[variant=line]/tabs-list:after:content-[''] group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100",
+        "dark:group-data-[variant=line]/tabs-list:after:inset-x-0 dark:group-data-[variant=line]/tabs-list:after:bottom-0 dark:group-data-[variant=line]/tabs-list:after:z-[2] dark:group-data-[variant=line]/tabs-list:after:h-[2px] dark:group-data-[variant=line]/tabs-list:after:bg-[#FFFFFF]",
         className,
       )}
       {...props}

frontend-web/src/components/workspace/admin/admin-memory-page.tsx

@@ -6,6 +6,7 @@ import { toast } from "sonner";
 
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
+import { useTheme } from "@/contexts/ThemeContext";
 import { Input } from "@/components/ui/input";
 import { ScrollArea } from "@/components/ui/scroll-area";
 import {
@@ -90,7 +91,7 @@ function V1SectionField({
   return (
     <div className="space-y-1">
       <div className="flex items-center justify-between">
-        <span className="text-xs font-medium text-muted-foreground">{label}</span>
+        <span className="text-xs font-medium text-muted-foreground dark:text-[#AACEE2]">{label}</span>
         {!editing && (
           <Button size="icon" variant="ghost" className="size-6" onClick={() => { setDraft(value); setEditing(true); }}>
             <Pencil className="size-3" />
@@ -154,7 +155,7 @@ function V1FactItem({
   }
 
   return (
-    <div className="rounded border p-2 space-y-1 group">
+    <div className="rounded border p-2 space-y-1 group ">
       {editing ? (
         <div className="space-y-2">
           <Textarea value={draftContent} onChange={(e) => setDraftContent(e.target.value)} className="min-h-[64px] text-sm" autoFocus />
@@ -196,7 +197,7 @@ function V1FactItem({
               </Button>
             </div>
           </div>
-          <p className="text-sm whitespace-pre-wrap">{String(fact.content ?? "")}</p>
+          <p className="text-sm whitespace-pre-wrap dark:text-[#AACEE2]">{String(fact.content ?? "")}</p>
           {fact.sourceError ? <p className="text-xs text-red-600 bg-red-50 rounded px-2 py-1">避免：{String(fact.sourceError)}</p> : null}
         </>
       )}
@@ -206,6 +207,7 @@ function V1FactItem({
 
 // 新增事实表单
 function V1AddFactForm({ agent, userId }: { agent: string | null; userId: string }) {
+  const { theme } = useTheme();
   const [open, setOpen] = useState(false);
   const [content, setContent] = useState("");
   const [category, setCategory] = useState("context");
@@ -222,7 +224,12 @@ function V1AddFactForm({ agent, userId }: { agent: string | null; userId: string
 
   if (!open) {
     return (
-      <Button variant="outline" size="sm" className="mt-1 w-full" onClick={() => setOpen(true)}>
+      <Button
+        variant={theme === "dark" ? "default" : "outline"}
+        size="sm"
+        className="mt-1 w-full"
+        onClick={() => setOpen(true)}
+      >
         <Plus className="size-3" />新增事实
       </Button>
     );
@@ -276,8 +283,8 @@ export function V1BucketView({
   return (
     <div className="space-y-4">
       {/* 用户画像字段 */}
-      <div className="rounded-md border p-3 space-y-3">
+      <div className="rounded-md border p-3 space-y-3 dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
-        <h4 className="text-xs font-semibold text-muted-foreground">用户画像</h4>
+        <h4 className="text-xs font-semibold text-muted-foreground dark:text-white">用户画像</h4>
         {allCtxFields.map((field) => (
           <V1SectionField
             key={field}
@@ -291,8 +298,8 @@ export function V1BucketView({
       </div>
 
       {/* 历史摘要字段 */}
-      <div className="rounded-md border p-3 space-y-3">
+      <div className="rounded-md border p-3 space-y-3 dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
-        <h4 className="text-xs font-semibold text-muted-foreground">历史摘要</h4>
+        <h4 className="text-xs font-semibold text-muted-foreground dark:text-white">历史摘要</h4>
         {allHistoryFields.map((field) => (
           <V1SectionField
             key={field}
@@ -306,8 +313,8 @@ export function V1BucketView({
       </div>
 
       {/* 事实记录 */}
-      <div className="rounded-md border p-3 space-y-2">
+      <div className="rounded-md border p-3 space-y-2 dark:border-[#213D5E] dark:bg-[#022248]">
-        <h4 className="text-xs font-semibold text-muted-foreground">事实记录（{factsRaw.length} 条）</h4>
+        <h4 className="text-xs font-semibold text-muted-foreground dark:text-white">事实记录（{factsRaw.length} 条）</h4>
         {factsRaw.map((fact, i) => (
           <V1FactItem key={String(fact.id ?? i)} fact={fact} agent={agent} userId={userId} />
         ))}

frontend-web/src/components/workspace/admin/admin-user-hub.tsx

@@ -179,7 +179,7 @@ function UserAuditPanel({ userId }: { userId: string }) {
       <ScrollArea className="min-h-0 flex-1">
         <div className="p-4">
           {!threadId && (
-            <div className="text-muted-foreground flex flex-col items-center gap-2 py-16 text-sm">
+            <div className="text-muted-foreground flex flex-col items-center gap-2 py-16 text-sm dark:text-[#AACEF8]">
               <MessageSquareIcon className="size-6" />
               请从左侧选择一个会话
             </div>
@@ -253,7 +253,7 @@ function AgentMemoryPanel({ userId }: { userId: string }) {
               <SelectTrigger className="h-8 w-48" size="sm">
                 <SelectValue />
               </SelectTrigger>
-              <SelectContent>
+              <SelectContent position="popper" side="bottom" sideOffset={4}>
                 {/* 默认助手始终显示，对应全局记忆文件 */}
                 <SelectItem value="default">默认助手</SelectItem>
                 {otherBuckets.map((b) => (

frontend-web/src/components/workspace/admin/tag-management-page.tsx

@@ -224,16 +224,16 @@ export function TagManagementPage() {
               <table className="w-full text-sm">
                 <thead className="bg-muted/50">
                   <tr>
-                    <th className="text-muted-foreground px-4 py-3 text-left font-medium">
+                    <th className="text-muted-foreground px-4 py-3 text-left font-medium dark:text-white">
                       {t.adminTags.name}
                     </th>
-                    <th className="text-muted-foreground px-4 py-3 text-left font-medium">
+                    <th className="text-muted-foreground px-4 py-3 text-left font-medium dark:text-white">
                       {t.adminTags.tagDescription}
                     </th>
-                    <th className="text-muted-foreground px-4 py-3 text-right font-medium">
+                    <th className="text-muted-foreground px-4 py-3 text-right font-medium dark:text-white">
                       {t.adminTags.usageCount}
                     </th>
-                    <th className="text-muted-foreground px-4 py-3 text-right font-medium">
+                    <th className="text-muted-foreground px-4 py-3 text-right font-medium dark:text-white">
                       {t.adminTags.actions}
                     </th>
                   </tr>

frontend-web/src/components/workspace/admin/tool-metrics-panel.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Download, Loader2 } from "lucide-react";
+import { AlertCircle,CheckCircle2, Download, Loader2 } from "lucide-react";
 import { useMemo, useState } from "react";
 import { toast } from "sonner";
 
@@ -29,6 +29,7 @@ import {
 } from "@/core/tool-metrics/api";
 import { useToolMetrics, useToolMetricsSummary } from "@/core/tool-metrics/hooks";
 import { cn } from "@/lib/utils";
+import { useTheme } from "@/contexts/ThemeContext";
 
 const PAGE_SIZE = 50;
 
@@ -66,6 +67,7 @@ function categoryLabel(category?: string | null): string {
 }
 
 export function ToolMetricsPanel() {
+  const { theme } = useTheme();
   const [page, setPage] = useState(0);
   const [tool, setTool] = useState("");
   const [user, setUser] = useState("");
@@ -79,6 +81,31 @@ export function ToolMetricsPanel() {
   const [until, setUntil] = useState("");
   const [exporting, setExporting] = useState(false);
   const [detailRow, setDetailRow] = useState<ToolMetric | null>(null);
+/** 成功 toast：仅暗色模式，浅色走 Sonner 默认 */
+const successToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#106455] !bg-[#052934] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <CheckCircle2 className="size-4 shrink-0 text-[#2FD69A]" />,
+} as const;
+
+/** 失败 toast：仅暗色模式，浅色走 Sonner 默认 */
+const errorToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#7F1A2A] !bg-[#311629] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <AlertCircle className="size-4 shrink-0 text-[#F5222D]" />,
+} as const;
+  const darkToastOpts =
+    theme === "dark"
+      ? { success: successToastDarkOptions, error: errorToastDarkOptions }
+      : { success: undefined, error: undefined };
 
   const filters = useMemo<ToolMetricsFilters>(() => {
     const out: ToolMetricsFilters = {};
@@ -117,9 +144,9 @@ export function ToolMetricsPanel() {
     setExporting(true);
     try {
       await downloadToolMetricsExcel(filters);
-      toast.success("已导出为 Excel");
+      toast.success("已导出为 Excel",darkToastOpts.success);
     } catch (e) {
-      toast.error(e instanceof Error ? e.message : "导出失败");
+      toast.error(e instanceof Error ? e.message : "导出失败",darkToastOpts.error);
     } finally {
       setExporting(false);
     }
@@ -167,7 +194,7 @@ export function ToolMetricsPanel() {
       </div>
 
       {/* Summary strip */}
-      <div className="flex flex-wrap items-center gap-2 rounded-xl border bg-white p-4">
+      <div className="flex flex-wrap items-center gap-2 rounded-xl border bg-white p-4 dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
         <div className="mr-4 flex flex-col">
           <span className="text-muted-foreground text-xs">总调用</span>
           <span className="text-lg font-semibold tabular-nums">
@@ -213,7 +240,7 @@ export function ToolMetricsPanel() {
 
       {/* Per-skill breakdown — answers "was skill X invoked, and did it succeed". */}
       {summary && summary.by_skill.length > 0 && (
-        <div className="rounded-xl border bg-white p-4">
+        <div className="rounded-xl border bg-white p-4 ">
           <h3 className="mb-2 text-sm font-medium">各技能调用情况</h3>
           <div className="overflow-x-auto">
             <table className="w-full text-sm">
@@ -258,7 +285,7 @@ export function ToolMetricsPanel() {
         </div>
       )}
       {summary && kind === "skill" && summary.by_skill.length === 0 && (
-        <div className="text-muted-foreground rounded-xl border bg-white p-4 text-sm">
+        <div className="text-muted-foreground rounded-xl border bg-white p-4 text-sm dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
           当前筛选范围内没有检测到任何技能调用记录。技能只有在被 Agent 通过
           <code className="bg-muted mx-1 rounded px-1">skill_view</code>
           读取(即真正"调用")时才会被记录;仅在系统提示里被列出、但未被读取的技能不会计入。
@@ -266,9 +293,9 @@ export function ToolMetricsPanel() {
       )}
 
       {/* Filters */}
-      <div className="grid gap-3 rounded-xl border bg-white p-4 md:grid-cols-3 lg:grid-cols-6">
+      <div className="grid gap-3 rounded-xl border bg-white p-4 md:grid-cols-3 lg:grid-cols-6 dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">调用类型</label>
+          <label className="text-muted-foreground text-xs dark:text-white">调用类型</label>
           <Select
             value={kind}
             onValueChange={(value) => {
@@ -276,17 +303,17 @@ export function ToolMetricsPanel() {
               setPage(0);
             }}
           >
-            <SelectTrigger>
+            <SelectTrigger className="dark:bg-[#0D2D54] dark:hover:bg-[#0D2D54]">
               <SelectValue />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent position="popper" side="bottom" sideOffset={4}>
               <SelectItem value="skill">技能（Agent Skill）</SelectItem>
               <SelectItem value="all">全部工具调用</SelectItem>
             </SelectContent>
           </Select>
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">技能名称</label>
+          <label className="text-muted-foreground text-xs dark:text-white">技能名称</label>
           <Input
             value={skill}
             placeholder="按技能名筛选"
@@ -297,7 +324,7 @@ export function ToolMetricsPanel() {
           />
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">工具名</label>
+          <label className="text-muted-foreground text-xs dark:text-white">工具名</label>
           <Input
             value={tool}
             placeholder="按工具名筛选"
@@ -308,7 +335,7 @@ export function ToolMetricsPanel() {
           />
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">用户名</label>
+          <label className="text-muted-foreground text-xs dark:text-white">用户名</label>
           <Input
             value={user}
             placeholder="@ 前部分"
@@ -319,7 +346,7 @@ export function ToolMetricsPanel() {
           />
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">状态</label>
+          <label className="text-muted-foreground text-xs dark:text-white">状态</label>
           <Select
             value={status}
             onValueChange={(value) => {
@@ -327,10 +354,10 @@ export function ToolMetricsPanel() {
               setPage(0);
             }}
           >
-            <SelectTrigger>
+            <SelectTrigger className="w-full dark:bg-[#0D2D54] dark:hover:bg-[#0D2D54]">
               <SelectValue />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent position="popper" side="bottom" sideOffset={4}>
               <SelectItem value="all">全部</SelectItem>
               <SelectItem value="success">成功</SelectItem>
               <SelectItem value="error">失败</SelectItem>
@@ -338,7 +365,7 @@ export function ToolMetricsPanel() {
           </Select>
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">错误类型</label>
+          <label className="text-muted-foreground text-xs dark:text-white">错误类型</label>
           <Select
             value={category}
             onValueChange={(value) => {
@@ -346,10 +373,10 @@ export function ToolMetricsPanel() {
               setPage(0);
             }}
           >
-            <SelectTrigger>
+            <SelectTrigger className="w-full dark:bg-[#0D2D54] dark:hover:bg-[#0D2D54]">
               <SelectValue />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent  position="popper" side="bottom" sideOffset={4}>
               <SelectItem value="all">全部</SelectItem>
               {TOOL_ERROR_CATEGORIES.map((cat) => (
                 <SelectItem key={cat} value={cat}>
@@ -360,7 +387,7 @@ export function ToolMetricsPanel() {
           </Select>
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">开始时间</label>
+          <label className="text-muted-foreground text-xs dark:text-white">开始时间</label>
           <Input
             type="datetime-local"
             value={since}
@@ -371,7 +398,7 @@ export function ToolMetricsPanel() {
           />
         </div>
         <div className="flex flex-col gap-1">
-          <label className="text-muted-foreground text-xs">结束时间</label>
+          <label className="text-muted-foreground text-xs dark:text-white">结束时间</label>
           <Input
             type="datetime-local"
             value={until}
@@ -389,10 +416,10 @@ export function ToolMetricsPanel() {
       </div>
 
       {/* Table */}
-      <div className="rounded-xl border bg-white">
+      <div className="rounded-xl border bg-white dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
         <div className="overflow-x-auto">
           <table className="w-full min-w-[960px] text-sm">
-            <thead className="bg-muted/60 text-muted-foreground">
+            <thead className="bg-muted/60 text-muted-foreground dark:text-white">
               <tr>
                 <Th>时间</Th>
                 <Th>用户</Th>

frontend-web/src/components/workspace/agents/agent-card.tsx

@@ -2,6 +2,7 @@
 
 import {
   BotIcon,
+  CopyIcon,
   GlobeIcon,
   InfoIcon,
   LockIcon,
@@ -43,12 +44,14 @@ import { TagChipList } from "@/components/workspace/tags/tag-chip";
 import { TagPickerDialog } from "@/components/workspace/tags/tag-picker-dialog";
 import {
   useAgent,
+  useCreateAgent,
   useDeleteAgent,
   useSetAgentFeatured,
   useSetAgentPrivate,
   useToggleAgentFavorite,
   useUpdateAgent,
 } from "@/core/agents";
+import { getAgent } from "@/core/agents/api";
 import type { Agent } from "@/core/agents";
 import { getStoredAuth } from "@/core/auth";
 import { useI18n } from "@/core/i18n/hooks";
@@ -65,6 +68,7 @@ export function AgentCard({ agent }: AgentCardProps) {
   const router = useRouter();
   const deleteAgent = useDeleteAgent();
   const updateAgent = useUpdateAgent();
+  const createAgent = useCreateAgent();
   const setFeatured = useSetAgentFeatured();
   const setPrivate = useSetAgentPrivate();
   const toggleFavorite = useToggleAgentFavorite();
@@ -153,6 +157,41 @@ export function AgentCard({ agent }: AgentCardProps) {
     }
   }
 
+  async function handleDuplicate() {
+    if (createAgent.isPending) {
+      return;
+    }
+    try {
+      // SOUL.md is omitted from the list payload (perf), so fetch the detail
+      // row to carry the source agent's personality into the copy. Fall back
+      // to whatever the list happened to include if the detail fetch fails.
+      let soul = agent.soul ?? "";
+      try {
+        const detail = await getAgent(agent.id);
+        soul = detail.soul ?? soul;
+      } catch {
+        // keep the list fallback
+      }
+      const created = await createAgent.mutateAsync({
+        name: `${agent.name} 副本`,
+        description: agent.description ?? "",
+        soul,
+        skills: agent.skills ?? [],
+        model: agent.model ?? null,
+        tool_groups: agent.tool_groups ?? null,
+        // A copy starts as a private, unpublished draft the owner can refine
+        // before sharing — never inherit the source's published/private state.
+        published: false,
+        is_private: false,
+      });
+      toast.success(
+        `已复制为「${desensitize(created.name)}」，可在「我的」中编辑`,
+      );
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : String(err));
+    }
+  }
+
   async function handleSaveEdit() {
     const trimmedName = editName.trim();
     if (!trimmedName) {
@@ -471,6 +510,16 @@ export function AgentCard({ agent }: AgentCardProps) {
                   <ShieldIcon className="h-3.5 w-3.5" />
                 </Button>
               )}
+              <Button
+                size="icon"
+                variant="ghost"
+                className="h-8 w-8 shrink-0"
+                onClick={() => void handleDuplicate()}
+                disabled={createAgent.isPending}
+                title="复制为新智能体"
+              >
+                <CopyIcon className="h-3.5 w-3.5" />
+              </Button>
               {canEdit && (
                 <Button
                   size="icon"
@@ -535,7 +584,7 @@ export function AgentCard({ agent }: AgentCardProps) {
                   已选 {selectedSkills.length} 个
                 </span>
               </div>
-              <div className="rounded-md border p-2">
+              <div className="max-h-[240px] overflow-y-auto rounded-md border p-2">
                 {isSkillsLoading ? (
                   <p className="text-muted-foreground text-sm">技能加载中...</p>
                 ) : enabledSkills.length === 0 ? (
@@ -543,13 +592,13 @@ export function AgentCard({ agent }: AgentCardProps) {
                     当前没有可用技能
                   </p>
                 ) : (
-                  <div className="flex flex-wrap gap-2">
+                  <div className="grid grid-cols-1 gap-2 sm:grid-cols-2">
                     {enabledSkills.map((skill) => {
                       const checked = selectedSkills.includes(skill.name);
                       return (
                         <div
                           key={skill.name}
-                          className="inline-flex max-w-full items-center"
+                          className="flex w-full min-w-0 items-center"
                         >
                           <Button
                             type="button"
@@ -557,7 +606,7 @@ export function AgentCard({ agent }: AgentCardProps) {
                             variant={checked ? "default" : "outline"}
                             onClick={() => toggleSkill(skill.name)}
                             title={desensitize(skill.description ?? "")}
-                            className="h-8 max-w-[200px] rounded-r-none"
+                            className="h-8 min-w-0 flex-1 rounded-r-none"
                           >
                             <span className="truncate">{desensitize(skill.name)}</span>
                           </Button>

frontend-web/src/components/workspace/artifacts/artifact-file-detail.tsx

@@ -400,6 +400,47 @@ export function ArtifactFileDetail({
     }
   }, [displayContent, filepath]);
 
+  const handleOpenWriteFileInNewTab = useCallback(() => {
+    const source = displayContent ?? "";
+    if (!source.trim()) {
+      toast.error("文件内容为空，暂时无法打开");
+      return;
+    }
+    const blobType =
+      language === "html"
+        ? "text/html;charset=utf-8"
+        : language === "markdown"
+          ? "text/markdown;charset=utf-8"
+          : "text/plain;charset=utf-8";
+    const blob = new Blob([source], { type: blobType });
+    const url = URL.createObjectURL(blob);
+    window.open(url, "_blank", "noopener,noreferrer");
+    window.setTimeout(() => URL.revokeObjectURL(url), 60_000);
+  }, [displayContent, language]);
+
+  const handleDownloadWriteFile = useCallback(() => {
+    const source = displayContent ?? "";
+    if (!source.trim()) {
+      toast.error("文件内容为空，暂时无法下载");
+      return;
+    }
+    const blobType =
+      language === "html"
+        ? "text/html;charset=utf-8"
+        : language === "markdown"
+          ? "text/markdown;charset=utf-8"
+          : "text/plain;charset=utf-8";
+    const blob = new Blob([source], { type: blobType });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = getFileName(filepath);
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    URL.revokeObjectURL(url);
+  }, [displayContent, filepath, language]);
+
   return (
     <Artifact className={cn(className)}>
       <ArtifactHeader className="grid grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-3 px-4 py-3">
@@ -500,30 +541,32 @@ export function ArtifactFileDetail({
                 />
               </Tooltip>
             )}
-            {!isWriteFile && (
+            <ArtifactAction
-              <ArtifactAction
+              icon={SquareArrowOutUpRightIcon}
-                icon={SquareArrowOutUpRightIcon}
+              label={t.common.openInNewWindow}
-                label={t.common.openInNewWindow}
+              tooltip={t.common.openInNewWindow}
-                tooltip={t.common.openInNewWindow}
+              onClick={async () => {
-                onClick={async () => {
+                if (isWriteFile) {
-                  try {
+                  handleOpenWriteFileInNewTab();
-                    await openArtifactInNewTab({
+                  return;
-                      filepath,
+                }
-                      threadId,
+                try {
-                      isMock,
+                  await openArtifactInNewTab({
-                      publicShareCode,
+                    filepath,
-                    });
+                    threadId,
-                  } catch (error) {
+                    isMock,
-                    console.error(error);
+                    publicShareCode,
-                    toast.error(
+                  });
-                      error instanceof Error
+                } catch (error) {
-                        ? error.message
+                  console.error(error);
-                        : "Failed to open artifact",
+                  toast.error(
-                    );
+                    error instanceof Error
-                  }
+                      ? error.message
-                }}
+                      : "Failed to open artifact",
-              />
+                  );
-            )}
+                }
+              }}
+            />
             {isCodeFile && (
               <ArtifactAction
                 icon={CopyIcon}
@@ -550,30 +593,32 @@ export function ArtifactFileDetail({
                 onClick={handleDownloadAsWord}
               />
             )}
-            {!isWriteFile && (
+            <ArtifactAction
-              <ArtifactAction
+              icon={DownloadIcon}
-                icon={DownloadIcon}
+              label={t.common.download}
-                label={t.common.download}
+              tooltip={t.common.download}
-                tooltip={t.common.download}
+              onClick={async () => {
-                onClick={async () => {
+                if (isWriteFile) {
-                  try {
+                  handleDownloadWriteFile();
-                    await downloadArtifactFile({
+                  return;
-                      filepath,
+                }
-                      threadId,
+                try {
-                      isMock,
+                  await downloadArtifactFile({
-                      publicShareCode,
+                    filepath,
-                    });
+                    threadId,
-                  } catch (error) {
+                    isMock,
-                    console.error(error);
+                    publicShareCode,
-                    toast.error(
+                  });
-                      error instanceof Error
+                } catch (error) {
-                        ? error.message
+                  console.error(error);
-                        : "Download failed",
+                  toast.error(
-                    );
+                    error instanceof Error
-                  }
+                      ? error.message
-                }}
+                      : "Download failed",
-              />
+                  );
-            )}
+                }
+              }}
+            />
             <ArtifactAction
               className="hover:bg-background"
               icon={XIcon}
@@ -670,7 +715,10 @@ export function ArtifactFilePreview({
       return;
     }
 
-    const blob = new Blob([content ?? ""], { type: "text/html" });
+    // 必须带 charset=utf-8：blob: URL 的 Content-Type 不含 charset 时，iframe 会按
+    // 系统默认编码(中文 Windows 常为 GBK/Latin-1)解码,模型生成的 HTML 若没写
+    // <meta charset> 就会中文乱码。与下方下载/新窗口打开的 blobType 保持一致。
+    const blob = new Blob([content ?? ""], { type: "text/html;charset=utf-8" });
     const url = URL.createObjectURL(blob);
     setHtmlPreviewUrl(url);
 

frontend-web/src/components/workspace/chats/chat-box.tsx

@@ -16,7 +16,11 @@ import { apiFetch } from "@/core/api";
 import { getBackendBaseURL } from "@/core/config";
 import { isThreadRagModeLocked, useLocalSettings } from "@/core/settings";
 import { useSkills } from "@/core/skills/hooks";
-import { normalizeDisplaySources } from "@/core/skill-display/display-adapter";
+import type { SkillDisplayConfig } from "@/core/skills/type";
+import {
+  displayConfigFromResultSet,
+  normalizeDisplaySources,
+} from "@/core/skill-display/display-adapter";
 import {
   buildSkillDisplayMap,
   collectRuntimeDisplaySources,
@@ -63,9 +67,14 @@ function logReferenceDebug(
   });
 }
 
-const ChatBox: React.FC<{ children: React.ReactNode; threadId: string }> = ({
+const ChatBox: React.FC<{
+  children: React.ReactNode;
+  threadId: string;
+  disableArtifacts?: boolean;
+}> = ({
   children,
   threadId,
+  disableArtifacts = false,
 }) => {
   const { thread } = useThread();
   const pathname = usePathname();
@@ -271,12 +280,16 @@ const ChatBox: React.FC<{ children: React.ReactNode; threadId: string }> = ({
     }
 
     // Update artifacts from the current thread
-    const nextArtifacts = thread.values.artifacts ?? [];
+    const nextArtifacts = disableArtifacts ? [] : (thread.values.artifacts ?? []);
     const hadArtifacts = artifactsCountRef.current > 0;
     const hasNewArtifact = nextArtifacts.length > artifactsCountRef.current;
     artifactsCountRef.current = nextArtifacts.length;
     setArtifacts(nextArtifacts);
-    if ((hasNewArtifact || (!hadArtifacts && nextArtifacts.length > 0)) && !selectedArtifact) {
+    if (
+      !disableArtifacts &&
+      (hasNewArtifact || (!hadArtifacts && nextArtifacts.length > 0)) &&
+      !selectedArtifact
+    ) {
       selectArtifact(nextArtifacts[nextArtifacts.length - 1]!);
       setArtifactsOpen(true);
       setSideTab("document");
@@ -291,6 +304,7 @@ const ChatBox: React.FC<{ children: React.ReactNode; threadId: string }> = ({
     // }
 
     if (
+      !disableArtifacts &&
       env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true" &&
       autoSelectFirstArtifact
     ) {
@@ -307,14 +321,18 @@ const ChatBox: React.FC<{ children: React.ReactNode; threadId: string }> = ({
     selectedArtifact,
     setArtifacts,
     thread.values.artifacts,
+    disableArtifacts,
   ]);
 
   const artifactPanelOpen = useMemo(() => {
+    if (disableArtifacts) {
+      return false;
+    }
     if (env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true") {
       return artifactsOpen && artifacts?.length > 0;
     }
     return artifactsOpen;
-  }, [artifactsOpen, artifacts]);
+  }, [artifactsOpen, artifacts, disableArtifacts]);
   const sidePanelOpen = artifactPanelOpen || (hasCitationReferences && referencesOpen);
   const showTabs = !!selectedArtifact && hasCitationReferences;
 
@@ -343,6 +361,10 @@ const ChatBox: React.FC<{ children: React.ReactNode; threadId: string }> = ({
     }
   }, [sidePanelOpen]);
 
+  if (disableArtifacts) {
+    return <>{children}</>;
+  }
+
   return (
     <ResizablePanelGroup
       id={`${resizableIdBase}-panels`}
@@ -603,9 +625,10 @@ function adaptBackendSourceWithSkillDisplay(
   if (!match) {
     return null;
   }
+  const display = findDisplayConfigForBackendSource(source, match.display);
   const normalized = normalizeDisplaySources(
-    buildPayloadAtPath(match.display.resultPath || "results", [rawItem]),
+    buildPayloadAtPath(display.resultPath || "results", [rawItem]),
-    match.display,
+    display,
   )[0];
   if (!normalized) {
     return null;
@@ -614,13 +637,27 @@ function adaptBackendSourceWithSkillDisplay(
     ...source,
     ...normalized,
     skillName: match.skillName,
-    mode: match.display.mode,
+    mode: display.mode,
-    tableColumns: match.display.tableColumns,
+    tableColumns: display.tableColumns,
     index: source.index,
     raw: source.raw,
   };
 }
 
+function findDisplayConfigForBackendSource(
+  source: BackendReferenceSource,
+  display: SkillDisplayConfig,
+) {
+  const resultSetKey = source.resultSetKey;
+  if (resultSetKey) {
+    const resultSet = display.resultSets?.find((item) => item.key === resultSetKey);
+    if (resultSet) {
+      return displayConfigFromResultSet(display, resultSet);
+    }
+  }
+  return { ...display, resultSets: [] };
+}
+
 function findBackendSourceDisplay(
   source: BackendReferenceSource,
   skillDisplayMap: ReturnType<typeof buildSkillDisplayMap>,

frontend-web/src/components/workspace/input-box.tsx

@@ -583,7 +583,7 @@ export function InputBox({
           // 对话态：常规白卡 + 中性边框 + 轻阴影
           isNewThread
             ? "rounded-3xl bg-transparent border-0 shadow-none ring-0"
-            : "rounded-3xl bg-background border border-border shadow-sm dark:bg-slate-800 dark:border-slate-700",
+            : "rounded-3xl bg-background border border-border shadow-sm transition-shadow hover:shadow-md focus-within:border-ring/40 focus-within:shadow-md focus-within:ring-1 focus-within:ring-ring/20 dark:bg-slate-800 dark:border-slate-700",
           className,
         )}
         disabled={disabled}

frontend-web/src/components/workspace/messages/markdown-content.tsx

@@ -8,7 +8,6 @@ import {
   type MessageResponseProps,
 } from "@/components/ai-elements/message";
 import { streamdownPlugins } from "@/core/streamdown";
-import { desensitize } from "@/lib/desensitize";
 import { cn } from "@/lib/utils";
 
 import { CitationLink } from "../citations/citation-link";
@@ -67,8 +66,6 @@ export function MarkdownContent({
 
   if (!content) return null;
 
-  const displayContent = desensitize(content);
-
   return (
     <MessageResponse
       className={className}
@@ -76,7 +73,7 @@ export function MarkdownContent({
       rehypePlugins={rehypePlugins}
       components={components}
     >
-      {displayContent}
+      {content}
     </MessageResponse>
   );
 }

frontend-web/src/components/workspace/messages/message-group.tsx

@@ -262,7 +262,7 @@ function ToolCall({
           ...item,
           index: index + 1,
           skillName: displayMatch.skillName,
-          mode: displayMatch.display.mode,
+          mode: item.displayMode ?? displayMatch.display.mode,
         }))
       : [];
   if (displayItems.length > 0) {

frontend-web/src/components/workspace/messages/message-list-item.tsx

@@ -1,33 +1,41 @@
-import type { Message } from "@langchain/langgraph-sdk";
+import type { Message } from '@langchain/langgraph-sdk';
-import { ClockIcon, FileIcon, Loader2Icon } from "lucide-react";
+import { ClockIcon, FileIcon, Loader2Icon, PencilIcon } from 'lucide-react';
 import {
   memo,
   useCallback,
   useContext,
+  useEffect,
   useMemo,
+  useState,
   type AnchorHTMLAttributes,
   type ImgHTMLAttributes,
-} from "react";
+} from 'react';
-import rehypeKatex from "rehype-katex";
+import rehypeKatex from 'rehype-katex';
 
-import { Loader } from "@/components/ai-elements/loader";
+import { Loader } from '@/components/ai-elements/loader';
 import {
   Message as AIElementMessage,
   MessageContent as AIElementMessageContent,
   MessageResponse as AIElementMessageResponse,
   MessageToolbar,
-} from "@/components/ai-elements/message";
+} from '@/components/ai-elements/message';
 import {
   Reasoning,
   ReasoningContent,
   ReasoningTrigger,
-} from "@/components/ai-elements/reasoning";
+} from '@/components/ai-elements/reasoning';
-import { Task, TaskTrigger } from "@/components/ai-elements/task";
+import { Task, TaskTrigger } from '@/components/ai-elements/task';
-import { Badge } from "@/components/ui/badge";
+import { Badge } from '@/components/ui/badge';
-import { resolveArtifactURL } from "@/core/artifacts/utils";
+import { Button } from '@/components/ui/button';
-import { useChatAskTimes } from "@/core/chat-timestamps";
+import { Textarea } from '@/components/ui/textarea';
-import { getBackendBaseURL } from "@/core/config";
+import {
-import { useI18n } from "@/core/i18n/hooks";
+  UploadedFilePreviewDialog,
+  useAuthedObjectUrl,
+} from '@/components/workspace/messages/uploaded-file-preview-dialog';
+import { resolveArtifactURL } from '@/core/artifacts/utils';
+import { useChatAskTimes } from '@/core/chat-timestamps';
+import { getBackendBaseURL } from '@/core/config';
+import { useI18n } from '@/core/i18n/hooks';
 import {
   extractContentFromMessage,
   extractReasoningContentFromMessage,
@@ -35,23 +43,64 @@ import {
   stripArtifactTag,
   stripUploadedFilesTag,
   type FileInMessage,
-} from "@/core/messages/utils";
+} from '@/core/messages/utils';
-import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
+import { useRehypeSplitWordsIntoSpans } from '@/core/rehype';
 import {
   applyInlineCitations,
   type RuntimeDisplaySource,
-} from "@/core/skill-display/runtime";
+} from '@/core/skill-display/runtime';
-import { humanMessagePlugins } from "@/core/streamdown";
+import { humanMessagePlugins } from '@/core/streamdown';
-import { desensitize } from "@/lib/desensitize";
+import { cn } from '@/lib/utils';
-import { cn } from "@/lib/utils";
 
-import { CitationLink } from "../citations/citation-link";
+import { CitationLink } from '../citations/citation-link';
-import { CopyButton } from "../copy-button";
+import { CopyButton } from '../copy-button';
-import { SkillDisplayBlock } from "../skill-display-block";
+import { Tooltip } from '../tooltip';
-import { ThreadContext } from "./context";
+import { SkillDisplayBlock } from '../skill-display-block';
-import { DownloadWordButton } from "./download-word-button";
+import { ThreadContext } from './context';
-import { MarkdownContent, type MarkdownContentProps } from "./markdown-content";
+import { DownloadWordButton } from './download-word-button';
-import { MessageTokenUsage } from "./message-token-usage";
+import { MarkdownContent, type MarkdownContentProps } from './markdown-content';
+import { MessageTokenUsage } from './message-token-usage';
+
+type EmbeddedPageContext = {
+  title?: string;
+  url?: string;
+  content?: string;
+};
+
+function extractTagContent(source: string, tagName: string) {
+  const match = new RegExp(
+    `<${tagName}>\\s*([\\s\\S]*?)\\s*</${tagName}>`,
+    'i',
+  ).exec(source);
+  return match?.[1]?.trim() ?? '';
+}
+
+function parseEmbeddedPageContext(source: string): {
+  content: string;
+  pageContext: EmbeddedPageContext | null;
+} {
+  const match = /<page_context>\s*([\s\S]*?)\s*<\/page_context>/i.exec(source);
+  if (!match) {
+    return { content: source, pageContext: null };
+  }
+
+  const body = match[1] ?? '';
+  const pageContext = {
+    title: extractTagContent(body, 'title') || undefined,
+    url: extractTagContent(body, 'url') || undefined,
+    content: extractTagContent(body, 'content') || undefined,
+  };
+  const cleanedContent = source
+    .replace(match[0], '')
+    .replace(/\n{3,}/g, '\n\n')
+    .trim();
+
+  if (!pageContext.title && !pageContext.url && !pageContext.content) {
+    return { content: cleanedContent, pageContext: null };
+  }
+
+  return { content: cleanedContent, pageContext };
+}
 
 /**
  * Resolve an in-conversation file path to a fetchable URL.
@@ -65,7 +114,7 @@ function useArtifactResolver(threadId: string): (path: string) => string {
   return useCallback(
     (path: string) => {
       if (publicShareCode) {
-        const normalized = path.startsWith("/") ? path : `/${path}`;
+        const normalized = path.startsWith('/') ? path : `/${path}`;
         return `${getBackendBaseURL()}/api/public/shares/${encodeURIComponent(
           publicShareCode,
         )}/files${normalized}`;
@@ -78,50 +127,65 @@ function useArtifactResolver(threadId: string): (path: string) => string {
 
 export function MessageListItem({
   className,
+  fitRowToContent = false,
   message,
   isLoading,
   threadId,
   tokenUsageEnabled = false,
   displaySources = [],
   extraRehypePlugins,
+  onEditResubmit,
 }: {
   className?: string;
+  fitRowToContent?: boolean;
   message: Message;
   isLoading?: boolean;
   threadId: string;
   tokenUsageEnabled?: boolean;
   displaySources?: RuntimeDisplaySource[];
   extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
+  onEditResubmit?: (text: string) => void;
 }) {
-  const isHuman = message.type === "human";
+  const isHuman = message.type === 'human';
   const messageMarkdown =
     extractContentFromMessage(message) ??
     extractReasoningContentFromMessage(message) ??
-    "";
+    '';
   return (
     <AIElementMessage
-      className={cn("group/conversation-message relative w-full", className)}
+      className={cn(
-      from={isHuman ? "user" : "assistant"}
+        'group/conversation-message relative',
+        fitRowToContent ? 'max-w-full w-fit' : 'w-full',
+        isHuman && fitRowToContent && 'ml-auto',
+        className,
+      )}
+      from={isHuman ? 'user' : 'assistant'}
     >
       <MessageContent
-        className={isHuman ? "w-fit" : "w-full"}
+        className={isHuman ? 'w-fit' : 'w-full'}
         message={message}
         isLoading={isLoading}
         threadId={threadId}
         tokenUsageEnabled={tokenUsageEnabled}
         displaySources={displaySources}
         extraRehypePlugins={extraRehypePlugins}
+        onEditResubmit={onEditResubmit}
       />
-      {!isLoading && (
+      {/*
+        Human messages carry their own inline copy/edit toolbar inside
+        MessageContent (above the timestamp). Only assistant answers use the
+        floating bottom toolbar here.
+      */}
+      {!isLoading && !isHuman && (
         <MessageToolbar
           className={cn(
-            isHuman ? "-bottom-9 justify-end" : "-bottom-8",
+            '-bottom-8',
-            "absolute right-0 left-0 z-20 opacity-0 transition-opacity delay-200 duration-300 group-hover/conversation-message:opacity-100",
+            'absolute right-0 left-0 z-20 opacity-0 transition-opacity delay-200 duration-300 group-hover/conversation-message:opacity-100',
           )}
         >
           <div className="flex gap-1">
             <CopyButton clipboardData={messageMarkdown} />
-            {!isHuman && messageMarkdown && (
+            {messageMarkdown && (
               <DownloadWordButton
                 markdown={messageMarkdown}
                 fileName="message"
@@ -134,6 +198,128 @@ export function MessageListItem({
   );
 }
 
+/**
+ * Inline copy/edit affordances + editor for the user's own question bubble.
+ *
+ * Layout: bubble → hover toolbar (copy + edit) → timestamp. The toolbar sits
+ * in normal flow above the timestamp (not floating) so it never covers the
+ * following message. Clicking edit turns the bubble into a textarea seeded with
+ * the question; confirming sends the edited text as a brand-new turn (the
+ * original question stays in the thread).
+ */
+function HumanMessageBlock({
+  text,
+  pageContext,
+  filesList,
+  messageTime,
+  components,
+  onEditResubmit,
+}: {
+  text: string;
+  pageContext?: EmbeddedPageContext | null;
+  filesList: React.ReactNode;
+  messageTime: { label: string; full: string } | null;
+  components: MarkdownContentProps["components"];
+  onEditResubmit?: (text: string) => void;
+}) {
+  const { t } = useI18n();
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState(text);
+
+  useEffect(() => {
+    if (!editing) {
+      setDraft(text);
+    }
+  }, [text, editing]);
+
+  const confirmEdit = useCallback(() => {
+    const value = draft.trim();
+    if (!value) {
+      return;
+    }
+    onEditResubmit?.(value);
+    setEditing(false);
+  }, [draft, onEditResubmit]);
+
+  if (editing) {
+    return (
+      <div className="ml-auto flex w-full max-w-[min(85%,42rem)] flex-col gap-2">
+        {filesList}
+        <Textarea
+          value={draft}
+          autoFocus
+          onChange={(event) => setDraft(event.currentTarget.value)}
+          onKeyDown={(event) => {
+            if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+              event.preventDefault();
+              confirmEdit();
+            }
+            if (event.key === "Escape") {
+              event.preventDefault();
+              setEditing(false);
+            }
+          }}
+          className="min-h-20 resize-none text-[15px] leading-7"
+        />
+        <div className="flex items-center justify-end gap-2">
+          <Button
+            size="sm"
+            variant="ghost"
+            onClick={() => setEditing(false)}
+          >
+            {t.common.cancel}
+          </Button>
+          <Button size="sm" onClick={confirmEdit} disabled={!draft.trim()}>
+            {t.common.confirm}
+          </Button>
+        </div>
+      </div>
+    );
+  }
+
+  const messageResponse = text ? (
+    <AIElementMessageResponse
+      remarkPlugins={humanMessagePlugins.remarkPlugins}
+      rehypePlugins={humanMessagePlugins.rehypePlugins}
+      components={components}
+      parseIncompleteMarkdown={false}
+    >
+      {text}
+    </AIElementMessageResponse>
+  ) : null;
+
+  return (
+    <div className="ml-auto flex flex-col items-end gap-1">
+      {filesList}
+      {messageResponse && (
+        <AIElementMessageContent className="w-fit">
+          {messageResponse}
+        </AIElementMessageContent>
+      )}
+      <MessageTimeStamp time={messageTime} align="right" />
+      {pageContext && <EmbeddedPageContextCard pageContext={pageContext} />}
+      {text && (
+        <div className="flex items-center gap-0.5 opacity-0 transition-opacity duration-200 group-hover/conversation-message:opacity-100">
+          <CopyButton clipboardData={text} className="size-6" />
+          {onEditResubmit && (
+            <Tooltip content={t.inputBox.editQuestion}>
+              <Button
+                size="icon-sm"
+                type="button"
+                variant="ghost"
+                className="size-6"
+                onClick={() => setEditing(true)}
+              >
+                <PencilIcon size={11} />
+              </Button>
+            </Tooltip>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
+
 /**
  * Custom image component that handles artifact URLs
  */
@@ -141,7 +327,7 @@ function MessageImage({
   src,
   alt,
   threadId,
-  maxWidth = "90%",
+  maxWidth = '90%',
   ...props
 }: React.ImgHTMLAttributes<HTMLImageElement> & {
   threadId: string;
@@ -150,13 +336,13 @@ function MessageImage({
   const resolveArtifact = useArtifactResolver(threadId);
   if (!src) return null;
 
-  const imgClassName = cn("overflow-hidden rounded-lg", `max-w-[${maxWidth}]`);
+  const imgClassName = cn('overflow-hidden rounded-lg', `max-w-[${maxWidth}]`);
 
-  if (typeof src !== "string") {
+  if (typeof src !== 'string') {
     return <img className={imgClassName} src={src} alt={alt} {...props} />;
   }
 
-  const url = src.startsWith("/mnt/") ? resolveArtifact(src) : src;
+  const url = src.startsWith('/mnt/') ? resolveArtifact(src) : src;
 
   return (
     <a href={url} target="_blank" rel="noopener noreferrer">
@@ -173,6 +359,7 @@ function MessageContent_({
   tokenUsageEnabled = false,
   displaySources = [],
   extraRehypePlugins,
+  onEditResubmit,
 }: {
   className?: string;
   message: Message;
@@ -181,6 +368,7 @@ function MessageContent_({
   tokenUsageEnabled?: boolean;
   displaySources?: RuntimeDisplaySource[];
   extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
+  onEditResubmit?: (text: string) => void;
 }) {
   const baseRehypePlugins = useRehypeSplitWordsIntoSpans(isLoading);
 
@@ -196,11 +384,14 @@ function MessageContent_({
   }, [extraRehypePlugins]);
 
   const rehypePlugins = useMemo(
-    () => (stableExtraPlugins.length ? [...stableExtraPlugins, ...baseRehypePlugins] : baseRehypePlugins),
+    () =>
-    [stableExtraPlugins, baseRehypePlugins],
+      extraRehypePlugins?.length
+        ? [...baseRehypePlugins, ...extraRehypePlugins]
+        : baseRehypePlugins,
+    [baseRehypePlugins, extraRehypePlugins],
   );
   const askTimes = useChatAskTimes();
-  const isHuman = message.type === "human";
+  const isHuman = message.type === 'human';
   const resolveArtifact = useArtifactResolver(threadId);
   const components = useMemo(
     () => ({
@@ -208,13 +399,16 @@ function MessageContent_({
         <MessageImage {...props} threadId={threadId} maxWidth="90%" />
       ),
       a: ({ href, ...props }: AnchorHTMLAttributes<HTMLAnchorElement>) => {
-        if (href?.startsWith("#reference-")) {
+        if (href?.startsWith('#reference-')) {
           return <CitationLink href={href} {...props} />;
         }
-        if (typeof props.children === "string" && /^citation:/i.test(props.children)) {
+        if (
+          typeof props.children === 'string' &&
+          /^citation:/i.test(props.children)
+        ) {
           return <CitationLink href={href} {...props} />;
         }
-        if (href?.startsWith("/mnt/")) {
+        if (href?.startsWith('/mnt/')) {
           const url = resolveArtifact(href);
           return (
             <a
@@ -242,7 +436,7 @@ function MessageContent_({
   const files = useMemo(() => {
     const files = message.additional_kwargs?.files;
     if (!Array.isArray(files) || files.length === 0) {
-      if (rawContent.includes("<uploaded_files>")) {
+      if (rawContent.includes('<uploaded_files>')) {
         // If the content contains the <uploaded_files> tag, we return the parsed files from the content for backward compatibility.
         return parseUploadedFiles(rawContent);
       }
@@ -253,10 +447,19 @@ function MessageContent_({
 
   const contentToDisplay = useMemo(() => {
     if (isHuman) {
-      return rawContent ? stripArtifactTag(stripUploadedFilesTag(rawContent)) : "";
+      return rawContent
+        ? stripArtifactTag(stripUploadedFilesTag(rawContent))
+        : '';
     }
-    return applyInlineCitations(rawContent ?? "", displaySources);
+    return applyInlineCitations(rawContent ?? '', displaySources);
   }, [rawContent, isHuman, displaySources]);
+  const parsedHumanContent = useMemo(
+    () =>
+      isHuman
+        ? parseEmbeddedPageContext(contentToDisplay)
+        : { content: contentToDisplay, pageContext: null },
+    [contentToDisplay, isHuman],
+  );
 
   const filesList =
     files && files.length > 0 ? (
@@ -264,14 +467,14 @@ function MessageContent_({
     ) : null;
 
   // Uploading state: mock AI message shown while files upload
-  if (message.additional_kwargs?.element === "task") {
+  if (message.additional_kwargs?.element === 'task') {
     return (
       <AIElementMessageContent className={className}>
         <Task defaultOpen={false}>
           <TaskTrigger title="">
             <div className="text-muted-foreground flex w-full cursor-default items-center gap-2 text-sm select-none">
               <Loader className="size-4" />
-              <span>{desensitize(contentToDisplay)}</span>
+              <span>{contentToDisplay}</span>
             </div>
           </TaskTrigger>
         </Task>
@@ -285,7 +488,7 @@ function MessageContent_({
       <AIElementMessageContent className={className}>
         <Reasoning isStreaming={isLoading}>
           <ReasoningTrigger />
-          <ReasoningContent>{desensitize(reasoningContent)}</ReasoningContent>
+          <ReasoningContent>{reasoningContent}</ReasoningContent>
         </Reasoning>
         <MessageTokenUsage
           enabled={tokenUsageEnabled}
@@ -297,26 +500,15 @@ function MessageContent_({
   }
 
   if (isHuman) {
-    const messageResponse = contentToDisplay ? (
-      <AIElementMessageResponse
-        remarkPlugins={humanMessagePlugins.remarkPlugins}
-        rehypePlugins={humanMessagePlugins.rehypePlugins}
-        components={components}
-        parseIncompleteMarkdown={false}
-      >
-        {desensitize(contentToDisplay)}
-      </AIElementMessageResponse>
-    ) : null;
     return (
-      <div className={cn("ml-auto flex flex-col gap-2", className)}>
+      <HumanMessageBlock
-        {filesList}
+        text={parsedHumanContent.content}
-        {messageResponse && (
+        pageContext={parsedHumanContent.pageContext}
-          <AIElementMessageContent className="w-fit">
+        filesList={filesList}
-            {messageResponse}
+        messageTime={messageTime}
-          </AIElementMessageContent>
+        components={components}
-        )}
+        onEditResubmit={onEditResubmit}
-        <MessageTimeStamp time={messageTime} align="right" />
+      />
-      </div>
     );
   }
 
@@ -329,7 +521,7 @@ function MessageContent_({
           displaySources={displaySources}
           isLoading={isLoading}
           renderSkillDisplayBlocks={false}
-          rehypePlugins={[...rehypePlugins, [rehypeKatex, { output: "html" }]]}
+          rehypePlugins={[...rehypePlugins, [rehypeKatex, { output: 'html' }]]}
           components={components}
         />
       </div>
@@ -345,6 +537,27 @@ function MessageContent_({
   );
 }
 
+function EmbeddedPageContextCard({
+  pageContext,
+}: {
+  pageContext: EmbeddedPageContext;
+}) {
+  const previewText = [pageContext.title, pageContext.url, pageContext.content]
+    .filter(Boolean)
+    .join(' | ');
+
+  return (
+    <div className="bg-muted/70 ml-auto flex w-fit min-w-0 max-w-[min(24rem,calc(100vw-2rem),100%)] flex-col gap-2 rounded-2xl border px-3 py-2 text-sm shadow-sm">
+      <div
+        className="text-muted-foreground line-clamp-2 min-w-0 [overflow-wrap:anywhere] break-words text-xs"
+        title={previewText}
+      >
+        {previewText}
+      </div>
+    </div>
+  );
+}
+
 /**
  * Format a wall-clock message time as ``YYYY-MM-DD HH:mm`` for display, plus a
  * full localized string for the hover title. Returns ``null`` when no/invalid
@@ -353,10 +566,10 @@ function MessageContent_({
 function formatAskedTime(
   clientTs: unknown,
 ): { label: string; full: string } | null {
-  if (typeof clientTs !== "string" || !clientTs) return null;
+  if (typeof clientTs !== 'string' || !clientTs) return null;
   const date = new Date(clientTs);
   if (Number.isNaN(date.getTime())) return null;
-  const pad = (n: number) => String(n).padStart(2, "0");
+  const pad = (n: number) => String(n).padStart(2, '0');
   const label =
     `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}` +
     ` ${pad(date.getHours())}:${pad(date.getMinutes())}`;
@@ -369,17 +582,17 @@ function formatAskedTime(
  */
 function MessageTimeStamp({
   time,
-  align = "right",
+  align = 'right',
 }: {
   time: { label: string; full: string } | null;
-  align?: "left" | "right";
+  align?: 'left' | 'right';
 }) {
   if (!time) return null;
   return (
     <div
       className={cn(
-        "text-muted-foreground/60 flex items-center gap-1 text-[11px] leading-none tabular-nums",
+        'text-muted-foreground/60 flex items-center gap-1 text-[11px] leading-none tabular-nums',
-        align === "right" ? "justify-end pr-0.5" : "justify-start pl-0.5",
+        align === 'right' ? 'justify-end pr-0.5' : 'justify-start pl-0.5',
       )}
       title={time.full}
     >
@@ -393,39 +606,39 @@ function MessageTimeStamp({
  * Get file extension and check helpers
  */
 const getFileExt = (filename: string) =>
-  filename.split(".").pop()?.toLowerCase() ?? "";
+  filename.split('.').pop()?.toLowerCase() ?? '';
 
 const FILE_TYPE_MAP: Record<string, string> = {
-  json: "JSON",
+  json: 'JSON',
-  csv: "CSV",
+  csv: 'CSV',
-  txt: "TXT",
+  txt: 'TXT',
-  md: "Markdown",
+  md: 'Markdown',
-  py: "Python",
+  py: 'Python',
-  js: "JavaScript",
+  js: 'JavaScript',
-  ts: "TypeScript",
+  ts: 'TypeScript',
-  tsx: "TSX",
+  tsx: 'TSX',
-  jsx: "JSX",
+  jsx: 'JSX',
-  html: "HTML",
+  html: 'HTML',
-  css: "CSS",
+  css: 'CSS',
-  xml: "XML",
+  xml: 'XML',
-  yaml: "YAML",
+  yaml: 'YAML',
-  yml: "YAML",
+  yml: 'YAML',
-  pdf: "PDF",
+  pdf: 'PDF',
-  png: "PNG",
+  png: 'PNG',
-  jpg: "JPG",
+  jpg: 'JPG',
-  jpeg: "JPEG",
+  jpeg: 'JPEG',
-  gif: "GIF",
+  gif: 'GIF',
-  svg: "SVG",
+  svg: 'SVG',
-  zip: "ZIP",
+  zip: 'ZIP',
-  tar: "TAR",
+  tar: 'TAR',
-  gz: "GZ",
+  gz: 'GZ',
 };
 
-const IMAGE_EXTENSIONS = ["png", "jpg", "jpeg", "gif", "webp", "svg", "bmp"];
+const IMAGE_EXTENSIONS = ['png', 'jpg', 'jpeg', 'gif', 'webp', 'svg', 'bmp'];
 
 function getFileTypeLabel(filename: string): string {
   const ext = getFileExt(filename);
-  return FILE_TYPE_MAP[ext] ?? (ext.toUpperCase() || "FILE");
+  return FILE_TYPE_MAP[ext] ?? (ext.toUpperCase() || 'FILE');
 }
 
 function isImageFile(filename: string): boolean {
@@ -436,7 +649,7 @@ function isImageFile(filename: string): boolean {
  * Format bytes to human-readable size string
  */
 function formatBytes(bytes: number): string {
-  if (bytes === 0) return "—";
+  if (bytes === 0) return '0 B';
   const kb = bytes / 1024;
   if (kb < 1024) return `${kb.toFixed(1)} KB`;
   return `${(kb / 1024).toFixed(1)} MB`;
@@ -478,8 +691,17 @@ function RichFileCard({
 }) {
   const { t } = useI18n();
   const resolveArtifact = useArtifactResolver(threadId);
-  const isUploading = file.status === "uploading";
+  const [previewOpen, setPreviewOpen] = useState(false);
+  const isUploading = file.status === 'uploading';
   const isImage = isImageFile(file.filename);
+  const fileUrl = file.path ? resolveArtifact(file.path) : null;
+  // Thumbnails must be fetched with auth: the artifact route is gated and a
+  // plain <img src> sends no Authorization header → 401 (broken image). Fetch
+  // the bytes via apiFetch and display the resulting object URL instead.
+  const { objectUrl: thumbUrl, loading: thumbLoading } = useAuthedObjectUrl(
+    fileUrl,
+    isImage && !isUploading && !!fileUrl,
+  );
 
   if (isUploading) {
     return (
@@ -508,50 +730,81 @@ function RichFileCard({
     );
   }
 
-  if (!file.path) return null;
+  if (!fileUrl) return null;
 
-  const fileUrl = resolveArtifact(file.path);
+  const preview = (
+    <UploadedFilePreviewDialog
+      filename={file.filename}
+      fileUrl={fileUrl}
+      open={previewOpen}
+      onOpenChange={setPreviewOpen}
+    />
+  );
 
   if (isImage) {
     return (
-      <a
+      <>
-        href={fileUrl}
+        <button
-        target="_blank"
+          type="button"
-        rel="noopener noreferrer"
+          onClick={() => setPreviewOpen(true)}
-        className="group border-border/40 relative block overflow-hidden rounded-lg border"
+          title={file.filename}
-      >
+          className="group border-border/40 relative block cursor-pointer overflow-hidden rounded-lg border"
-        <img
+        >
-          src={fileUrl}
+          {thumbUrl ? (
-          alt={file.filename}
+            <img
-          className="h-32 w-auto max-w-60 object-cover transition-transform group-hover:scale-105"
+              src={thumbUrl}
-        />
+              alt={file.filename}
-      </a>
+              className="h-32 w-auto max-w-60 object-cover transition-transform group-hover:scale-105"
+            />
+          ) : (
+            <div className="bg-muted/40 text-muted-foreground flex h-32 w-44 items-center justify-center gap-2 text-xs">
+              {thumbLoading ? (
+                <Loader2Icon className="size-4 animate-spin" />
+              ) : (
+                <>
+                  <FileIcon className="size-4" />
+                  <span className="truncate">{file.filename}</span>
+                </>
+              )}
+            </div>
+          )}
+        </button>
+        {preview}
+      </>
     );
   }
 
   return (
-    <div className="bg-background border-border/40 flex max-w-50 min-w-30 flex-col gap-1 rounded-lg border p-3 shadow-sm">
+    <>
-      <div className="flex items-start gap-2">
+      <button
-        <FileIcon className="text-muted-foreground mt-0.5 size-4 shrink-0" />
+        type="button"
-        <span
+        onClick={() => setPreviewOpen(true)}
-          className="text-foreground truncate text-sm font-medium"
+        title={file.filename}
-          title={file.filename}
+        className="bg-background border-border/40 hover:bg-accent/50 flex max-w-50 min-w-30 cursor-pointer flex-col gap-1 rounded-lg border p-3 text-left shadow-sm transition-colors"
-        >
+      >
-          {file.filename}
+        <div className="flex items-start gap-2">
-        </span>
+          <FileIcon className="text-muted-foreground mt-0.5 size-4 shrink-0" />
-      </div>
+          <span
-      <div className="flex items-center justify-between gap-2">
+            className="text-foreground truncate text-sm font-medium"
-        <Badge
+            title={file.filename}
-          variant="secondary"
+          >
-          className="rounded px-1.5 py-0.5 text-[10px] font-normal"
+            {file.filename}
-        >
+          </span>
-          {getFileTypeLabel(file.filename)}
+        </div>
-        </Badge>
+        <div className="flex items-center justify-between gap-2">
-        <span className="text-muted-foreground text-[10px]">
+          <Badge
-          {formatBytes(file.size)}
+            variant="secondary"
-        </span>
+            className="rounded px-1.5 py-0.5 text-[10px] font-normal"
-      </div>
+          >
-    </div>
+            {getFileTypeLabel(file.filename)}
+          </Badge>
+          <span className="text-muted-foreground text-[10px]">
+            {formatBytes(file.size)}
+          </span>
+        </div>
+      </button>
+      {preview}
+    </>
   );
 }
 
@@ -569,8 +822,8 @@ function AssistantDisplayContent({
   displaySources: RuntimeDisplaySource[];
   isLoading: boolean;
   renderSkillDisplayBlocks: boolean;
-  rehypePlugins: MarkdownContentProps["rehypePlugins"];
+  rehypePlugins: MarkdownContentProps['rehypePlugins'];
-  components: MarkdownContentProps["components"];
+  components: MarkdownContentProps['components'];
 }) {
   const { parts, placedKeys } = useMemo(
     () =>
@@ -586,14 +839,14 @@ function AssistantDisplayContent({
       return [];
     }
     return groupDisplaySources(displaySources).filter(
-      (group) => group.mode !== "citation" && !placedKeys.has(group.key),
+      (group) => group.mode !== 'citation' && !placedKeys.has(group.key),
     );
   }, [displaySources, placedKeys, renderSkillDisplayBlocks]);
 
   return (
     <>
       {parts.map((part, index) =>
-        part.type === "markdown" ? (
+        part.type === 'markdown' ? (
           <MarkdownContent
             key={`markdown-${index}`}
             content={part.content}
@@ -622,11 +875,11 @@ function AssistantDisplayContent({
 }
 
 type DisplayPart =
-  | { type: "markdown"; content: string }
+  | { type: 'markdown'; content: string }
   | {
-      type: "display";
+      type: 'display';
       key: string;
-      mode: RuntimeDisplaySource["mode"];
+      mode: RuntimeDisplaySource['mode'];
       sources: RuntimeDisplaySource[];
     };
 
@@ -643,16 +896,16 @@ function splitSkillDisplayPlaceholders(
     const start = match.index ?? 0;
     const before = content.slice(cursor, start);
     if (before.trim()) {
-      parts.push({ type: "markdown", content: before });
+      parts.push({ type: 'markdown', content: before });
     }
-    const attrs = parseDisplayAttrs(match[1] ?? "");
+    const attrs = parseDisplayAttrs(match[1] ?? '');
     const group = findDisplayGroup(displaySources, attrs.tool, attrs.mode);
     if (group) {
       placedKeys.add(group.key);
     }
     if (group && renderSkillDisplayBlocks) {
       parts.push({
-        type: "display",
+        type: 'display',
         key: group.key,
         mode: group.mode,
         sources: group.sources,
@@ -662,26 +915,29 @@ function splitSkillDisplayPlaceholders(
   }
   const rest = content.slice(cursor);
   if (rest.trim() || parts.length === 0) {
-    parts.push({ type: "markdown", content: rest });
+    parts.push({ type: 'markdown', content: rest });
   }
   return { parts, placedKeys };
 }
 
-function parseDisplayAttrs(raw: string): { tool?: string; mode?: RuntimeDisplaySource["mode"] } {
+function parseDisplayAttrs(raw: string): {
+  tool?: string;
+  mode?: RuntimeDisplaySource['mode'];
+} {
   const attrs: Record<string, string> = {};
   for (const match of raw.matchAll(/([a-zA-Z][\w-]*)="([^"]*)"/g)) {
     attrs[match[1]!] = match[2]!;
   }
   return {
     tool: attrs.tool || attrs.skill || attrs.name,
-    mode: attrs.mode as RuntimeDisplaySource["mode"] | undefined,
+    mode: attrs.mode as RuntimeDisplaySource['mode'] | undefined,
   };
 }
 
 function findDisplayGroup(
   sources: RuntimeDisplaySource[],
   tool?: string,
-  mode?: RuntimeDisplaySource["mode"],
+  mode?: RuntimeDisplaySource['mode'],
 ) {
   return groupDisplaySources(sources).find((group) => {
     if (mode && group.mode !== mode) {
@@ -702,20 +958,18 @@ function groupDisplaySources(sources: RuntimeDisplaySource[]) {
     {
       key: string;
       skillName: string;
-      mode: RuntimeDisplaySource["mode"];
+      mode: RuntimeDisplaySource['mode'];
       sources: RuntimeDisplaySource[];
     }
   >();
   for (const source of sources) {
     const key = `${source.skillName}:${source.mode}`;
-    const group =
+    const group = groups.get(key) ?? {
-      groups.get(key) ??
+      key,
-      {
+      skillName: source.skillName,
-        key,
+      mode: source.mode,
-        skillName: source.skillName,
+      sources: [],
-        mode: source.mode,
+    };
-        sources: [],
-      };
     group.sources.push(source);
     groups.set(key, group);
   }
@@ -723,5 +977,5 @@ function groupDisplaySources(sources: RuntimeDisplaySource[]) {
 }
 
 function normalizeName(name: string) {
-  return name.toLowerCase().replace(/[^a-z0-9]+/g, "");
+  return name.toLowerCase().replace(/[^a-z0-9]+/g, '');
 }

frontend-web/src/components/workspace/messages/message-list.tsx

@@ -52,24 +52,34 @@ export const MESSAGE_LIST_FOLLOWUPS_EXTRA_PADDING_BOTTOM = 80;
 
 export function MessageList({
   className,
+  contentClassName,
+  fitMessageRowsToContent = false,
   threadId,
   thread,
   paddingBottom = MESSAGE_LIST_DEFAULT_PADDING_BOTTOM,
   tokenUsageEnabled = false,
   extraRehypePlugins,
   onClarificationSubmit,
+  onEditResubmit,
   onSetupAgentApprove,
   onSetupAgentReject,
+  onSetupWritingApprove,
+  onSetupWritingReject,
 }: {
   className?: string;
+  contentClassName?: string;
+  fitMessageRowsToContent?: boolean;
   threadId: string;
   thread: BaseStream<AgentThreadState>;
   paddingBottom?: number;
   tokenUsageEnabled?: boolean;
   extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
   onClarificationSubmit?: (answer: string) => void | Promise<void>;
+  onEditResubmit?: (text: string) => void;
   onSetupAgentApprove?: (payload: SetupAgentApprovalPayload) => void | Promise<void>;
   onSetupAgentReject?: (payload: SetupAgentApprovalPayload) => void | Promise<void>;
+  onSetupWritingApprove?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
+  onSetupWritingReject?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
 }) {
   const baseRehypePlugins = useRehypeSplitWordsIntoSpans(thread.isLoading);
   const rehypePlugins = useMemo(
@@ -77,6 +87,7 @@ export function MessageList({
     [baseRehypePlugins, extraRehypePlugins],
   );
   const updateSubtask = useUpdateSubtask();
+  const { t } = useI18n();
   const messages = thread.messages;
 
   // Stamp a wall-clock time onto every question/answer the first time it is
@@ -217,7 +228,12 @@ export function MessageList({
     <Conversation
       className={cn("flex size-full flex-col justify-center", className)}
     >
-      <ConversationContent className="mx-auto w-full max-w-(--container-width-lg) gap-8 pt-12">
+      <ConversationContent
+        className={cn(
+          "mx-auto w-full max-w-(--container-width-lg) gap-8 pt-12",
+          contentClassName,
+        )}
+      >
         <MessageMetricsProvider messages={messages} isLoading={thread.isLoading}>
         {groupMessages(messages, (group) => {
           if (group.type === "human" || group.type === "assistant") {
@@ -235,12 +251,14 @@ export function MessageList({
               return (
                 <MessageListItem
                   key={`${group.id}/${msg.id}`}
+                  fitRowToContent={fitMessageRowsToContent}
                   message={msg}
                   isLoading={thread.isLoading}
                   threadId={threadId}
                   tokenUsageEnabled={tokenUsageEnabled}
                   displaySources={displaySources}
                   extraRehypePlugins={extraRehypePlugins}
+                  onEditResubmit={onEditResubmit}
                 />
               );
             });
@@ -307,6 +325,23 @@ export function MessageList({
                 />
               </div>
             ) : null;
+          } else if (group.type === "assistant:setup-writing-approval") {
+            const message = group.messages[0];
+            return message ? (
+              <div key={group.id} className="w-full">
+                <SetupWritingApprovalCard
+                  disabled={thread.isLoading}
+                  message={message}
+                  onApprove={onSetupWritingApprove}
+                  onReject={onSetupWritingReject}
+                />
+                <MessageTokenUsageList
+                  enabled={tokenUsageEnabled}
+                  isLoading={thread.isLoading}
+                  messages={group.messages}
+                />
+              </div>
+            ) : null;
           } else if (group.type === "assistant:present-files") {
             const files: string[] = [];
             for (const message of group.messages) {
@@ -485,6 +520,16 @@ export type SetupAgentApprovalPayload = {
   skills?: string[];
 };
 
+export type SetupWritingApprovalPayload = {
+  user_intent?: string;
+  article_type?: string;
+  word_count_target?: number | null;
+  target_audience?: string;
+  writing_mode?: string;
+  material_source?: string;
+  outline?: string;
+};
+
 function findPreviousHumanMessageId(
   messages: Message[],
   beforeMessageId?: string,
@@ -635,6 +680,155 @@ function SetupAgentApprovalCard({
   );
 }
 
+function getSetupWritingApprovalPayload(
+  message: unknown,
+): SetupWritingApprovalPayload | null {
+  if (typeof message !== "object" || message === null) {
+    return null;
+  }
+  const additionalKwargs = Reflect.get(message, "additional_kwargs");
+  if (typeof additionalKwargs !== "object" || additionalKwargs === null) {
+    return null;
+  }
+  const approval = Reflect.get(additionalKwargs, "setup_writing_approval");
+  if (typeof approval !== "object" || approval === null) {
+    return null;
+  }
+  return approval as SetupWritingApprovalPayload;
+}
+
+const WRITING_MODE_LABELS: Record<string, string> = {
+  strict: "严格依据素材",
+  loose: "可结合通用知识",
+};
+const MATERIAL_SOURCE_LABELS: Record<string, string> = {
+  knowledge_base: "知识库",
+  skill: "技能检索",
+};
+
+function SetupWritingApprovalCard({
+  disabled,
+  message,
+  onApprove,
+  onReject,
+}: {
+  disabled: boolean;
+  message: unknown;
+  onApprove?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
+  onReject?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
+}) {
+  const payload = getSetupWritingApprovalPayload(message);
+  const [submitting, setSubmitting] = useState<"approve" | "reject" | null>(
+    null,
+  );
+
+  if (!payload) {
+    return null;
+  }
+
+  const approvalPayload = payload;
+  const busy = disabled || submitting !== null;
+
+  async function run(action: "approve" | "reject") {
+    if (busy) {
+      return;
+    }
+    setSubmitting(action);
+    try {
+      if (action === "approve") {
+        await onApprove?.(approvalPayload);
+      } else {
+        await onReject?.(approvalPayload);
+      }
+    } finally {
+      setSubmitting(null);
+    }
+  }
+
+  const rows: Array<{ label: string; value: string }> = [];
+  if (approvalPayload.article_type) {
+    rows.push({ label: "文章类型", value: approvalPayload.article_type });
+  }
+  if (typeof approvalPayload.word_count_target === "number") {
+    rows.push({ label: "目标字数", value: `${approvalPayload.word_count_target} 字` });
+  }
+  if (approvalPayload.target_audience) {
+    rows.push({ label: "目标读者", value: approvalPayload.target_audience });
+  }
+  if (approvalPayload.writing_mode) {
+    rows.push({
+      label: "写作模式",
+      value: WRITING_MODE_LABELS[approvalPayload.writing_mode] ?? approvalPayload.writing_mode,
+    });
+  }
+  if (approvalPayload.material_source) {
+    rows.push({
+      label: "素材来源",
+      value: MATERIAL_SOURCE_LABELS[approvalPayload.material_source] ?? approvalPayload.material_source,
+    });
+  }
+
+  return (
+    <div className="border-border bg-card text-card-foreground w-full rounded-lg border p-4 shadow-sm">
+      <div className="space-y-3">
+        <div>
+          <div className="text-muted-foreground text-xs font-medium">写作配置建议</div>
+          <div className="text-sm font-medium">确认后将应用到左侧写作表单。</div>
+        </div>
+
+        {approvalPayload.user_intent ? (
+          <div className="space-y-1">
+            <div className="text-muted-foreground text-xs">写作意图</div>
+            <p className="text-sm leading-6">{approvalPayload.user_intent}</p>
+          </div>
+        ) : null}
+
+        {rows.length > 0 ? (
+          <div className="flex flex-wrap gap-x-6 gap-y-1.5">
+            {rows.map((row) => (
+              <div key={row.label} className="space-y-0.5">
+                <div className="text-muted-foreground text-xs">{row.label}</div>
+                <p className="text-sm font-medium">{row.value}</p>
+              </div>
+            ))}
+          </div>
+        ) : null}
+
+        {approvalPayload.outline ? (
+          <div className="space-y-1">
+            <div className="text-muted-foreground text-xs">已有大纲</div>
+            <pre className="bg-muted max-h-52 overflow-auto rounded-md p-3 text-xs whitespace-pre-wrap">
+              {approvalPayload.outline}
+            </pre>
+          </div>
+        ) : null}
+      </div>
+
+      <div className="mt-4 flex justify-end gap-2">
+        <Button
+          type="button"
+          variant="outline"
+          size="sm"
+          disabled={busy || !onReject}
+          onClick={() => void run("reject")}
+        >
+          <XIcon className="h-4 w-4" />
+          忽略
+        </Button>
+        <Button
+          type="button"
+          size="sm"
+          disabled={busy || !onApprove}
+          onClick={() => void run("approve")}
+        >
+          <CheckIcon className="h-4 w-4" />
+          应用到表单
+        </Button>
+      </div>
+    </div>
+  );
+}
+
 function getClarificationPayload(message: unknown): ClarificationPayload | null {
   if (typeof message !== "object" || message === null) {
     return null;
@@ -711,9 +905,14 @@ function ClarificationCard({
       return;
     }
     if (!allowMultiple) {
-      const next = { selectedIds: [optionId], custom: "" };
+      // 单选：仅当「只有这一张待答澄清卡」时才点击即发送。多张澄清卡同时出现时，
+      // 点击只记录本卡选择，待最后一张的「全部发送」统一提交——否则点了第一张就立刻
+      // 提交整批，后面的卡片再也无法选择（见 bug：选了第一个，第二个不让选）。
+      const next = { selectedIds: [optionId], custom: selection.custom };
       onSelectionChange(next);
-      void onSubmitAll(next);
+      if (!multiPending) {
+        void onSubmitAll(next);
+      }
       return;
     }
     const next = selection.selectedIds.includes(optionId)
@@ -753,7 +952,11 @@ function ClarificationCard({
       {options.length > 0 ? (
         <div className="mt-4 grid gap-2">
           <div className="text-muted-foreground text-xs">
-            {allowMultiple ? "可多选（再次点击取消选择）" : "请选择一项（点击即发送）"}
+            {allowMultiple
+              ? "可多选（再次点击取消选择）"
+              : multiPending
+                ? "请选择一项"
+                : "请选择一项（点击即发送）"}
           </div>
           {options.map((option) => {
             const optionId = option.id || option.label;
@@ -762,7 +965,7 @@ function ClarificationCard({
               <Button
                 key={optionId}
                 type="button"
-                variant={isSelected && allowMultiple ? "default" : "outline"}
+                variant={isSelected && (allowMultiple || multiPending) ? "default" : "outline"}
                 className="h-auto justify-start whitespace-normal px-3 py-2 text-left"
                 disabled={disabled}
                 onClick={() => handleOptionClick(optionId)}
@@ -782,7 +985,7 @@ function ClarificationCard({
                     </span>
                   ) : null}
                 </span>
-                {isSelected && allowMultiple ? (
+                {isSelected && (allowMultiple || multiPending) ? (
                   <CheckIcon className="ml-2 h-4 w-4 shrink-0" />
                 ) : null}
               </Button>
@@ -807,10 +1010,10 @@ function ClarificationCard({
         </div>
       ) : null}
 
-      {isPending && (allowMultiple || payload.allow_custom !== false) ? (
+      {isPending && (allowMultiple || multiPending || payload.allow_custom !== false) ? (
         isLastPending ? (
           <div className="mt-3 flex items-center justify-end gap-2">
-            {multiPending && allowMultiple ? (
+            {multiPending ? (
               <span className="text-muted-foreground text-xs">
                 将一起提交以上 {pendingCount} 个问题的回答
               </span>
@@ -822,10 +1025,10 @@ function ClarificationCard({
               onClick={() => void onSubmitAll()}
             >
               <SendIcon className="h-4 w-4" />
-              {submitting ? "发送中…" : multiPending && allowMultiple ? "全部发送" : "发送回答"}
+              {submitting ? "发送中…" : multiPending ? "全部发送" : "发送回答"}
             </Button>
           </div>
-        ) : allowMultiple ? (
+        ) : allowMultiple || multiPending ? (
           <div className="text-muted-foreground mt-3 text-right text-xs">
             选择后等待最后一题统一提交
           </div>

frontend-web/src/components/workspace/messages/uploaded-file-preview-dialog.tsx

@@ -0,0 +1,278 @@
+"use client";
+
+import { DownloadIcon, Loader2 } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { MarkdownContent } from "@/components/workspace/messages/markdown-content";
+import { apiFetch } from "@/core/api/fetch-client";
+import { useI18n } from "@/core/i18n/hooks";
+import { reasoningPlugins } from "@/core/streamdown";
+
+const markdownClassName =
+  "!h-auto !w-full max-w-none min-w-0 text-sm leading-7 " +
+  "[&_h1]:mt-0 [&_h1]:mb-3 [&_h1]:text-xl [&_h1]:font-semibold " +
+  "[&_h2]:mt-6 [&_h2]:mb-2 [&_h2]:border-b [&_h2]:pb-2 [&_h2]:text-lg [&_h2]:font-semibold " +
+  "[&_h3]:mt-5 [&_h3]:mb-2 [&_h3]:text-base [&_h3]:font-semibold " +
+  "[&_p]:my-3 [&_ul]:my-3 [&_ol]:my-3 [&_li]:my-1.5 " +
+  "[&_ul]:list-disc [&_ol]:list-decimal [&_ul]:pl-5 [&_ol]:pl-5 " +
+  "[&_table]:my-4 [&_table]:w-full [&_table]:border-collapse " +
+  "[&_th]:border [&_th]:px-2 [&_th]:py-1 [&_td]:border [&_td]:px-2 [&_td]:py-1 " +
+  "[&_blockquote]:my-4 [&_blockquote]:border-l-4 [&_blockquote]:pl-4 [&_blockquote]:text-muted-foreground " +
+  "[&_code]:rounded [&_code]:border [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_code]:font-mono [&_code]:text-xs " +
+  "[&_pre]:my-4 [&_pre]:max-w-full [&_pre]:overflow-x-auto [&_pre]:rounded-lg [&_pre]:border [&_pre]:bg-muted [&_pre]:p-4 " +
+  "[&_pre_code]:border-0 [&_pre_code]:bg-transparent [&_pre_code]:p-0";
+
+const IMAGE_EXT = ["png", "jpg", "jpeg", "gif", "webp", "svg", "bmp"];
+const TEXT_EXT = [
+  "txt", "md", "markdown", "csv", "tsv", "json", "log", "yaml", "yml",
+  "xml", "html", "htm", "css", "js", "ts", "tsx", "jsx", "py", "java",
+  "go", "rs", "c", "cpp", "h", "hpp", "sh", "sql", "ini", "toml", "env",
+];
+// Office documents are converted to a sibling Markdown file server-side
+// (uploads.auto_convert_documents). We preview that .md instead of the binary.
+const OFFICE_EXT = ["xlsx", "xls", "docx", "doc", "pptx", "ppt"];
+
+function extOf(filename: string): string {
+  const i = filename.lastIndexOf(".");
+  return i >= 0 ? filename.slice(i + 1).toLowerCase() : "";
+}
+
+type PreviewKind = "image" | "text" | "office" | "pdf" | "binary";
+
+function kindOf(filename: string): PreviewKind {
+  const ext = extOf(filename);
+  if (IMAGE_EXT.includes(ext)) return "image";
+  if (ext === "pdf") return "pdf";
+  if (OFFICE_EXT.includes(ext)) return "office";
+  if (TEXT_EXT.includes(ext)) return "text";
+  return "binary";
+}
+
+function withReplacedExtension(url: string): string {
+  // Replace the path extension with .md, keeping any query string intact.
+  const [base, query] = url.split("?");
+  const i = base.lastIndexOf(".");
+  const swapped = (i >= 0 ? base.slice(0, i) : base) + ".md";
+  return query ? `${swapped}?${query}` : swapped;
+}
+
+/**
+ * Fetch an auth-gated artifact (the artifact route requires an
+ * `Authorization: Bearer` header, which a plain <img>/<iframe> cannot send —
+ * hence the 401s) and expose it as an object URL for inline display.
+ */
+export function useAuthedObjectUrl(url: string | null, enabled: boolean) {
+  const [objectUrl, setObjectUrl] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!enabled || !url) {
+      setObjectUrl(null);
+      return;
+    }
+    let cancelled = false;
+    let created: string | null = null;
+    setLoading(true);
+    setError(null);
+    apiFetch(url)
+      .then(async (res) => {
+        if (!res.ok) throw new Error(`HTTP ${res.status}`);
+        return res.blob();
+      })
+      .then((blob) => {
+        if (cancelled) return;
+        created = URL.createObjectURL(blob);
+        setObjectUrl(created);
+      })
+      .catch((err: unknown) => {
+        if (!cancelled)
+          setError(err instanceof Error ? err.message : String(err));
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false);
+      });
+    return () => {
+      cancelled = true;
+      if (created) URL.revokeObjectURL(created);
+    };
+  }, [url, enabled]);
+
+  return { objectUrl, loading, error };
+}
+
+/**
+ * Preview dialog for a file attached to a chat message. All fetches go through
+ * `apiFetch` so the `Authorization` header is attached (artifacts are auth-gated).
+ *
+ * - image  → fetched as blob, rendered inline
+ * - text   → fetched and shown (markdown rendered for .md, otherwise <pre>)
+ * - office → fetches the server-converted sibling `<name>.md` and renders it
+ * - pdf    → fetched as blob, embedded via <iframe>
+ * - else   → download link
+ */
+export function UploadedFilePreviewDialog({
+  filename,
+  fileUrl,
+  open,
+  onOpenChange,
+}: {
+  filename: string;
+  /** Absolute artifact URL for the original uploaded file. */
+  fileUrl: string;
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}) {
+  const { t } = useI18n();
+  const kind = useMemo(() => kindOf(filename), [filename]);
+  const ext = useMemo(() => extOf(filename), [filename]);
+
+  // image / pdf → fetch as authed blob and display via object URL.
+  const blobEnabled = open && (kind === "image" || kind === "pdf");
+  const { objectUrl, loading: blobLoading, error: blobError } =
+    useAuthedObjectUrl(fileUrl, blobEnabled);
+
+  // text / office → fetch text (office reads the converted sibling .md).
+  const textUrl = useMemo(
+    () => (kind === "office" ? withReplacedExtension(fileUrl) : fileUrl),
+    [kind, fileUrl],
+  );
+  const [text, setText] = useState<string | null>(null);
+  const [textLoading, setTextLoading] = useState(false);
+  const [textError, setTextError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!open || (kind !== "text" && kind !== "office")) return;
+    let cancelled = false;
+    setTextLoading(true);
+    setTextError(null);
+    setText(null);
+    apiFetch(textUrl)
+      .then(async (res) => {
+        if (!res.ok) throw new Error(`HTTP ${res.status}`);
+        return res.text();
+      })
+      .then((body) => {
+        if (!cancelled) setText(body);
+      })
+      .catch((err: unknown) => {
+        if (!cancelled)
+          setTextError(err instanceof Error ? err.message : String(err));
+      })
+      .finally(() => {
+        if (!cancelled) setTextLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [open, kind, textUrl]);
+
+  const renderAsMarkdown =
+    kind === "office" || ext === "md" || ext === "markdown";
+
+  const loadingView = (
+    <div className="text-muted-foreground flex items-center justify-center gap-2 py-12 text-sm">
+      <Loader2 className="size-4 animate-spin" />
+      {t.common.loading}
+    </div>
+  );
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent
+        className="flex flex-col gap-0 overflow-hidden p-0"
+        style={{
+          width: "min(56rem, calc(100vw - 2rem))",
+          maxWidth: "none",
+          height: "min(720px, calc(100dvh - 2rem))",
+        }}
+      >
+        <DialogHeader className="shrink-0 border-b px-5 py-3 pr-12">
+          <DialogTitle className="truncate text-sm">{filename}</DialogTitle>
+          <DialogDescription className="mt-0.5 truncate text-xs">
+            <a
+              href={fileUrl}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="hover:text-foreground inline-flex items-center gap-1 underline-offset-2 hover:underline"
+            >
+              <DownloadIcon className="size-3" />
+              {t.common.download}
+            </a>
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="min-h-0 flex-1 overflow-auto px-5 py-4">
+          {kind === "image" ? (
+            blobLoading ? (
+              loadingView
+            ) : blobError || !objectUrl ? (
+              <BinaryFallback fileUrl={fileUrl} label={t.common.download} />
+            ) : (
+              <div className="flex items-center justify-center">
+                <img
+                  src={objectUrl}
+                  alt={filename}
+                  className="max-h-full max-w-full rounded border"
+                />
+              </div>
+            )
+          ) : kind === "pdf" ? (
+            blobLoading ? (
+              loadingView
+            ) : blobError || !objectUrl ? (
+              <BinaryFallback fileUrl={fileUrl} label={t.common.download} />
+            ) : (
+              <iframe
+                src={objectUrl}
+                title={filename}
+                className="h-full min-h-[500px] w-full rounded border"
+              />
+            )
+          ) : kind === "text" || kind === "office" ? (
+            textLoading ? (
+              loadingView
+            ) : textError ? (
+              <BinaryFallback fileUrl={fileUrl} label={t.common.download} />
+            ) : renderAsMarkdown ? (
+              <MarkdownContent
+                className={markdownClassName}
+                content={text ?? ""}
+                isLoading={false}
+                remarkPlugins={reasoningPlugins.remarkPlugins}
+                rehypePlugins={reasoningPlugins.rehypePlugins}
+              />
+            ) : (
+              <pre className="text-foreground/80 bg-muted/40 max-w-full overflow-x-auto rounded-lg border p-4 font-mono text-xs leading-relaxed whitespace-pre-wrap">
+                {text ?? ""}
+              </pre>
+            )
+          ) : (
+            <BinaryFallback fileUrl={fileUrl} label={t.common.download} />
+          )}
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+function BinaryFallback({ fileUrl, label }: { fileUrl: string; label: string }) {
+  return (
+    <div className="text-muted-foreground flex flex-col items-center gap-3 rounded-lg border border-dashed px-4 py-12 text-center text-sm">
+      <Button asChild size="sm" variant="outline">
+        <a href={fileUrl} target="_blank" rel="noopener noreferrer" download>
+          <DownloadIcon className="size-3.5" />
+          {label}
+        </a>
+      </Button>
+    </div>
+  );
+}

frontend-web/src/components/workspace/recent-chat-list.tsx

@@ -213,7 +213,7 @@ export function RecentChatList() {
                         className="block w-full whitespace-nowrap group-hover/side-menu-item:overflow-hidden"
                         href={pathOfThread(thread)}
                       >
-                        {desensitize(titleOfThread(thread))}
+                        {desensitize(titleOfThread(thread, t.pages.newChat))}
                       </Link>
                     </SidebarMenuButton>
                     {env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY !== "true" && (
@@ -236,7 +236,7 @@ export function RecentChatList() {
                             onSelect={() =>
                               handleRenameClick(
                                 thread.thread_id,
-                                titleOfThread(thread),
+                                titleOfThread(thread, t.pages.newChat),
                               )
                             }
                           >

frontend-web/src/components/workspace/settings/appearance-settings-page.tsx

@@ -6,6 +6,7 @@ import { toast } from "sonner";
 
 import { useTheme } from "@/contexts/ThemeContext";
 
+import { FONT_SCALE_OPTIONS } from "@/components/font-scale";
 import { Button } from "@/components/ui/button";
 import {
   Select,
@@ -147,6 +148,39 @@ export function AppearanceSettingsPage() {
 
       <Separator />
 
+      <SettingsSection
+        title="字号"
+        description="调整界面整体字号，方便放大或缩小阅读。默认 16px（标准）。"
+      >
+        <div className="space-y-3">
+          <Select
+            value={String(settings.display.fontScale ?? 1)}
+            onValueChange={(value) => {
+              const scale = Number(value);
+              if (Number.isFinite(scale) && scale > 0) {
+                setSettings("display", { fontScale: scale });
+              }
+            }}
+          >
+            <SelectTrigger className="w-[220px]">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent>
+              {FONT_SCALE_OPTIONS.map((item) => (
+                <SelectItem key={item.value} value={String(item.value)}>
+                  {item.label}（{item.px}px）
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          <div className="text-muted-foreground rounded-lg border p-4 text-sm leading-relaxed">
+            预览：多智能体圆桌研讨 · The quick brown fox · 0123456789
+          </div>
+        </div>
+      </SettingsSection>
+
+      <Separator />
+
       <SettingsSection
         title={t.settings.appearance.languageTitle}
         description={t.settings.appearance.languageDescription}

frontend-web/src/components/workspace/settings/memory-settings-page.tsx

@@ -229,7 +229,7 @@ export function MemorySettingsPage() {
                 <SelectTrigger className="h-8 w-44" size="sm">
                   <SelectValue />
                 </SelectTrigger>
-                <SelectContent>
+                <SelectContent position="popper" side="bottom" sideOffset={4}>
                   <SelectItem value="default">
                     {m.workNotesDefaultAgent}
                   </SelectItem>
@@ -490,7 +490,7 @@ function MemoryV1View({
   return (
     <div className="space-y-3">
       {/* 说明横幅 */}
-      <div className="rounded-md border border-dashed px-4 py-3 text-sm text-muted-foreground">
+      <div className="rounded-md border border-dashed px-4 py-3 text-sm text-muted-foreground dark:border-[#213D5E] dark:bg-[#022248]">
         V1 模式：记忆由系统在对话结束后自动提取，无需手动管理。
       </div>
 
@@ -509,13 +509,13 @@ function MemoryV1View({
 
         {/* 事实记录 Tab */}
         <TabsContent value="facts" className="mt-3">
-          <div className="rounded-lg border p-4 space-y-3">
+          <div className="rounded-lg border p-4 space-y-3 dark:border-[#213D5E] dark:bg-[#022248]">
             <div className="flex items-center justify-between">
               <h3 className="text-base font-medium">事实记录</h3>
               <span className="text-xs text-muted-foreground">{memory.memory_usage}</span>
             </div>
             {memory.facts.length === 0 ? (
-              <div className="rounded-md border border-dashed p-3 text-sm text-muted-foreground">
+              <div className="rounded-md border border-dashed p-3 text-sm text-muted-foreground ">
                 暂无事实记录，对话后系统会自动提取。
               </div>
             ) : (
@@ -542,21 +542,21 @@ function MemoryV1View({
                     </div>
                     <p className="text-sm whitespace-pre-wrap [overflow-wrap:anywhere]">{desensitize(fact.content)}</p>
                     {fact.sourceError && (
-                      <p className="text-xs text-red-600 bg-red-50 rounded px-2 py-1">
+                      <p className="rounded bg-red-50 px-2 py-1 text-xs text-red-600 dark:bg-[#311629] dark:text-[#EE212C]">
                         避免：{desensitize(fact.sourceError)}
                       </p>
                     )}
                   </div>
                 ))}
               </div>
-            )}
+             )}
           </div>
         </TabsContent>
 
         {/* 用户画像 & 历史摘要 Tab */}
         <TabsContent value="profile" className="mt-3 space-y-4">
           {/* 用户画像 (userContext) */}
-          <div className="rounded-lg border p-4 space-y-2">
+          <div className="rounded-lg border p-4 space-y-2 dark:border-[#213D5E] dark:bg-[#022248]">
             <h3 className="text-base font-medium">用户画像</h3>
             {ctxEntries.length === 0 ? (
               <p className="text-sm text-muted-foreground">暂无画像信息，对话后系统会自动归纳。</p>
@@ -575,7 +575,7 @@ function MemoryV1View({
           </div>
 
           {/* 历史摘要 (history) */}
-          <div className="rounded-lg border p-4 space-y-2">
+          <div className="rounded-lg border p-4 space-y-2 dark:border-[#213D5E] dark:bg-[#022248]">
             <h3 className="text-base font-medium">历史摘要</h3>
             {historyEntries.length === 0 ? (
               <p className="text-sm text-muted-foreground">暂无历史摘要。</p>

frontend-web/src/components/workspace/settings/skill-settings-page.tsx

@@ -7,8 +7,10 @@ import {
   ChevronLeftIcon,
   ChevronRightIcon,
   ClockIcon,
+  CopyIcon,
   FileArchive,
   GlobeIcon,
+  InfoIcon,
   Loader2,
   LockIcon,
   PinIcon,
@@ -49,16 +51,19 @@ import {
   ItemContent,
   ItemDescription,
 } from "@/components/ui/item";
+import { Input } from "@/components/ui/input";
 import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { SkillDetailDialog } from "@/components/workspace/skills/skill-detail-dialog";
 import { TagChipList } from "@/components/workspace/tags/tag-chip";
 import { TagPickerDialog } from "@/components/workspace/tags/tag-picker-dialog";
 import { TagSearchBar } from "@/components/workspace/tags/tag-search-bar";
+import { useTheme } from "@/contexts/ThemeContext";
 import { getStoredAuth } from "@/core/auth";
 import { useI18n } from "@/core/i18n/hooks";
 import type { ValidateSkillUploadResponse } from "@/core/skills/api";
 import {
   useDeleteCustomSkill,
+  useDuplicateSkill,
   useInstallSkillUpload,
   useReconcileCustomSkills,
   useSetSkillPinned,
@@ -88,8 +93,42 @@ export function SkillSettingsPage({ onClose }: { onClose?: () => void } = {}) {
 
 const PAGE_SIZE = 10;
 
+/** 重新扫描成功 toast：仅暗色模式使用，浅色走 Sonner 默认样式 */
+const rescanSuccessToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#106455] !bg-[#052934] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <CheckCircle2 className="size-4 shrink-0 text-[#2FD69A]" />,
+} as const;
+
+/** 重新扫描无变更 toast：仅暗色模式使用，浅色走 Sonner 默认样式 */
+const rescanInfoToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#704812] !bg-[#202222] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <InfoIcon className="size-4 shrink-0 text-[#FF9900]" />,
+} as const;
+
+/** 重新扫描失败 toast：仅暗色模式使用，浅色走 Sonner 默认样式 */
+const rescanErrorToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#7F1A2A] !bg-[#311629] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <AlertCircle className="size-4 shrink-0 text-[#F5222D]" />,
+} as const;
+
 function SkillSettingsList({ onClose }: { onClose?: () => void }) {
   const { t } = useI18n();
+  const { theme } = useTheme();
   const router = useRouter();
   const [filter, setFilter] = useState<string>("mine");
   const [installOpen, setInstallOpen] = useState(false);
@@ -174,13 +213,21 @@ function SkillSettingsList({ onClose }: { onClose?: () => void }) {
             "{count}",
             String(result.adopted.length),
           ),
+          theme === "dark" ? rescanSuccessToastDarkOptions : undefined,
         );
       } else {
-        toast.info(t.settings.skills.rescanSkillsNoop);
+        toast.info(
+          t.settings.skills.rescanSkillsNoop,
+          theme === "dark" ? rescanInfoToastDarkOptions : undefined,
+        );
       }
     } catch (err) {
-      toast.error(err instanceof Error ? err.message : String(err));
+      toast.error(
+        err instanceof Error ? err.message : String(err),
+        theme === "dark" ? rescanErrorToastDarkOptions : undefined,
+      );
     }
+      
   };
   return (
     <div className="flex w-full flex-col gap-4">
@@ -346,9 +393,12 @@ export function SkillRow({
   const setPublished = useSetSkillPublished();
   const setPinned = useSetSkillPinned();
   const deleteSkill = useDeleteCustomSkill();
+  const duplicateSkillMutation = useDuplicateSkill();
   const [confirmDeleteOpen, setConfirmDeleteOpen] = useState(false);
   const [tagPickerOpen, setTagPickerOpen] = useState(false);
   const [detailOpen, setDetailOpen] = useState(false);
+  const [duplicateOpen, setDuplicateOpen] = useState(false);
+  const [duplicateName, setDuplicateName] = useState("");
 
   const isCustom = skill.category === "custom";
   // Built-in flag falls back to "no DB owner" so legacy responses without
@@ -384,6 +434,31 @@ export function SkillRow({
     }
   }
 
+  function handleOpenDuplicate() {
+    // Suggest a "<name>-copy" default that already satisfies the backend's
+    // lowercase/digit/-/_ skill-name rule. The user can edit it before saving.
+    setDuplicateName(`${skill.name}-copy`);
+    setDuplicateOpen(true);
+  }
+
+  async function handleDuplicate() {
+    const target = duplicateName.trim();
+    if (!target) {
+      toast.error("请输入新技能名称");
+      return;
+    }
+    try {
+      const result = await duplicateSkillMutation.mutateAsync({
+        sourceName: skill.name,
+        newName: target,
+      });
+      toast.success(`已复制为「${result.skill_name}」`);
+      setDuplicateOpen(false);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : String(err));
+    }
+  }
+
   async function handleTogglePinned() {
     const next = !skill.pinned;
     try {
@@ -398,7 +473,7 @@ export function SkillRow({
 
   return (
     <>
-      <Item className="w-full" variant="outline">
+      <Item className="w-full dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white" variant="outline">
         <ItemContent
           className="cursor-pointer"
           onClick={() => setDetailOpen(true)}
@@ -543,6 +618,16 @@ export function SkillRow({
               )}
             </Button>
           )}
+          <Button
+            size="icon"
+            variant="ghost"
+            className="h-8 w-8 shrink-0"
+            disabled={duplicateSkillMutation.isPending}
+            onClick={handleOpenDuplicate}
+            title="复制为新技能"
+          >
+            <CopyIcon className="size-3.5" />
+          </Button>
           {canManage && (
             <Button
               size="icon"
@@ -556,6 +641,43 @@ export function SkillRow({
           )}
         </ItemActions>
       </Item>
+      <Dialog open={duplicateOpen} onOpenChange={setDuplicateOpen}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>复制技能</DialogTitle>
+            <DialogDescription>
+              将「{desensitize(skill.name)}」复制为一个属于你的新技能。请输入新名称（仅小写字母、数字、- 或 _）。
+            </DialogDescription>
+          </DialogHeader>
+          <Input
+            value={duplicateName}
+            onChange={(e) => setDuplicateName(e.currentTarget.value)}
+            placeholder="new-skill-name"
+            autoFocus
+            onKeyDown={(e) => {
+              if (e.key === "Enter") {
+                e.preventDefault();
+                void handleDuplicate();
+              }
+            }}
+          />
+          <DialogFooter>
+            <Button
+              variant="outline"
+              onClick={() => setDuplicateOpen(false)}
+              disabled={duplicateSkillMutation.isPending}
+            >
+              {t.common.cancel}
+            </Button>
+            <Button
+              onClick={() => void handleDuplicate()}
+              disabled={duplicateSkillMutation.isPending}
+            >
+              {duplicateSkillMutation.isPending ? t.common.loading : "复制"}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
       <Dialog open={confirmDeleteOpen} onOpenChange={setConfirmDeleteOpen}>
         <DialogContent>
           <DialogHeader>

frontend-web/src/components/workspace/skill-display-adapter-panel.tsx

@@ -17,6 +17,7 @@ import {
 import { Switch } from "@/components/ui/switch";
 import { Textarea } from "@/components/ui/textarea";
 import {
+  displayConfigFromResultSet,
   emptyDisplayConfig,
   inferDisplayConfig,
   normalizeDisplaySources,
@@ -27,9 +28,29 @@ import {
   getSkillDisplaySample,
 } from "@/core/skills/api";
 import { useSetSkillDisplay } from "@/core/skills/hooks";
-import type { Skill, SkillDisplayConfig, SkillDisplayMode, SkillLinkStrategy } from "@/core/skills/type";
+import type {
+  Skill,
+  SkillDisplayConfig,
+  SkillDisplayMode,
+  SkillDisplayResultSetConfig,
+  SkillLinkStrategy,
+} from "@/core/skills/type";
 
-const fieldLabels: Array<[keyof SkillDisplayConfig, string]> = [
+type DisplayFieldKey =
+  | "resultPath"
+  | "titleField"
+  | "summaryField"
+  | "contentField"
+  | "sourceField"
+  | "authorField"
+  | "typeField"
+  | "timeField"
+  | "scoreField"
+  | "urlField"
+  | "idField"
+  | "linkTemplate";
+
+const fieldLabels: Array<[DisplayFieldKey, string]> = [
   ["resultPath", "结果列表路径"],
   ["titleField", "标题字段"],
   ["summaryField", "摘要字段"],
@@ -71,14 +92,56 @@ function formatSample(sample: Record<string, unknown> | null | undefined) {
   return sample ? JSON.stringify(sample, null, 2) : "";
 }
 
+function firstResultSetKey(display: SkillDisplayConfig | null | undefined) {
+  return display?.resultSets?.[0]?.key ?? null;
+}
+
 export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
   const queryClient = useQueryClient();
   const setDisplay = useSetSkillDisplay();
   const lastSkillNameRef = useRef(skill.name);
   const [draft, setDraft] = useState<SkillDisplayConfig>(() => skill.display ?? emptyDisplayConfig());
+  const [activeResultSetKey, setActiveResultSetKey] = useState<string | null>(() =>
+    firstResultSetKey(skill.display),
+  );
   const [sampleText, setSampleText] = useState(() => formatSample(skill.displaySample));
-  const [tableColumnsText, setTableColumnsText] = useState(() => JSON.stringify((skill.display ?? emptyDisplayConfig()).tableColumns ?? [], null, 2));
+  const [tableColumnsText, setTableColumnsText] = useState(() => {
+    const display = skill.display ?? emptyDisplayConfig();
+    const resultSet = display.resultSets?.[0];
+    return JSON.stringify((resultSet ?? display).tableColumns ?? [], null, 2);
+  });
   const [loadingDbConfig, setLoadingDbConfig] = useState(false);
+  const resultSets = draft.resultSets ?? [];
+  const activeResultSet =
+    resultSets.find((resultSet) => resultSet.key === activeResultSetKey) ?? null;
+  const editingConfig = activeResultSet ?? draft;
+  const previewConfig = activeResultSet
+    ? displayConfigFromResultSet(draft, activeResultSet)
+    : draft;
+
+  function updateEditingConfig<K extends keyof SkillDisplayResultSetConfig>(
+    key: K,
+    value: SkillDisplayResultSetConfig[K],
+  ) {
+    if (!activeResultSet) {
+      setDraft(updateConfig(draft, key as keyof SkillDisplayConfig, value as never));
+      return;
+    }
+    setDraft({
+      ...draft,
+      resultSets: resultSets.map((resultSet) =>
+        resultSet.key === activeResultSet.key
+          ? { ...resultSet, [key]: value }
+          : resultSet,
+      ),
+    });
+  }
+
+  function selectResultSet(key: string) {
+    const resultSet = resultSets.find((item) => item.key === key) ?? null;
+    setActiveResultSetKey(resultSet?.key ?? null);
+    setTableColumnsText(JSON.stringify((resultSet ?? draft).tableColumns ?? [], null, 2));
+  }
 
   // Echo server state into the form — on mount, on skill switch, AND after
   // a successful save (the refetched skill object has a new `display` identity).
@@ -88,7 +151,9 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
   useEffect(() => {
     const display = skill.display ?? emptyDisplayConfig();
     setDraft(display);
-    setTableColumnsText(JSON.stringify(display.tableColumns ?? [], null, 2));
+    const resultSet = display.resultSets?.[0];
+    setActiveResultSetKey(resultSet?.key ?? null);
+    setTableColumnsText(JSON.stringify((resultSet ?? display).tableColumns ?? [], null, 2));
   }, [skill.name, skill.display]);
 
   useEffect(() => {
@@ -101,8 +166,10 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
           return;
         }
         const display = fresh.display ?? emptyDisplayConfig();
+        const resultSet = display.resultSets?.[0];
         setDraft(display);
-        setTableColumnsText(JSON.stringify(display.tableColumns ?? [], null, 2));
+        setActiveResultSetKey(resultSet?.key ?? null);
+        setTableColumnsText(JSON.stringify((resultSet ?? display).tableColumns ?? [], null, 2));
         setSampleText(formatSample(fresh.displaySample));
         queryClient.setQueryData<Skill | undefined>(["skill", skill.name], fresh);
         queryClient.setQueriesData<Skill[]>({ queryKey: ["skills"] }, (current) =>
@@ -186,8 +253,8 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
   }, [sampleText]);
 
   const previewItems = useMemo(() => (
-    samplePayload ? normalizeDisplaySources(samplePayload, draft) : []
+    samplePayload ? normalizeDisplaySources(samplePayload, previewConfig) : []
-  ), [draft, samplePayload]);
+  ), [previewConfig, samplePayload]);
 
   function generateDraft() {
     if (!samplePayload) {
@@ -196,8 +263,14 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
     }
     const nextDraft = inferDisplayConfig(samplePayload, skill.name);
     setDraft(nextDraft);
-    setTableColumnsText(JSON.stringify(nextDraft.tableColumns ?? [], null, 2));
+    const resultSet = nextDraft.resultSets?.[0];
-    toast.success("已生成展示适配草稿");
+    setActiveResultSetKey(resultSet?.key ?? null);
+    setTableColumnsText(JSON.stringify((resultSet ?? nextDraft).tableColumns ?? [], null, 2));
+    toast.success(
+      resultSet
+        ? `已识别 ${nextDraft.resultSets?.length ?? 0} 个结果集，可分别配置`
+        : "已生成展示适配草稿",
+    );
   }
 
   async function loadSampleAndGenerate() {
@@ -219,8 +292,14 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
       );
       const nextDraft = inferDisplayConfig(response.sample, skill.name);
       setDraft(nextDraft);
-      setTableColumnsText(JSON.stringify(nextDraft.tableColumns ?? [], null, 2));
+      const resultSet = nextDraft.resultSets?.[0];
-      toast.success("已获取样例并生成展示适配");
+      setActiveResultSetKey(resultSet?.key ?? null);
+      setTableColumnsText(JSON.stringify((resultSet ?? nextDraft).tableColumns ?? [], null, 2));
+      toast.success(
+        resultSet
+          ? `已获取样例，并识别 ${nextDraft.resultSets?.length ?? 0} 个结果集`
+          : "已获取样例并生成展示适配",
+      );
     } catch (err) {
       generateDraft();
       toast.error(err instanceof Error ? err.message : String(err));
@@ -235,8 +314,10 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
         sample: samplePayload ?? undefined,
       });
       const display = saved.display ?? emptyDisplayConfig();
+      const resultSet = display.resultSets?.find((item) => item.key === activeResultSetKey) ?? display.resultSets?.[0];
       setDraft(display);
-      setTableColumnsText(JSON.stringify(display.tableColumns ?? [], null, 2));
+      setActiveResultSetKey(resultSet?.key ?? null);
+      setTableColumnsText(JSON.stringify((resultSet ?? display).tableColumns ?? [], null, 2));
       setSampleText(formatSample(saved.displaySample));
       toast.success("展示适配已保存");
     } catch (err) {
@@ -248,6 +329,7 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
     try {
       await setDisplay.mutateAsync({ skillName: skill.name, display: null, sample: null });
       setDraft(emptyDisplayConfig());
+      setActiveResultSetKey(null);
       setTableColumnsText(JSON.stringify([], null, 2));
       toast.success("展示适配已清除");
     } catch (err) {
@@ -283,8 +365,8 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
           <label className="space-y-1.5">
             <span className="text-xs text-muted-foreground">展示方式</span>
             <Select
-              value={draft.mode}
+              value={editingConfig.mode}
-              onValueChange={(value) => setDraft(updateConfig(draft, "mode", value as SkillDisplayMode))}
+              onValueChange={(value) => updateEditingConfig("mode", value as SkillDisplayMode)}
             >
               <SelectTrigger className="w-full">
                 <SelectValue />
@@ -300,8 +382,8 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
           <label className="space-y-1.5">
             <span className="text-xs text-muted-foreground">跳转方式</span>
             <Select
-              value={draft.linkStrategy}
+              value={editingConfig.linkStrategy}
-              onValueChange={(value) => setDraft(updateConfig(draft, "linkStrategy", value as SkillLinkStrategy))}
+              onValueChange={(value) => updateEditingConfig("linkStrategy", value as SkillLinkStrategy)}
             >
               <SelectTrigger className="w-full">
                 <SelectValue />
@@ -320,26 +402,58 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
               type="number"
               min={1}
               max={100}
-              value={draft.maxItems}
+              value={editingConfig.maxItems}
-              onChange={(event) => setDraft(updateConfig(draft, "maxItems", Number(event.currentTarget.value) || 1))}
+              onChange={(event) => updateEditingConfig("maxItems", Number(event.currentTarget.value) || 1)}
             />
           </label>
         </div>
 
+        {resultSets.length > 0 && (
+          <div className="mt-4 grid gap-3 md:grid-cols-[1fr_auto] md:items-end">
+            <label className="space-y-1.5">
+              <span className="text-xs text-muted-foreground">结果集配置</span>
+              <Select
+                value={activeResultSet?.key ?? resultSets[0]?.key}
+                onValueChange={selectResultSet}
+              >
+                <SelectTrigger className="w-full">
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  {resultSets.map((resultSet) => (
+                    <SelectItem key={resultSet.key} value={resultSet.key}>
+                      {resultSet.label || resultSet.resultPath}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
+            </label>
+            {activeResultSet && (
+              <label className="flex items-center justify-end gap-2 pb-2">
+                <span className="text-xs text-muted-foreground">启用当前结果集</span>
+                <Switch
+                  checked={activeResultSet.enabled}
+                  onCheckedChange={(checked) => updateEditingConfig("enabled", checked)}
+                />
+              </label>
+            )}
+          </div>
+        )}
+
         <div className="mt-4 grid gap-3 md:grid-cols-2">
           {fieldLabels.map(([field, label]) => (
             <label key={field} className="space-y-1.5">
               <span className="text-xs text-muted-foreground">{label}</span>
               <Input
-                value={(draft[field] as string | number | boolean | null | undefined)?.toString() ?? ""}
+                value={(editingConfig[field] as string | number | boolean | null | undefined)?.toString() ?? ""}
-                onChange={(event) => setDraft(updateConfig(draft, field, event.currentTarget.value as never))}
+                onChange={(event) => updateEditingConfig(field, event.currentTarget.value as never)}
                 placeholder={field === "linkTemplate" ? "https://xxx.xxx.xxx?recuuid={recUuid}" : undefined}
               />
             </label>
           ))}
         </div>
 
-        {draft.mode === "table" && (
+        {editingConfig.mode === "table" && (
           <label className="mt-4 block space-y-1.5">
             <span className="text-xs text-muted-foreground">表格列配置 JSON</span>
             <Textarea
@@ -349,7 +463,7 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
                 try {
                   const value = JSON.parse(event.currentTarget.value);
                   if (Array.isArray(value)) {
-                    setDraft(updateConfig(draft, "tableColumns", value));
+                    updateEditingConfig("tableColumns", value);
                   }
                 } catch {
                   // Keep typing invalid JSON without crashing the panel.
@@ -361,12 +475,12 @@ export function SkillDisplayAdapterPanel({ skill }: { skill: Skill }) {
           </label>
         )}
 
-        {draft.mode === "custom" && (
+        {editingConfig.mode === "custom" && (
           <label className="mt-4 block space-y-1.5">
             <span className="text-xs text-muted-foreground">自定义展示描述</span>
             <Textarea
-              value={draft.customInstruction}
+              value={editingConfig.customInstruction}
-              onChange={(event) => setDraft(updateConfig(draft, "customInstruction", event.currentTarget.value))}
+              onChange={(event) => updateEditingConfig("customInstruction", event.currentTarget.value)}
               placeholder="例如：按 publish_time 时间倒序显示为时间线，每条包含标题、摘要、来源和查看原文按钮。"
               className="min-h-24"
             />

frontend-web/src/components/workspace/skills/skill-evolution-panel.tsx

@@ -425,10 +425,15 @@ function ConfigCard() {
               })
             }
           >
-            <SelectTrigger className="max-w-[20rem]">
+            <SelectTrigger
+              className={cn(
+                "max-w-[20rem]",
+                "dark:border-[#1B477E] dark:bg-[#0D2D54] dark:text-[#AACEFF] dark:data-[placeholder]:text-[#566B7F] dark:hover:bg-[#0D2D54]",
+              )}
+            >
               <SelectValue />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent position="popper" side="bottom" sideOffset={4}>
               <SelectItem value={DEFAULT_MODEL_VALUE}>
                 {tt.curatorModelDefault}
               </SelectItem>

frontend-web/src/components/workspace/thread-title.tsx

@@ -3,6 +3,7 @@ import { useEffect } from "react";
 
 import { useI18n } from "@/core/i18n/hooks";
 import type { AgentThreadState } from "@/core/threads";
+import { sanitizeThreadTitleForDisplay } from "@/core/threads/utils";
 import { desensitize } from "@/lib/desensitize";
 
 import { useThreadChat } from "./chats";
@@ -18,11 +19,13 @@ export function ThreadTitle({
 }) {
   const { t } = useI18n();
   const { isNewThread } = useThreadChat();
+  const displayTitle = sanitizeThreadTitleForDisplay(thread.values?.title);
+
   useEffect(() => {
     let _title = t.pages.untitled;
 
     if (thread.values?.title) {
-      _title = thread.values.title;
+      _title = displayTitle;
     } else if (isNewThread) {
       _title = t.pages.newChat;
     }
@@ -38,6 +41,7 @@ export function ThreadTitle({
     t.pages.appName,
     thread.isThreadLoading,
     thread.values,
+    displayTitle,
   ]);
 
   if (!thread.values?.title) {
@@ -45,7 +49,7 @@ export function ThreadTitle({
   }
   return (
     <FlipDisplay uniqueKey={threadId}>
-      {desensitize(thread.values.title ?? "Untitled")}
+      {desensitize(displayTitle)}
     </FlipDisplay>
   );
 }

frontend-web/src/components/workspace/workspace-container.tsx

@@ -20,8 +20,11 @@ export function WorkspaceContainer({
   children,
   ...props
 }: React.ComponentProps<"div">) {
+  // h-full 而非 h-screen:本容器恒在 WorkspaceRoutes 的 SidebarInset(flex-1,确定高度)下,
+  // h-full 既跟随容器高度(无界等嵌套不再锁死整屏),又修掉原 h-screen=100vh 比可用区域
+  // 高出一个页头高度的溢出。
   return (
-    <div className={cn("flex h-screen w-full flex-col", className)} {...props}>
+    <div className={cn("flex h-full w-full flex-col", className)} {...props}>
       {children}
     </div>
   );

frontend-web/src/components/workspace/workspace-nav-studio.tsx

@@ -34,8 +34,6 @@ const NAV_ITEM_CLASS =
   "data-[active=true]:bg-primary/15 data-[active=true]:text-primary data-[active=true]:shadow-none " +
   "dark:hover:bg-primary/15 dark:data-[active=true]:bg-primary/25 dark:data-[active=true]:text-primary-foreground";
 
-const SIDEBAR_PREVIEW_COUNT = 5;
-
 export function WorkspaceNavStudio() {
   const { notebooks, isLoading, isError } = useStudioNotebooks();
   const { pathname } = useLocation();
@@ -71,6 +69,7 @@ export function WorkspaceNavStudio() {
     return null;
   }
 
+  const SIDEBAR_PREVIEW_COUNT = 2;
   const preview = notebooks.slice(0, SIDEBAR_PREVIEW_COUNT);
 
   return (

frontend-web/src/core/api/api-client.ts

@@ -5,19 +5,21 @@ import { Client as LangGraphClient } from "@langchain/langgraph-sdk/client";
 import { getAuthorizationHeaderValue } from "../auth";
 import { getLangGraphBaseURL } from "../config";
 
+import { withCsrfHeaders } from "./csrf";
 import { sanitizeRunStreamOptions } from "./stream-mode";
 
 function createCompatibleClient(isMock?: boolean): LangGraphClient {
   const client = new LangGraphClient({
     apiUrl: getLangGraphBaseURL(isMock),
     onRequest(_url, init) {
-      const headers = new Headers(init.headers ?? {});
+      const headers = withCsrfHeaders(init.headers);
       const authHeader = getAuthorizationHeaderValue();
       if (authHeader && !headers.has("Authorization")) {
         headers.set("Authorization", authHeader);
       }
       return {
         ...init,
+        credentials: init.credentials ?? "include",
         headers,
       };
     },

frontend-web/src/core/api/canvas-client.ts

@@ -5,6 +5,7 @@ import { Client as LangGraphClient } from "@langchain/langgraph-sdk/client";
 import { getAuthorizationHeaderValue } from "../auth";
 import { getCanvasLangGraphBaseURL } from "../config";
 
+import { withCsrfHeaders } from "./csrf";
 import { sanitizeRunStreamOptions } from "./stream-mode";
 
 /**
@@ -19,12 +20,16 @@ function createCanvasClient(): LangGraphClient {
   const client = new LangGraphClient({
     apiUrl: getCanvasLangGraphBaseURL(),
     onRequest(_url, init) {
-      const headers = new Headers(init.headers ?? {});
+      const headers = withCsrfHeaders(init.headers);
       const authHeader = getAuthorizationHeaderValue();
       if (authHeader && !headers.has("Authorization")) {
         headers.set("Authorization", authHeader);
       }
-      return { ...init, headers };
+      return {
+        ...init,
+        credentials: init.credentials ?? "include",
+        headers,
+      };
     },
   });
 

frontend-web/src/core/api/csrf.ts

@@ -0,0 +1,42 @@
+const CSRF_COOKIE_NAME = "csrf_token";
+const CSRF_HEADER_NAME = "X-CSRF-Token";
+
+function readCookie(name: string): string | undefined {
+  if (typeof document === "undefined") {
+    return undefined;
+  }
+
+  const cookies = document.cookie.split(";");
+  for (const cookie of cookies) {
+    const [rawName, ...rest] = cookie.trim().split("=");
+    if (rawName !== name) {
+      continue;
+    }
+    const rawValue = rest.join("=");
+    if (!rawValue) {
+      return undefined;
+    }
+    try {
+      return decodeURIComponent(rawValue);
+    } catch {
+      return rawValue;
+    }
+  }
+
+  return undefined;
+}
+
+export function getCsrfToken(): string | undefined {
+  const token = readCookie(CSRF_COOKIE_NAME)?.trim();
+  return token ? token : undefined;
+}
+
+export function withCsrfHeaders(headers?: HeadersInit): Headers {
+  const next = new Headers(headers ?? {});
+  const csrfToken = getCsrfToken();
+  if (csrfToken && !next.has(CSRF_HEADER_NAME)) {
+    next.set(CSRF_HEADER_NAME, csrfToken);
+  }
+  return next;
+}
+

frontend-web/src/core/api/fetch-client.ts

@@ -1,7 +1,8 @@
 import { getAuthorizationHeaderValue } from "@/core/auth";
+import { withCsrfHeaders } from "./csrf";
 
 function withAuthHeaders(headers?: HeadersInit): Headers {
-  const next = new Headers(headers ?? {});
+  const next = withCsrfHeaders(headers);
   const authHeader = getAuthorizationHeaderValue();
   if (authHeader && !next.has("Authorization")) {
     next.set("Authorization", authHeader);
@@ -12,6 +13,7 @@ function withAuthHeaders(headers?: HeadersInit): Headers {
 export function apiFetch(input: RequestInfo | URL, init?: RequestInit) {
   return fetch(input, {
     ...init,
+    credentials: init?.credentials ?? "include",
     headers: withAuthHeaders(init?.headers),
   });
 }

frontend-web/src/core/auth/api.ts

@@ -17,25 +17,97 @@ export async function listAllUsers(): Promise<UserListItem[]> {
   return res.json() as Promise<UserListItem[]>;
 }
 
+// Normalize a FastAPI error body into a human-readable string. `detail` may be
+// a plain string, an object like AuthErrorResponse ({ code, message }), or an
+// array of validation errors — anything but a string would otherwise render as
+// the dreaded "[object Object]".
+function extractErrorMessage(body: unknown, fallback = "Login failed."): string {
+  const detail = (body as { detail?: unknown } | null)?.detail ?? body;
+  if (typeof detail === "string") return detail;
+  if (Array.isArray(detail)) {
+    const msg = detail
+      .map((d) => (d && typeof d === "object" ? (d as { msg?: string }).msg : String(d)))
+      .filter(Boolean)
+      .join("; ");
+    return msg || fallback;
+  }
+  if (detail && typeof detail === "object") {
+    const obj = detail as { message?: string; msg?: string };
+    return obj.message ?? obj.msg ?? fallback;
+  }
+  return fallback;
+}
+
 export async function loginByUsername(
   username: string,
+  password?: string | null,
 ): Promise<LoginByUsernameResponse> {
-  const response = await apiFetch(
+  // When the username-login password gate is enabled server-side, the shared
-    `${getBackendBaseURL()}/api/v1/auth/login/username`,
+  // secret must be passed as ?password=. Omitted when no password is provided
-    {
+  // so the passwordless flow keeps working unchanged.
-      method: "POST",
+  const base = `${getBackendBaseURL()}/api/v1/auth/login/username`;
-      headers: {
+  const url =
-        "Content-Type": "application/json",
+    password != null && password !== ""
-      },
+      ? `${base}?password=${encodeURIComponent(password)}`
-      body: JSON.stringify({ username }),
+      : base;
+  const response = await apiFetch(url, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
     },
-  );
+    body: JSON.stringify({ username }),
+  });
   if (!response.ok) {
-    const error = await response
+    const error = await response.json().catch(() => null);
-      .json()
+    throw new Error(extractErrorMessage(error));
-      .catch(() => ({ detail: "Login failed." }));
-    throw new Error(error.detail ?? "Login failed.");
   }
   return response.json() as Promise<LoginByUsernameResponse>;
 }
 
+// The upstream token issuer and the verifier (token_info_url) run on separate
+// servers whose clocks can drift ~3-4s apart. A token verified right after it
+// is issued can look "not yet valid / expired" to the verifier, which surfaces
+// as a 401 here. That window closes on its own once real time advances past the
+// skew, so we silently retry the exchange a couple of times before giving up —
+// the LoginPage keeps showing its loading state, so the user never notices.
+const TOKEN_LOGIN_MAX_ATTEMPTS = 3; // initial try + 2 retries → covers up to ~6s skew
+const TOKEN_LOGIN_RETRY_DELAY_MS = 3000;
+
+const wait = (ms: number) => new Promise<void>((resolve) => setTimeout(resolve, ms));
+
+export async function loginByToken(
+  token: string,
+): Promise<LoginByUsernameResponse> {
+  // Token-exchange login: the gateway resolves the upstream token to a username
+  // and signs the matching local account in.
+  const url = `${getBackendBaseURL()}/api/v1/auth/login/token?token=${encodeURIComponent(token)}`;
+  let lastError = "Login failed.";
+
+  for (let attempt = 1; attempt <= TOKEN_LOGIN_MAX_ATTEMPTS; attempt += 1) {
+    const response = await apiFetch(url, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+    });
+    if (response.ok) {
+      return response.json() as Promise<LoginByUsernameResponse>;
+    }
+
+    const error = await response.json().catch(() => null);
+    lastError = extractErrorMessage(error);
+
+    // Only 401 is plausibly the transient clock-skew case and worth waiting on.
+    // 403 (disabled), 429 (rate-limited), 500 (misconfigured) won't self-heal,
+    // so fail fast instead of stalling the user.
+    const isTransient = response.status === 401;
+    if (!isTransient || attempt === TOKEN_LOGIN_MAX_ATTEMPTS) {
+      throw new Error(lastError);
+    }
+    await wait(TOKEN_LOGIN_RETRY_DELAY_MS);
+  }
+
+  // Unreachable: the loop either returns or throws above.
+  throw new Error(lastError);
+}
+

frontend-web/src/core/auth/external-login.ts

@@ -13,6 +13,10 @@ export const EXTERNAL_LOGIN_STORAGE_KEYS = {
   ticket: "login.ticket",
   userId: "login.userId",
   env: "login.env",
+  /** MaxKey getTokenByOnlineTicket 返回的 token */
+  maxkeyOnlineToken: "login.maxkeyOnlineToken",
+  /** consumer /cop/userDetailToken 返回的 data 整包（JSON） */
+  userDetailToken: "login.userDetailToken",
 } as const;
 
 export type ExternalLoginParams = {
@@ -51,7 +55,14 @@ export function readExternalLoginParams(): Required<ExternalLoginParams> {
   }
 }
 
-/** 把 ``theme`` query 值映射成 ThemeContext 的 ``'dark' | 'light'`` */
+/**
+ * 把外部(URL query / 无界 props)的 ``theme`` 值映射成 ThemeContext 的
+ * ``'dark' | 'light'``。已知取值:
+ *   - ``dark-blue`` → 深色
+ *   - ``red``       → 浅色(当前默认红白主题)
+ *   - ``blue``      → 暂无该主题,先用浅色代替(命中 else 分支)
+ * 其余/缺省同样回退浅色。将来若新增 blue 主题,在此扩展映射即可。
+ */
 export function resolveThemeFromQuery(themeParam: string | null | undefined): "dark" | "light" {
   return themeParam === "dark-blue" ? "dark" : "light";
 }

frontend-web/src/core/auth/sync.tsx

@@ -1,46 +1,98 @@
 "use client";
 
 import { useEffect, useRef } from "react";
+import { toast } from "sonner";
 
 import { getStoredAuth } from "@/core/auth";
 
 const AUTH_STORAGE_KEY = "deerflow.auth";
 
+// 防抖窗口:跨标签页登录/重写 auth 常常在极短时间内连发多个 storage 事件
+// (例如先写 token、再写用户信息)。等它"落定"再判断,避免抖动期的中间态
+// (短暂 null / 半写状态)误触发动作。
+const SETTLE_DELAY_MS = 1200;
+
+// 提示 toast 的稳定 id —— 同一次身份变化只保留一条,避免连发事件刷屏。
+const IDENTITY_TOAST_ID = "auth-identity-changed";
+
 function readUserId(): string | null {
   return getStoredAuth()?.user_id ?? null;
 }
 
 /**
  * Mount once at the app root. Watches `localStorage["deerflow.auth"]` for
- * cross-tab changes — when another tab logs in as a different user, this tab
+ * cross-tab changes.
- * still holds the previous user's cached state (chat list, thread ids, etc.)
+ *
- * which then collides with the new token and surfaces as a 404 on "新对话".
+ * 背景:`deerflow.auth` 在同源所有标签页之间共享。某个标签页登录/重写它时,
- * Reloading the tab is the simplest way to resync React state with the new
+ * 其它标签页仍持有旧用户的内存态(会话列表、thread id、以及多智能体会商这类
- * identity.
+ * 纯内存的页面状态),与新 token 不一致,可能在"新对话"等操作上 404。
+ *
+ * 旧实现:只要检测到 user_id 变化就 `window.location.reload()`。这会把**正在
+ * 使用的标签页**(例如正在跑多智能体会商第二步的那个)整页刷新,内存态全丢、
+ * 步骤回到第一步 —— 用户复制链接到新标签页打开(新标签页可能以不同/默认用户
+ * 重新登录并改写共享 auth)就会触发,体验很差。
+ *
+ * 现实现(方案 1,收敛粗暴刷新):
+ *  - **真·退出登录**(auth 变为 null)→ 仍然跳登录页并刷新(本就该重新登录)。
+ *  - **出现不同的非空用户**(另一个标签页登录成别的身份)→ **不再自动整页刷新**,
+ *    改为弹一条常驻提示,把"是否刷新同步"的决定权交给用户,避免冲掉正在进行的工作。
+ *  - 防抖 + 落定后二次校验,过滤掉同用户重写 / 抖动中间态带来的误触发。
  */
 export function AuthSyncWatcher() {
   const lastUserIdRef = useRef<string | null>(readUserId());
 
   useEffect(() => {
-    function handleStorage(event: StorageEvent) {
+    let settleTimer: ReturnType<typeof setTimeout> | null = null;
-      if (event.key !== null && event.key !== AUTH_STORAGE_KEY) {
+
-        return;
+    // storage 事件落定后再判断当前的真实身份并决定动作。
-      }
+    function evaluateSettledIdentity() {
       const nextUserId = readUserId();
       if (nextUserId === lastUserIdRef.current) {
+        // 同用户重写,或抖动后又回到原身份 —— 无需任何动作。
         return;
       }
-      lastUserIdRef.current = nextUserId;
+
       if (nextUserId === null) {
+        // 另一个标签页退出登录(或清空了 auth)→ 本标签页也该回到登录页。
+        lastUserIdRef.current = null;
         window.location.replace("#/login");
         window.location.reload();
         return;
       }
-      window.location.reload();
+
+      // 出现了不同的非空用户。共享 auth 已被改成别的身份,继续在本标签页发请求
+      // 可能 404 / 鉴权失败,但**不**强制刷新 —— 用户可能正在本标签页干活
+      // (如多智能体会商),由用户自己决定何时刷新同步。
+      lastUserIdRef.current = nextUserId;
+      toast.warning("检测到账号在其它标签页发生变化", {
+        id: IDENTITY_TOAST_ID,
+        description: "当前标签页仍是原会话。如需与新账号同步,请刷新页面。",
+        duration: Infinity,
+        action: {
+          label: "刷新同步",
+          onClick: () => window.location.reload(),
+        },
+      });
+    }
+
+    function handleStorage(event: StorageEvent) {
+      // 只关心 auth 键的变化;event.key === null 表示 localStorage 被整体清空。
+      if (event.key !== null && event.key !== AUTH_STORAGE_KEY) {
+        return;
+      }
+      if (settleTimer) {
+        clearTimeout(settleTimer);
+      }
+      settleTimer = setTimeout(evaluateSettledIdentity, SETTLE_DELAY_MS);
     }
 
     window.addEventListener("storage", handleStorage);
-    return () => window.removeEventListener("storage", handleStorage);
+    return () => {
+      window.removeEventListener("storage", handleStorage);
+      if (settleTimer) {
+        clearTimeout(settleTimer);
+      }
+    };
   }, []);
 
   return null;

frontend-web/src/core/auth/wujie-ticket-login.ts

@@ -0,0 +1,142 @@
+import { requestCrudService } from "@/service/request-axios-service";
+
+import {
+  EXTERNAL_LOGIN_STORAGE_KEYS,
+  persistExternalLoginParams,
+} from "./external-login";
+
+const AUTH_BASE_URL = (import.meta.env.VITE_AUTH_BASE_URL || "").replace(
+  /\/$/,
+  "",
+);
+const CONSUMER_URL = (import.meta.env.VITE_AIPI_CONSUMER_URL || "").replace(
+  /\/$/,
+  "",
+);
+
+/** MaxKey onlineTicket 换发的 token（后续请求可能用到） */
+export const MAXKEY_ONLINE_TOKEN_STORAGE_KEY =
+  EXTERNAL_LOGIN_STORAGE_KEYS.maxkeyOnlineToken;
+
+/** `/cop/userDetailToken` 返回的 data 整包（JWT 解析后的用户信息） */
+export const USER_DETAIL_TOKEN_STORAGE_KEY =
+  EXTERNAL_LOGIN_STORAGE_KEYS.userDetailToken;
+
+export type MaxkeyTokenByTicketResponse = {
+  code: number;
+  data: string;
+  message?: string;
+};
+
+export type UserDetailTokenPayload = {
+  sub?: string;
+  user_id?: string;
+  exp?: number;
+  expired?: boolean;
+  iat?: number;
+  institution?: string;
+  iss?: string;
+  locale?: string;
+  kid?: string;
+  jti?: string;
+  [key: string]: unknown;
+};
+
+type UserDetailTokenResponse = {
+  code?: number;
+  data?: UserDetailTokenPayload;
+  message?: string;
+};
+
+function persistMaxkeyOnlineToken(token: string): void {
+  try {
+    localStorage.setItem(MAXKEY_ONLINE_TOKEN_STORAGE_KEY, token);
+  } catch {
+    // 静默失败，不阻断登录
+  }
+}
+
+function persistUserDetailToken(data: UserDetailTokenPayload): void {
+  try {
+    localStorage.setItem(USER_DETAIL_TOKEN_STORAGE_KEY, JSON.stringify(data));
+    if (data.user_id) {
+      localStorage.setItem(EXTERNAL_LOGIN_STORAGE_KEYS.userId, String(data.user_id));
+    }
+  } catch {
+    // 静默失败
+  }
+}
+
+/**
+ * 无界 / 外部跳转：用 onlineTicket 换 MaxKey token，并拉取用户详情。
+ * - token 存入 localStorage（`login.maxkeyOnlineToken`）
+ * - userDetailToken 的 data 存入 localStorage（`login.userDetailToken`）
+ * @returns 用于 DeerFlow `loginByUsername` 的用户名（取自 data.sub）
+ */
+export async function resolveUsernameByOnlineTicket(
+  ticket: string,
+): Promise<string> {
+  const onlineTicket = ticket.trim();
+  if (!onlineTicket) {
+    throw new Error("缺少 onlineTicket，无法完成无界登录。");
+  }
+  if (!AUTH_BASE_URL) {
+    throw new Error("未配置 VITE_AUTH_BASE_URL，无法换取 MaxKey token。");
+  }
+  if (!CONSUMER_URL) {
+    throw new Error("未配置 VITE_AIPI_CONSUMER_URL，无法获取用户详情。");
+  }
+
+  persistExternalLoginParams({ ticket: onlineTicket });
+
+  const tokenRes = (await requestCrudService.get(
+    `${AUTH_BASE_URL}/maxkey-mgt-api/sys/getTokenByOnlineTicket`,
+    { onlineTicket },
+  )) as unknown as MaxkeyTokenByTicketResponse;
+
+  console.log("[wujie] getTokenByOnlineTicket:", tokenRes);
+
+  if (tokenRes.code !== 200 || !tokenRes.data) {
+    throw new Error(
+      tokenRes.message || "getTokenByOnlineTicket 未返回有效 token。",
+    );
+  }
+  persistMaxkeyOnlineToken(tokenRes.data);
+
+  const detailRes = (await requestCrudService.get(
+    `${CONSUMER_URL}/cop/userDetailToken`,
+    { ticket: onlineTicket },
+  )) as unknown as UserDetailTokenResponse;
+
+  console.log("[wujie] userDetailToken:", detailRes);
+
+  const userData = detailRes.data;
+  if (!userData) {
+    throw new Error("userDetailToken 未返回用户 data。");
+  }
+  persistUserDetailToken(userData);
+
+  const username = (userData.sub ?? "").trim();
+  if (!username) {
+    throw new Error("userDetailToken 中缺少 sub（用户名）。");
+  }
+  return username;
+}
+
+export function readMaxkeyOnlineToken(): string {
+  try {
+    return localStorage.getItem(MAXKEY_ONLINE_TOKEN_STORAGE_KEY) ?? "";
+  } catch {
+    return "";
+  }
+}
+
+export function readUserDetailToken(): UserDetailTokenPayload | null {
+  try {
+    const raw = localStorage.getItem(USER_DETAIL_TOKEN_STORAGE_KEY);
+    if (!raw) return null;
+    return JSON.parse(raw) as UserDetailTokenPayload;
+  } catch {
+    return null;
+  }
+}

frontend-web/src/core/embed/params.ts

@@ -0,0 +1,46 @@
+import { resolveThemeFromQuery } from "@/core/auth/external-login";
+
+const DEFAULT_USERNAME = "guest";
+
+export type EmbedChatParams = {
+  /** Parent correlation id — required for status polling without thread_id. */
+  sessionId: string;
+  message: string;
+  username: string;
+  theme: string;
+};
+
+/**
+ * Resolve iframe embed params from URL query only (plain iframe, not wujie).
+ *
+ * Parent must generate ``sessionId`` and pass it on the iframe URL so it can
+ * poll ``GET /api/public/embed/sessions/{sessionId}/status`` without reading
+ * the child frame.
+ */
+export function resolveEmbedChatParams(search: string): EmbedChatParams {
+  const params = new URLSearchParams(search.startsWith("?") ? search : `?${search}`);
+
+  const sessionId =
+    params.get("sessionId")?.trim() ||
+    params.get("session_id")?.trim() ||
+    "";
+
+  const message =
+    params.get("message")?.trim() ||
+    params.get("question")?.trim() ||
+    params.get("text")?.trim() ||
+    "";
+
+  const username =
+    params.get("username")?.trim() ||
+    params.get("userName")?.trim() ||
+    DEFAULT_USERNAME;
+
+  const theme = params.get("theme")?.trim() || "";
+
+  return { sessionId, message, username, theme };
+}
+
+export function resolveEmbedTheme(themeParam: string): "dark" | "light" {
+  return resolveThemeFromQuery(themeParam || null);
+}

frontend-web/src/core/embed/status-api.ts

@@ -0,0 +1,73 @@
+import { getBackendBaseURL } from "@/core/config";
+
+export type EmbedSessionStatus = {
+  session_id: string;
+  registered: boolean;
+  thread_id: string | null;
+  finished: boolean;
+  thread_status: string;
+  has_active_run: boolean;
+  latest_run_status: string | null;
+};
+
+export type EmbedSessionResult = EmbedSessionStatus & {
+  messages: Record<string, unknown>[];
+  generated_text: string;
+  generated_files: string[];
+};
+
+async function parseEmbedError(response: Response): Promise<string> {
+  const body = await response.json().catch(() => ({}));
+  if (typeof body.detail === "string") {
+    return body.detail;
+  }
+  return `HTTP ${response.status}`;
+}
+
+/** Register session_id → thread_id (iframe calls this; parent never needs thread_id). */
+export async function registerEmbedSession(
+  sessionId: string,
+  threadId: string,
+): Promise<{ session_id: string; thread_id: string }> {
+  const base = getBackendBaseURL();
+  const response = await fetch(`${base}/api/public/embed/sessions`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    credentials: "omit",
+    body: JSON.stringify({ session_id: sessionId, thread_id: threadId }),
+  });
+  if (!response.ok) {
+    throw new Error(await parseEmbedError(response));
+  }
+  return response.json() as Promise<{ session_id: string; thread_id: string }>;
+}
+
+/** Poll whether embed Q&A has finished — parent uses sessionId only. */
+export async function getEmbedSessionStatus(
+  sessionId: string,
+): Promise<EmbedSessionStatus> {
+  const base = getBackendBaseURL();
+  const response = await fetch(
+    `${base}/api/public/embed/sessions/${encodeURIComponent(sessionId)}/status`,
+    { credentials: "omit" },
+  );
+  if (!response.ok) {
+    throw new Error(await parseEmbedError(response));
+  }
+  return response.json() as Promise<EmbedSessionStatus>;
+}
+
+/** Fetch full messages, generated text, and artifact paths — parent uses sessionId only. */
+export async function getEmbedSessionResult(
+  sessionId: string,
+): Promise<EmbedSessionResult> {
+  const base = getBackendBaseURL();
+  const response = await fetch(
+    `${base}/api/public/embed/sessions/${encodeURIComponent(sessionId)}/result`,
+    { credentials: "omit" },
+  );
+  if (!response.ok) {
+    throw new Error(await parseEmbedError(response));
+  }
+  return response.json() as Promise<EmbedSessionResult>;
+}

frontend-web/src/core/embed/wujie.ts

@@ -0,0 +1,85 @@
+/**
+ * 无界(wujie)子应用运行时 props 读取。
+ *
+ * 本应用作为子应用被内网门户用无界嵌套时,父级通过
+ *   <WujieVue name="subApp" :url="..." :props="{ ticket, userId, theme, env }" />
+ * 注入参数,子应用在 `window.$wujie.props` 上拿到**同一个对象**(无界在子应用
+ * bootstrap 之前就已注入,因此首帧即可读)。
+ *
+ * ticket 在 LoginPage 会走 MaxKey + consumer 双接口换用户名并登录;读出的
+ * ticket/userId/env 复用 external-login 的 localStorage 存储(与 URL 跳转登录
+ * 同一套 key),theme 交给调用方(LoginPage)映射到 ThemeContext。
+ */
+import { useEffect, useMemo } from "react";
+
+import { persistExternalLoginParams } from "@/core/auth/external-login";
+
+/** 无界父级注入的 props 形状。除已知字段外允许透传其余未知字段便于排查。 */
+export interface WujieProps {
+  /** 第三方 onlineTicket（LoginPage 用于 MaxKey + userDetailToken 登录）。 */
+  ticket?: string;
+  /** 外部用户 id。 */
+  userId?: string;
+  /** 环境标识。 */
+  env?: string;
+  /** 主题色标识(映射到深/浅色)。 */
+  theme?: string;
+  /** 嵌入问答：首条用户问题（与 question / text 同义）。 */
+  message?: string;
+  question?: string;
+  text?: string;
+  /** 嵌入问答：DeerFlow 本地用户名登录。 */
+  username?: string;
+  userName?: string;
+  [key: string]: unknown;
+}
+
+interface WujieRuntime {
+  props?: WujieProps;
+  [key: string]: unknown;
+}
+
+declare global {
+  interface Window {
+    /** 无界注入的子应用运行时;非无界环境下为 undefined。 */
+    $wujie?: WujieRuntime;
+    /** 无界注入的环境标志(子应用内为 true)。 */
+    __POWERED_BY_WUJIE__?: boolean;
+  }
+}
+
+/** 当前是否运行在无界子应用环境中。 */
+export function isWujieEnv(): boolean {
+  return typeof window !== "undefined" && !!window.__POWERED_BY_WUJIE__;
+}
+
+/** 读取无界父级注入的 props;不在无界环境 / 未注入时返回空对象。 */
+export function readWujieProps(): WujieProps {
+  if (typeof window === "undefined") return {};
+  return window.$wujie?.props ?? {};
+}
+
+/**
+ * 全局读取无界父级注入的 props 的 hook。
+ *
+ * - 首帧从 `window.$wujie.props` 读出(无界已在 bootstrap 前注入,引用稳定);
+ * - 读到后把 ticket/userId/env 持久化到 localStorage(复用 external-login 存储),
+ *   供后续任意页面/请求读取 —— 即「存到全局」;
+ * - 返回 props 供调用方消费(如 LoginPage 取 theme)。
+ *
+ * 非无界环境(直接访问)下返回空对象且不做任何持久化,可安全无条件调用。
+ */
+export function useWujieProps(): WujieProps {
+  const props = useMemo(() => readWujieProps(), []);
+
+  useEffect(() => {
+    if (!props.ticket && !props.userId && !props.env) return;
+    persistExternalLoginParams({
+      ticket: props.ticket,
+      userId: props.userId,
+      env: props.env,
+    });
+  }, [props.ticket, props.userId, props.env]);
+
+  return props;
+}

frontend-web/src/core/i18n/locales/en-US.ts

@@ -41,6 +41,7 @@ export const enUS: Translations = {
     code: "Code",
     preview: "Preview",
     cancel: "Cancel",
+    confirm: "Confirm",
     save: "Save",
     install: "Install",
     create: "Create",
@@ -80,6 +81,7 @@ export const enUS: Translations = {
   // Input Box
   inputBox: {
     placeholder: "How can I assist you today?",
+    editQuestion: "Edit question",
     createSkillPrompt:
       "We're going to build a new skill step by step with `skill-creator`. To start, what do you want this skill to do?",
     addAttachments: "Add attachments",

frontend-web/src/core/i18n/locales/types.ts

@@ -42,6 +42,7 @@ export interface Translations {
     code: string;
     preview: string;
     cancel: string;
+    confirm: string;
     save: string;
     install: string;
     create: string;
@@ -77,6 +78,7 @@ export interface Translations {
   // Input Box
   inputBox: {
     placeholder: string;
+    editQuestion: string;
     createSkillPrompt: string;
     addAttachments: string;
     mode: string;

frontend-web/src/core/i18n/locales/zh-CN.ts

@@ -41,6 +41,7 @@ export const zhCN: Translations = {
     code: "代码",
     preview: "预览",
     cancel: "取消",
+    confirm: "确定",
     save: "保存",
     install: "安装",
     create: "创建",
@@ -80,6 +81,7 @@ export const zhCN: Translations = {
   // Input Box
   inputBox: {
     placeholder: "今天我能为你做些什么？",
+    editQuestion: "编辑问题",
     createSkillPrompt:
       "我们一起用 skill-creator 技能来创建一个技能吧。先问问我希望这个技能能做什么。",
     addAttachments: "添加附件",

frontend-web/src/core/messages/utils.ts

@@ -20,6 +20,8 @@ interface AssistantClarificationGroup extends GenericMessageGroup<"assistant:cla
 
 interface AssistantSetupAgentApprovalGroup extends GenericMessageGroup<"assistant:setup-agent-approval"> {}
 
+interface AssistantSetupWritingApprovalGroup extends GenericMessageGroup<"assistant:setup-writing-approval"> {}
+
 interface AssistantSubagentGroup extends GenericMessageGroup<"assistant:subagent"> {}
 
 type MessageGroup =
@@ -29,6 +31,7 @@ type MessageGroup =
   | AssistantPresentFilesGroup
   | AssistantClarificationGroup
   | AssistantSetupAgentApprovalGroup
+  | AssistantSetupWritingApprovalGroup
   | AssistantSubagentGroup;
 
 export function groupMessages<T>(
@@ -50,7 +53,8 @@ export function groupMessages<T>(
       last.type !== "human" &&
       last.type !== "assistant" &&
       last.type !== "assistant:clarification" &&
-      last.type !== "assistant:setup-agent-approval"
+      last.type !== "assistant:setup-agent-approval" &&
+      last.type !== "assistant:setup-writing-approval"
     ) {
       return last;
     }
@@ -88,6 +92,13 @@ export function groupMessages<T>(
           type: "assistant:setup-agent-approval",
           messages: [message],
         });
+      } else if (isSetupWritingApprovalToolMessage(message)) {
+        lastOpenGroup()?.messages.push(message);
+        groups.push({
+          id: message.id,
+          type: "assistant:setup-writing-approval",
+          messages: [message],
+        });
       } else {
         const open = lastOpenGroup();
         if (open) {
@@ -354,6 +365,15 @@ export function isSetupAgentApprovalToolMessage(message: Message) {
   );
 }
 
+export function isSetupWritingApprovalToolMessage(message: Message) {
+  return (
+    message.type === "tool" &&
+    message.name === "setup_writing" &&
+    typeof message.additional_kwargs?.setup_writing_approval === "object" &&
+    message.additional_kwargs.setup_writing_approval !== null
+  );
+}
+
 export function extractPresentFilesFromMessage(message: Message) {
   if (message.type !== "ai" || !hasPresentFiles(message)) {
     return [];
@@ -462,10 +482,10 @@ export function parseUploadedFiles(content: string): FileInMessage[] {
     return [];
   }
 
-  // Check if the backend reported no new files were uploaded in this message
+  // NOTE: do NOT bail on "(empty)" here. The backend writes "(empty)" only for
-  if (uploadedFilesContent?.includes("(empty)")) {
+  // the "uploaded in this message" section; files uploaded in previous messages
-    return [];
+  // are still listed below it. Bailing dropped those valid entries. The file
-  }
+  // regex below naturally skips the "(empty)" line, so parsing stays correct.
 
   // Parse file list
   // Format: - filename (size)\n  Path: /path/to/file

frontend-web/src/core/scheduled-tasks/api.ts

@@ -2,12 +2,15 @@ import { apiFetch } from "@/core/api";
 import { getBackendBaseURL } from "@/core/config";
 
 import type {
+  HtmlPageFavorite,
   PublishedScheduledTask,
   ScheduledTask,
   ScheduledTaskDeliveryProfile,
+  ScheduledTaskExecutionContext,
   ScheduledTaskResultFileContent,
   ScheduledTaskRun,
   ScheduledTaskRunFileUpdateResponse,
+  ScheduledTaskRunHtml,
   ScheduledTaskRunMessagesResponse,
   ScheduledTaskSubscription,
   SchedulerThread,
@@ -52,6 +55,7 @@ export async function createScheduledTask(data: {
   timezone?: string | null;
   execution_agent_name?: string | null;
   require_markdown?: boolean;
+  execution_context?: ScheduledTaskExecutionContext | null;
 }) {
   return parseResponse<ScheduledTask>(
     await apiFetch(baseUrl(), {
@@ -212,6 +216,7 @@ export async function updateScheduledTask(
     enabled: boolean;
     execution_agent_name: string | null;
     require_markdown: boolean;
+    execution_context: ScheduledTaskExecutionContext | null;
   }>,
 ) {
   return parseResponse<ScheduledTask>(
@@ -368,3 +373,47 @@ export async function adminTriggerScheduledTask(taskId: string) {
     }),
   );
 }
+
+// --- HTML page tasks ---
+
+/** Fetch the generated HTML document for an ``html_page`` run. */
+export async function getScheduledTaskRunHtml(runId: string) {
+  return parseResponse<ScheduledTaskRunHtml>(
+    await apiFetch(`${baseUrl()}/runs/${encodeURIComponent(runId)}/html`),
+  );
+}
+
+const favoritesUrl = () => `${getBackendBaseURL()}/api/html-page-favorites`;
+
+export async function listHtmlPageFavorites() {
+  return parseResponse<HtmlPageFavorite[]>(await apiFetch(favoritesUrl()));
+}
+
+export async function getHtmlPageFavorite(favoriteId: string) {
+  return parseResponse<HtmlPageFavorite>(
+    await apiFetch(`${favoritesUrl()}/${encodeURIComponent(favoriteId)}`),
+  );
+}
+
+export async function createHtmlPageFavorite(data: {
+  page_id: string;
+  title?: string | null;
+  description?: string | null;
+  tags?: string[];
+}) {
+  return parseResponse<HtmlPageFavorite>(
+    await apiFetch(favoritesUrl(), {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(data),
+    }),
+  );
+}
+
+export async function deleteHtmlPageFavorite(favoriteId: string) {
+  return parseResponse<{ success: boolean }>(
+    await apiFetch(`${favoritesUrl()}/${encodeURIComponent(favoriteId)}`, {
+      method: "DELETE",
+    }),
+  );
+}

frontend-web/src/core/scheduled-tasks/hooks.ts

@@ -10,14 +10,18 @@ import {
   adminListScheduledTaskRuns,
   adminTriggerScheduledTask,
   adminUpdateScheduledTask,
+  createHtmlPageFavorite,
   createScheduledTask,
+  deleteHtmlPageFavorite,
   deleteScheduledTask,
   deleteScheduledTaskRun,
   getSchedulerThread,
   getScheduledTaskDeliveryProfile,
   getScheduledTaskRun,
+  getScheduledTaskRunHtml,
   getScheduledTaskRunMessages,
   listAllScheduledTasks,
+  listHtmlPageFavorites,
   listPublishedScheduledTasks,
   listScheduledTaskRuns,
   listScheduledTasks,
@@ -112,6 +116,42 @@ export function useScheduledTaskRunMessages(
   });
 }
 
+/** Generated HTML for an ``html_page`` run; polls while the run is in flight. */
+export function useScheduledTaskRunHtml(
+  runId?: string | null,
+  options: { enabled?: boolean; live?: boolean } = {},
+) {
+  return useQuery({
+    queryKey: ["scheduled-tasks", "runs", runId, "html"],
+    queryFn: () => getScheduledTaskRunHtml(runId!),
+    enabled: !!runId && (options.enabled ?? true),
+    refetchOnWindowFocus: false,
+    retry: false,
+    refetchInterval: options.live ? 5000 : false,
+  });
+}
+
+/** The current user's bookmarked HTML pages. */
+export function useHtmlPageFavorites(enabled: boolean = true) {
+  return useQuery({
+    queryKey: ["html-page-favorites"],
+    queryFn: listHtmlPageFavorites,
+    enabled,
+    refetchOnWindowFocus: false,
+  });
+}
+
+/** Create / delete HTML page favorites. */
+export function useHtmlPageFavoriteActions() {
+  const queryClient = useQueryClient();
+  const invalidate = () =>
+    queryClient.invalidateQueries({ queryKey: ["html-page-favorites"] });
+  return {
+    create: useMutation({ mutationFn: createHtmlPageFavorite, onSuccess: invalidate }),
+    remove: useMutation({ mutationFn: deleteHtmlPageFavorite, onSuccess: invalidate }),
+  };
+}
+
 export function useScheduledTaskDeliveryProfile() {
   return useQuery({
     queryKey: ["scheduled-tasks", "delivery-profile"],

frontend-web/src/core/scheduled-tasks/types.ts

@@ -11,6 +11,26 @@ export type ScheduledTaskSubscription = {
   updated_at?: string | null;
 };
 
+/** Task kinds. A bare/absent kind is the regular agent task. */
+export type ScheduledTaskKind = "agent" | "html_page";
+
+/** Config for an ``html_page`` task, persisted inside ``execution_context``.
+ * Data gathering is delegated to the agent's own search skills, so there is no
+ * explicit search query / data source — the page prompt drives everything. */
+export type HtmlPageConfig = {
+  page_prompt?: string | null;
+  negative_prompt?: string | null;
+  reference_favorite_id?: string | null;
+  model_name?: string | null;
+};
+
+export type ScheduledTaskExecutionContext = {
+  require_markdown?: boolean;
+  task_kind?: ScheduledTaskKind;
+  html_config?: HtmlPageConfig;
+  [key: string]: unknown;
+};
+
 export type ScheduledTask = {
   task_id: string;
   name: string;
@@ -21,11 +41,11 @@ export type ScheduledTask = {
   timezone: string;
   enabled: boolean;
   /**
-   * Free-form execution context persisted with the task. ``require_markdown``
+   * Free-form execution context persisted with the task. ``require_markdown``,
-   * lives here (rather than a dedicated column) so the feature needs no schema
+   * ``task_kind`` and ``html_config`` live here (rather than dedicated columns)
-   * migration.
+   * so the feature needs no schema migration.
    */
-  execution_context?: { require_markdown?: boolean; [key: string]: unknown } | null;
+  execution_context?: ScheduledTaskExecutionContext | null;
   next_run_at?: string | null;
   last_run_at?: string | null;
   last_status?: string | null;
@@ -70,7 +90,7 @@ export type ScheduledTaskResultFile = {
   path?: string | null;
   mime_type?: string | null;
   size?: number | null;
-  kind?: "markdown" | "attachment" | "artifact" | null;
+  kind?: "markdown" | "attachment" | "artifact" | "html" | null;
 };
 
 export type ScheduledTaskResultFileContent = {
@@ -86,9 +106,42 @@ export type ScheduledTaskResultFileContent = {
 export type ScheduledTaskRunResult = {
   title: string;
   content: string;
-  format: "markdown" | "text" | "json" | "mixed";
+  format: "markdown" | "text" | "json" | "mixed" | "html";
   files: ScheduledTaskResultFile[];
   created_at: string;
+  /** Present for ``html_page`` runs: the full generated HTML document. */
+  html?: string | null;
+  style_summary?: string | null;
+  layout_summary?: string | null;
+};
+
+/** Response of the run/latest HTML preview endpoints. */
+export type ScheduledTaskRunHtml = {
+  run_id: string;
+  task_id?: string | null;
+  title?: string | null;
+  html?: string | null;
+  style_summary?: string | null;
+  layout_summary?: string | null;
+  page_id?: string | null;
+  created_at?: string | null;
+};
+
+/** A user-bookmarked generated HTML page. */
+export type HtmlPageFavorite = {
+  id: string;
+  user_id: string;
+  page_id: string;
+  title: string;
+  description?: string | null;
+  tags?: string[];
+  html_snapshot?: string;
+  style_summary?: string | null;
+  layout_summary?: string | null;
+  content_structure_summary?: string | null;
+  reuse_prompt?: string | null;
+  created_at?: string | null;
+  updated_at?: string | null;
 };
 
 export type ScheduledTaskRun = {

frontend-web/src/core/settings/index.ts

@@ -1,3 +1,8 @@
 export { useLocalSettings, useThreadSettings } from "./hooks";
-export { isThreadRagModeLocked, lockThreadRagMode } from "./local";
+export {
+  getLastAgentId,
+  isThreadRagModeLocked,
+  lockThreadRagMode,
+  saveLastAgentId,
+} from "./local";
 export type { LocalSettings } from "./local";

frontend-web/src/core/settings/local.ts

@@ -8,6 +8,7 @@ export const DEFAULT_LOCAL_SETTINGS: LocalSettings = {
     streamSpeedMeterEnabled: true,
     ragModeEnabled: false,
     citationCleanupWords: [],
+    fontScale: 1,
   },
   context: {
     model_name: undefined,
@@ -20,6 +21,7 @@ export const DEFAULT_LOCAL_SETTINGS: LocalSettings = {
 export const LOCAL_SETTINGS_KEY = "deerflow.local-settings";
 export const THREAD_MODEL_KEY_PREFIX = "deerflow.thread-model.";
 export const THREAD_RAG_MODE_KEY_PREFIX = "deerflow.thread-rag-mode.";
+export const LAST_AGENT_ID_KEY = "deerflow.last-agent-id";
 
 function isBrowser(): boolean {
   return typeof window !== "undefined";
@@ -46,6 +48,13 @@ export interface LocalSettings {
      * and dialogs, one entry per line in the settings UI.
      */
     citationCleanupWords: string[];
+    /**
+     * Global UI font scale multiplier applied to the root <html> font-size.
+     * Base is 16px (deep-blue UI spec §2.1.2 body text), so `1` === 16px.
+     * The user picks a size from the appearance settings page; because the
+     * app sizes text/spacing in rem, the whole UI scales proportionally.
+     */
+    fontScale: number;
   };
   context: Omit<
     AgentThreadContext,
@@ -140,6 +149,29 @@ export function applyThreadModelOverride(
   };
 }
 
+/**
+ * The id of the agent the user last started a conversation with. New-chat
+ * landing screens pre-select this agent so the user doesn't have to re-pick it
+ * every time. Returns ``null`` when nothing was stored yet.
+ */
+export function getLastAgentId(): string | null {
+  if (!isBrowser()) {
+    return null;
+  }
+  return localStorage.getItem(LAST_AGENT_ID_KEY) || null;
+}
+
+export function saveLastAgentId(agentId: string | null | undefined) {
+  if (!isBrowser()) {
+    return;
+  }
+  if (!agentId) {
+    localStorage.removeItem(LAST_AGENT_ID_KEY);
+    return;
+  }
+  localStorage.setItem(LAST_AGENT_ID_KEY, agentId);
+}
+
 export function getLocalSettings(): LocalSettings {
   if (!isBrowser()) {
     return DEFAULT_LOCAL_SETTINGS;

frontend-web/src/core/skill-display/display-adapter.ts

@@ -1,4 +1,7 @@
-import type { SkillDisplayConfig } from "@/core/skills/type";
+import type {
+  SkillDisplayConfig,
+  SkillDisplayResultSetConfig,
+} from "@/core/skills/type";
 
 const DEFAULT_CITATION_MAX_ITEMS = 100;
 const DEFAULT_LIST_MAX_ITEMS = 20;
@@ -15,6 +18,10 @@ export interface DisplaySourceItem {
   url?: string;
   content?: string;
   score?: number;
+  displayMode?: SkillDisplayConfig["mode"];
+  resultSetKey?: string;
+  resultSetLabel?: string | null;
+  tableColumns?: SkillDisplayConfig["tableColumns"];
   raw: Record<string, unknown>;
 }
 
@@ -38,6 +45,7 @@ export const emptyDisplayConfig = (): SkillDisplayConfig => ({
   maxItems: DEFAULT_CITATION_MAX_ITEMS,
   customInstruction: "",
   tableColumns: [],
+  resultSets: [],
 });
 
 const candidateFields: Record<string, string[]> = {
@@ -53,7 +61,7 @@ const candidateFields: Record<string, string[]> = {
   idField: ["recUuid", "rec_uuid", "uuid", "docId", "taskId", "recordId", "id"],
 };
 
-function getByPath(value: unknown, path: string): unknown {
+function getByPath(value: unknown, path: string | null | undefined): unknown {
   if (!path) return value;
   return path.split(".").reduce<unknown>((acc, key) => {
     if (acc && typeof acc === "object") {
@@ -63,19 +71,55 @@ function getByPath(value: unknown, path: string): unknown {
   }, value);
 }
 
-function findFirstArray(
+export type ResultArrayCandidate = {
-  value: unknown,
+  key: string;
-  path = "",
+  label: string;
-): { path: string; items: Record<string, unknown>[] } | null {
+  path: string;
-  if (Array.isArray(value) && value.every((item) => item && typeof item === "object")) {
+  items: Record<string, unknown>[];
-    return { path, items: value as Record<string, unknown>[] };
+};
+
+export function findResultArrayCandidates(samplePayload: unknown): ResultArrayCandidate[] {
+  const candidates: ResultArrayCandidate[] = [];
+  const seen = new Set<string>();
+
+  function visit(value: unknown, path = "", depth = 0) {
+    if (depth > 8 || candidates.length >= 20) return;
+    if (Array.isArray(value)) {
+      const objectItems = value.filter(
+        (item): item is Record<string, unknown> =>
+          !!item && typeof item === "object" && !Array.isArray(item),
+      );
+      if (
+        (value.length === 0 || objectItems.length > 0) &&
+        objectItems.length === value.length &&
+        !seen.has(path)
+      ) {
+        seen.add(path);
+        candidates.push({
+          key: buildResultSetKey(path || "root"),
+          label: buildResultSetLabel(path || "根数组", objectItems.length),
+          path,
+          items: objectItems,
+        });
+      }
+      return;
+    }
+    if (!value || typeof value !== "object" || Array.isArray(value)) return;
+    for (const [key, child] of Object.entries(value)) {
+      visit(child, path ? `${path}.${key}` : key, depth + 1);
+    }
   }
-  if (!value || typeof value !== "object") return null;
+
-  for (const [key, child] of Object.entries(value)) {
+  visit(samplePayload);
-    const found = findFirstArray(child, path ? `${path}.${key}` : key);
+  return candidates;
-    if (found) return found;
+}
-  }
+
-  return null;
+function buildResultSetKey(path: string): string {
+  return path.replace(/[^a-zA-Z0-9_]+/g, "_").replace(/^_+|_+$/g, "") || "root";
+}
+
+function buildResultSetLabel(path: string, count: number): string {
+  return `${path}（${count} 条）`;
 }
 
 function pickField(sample: Record<string, unknown>, candidates: string[]): string | null {
@@ -93,13 +137,31 @@ function pickField(sample: Record<string, unknown>, candidates: string[]): strin
 }
 
 export function inferDisplayConfig(samplePayload: unknown, skillName?: string): SkillDisplayConfig {
-  const found = findFirstArray(samplePayload) ?? { path: "results", items: [] };
+  const candidates = findResultArrayCandidates(samplePayload);
-  const sample = found.items[0] ?? {};
+  const found = candidates[0] ?? {
+    key: "results",
+    label: "results（0 条）",
+    path: "results",
+    items: [],
+  };
+  const inferred = buildConfigFromCandidate(found, skillName);
+  inferred.resultSets =
+    candidates.length > 1
+      ? candidates.map((candidate) => buildResultSetConfigFromCandidate(candidate, skillName))
+      : [];
+  return inferred;
+}
+
+function buildConfigFromCandidate(
+  candidate: ResultArrayCandidate,
+  skillName?: string,
+): SkillDisplayConfig {
+  const sample = candidate.items[0] ?? {};
   const inferred = emptyDisplayConfig();
   inferred.enabled = true;
   inferred.mode = skillName === "knowledge-search-v2" ? "citation" : "list";
-  inferred.resultPath = found.path || "results";
+  inferred.resultPath = candidate.path || "results";
-  inferred.maxItems = inferMaxItems(found.items.length, inferred.mode);
+  inferred.maxItems = inferMaxItems(candidate.items.length, inferred.mode);
 
   for (const [target, candidates] of Object.entries(candidateFields)) {
     (inferred as unknown as Record<string, string | null>)[target] = pickField(sample, candidates);
@@ -123,6 +185,65 @@ export function inferDisplayConfig(samplePayload: unknown, skillName?: string):
   return inferred;
 }
 
+function buildResultSetConfigFromCandidate(
+  candidate: ResultArrayCandidate,
+  skillName?: string,
+): SkillDisplayResultSetConfig {
+  const config = buildConfigFromCandidate(candidate, skillName);
+  return {
+    key: candidate.key,
+    label: candidate.label,
+    enabled: true,
+    mode: config.mode,
+    resultPath: config.resultPath,
+    titleField: config.titleField,
+    summaryField: config.summaryField,
+    contentField: config.contentField,
+    sourceField: config.sourceField,
+    authorField: config.authorField,
+    typeField: config.typeField,
+    timeField: config.timeField,
+    scoreField: config.scoreField,
+    urlField: config.urlField,
+    idField: config.idField,
+    linkStrategy: config.linkStrategy,
+    linkTemplate: config.linkTemplate,
+    citationToken: config.citationToken,
+    maxItems: config.maxItems,
+    customInstruction: config.customInstruction,
+    tableColumns: config.tableColumns,
+  };
+}
+
+export function displayConfigFromResultSet(
+  base: SkillDisplayConfig,
+  resultSet: SkillDisplayResultSetConfig,
+): SkillDisplayConfig {
+  return {
+    ...base,
+    enabled: resultSet.enabled,
+    mode: resultSet.mode,
+    resultPath: resultSet.resultPath,
+    titleField: resultSet.titleField,
+    summaryField: resultSet.summaryField,
+    contentField: resultSet.contentField,
+    sourceField: resultSet.sourceField,
+    authorField: resultSet.authorField,
+    typeField: resultSet.typeField,
+    timeField: resultSet.timeField,
+    scoreField: resultSet.scoreField,
+    urlField: resultSet.urlField,
+    idField: resultSet.idField,
+    linkStrategy: resultSet.linkStrategy,
+    linkTemplate: resultSet.linkTemplate,
+    citationToken: resultSet.citationToken,
+    maxItems: resultSet.maxItems,
+    customInstruction: resultSet.customInstruction,
+    tableColumns: resultSet.tableColumns,
+    resultSets: [],
+  };
+}
+
 function buildDefaultTableColumns(
   sample: Record<string, unknown>,
   config: SkillDisplayConfig,
@@ -161,13 +282,13 @@ function stringify(value: unknown, fallback = ""): string {
 
 function renderTemplate(template: string, item: Record<string, unknown>): string {
   return template.replace(/\{([^}]+)\}/g, (_match, key: string) =>
-    encodeURIComponent(stringify(item[key])),
+    encodeURIComponent(stringify(getByPath(item, key.trim()))),
   );
 }
 
 function resolveLink(item: Record<string, unknown>, config: SkillDisplayConfig): string | undefined {
-  const url = config.urlField ? stringify(item[config.urlField]) : "";
+  const url = config.urlField ? stringify(getByPath(item, config.urlField)) : "";
-  const id = config.idField ? stringify(item[config.idField]) : "";
+  const id = config.idField ? stringify(getByPath(item, config.idField)) : "";
   if (config.linkStrategy === "url") return url || undefined;
   if (config.linkStrategy === "id") {
     return id && config.linkTemplate ? renderTemplate(config.linkTemplate, item) : undefined;
@@ -176,6 +297,30 @@ function resolveLink(item: Record<string, unknown>, config: SkillDisplayConfig):
 }
 
 export function normalizeDisplaySources(payload: unknown, config: SkillDisplayConfig): DisplaySourceItem[] {
+  const configuredResultSets = config.resultSets ?? [];
+  const resultSets = configuredResultSets.filter(
+    (resultSet) => resultSet.enabled && resultSet.mode !== "none",
+  );
+  if (configuredResultSets.length > 0) {
+    return resultSets.flatMap((resultSet) =>
+      normalizeDisplaySourcesForConfig(
+        payload,
+        displayConfigFromResultSet(config, resultSet),
+        resultSet,
+      ),
+    );
+  }
+  if (!config.enabled || config.mode === "none") {
+    return [];
+  }
+  return normalizeDisplaySourcesForConfig(payload, config);
+}
+
+function normalizeDisplaySourcesForConfig(
+  payload: unknown,
+  config: SkillDisplayConfig,
+  resultSet?: SkillDisplayResultSetConfig,
+): DisplaySourceItem[] {
   const rawItems = getByPath(payload, config.resultPath);
   if (!Array.isArray(rawItems)) return [];
   const maxItems = resolveMaxItems(config, rawItems.length);
@@ -183,19 +328,23 @@ export function normalizeDisplaySources(payload: unknown, config: SkillDisplayCo
     .filter((item): item is Record<string, unknown> => !!item && typeof item === "object")
     .slice(0, maxItems)
     .map((item, index) => ({
-      id: config.idField ? stringify(item[config.idField]) : undefined,
+      id: config.idField ? stringify(getByPath(item, config.idField)) : undefined,
-      title: config.titleField ? stringify(item[config.titleField], `结果 ${index + 1}`) : `结果 ${index + 1}`,
+      title: config.titleField ? stringify(getByPath(item, config.titleField), `结果 ${index + 1}`) : `结果 ${index + 1}`,
-      type: config.typeField ? stringify(item[config.typeField], "result") : "result",
+      type: config.typeField ? stringify(getByPath(item, config.typeField), "result") : "result",
-      snippet: config.summaryField ? stringify(item[config.summaryField]) : "",
+      snippet: config.summaryField ? stringify(getByPath(item, config.summaryField)) : "",
-      content: config.contentField ? stringify(item[config.contentField]) : undefined,
+      content: config.contentField ? stringify(getByPath(item, config.contentField)) : undefined,
-      source: config.sourceField ? stringify(item[config.sourceField]) : undefined,
+      source: config.sourceField ? stringify(getByPath(item, config.sourceField)) : undefined,
-      author: config.authorField ? stringify(item[config.authorField]) : undefined,
+      author: config.authorField ? stringify(getByPath(item, config.authorField)) : undefined,
-      time: config.timeField ? stringify(item[config.timeField]) : undefined,
+      time: config.timeField ? stringify(getByPath(item, config.timeField)) : undefined,
       score:
-        config.scoreField && typeof item[config.scoreField] === "number"
+        config.scoreField && typeof getByPath(item, config.scoreField) === "number"
-          ? (item[config.scoreField] as number)
+          ? (getByPath(item, config.scoreField) as number)
           : undefined,
       url: resolveLink(item, config),
+      displayMode: config.mode,
+      resultSetKey: resultSet?.key,
+      resultSetLabel: resultSet?.label,
+      tableColumns: config.tableColumns,
       raw: item,
     }));
 }

frontend-web/src/core/skill-display/runtime.ts

@@ -202,8 +202,8 @@ export function collectRuntimeDisplaySources(
         normalized.map((item) => ({
           ...item,
           skillName: match?.skillName ?? toolCall.name,
-          mode: effectiveMode,
+          mode: item.displayMode ?? effectiveMode,
-          tableColumns: match?.display.tableColumns,
+          tableColumns: item.tableColumns ?? match?.display.tableColumns,
         })),
         seenCitationKeys,
         () => ++citationIndex,
@@ -242,8 +242,8 @@ export function collectRuntimeDisplaySources(
       normalized.map((item) => ({
         ...item,
         skillName: match?.skillName ?? toolName,
-        mode: effectiveMode,
+        mode: item.displayMode ?? effectiveMode,
-        tableColumns: match?.display.tableColumns,
+        tableColumns: item.tableColumns ?? match?.display.tableColumns,
       })),
       seenCitationKeys,
       () => ++citationIndex,

frontend-web/src/core/skills/api.ts

@@ -202,6 +202,24 @@ export async function installSkillUpload(
   return response.json() as Promise<InstallSkillResponse>;
 }
 
+export async function duplicateSkill(
+  sourceName: string,
+  newName: string,
+): Promise<InstallSkillResponse> {
+  const response = await apiFetch(
+    `${getBackendBaseURL()}/api/skills/custom/${encodeURIComponent(sourceName)}/duplicate`,
+    {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ new_name: newName }),
+    },
+  );
+  if (!response.ok) {
+    throw await parseDetailedError(response, "Failed to duplicate skill");
+  }
+  return response.json() as Promise<InstallSkillResponse>;
+}
+
 export interface ReconcileCustomSkillsResponse {
   adopted: string[];
   already_registered: string[];

frontend-web/src/core/skills/hooks.ts

@@ -7,6 +7,7 @@ import {
 
 import {
   deleteCustomSkill,
+  duplicateSkill,
   enableSkill,
   getSkill,
   getSkillContent,
@@ -192,6 +193,22 @@ export function useSetSkillPinned() {
   });
 }
 
+export function useDuplicateSkill() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      sourceName,
+      newName,
+    }: {
+      sourceName: string;
+      newName: string;
+    }) => duplicateSkill(sourceName, newName),
+    onSuccess: () => {
+      void queryClient.invalidateQueries({ queryKey: ["skills"] });
+    },
+  });
+}
+
 export function useDeleteCustomSkill() {
   const queryClient = useQueryClient();
   return useMutation({

frontend-web/src/core/skills/type.ts

@@ -12,7 +12,9 @@ export interface SkillDisplayTableColumn {
   width?: string | null;
 }
 
-export interface SkillDisplayConfig {
+export interface SkillDisplayResultSetConfig {
+  key: string;
+  label?: string | null;
   enabled: boolean;
   mode: SkillDisplayMode;
   resultPath: string;
@@ -34,6 +36,10 @@ export interface SkillDisplayConfig {
   tableColumns?: SkillDisplayTableColumn[];
 }
 
+export interface SkillDisplayConfig extends Omit<SkillDisplayResultSetConfig, "key" | "label"> {
+  resultSets?: SkillDisplayResultSetConfig[];
+}
+
 export interface Skill {
   name: string;
   description: string;

frontend-web/src/core/studio/api.ts

@@ -46,7 +46,10 @@ export async function createSearchSpace(
     },
     body: JSON.stringify({ name, description: "", citations_enabled: true }),
   });
-  if (!res.ok) throw new Error(`创建失败：${res.status}`);
+  if (!res.ok) {
+    const body = await res.json().catch(() => null);
+    throw new Error(body?.detail || `创建失败：${res.status}`);
+  }
 }
 
 export async function uploadSourceText(

frontend-web/src/core/threads/hooks.ts

@@ -350,9 +350,12 @@ export function useThreadStream({
         // agent thread URL — otherwise fall back to the global new chat.
         const hash = typeof window !== "undefined" ? window.location.hash : "";
         const agentMatch = hash.match(/#\/page\/workspace\/agents\/([^/]+)\//);
+        const iframeMatch = hash.match(/#\/page\/workspace\/chats_iframe\//);
         const target = agentMatch
           ? `/page/workspace/agents/${agentMatch[1]}/chats/new`
-          : "/page/workspace/chats/new";
+          : iframeMatch
+            ? "/page/workspace/chats_iframe/new"
+            : "/page/workspace/chats/new";
         // First navigate to a safe URL so the post-reload page lands on a
         // valid route. Then full-reload so TanStack Query cache, context
         // providers and any other state captured under the previous user's

frontend-web/src/core/threads/utils.ts

@@ -62,6 +62,33 @@ export function textOfMessage(message: Message) {
   return null;
 }
 
-export function titleOfThread(thread: AgentThread) {
+export function titleOfThread(thread: AgentThread, fallback = "Untitled") {
-  return thread.values?.title ?? "Untitled";
+  const title = thread.values?.title;
+  if (title) return title;
+
+  // No title yet (e.g. the very first turn is still streaming, or the backend
+  // title pass hasn't finished). Derive a sensible display title from the first
+  // user message so the user never sees a bare "Untitled" placeholder.
+  const messages = thread.values?.messages;
+  if (Array.isArray(messages)) {
+    const firstHuman = messages.find((m) => m.type === "human");
+    const text = firstHuman ? textOfMessage(firstHuman)?.trim() : null;
+    if (text) {
+      return text.length > 50 ? `${text.slice(0, 50).trimEnd()}…` : text;
+    }
+  }
+
+  return fallback;
+}
+
+export function sanitizeThreadTitleForDisplay(title: string | null | undefined) {
+  if (!title) return "Untitled";
+
+  const cleaned = title
+    .replace(/<\/?[^>\n]+>/g, " ")
+    .replace(/<[^>\n]*$/g, " ")
+    .replace(/\s+/g, " ")
+    .trim();
+
+  return cleaned || "Untitled";
 }

frontend-web/src/lib/desensitize.ts

@@ -5,6 +5,7 @@
  */
 export const DESENSITIZE_MAP: Record<string, string> = {
   态势: "TS",
+  你好: "nh",
   滨海作战体系: "第一张网",
   滨海作战部队: "第一张网",
   'Taiwan Air Force Flight Units': "第二张网",

frontend-web/src/open-canvas/components/ai-writing/AIWritingDraftPanel.tsx

@@ -1,24 +1,28 @@
 import { FileText, PenLine } from 'lucide-react';
 
+import { useAIWritingOptional } from '../../contexts/AIWritingContext';
 import { useCanvasGraphContext } from '../../contexts/CanvasGraphContext';
+import { useCanvasUIContext } from '../../contexts/CanvasUIContext';
+import { assembleStreamingDraftMarkdown } from '../../hooks/useAIWritingStream';
 import { getCurrentArtifactContent, isCodeArtifact } from '../../utils/artifact';
 import { TextArtifactRenderer } from '../artifact/TextArtifactRenderer';
+import { DraftStreamingPreview } from './DraftStreamingPreview';
 import type { CanvasArtifactText } from '../../types/artifact';
 
 function DraftWaitingPlaceholder() {
   return (
     <div className="h-full flex flex-col items-center justify-center gap-5 select-none">
       <div className="relative">
-        <div className="w-16 h-16 rounded-2xl bg-muted/60 flex items-center justify-center">
+        <div className="w-16 h-16 rounded-2xl bg-muted/60 flex items-center justify-center  dark:bg-[#022248] ">
-          <FileText className="w-8 h-8 text-muted-foreground/40" />
+          <FileText className="w-8 h-8 text-muted-foreground/40 dark:text-[#55A6FE] " />
         </div>
-        <div className="absolute -bottom-1.5 -right-1.5 w-6 h-6 rounded-full bg-primary/10 flex items-center justify-center">
+        <div className="absolute -bottom-1.5 -right-1.5 w-6 h-6 rounded-full bg-primary/10 flex items-center justify-center dark:bg-[#102D5C] ">
-          <PenLine className="w-3.5 h-3.5 text-primary/60" />
+          <PenLine className="w-3.5 h-3.5 text-primary/60 dark:text-[#2580FF] " />
         </div>
       </div>
       <div className="text-center space-y-1.5 max-w-[200px]">
-        <p className="text-sm font-medium text-foreground/60">草稿将在此处显示</p>
+        <p className="text-sm font-medium text-foreground/60 dark:text-[#AACEFF]">草稿将在此处显示</p>
-        <p className="text-[11px] text-muted-foreground leading-relaxed">
+        <p className="text-[11px] text-muted-foreground leading-relaxed dark:text-[#55A6FE]">
           完成写作流程后，AI 生成的内容将实时出现在这里
         </p>
       </div>
@@ -27,33 +31,81 @@ function DraftWaitingPlaceholder() {
 }
 
 export function AIWritingDraftPanel() {
+  const writing = useAIWritingOptional();
   const { artifact } = useCanvasGraphContext();
+  const { isDraftEditable } = useCanvasUIContext();
 
-  if (!artifact) {
+  const writingStatus = writing?.state.status;
+  // 仅当章节仍在累积时走流式 Markdown；draft_ready 清空 sections 后即使 status 尚未切走也进画布
+  const isActivelyStreamingDraft =
+    (writingStatus === 'writing_draft' || writingStatus === 'revising') &&
+    (writing?.state.streamingDraftSections.length ?? 0) > 0;
+
+  const streamingMarkdown = isActivelyStreamingDraft && writing
+    ? assembleStreamingDraftMarkdown(
+        writing.state.streamingDraftSections,
+        writing.state.streamingDraftTitle || writing.state.outline?.title || '',
+      )
+    : '';
+
+  // 流式生成中：只读 Markdown 预览
+  if (isActivelyStreamingDraft) {
     return (
-      <div className="h-full bg-muted/10 border-l">
+      <div className="h-full flex flex-col overflow-hidden border-l">
-        <DraftWaitingPlaceholder />
+        <div className="h-10 border-b flex items-center gap-2 px-4 shrink-0 bg-muted/20">
+          <FileText className="w-3.5 h-3.5 text-muted-foreground shrink-0" />
+          <span className="text-sm font-medium truncate flex-1">草稿生成中…</span>
+        </div>
+        <div className="flex-1 overflow-hidden">
+          {streamingMarkdown ? (
+            <DraftStreamingPreview markdown={streamingMarkdown} />
+          ) : (
+            <DraftWaitingPlaceholder />
+          )}
+        </div>
       </div>
     );
   }
 
-  const content = getCurrentArtifactContent(artifact);
+  const artifactContent = artifact ? getCurrentArtifactContent(artifact) : null;
+  const textFromArtifact =
+    artifactContent && !isCodeArtifact(artifactContent)
+      ? (artifactContent as CanvasArtifactText)
+      : null;
+  // draft_ready 后 DraftSync 写 artifact 可能晚一帧；先用 context 里的成稿兜底，避免闪占位符
+  const textContent: CanvasArtifactText | null =
+    textFromArtifact ??
+    (writing?.state.currentDraftMarkdown
+      ? {
+          index: 0,
+          type: 'text',
+          title: writing.state.currentDraftTitle || '草稿',
+          fullMarkdown: writing.state.currentDraftMarkdown,
+        }
+      : null);
+
+  if (textContent) {
+    return (
+      <div className="h-full flex flex-col overflow-hidden border-l">
+        <div className="h-10 border-b flex items-center gap-2 px-4 shrink-0 bg-muted/20">
+          <FileText className="w-3.5 h-3.5 text-muted-foreground shrink-0" />
+          <span className="text-sm font-medium truncate flex-1">
+            {textContent.title || '草稿预览'}
+          </span>
+        </div>
+        <div className="flex-1 overflow-hidden">
+          <TextArtifactRenderer
+            content={textContent}
+            isStreaming={!isDraftEditable}
+          />
+        </div>
+      </div>
+    );
+  }
 
   return (
-    <div className="h-full flex flex-col overflow-hidden border-l">
+    <div className="h-full bg-muted/10 border-l">
-      {/* 标题栏 */}
+      <DraftWaitingPlaceholder />
-      <div className="h-10 border-b flex items-center gap-2 px-4 shrink-0 bg-muted/20">
-        <FileText className="w-3.5 h-3.5 text-muted-foreground shrink-0" />
-        <span className="text-sm font-medium truncate flex-1">
-          {content?.title ?? '草稿预览'}
-        </span>
-      </div>
-
-      <div className="flex-1 overflow-hidden">
-        {content && !isCodeArtifact(content) ? (
-          <TextArtifactRenderer content={content as CanvasArtifactText} />
-        ) : null}
-      </div>
     </div>
   );
 }

frontend-web/src/open-canvas/components/ai-writing/AIWritingForm.tsx

@@ -15,6 +15,7 @@ import { useStudioNotebooks, useNotebookSources } from '@/core/studio/hooks';
 
 import type { AIWritingRequest } from '../../types/ai-writing';
 import { useArticleTypes } from '../../hooks/useArticleTypes';
+import { useWritingForm } from '../../contexts/WritingFormContext';
 
 interface AIWritingFormProps {
   onSubmit: (req: AIWritingRequest) => void;
@@ -26,12 +27,13 @@ interface AIWritingFormProps {
 const INPUT_CLASS =
   'flex h-12 w-full rounded-xl border border-[#e8dedd] bg-white px-4 py-2 text-sm shadow-sm ' +
   'placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 ' +
-  'focus-visible:ring-ring disabled:opacity-50';
+  'focus-visible:ring-ring disabled:opacity-50 ' +
+  'dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEFF] dark:placeholder:text-[#566B7F] ' +
+  'dark:[color-scheme:dark] dark:focus-visible:border-[#3b82f6] dark:focus-visible:ring-[#3b82f6]/30';
 
 const DEFAULT_KEYWORD_COUNT = 1;
 const DEFAULT_AUDIENCE = '普通读者';
 type MaterialSource = 'knowledge_base' | 'skill' | 'notebook';
-const DEFAULT_MATERIAL_SOURCE: MaterialSource = 'knowledge_base';
 const MAX_INTENT_LENGTH = 500;
 
 const MATERIAL_SOURCE_OPTIONS: Array<{ value: MaterialSource; label: string; desc: string }> = [
@@ -49,14 +51,18 @@ export function AIWritingForm({
   disabled,
   hideAdvancedFields = false,
 }: AIWritingFormProps) {
-  const [intent, setIntent] = useState('');
+  const {
-  const [articleType, setArticleType] = useState('analysis');
+    intent, setIntent,
-  const [audience, setAudience] = useState('普通读者');
+    showOutline, setShowOutline,
-  const [wordCountInput, setWordCountInput] = useState('800');
+    outlineText, setOutlineText,
-  const [strictMode, setStrictMode] = useState(false);
+    articleType, setArticleType,
-  const [materialSource, setMaterialSource] = useState<MaterialSource>(DEFAULT_MATERIAL_SOURCE);
+    audience, setAudience,
-  const [modelName, setModelName] = useState('');
+    wordCountInput, setWordCountInput,
-  // 笔记来源：选中的 search_space_id 和多个 document_id
+    strictMode, setStrictMode,
+    materialSource, setMaterialSource,
+    modelName, setModelName,
+  } = useWritingForm();
+  // 笔记来源：选中的 search_space_id 和多个 document_id（master 引入，useWritingForm 未含）
   const [selectedNotebookId, setSelectedNotebookId] = useState<number | null>(null);
   const [selectedDocumentIds, setSelectedDocumentIds] = useState<number[]>([]);
 
@@ -139,6 +145,7 @@ export function AIWritingForm({
     const wordCount = Math.max(100, parseInt(wordCountInput, 10) || 800);
     onSubmit({
       userIntent: intent.trim(),
+      userOutline: outlineText.trim() || undefined,
       articleType,
       targetAudience: hideAdvancedFields
         ? DEFAULT_AUDIENCE
@@ -156,16 +163,18 @@ export function AIWritingForm({
 
   return (
     <form onSubmit={handleSubmit} className="space-y-4 px-4 py-4">
-      <div className="rounded-2xl border border-[#ebe3e2] bg-[#fcf8f8] p-4">
+      <div className="rounded-2xl border border-[#ebe3e2] bg-[#fcf8f8] p-4 dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white [&_h3]:dark:text-white [&_label]:dark:text-white">
-        <div className="flex items-center gap-2 border-b border-[#ece5e4] pb-3">
+        <div className="flex items-center gap-2 border-b border-[#ece5e4] pb-3 dark:border-[#213D5E]">
-          <PenLine className="size-4 text-[#8b6f6f]" />
+          <PenLine className="size-4 text-[#8b6f6f] dark:text-white" />
-          <h3 className="text-[18px] font-semibold leading-none text-[#2f2f2f]">写作配置选项</h3>
+          <h3 className="text-[18px] font-semibold leading-none text-[#2f2f2f] dark:text-white">
+            写作配置选项
+          </h3>
         </div>
 
         <div className="mt-4 space-y-2">
           <div className="flex items-center justify-between">
             <label className={FIELD_LABEL_CLASS}>写作意图</label>
-            <span className="text-sm text-muted-foreground">
+            <span className="text-sm text-muted-foreground dark:text-white/70">
               {intent.length} / {MAX_INTENT_LENGTH} 字
             </span>
           </div>
@@ -180,6 +189,43 @@ export function AIWritingForm({
           />
         </div>
 
+        <div className="mt-4 space-y-2">
+          <button
+            type="button"
+            onClick={() => setShowOutline(!showOutline)}
+            disabled={disabled}
+            className="flex w-full items-center justify-between text-left"
+          >
+            <span className={FIELD_LABEL_CLASS}>
+              已有大纲
+              <span className="ml-1 text-sm font-normal text-muted-foreground dark:text-white/70">
+                （可选）
+              </span>
+            </span>
+            <span className="text-sm text-muted-foreground dark:text-white/70">
+              {showOutline ? '收起 ▴' : '我已有大纲，直接粘贴 ▾'}
+            </span>
+          </button>
+          {showOutline && (
+            <>
+              <Textarea
+                placeholder={
+                  '粘贴你已有的大纲，将完全按你的大纲生成（支持一/二/三级目录）。例如：\n' +
+                  '一、引言\n（一）背景\n（二）意义\n二、现状分析\n…'
+                }
+                value={outlineText}
+                onChange={(e) => setOutlineText(e.target.value)}
+                disabled={disabled}
+                rows={6}
+                className="resize-none rounded-2xl border-[#e8dedd] bg-white px-4 py-3 text-sm leading-6 shadow-sm"
+              />
+              <p className="text-xs leading-relaxed text-muted-foreground/80">
+                填写后将跳过自动大纲规划，按你粘贴的大纲逐章生成；留空则由 AI 自动规划大纲。
+              </p>
+            </>
+          )}
+        </div>
+
         <div className="mt-4 grid grid-cols-2 gap-4">
           <div className="min-w-0 space-y-2">
             <label className={FIELD_LABEL_CLASS}>文章类型</label>
@@ -191,7 +237,7 @@ export function AIWritingForm({
               <SelectTrigger className={FIELD_TRIGGER_CLASS}>
                 <SelectValue placeholder={typesLoading ? '加载中…' : '选择类型'} />
               </SelectTrigger>
-              <SelectContent>
+              <SelectContent position="popper" side="bottom" sideOffset={4}>
                 {articleTypes.map((t) => (
                   <SelectItem key={t.key} value={t.key} className="text-sm">
                     {t.label}
@@ -309,7 +355,7 @@ export function AIWritingForm({
                 }
               />
             </SelectTrigger>
-            <SelectContent>
+            <SelectContent position="popper" side="bottom" sideOffset={4}>
               {models.map((m) => (
                 <SelectItem key={m.name} value={m.name} className="text-sm">
                   {m.display_name || m.name}

frontend-web/src/open-canvas/components/ai-writing/AIWritingPanel.tsx

@@ -14,7 +14,7 @@ import {
 import { useArticleTypes } from '../../hooks/useArticleTypes';
 
 import { useCanvasGraphContext } from '../../contexts/CanvasGraphContext';
-import { useAIWriting } from '../../hooks/useAIWritingStream';
+import { useAIWriting } from '../../contexts/AIWritingContext';
 import { useAIWritingSessions } from '../../hooks/useAIWritingSessions';
 import { adminCleanupAIWritingSessions } from '../../api/ai-writing-sessions';
 
@@ -41,7 +41,8 @@ import { InterventionCard } from './InterventionCard';
 import { SkillStepsCard } from './SkillStepsCard';
 import { SkillSelectStreamingView } from './SkillSelectStreamingView';
 import { WritingSkeletonCard } from './WritingSkeletonCard';
-import { DraftStreamingView } from './DraftStreamingView';
+import { DraftGeneratingView } from './DraftGeneratingView';
+import { DraftSync } from './DraftSync';
 import { IntentResultCard } from './IntentResultCard';
 import { IntentStreamingView } from './IntentStreamingView';
 import { OutlineStreamingView } from './OutlineStreamingView';
@@ -251,6 +252,7 @@ export function AIWritingPanel({
   if (historySession) {
     return (
       <div className="flex flex-col h-full overflow-hidden bg-background">
+        <DraftSync status={state.status} markdown={state.currentDraftMarkdown} title={state.currentDraftTitle} />
         <div className="flex items-center justify-between px-4 py-2.5 border-b shrink-0">
           <span className="text-sm font-semibold truncate flex-1 min-w-0 mr-2">
             {historySession.draft_title ?? historySession.title}
@@ -287,6 +289,7 @@ export function AIWritingPanel({
 
   return (
     <div className="flex flex-col h-full overflow-hidden bg-background">
+      <DraftSync status={state.status} markdown={state.currentDraftMarkdown} title={state.currentDraftTitle} />
       {/* 头部 */}
       <div className="flex items-center justify-between px-4 py-2.5 border-b shrink-0">
         <span
@@ -440,12 +443,9 @@ export function AIWritingPanel({
           </div>
         )}
 
-        {/* 草稿流式打字机视图 */}
+        {/* 草稿生成中：左侧只展示思考过程（若有）+「内容生成中」骨架屏；正文实时显示在右侧画布 */}
-        {state.status === 'writing_draft' && state.streamingDraftSections.length > 0 && (
+        {state.status === 'writing_draft' && (
-          <DraftStreamingView
+          <DraftGeneratingView sections={state.streamingDraftSections} />
-            title={state.streamingDraftTitle}
-            sections={state.streamingDraftSections}
-          />
         )}
 
         {/* 技能选择 LLM 流式打字（含 <think> 思考分离），select_skills 完成后自动清空。
@@ -485,12 +485,6 @@ export function AIWritingPanel({
           </div>
         )}
 
-        {state.status === 'writing_draft' && state.streamingDraftSections.length === 0 && (
-          <div className="px-4 pb-4">
-            <WritingSkeletonCard status="writing_draft" />
-          </div>
-        )}
-
         {isError && state.error && (
           <div className="mx-4 mt-2 rounded-md bg-destructive/10 px-3 py-2 text-xs text-destructive">
             {state.error}

frontend-web/src/open-canvas/components/ai-writing/DraftGeneratingView.tsx

@@ -0,0 +1,119 @@
+import { useEffect, useRef } from 'react';
+import { Brain, PenLine } from 'lucide-react';
+import type { StreamingDraftSection } from '../../types/ai-writing';
+
+interface DraftGeneratingViewProps {
+  sections: StreamingDraftSection[];
+}
+
+/** 思考过程框：纯只读展示，跟随内容自动滚到底（仅操作 DOM，不触发 setState） */
+function ThinkingBox({ text, done }: { text: string; done: boolean }) {
+  const preRef = useRef<HTMLPreElement>(null);
+  useEffect(() => {
+    if (preRef.current) preRef.current.scrollTop = preRef.current.scrollHeight;
+  }, [text]);
+
+  return (
+    <div className="rounded-lg border border-amber-200 dark:border-amber-900 bg-amber-50/50 dark:bg-amber-950/20 overflow-hidden">
+      <div className="flex items-center gap-1.5 px-2.5 py-1.5 bg-amber-100/40 dark:bg-amber-900/30">
+        <Brain className="size-3 text-amber-500 shrink-0" />
+        <span className="text-[11px] font-medium text-amber-600 dark:text-amber-400">思考过程</span>
+      </div>
+      <pre
+        ref={preRef}
+        className="text-[10px] font-mono leading-relaxed px-2.5 py-2 text-amber-700/70 dark:text-amber-300/60 whitespace-pre-wrap max-h-40 overflow-y-auto italic"
+      >
+        {text}
+        {!done && (
+          <span className="inline-block w-0.5 h-3 bg-amber-400 ml-0.5 align-text-bottom animate-[blink_1s_step-end_infinite]" />
+        )}
+      </pre>
+    </div>
+  );
+}
+
+/** 「内容生成中」骨架屏：流光扫过的占位行 + 写字笔抖动 + 跳动圆点，提示正文正在右侧实时生成 */
+const SKELETON_WIDTHS = ['92%', '100%', '85%', '96%', '70%'];
+
+function GeneratingSkeleton() {
+  return (
+    <div className="group relative overflow-hidden rounded-xl border bg-card shadow-sm p-4">
+      {/* 顶部一道缓慢流过的高光，强化"正在工作"的呼吸感 */}
+      <div className="pointer-events-none absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-primary/[0.07] to-transparent animate-[card-sheen_2.8s_ease-in-out_infinite]" />
+
+      <div className="relative flex items-center gap-2 mb-3">
+        <PenLine className="size-3.5 text-primary animate-[pen-write_1.2s_ease-in-out_infinite] origin-bottom-left" />
+        <span className="text-xs font-medium text-foreground">内容生成中</span>
+        <span className="flex items-end gap-0.5">
+          <span className="size-1 rounded-full bg-primary/70 animate-[dot-bounce_1.4s_ease-in-out_infinite]" />
+          <span className="size-1 rounded-full bg-primary/70 animate-[dot-bounce_1.4s_ease-in-out_.2s_infinite]" />
+          <span className="size-1 rounded-full bg-primary/70 animate-[dot-bounce_1.4s_ease-in-out_.4s_infinite]" />
+        </span>
+        <span className="text-[11px] text-muted-foreground ml-auto">正文已在右侧实时显示</span>
+      </div>
+
+      <div className="relative space-y-2.5">
+        {SKELETON_WIDTHS.map((w, i) => (
+          <div
+            key={i}
+            className="relative h-3 overflow-hidden rounded-full bg-muted/60"
+            style={{ width: w }}
+          >
+            <div
+              className="absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/45 to-transparent dark:via-white/10 animate-[shimmer-sweep_1.5s_ease-in-out_infinite]"
+              style={{ animationDelay: `${i * 0.15}s` }}
+            />
+          </div>
+        ))}
+      </div>
+
+      <style>{`
+        @keyframes blink {
+          0%, 100% { opacity: 1; }
+          50%       { opacity: 0; }
+        }
+        /* 骨架行流光：高光从左扫到右 */
+        @keyframes shimmer-sweep {
+          0%   { transform: translateX(-100%); }
+          100% { transform: translateX(220%); }
+        }
+        /* 卡片整体微高光呼吸 */
+        @keyframes card-sheen {
+          0%, 60%, 100% { transform: translateX(-100%); }
+          80%           { transform: translateX(100%); }
+        }
+        /* 写字笔：轻微上下 + 摆动，像在书写 */
+        @keyframes pen-write {
+          0%, 100% { transform: translateY(0) rotate(0deg); }
+          50%      { transform: translateY(-1.5px) rotate(-12deg); }
+        }
+        /* 跳动圆点 */
+        @keyframes dot-bounce {
+          0%, 100% { opacity: .35; transform: translateY(0); }
+          50%      { opacity: 1;   transform: translateY(-2px); }
+        }
+      `}</style>
+    </div>
+  );
+}
+
+/**
+ * 作家写作 / 按意见修改阶段，左侧的轻量「生成中」视图。
+ *
+ * 刻意不再逐章节渲染流式正文（那套 DraftStreamingView 含逐 chunk 的平滑
+ * scrollIntoView 等重型操作）：正文已在右侧实时显示，左侧只需告知"正在生成"，
+ * 若模型有思考过程则一并展示。这样左侧每个 chunk 的渲染开销极小，避免更新风暴。
+ */
+export function DraftGeneratingView({ sections }: DraftGeneratingViewProps) {
+  // 按章节顺序拼接非空思考内容；是否仍在思考以"存在未完成章节"近似
+  const ordered = [...sections].sort((a, b) => a.sectionIndex - b.sectionIndex);
+  const thinking = ordered.map((s) => s.thinkingText).filter(Boolean).join('\n\n');
+  const thinkingDone = sections.length > 0 && sections.every((s) => s.isDone);
+
+  return (
+    <div className="px-4 pb-4 space-y-3">
+      {thinking && <ThinkingBox text={thinking} done={thinkingDone} />}
+      <GeneratingSkeleton />
+    </div>
+  );
+}

frontend-web/src/open-canvas/components/ai-writing/DraftStreamingPreview.tsx

@@ -0,0 +1,152 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { ArrowDown } from "lucide-react";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+
+import { Button } from "@/components/ui/button";
+
+interface DraftStreamingPreviewProps {
+  /** 正在流式生成的草稿 Markdown（边写边推送，逐 chunk 增长） */
+  markdown: string;
+  /** 是否显示流式光标（生成中 true；静态只读预览传 false） */
+  showCursor?: boolean;
+}
+
+/**
+ * AI 写作右侧「边生成边推送」的只读流式预览。
+ *
+ * 刻意不挂载 Tiptap 编辑器（useWritingEditor / useWritingRewrite）：草稿是 token 级
+ * 高频 chunk，若每个 chunk 都灌进编辑器会触发 ProseMirror transaction 风暴 + 父子组件
+ * 反复重渲染，导致 React「Maximum update depth exceeded」。生成完成后才由
+ * TextArtifactRenderer 接管为可编辑文档（润色 / 滑词等）。
+ *
+ * 行为：自动下滑跟随生成；用户向上滚动则停止自动下滑并浮出「回到底部」按钮，
+ * 点击后滚到底部并恢复自动下滑。
+ */
+export function DraftStreamingPreview({ markdown, showCursor = true }: DraftStreamingPreviewProps) {
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const autoScrollRef = useRef(true);
+  // 程序化滚动期间置 true，让 onScroll 忽略自己触发的滚动，避免 setState 抖动/回环
+  const programmaticRef = useRef(false);
+  const [showScrollBtn, setShowScrollBtn] = useState(false);
+
+  // 内容增长时，若自动下滑开启则贴底
+  useEffect(() => {
+    if (!autoScrollRef.current) return;
+    const el = scrollRef.current;
+    if (!el) return;
+    programmaticRef.current = true;
+    el.scrollTop = el.scrollHeight;
+    requestAnimationFrame(() => { programmaticRef.current = false; });
+  }, [markdown]);
+
+  const handleScroll = useCallback(() => {
+    if (programmaticRef.current) return; // 忽略程序化滚动
+    const el = scrollRef.current;
+    if (!el) return;
+    const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 40;
+    autoScrollRef.current = atBottom;
+    setShowScrollBtn((prev) => (prev === !atBottom ? prev : !atBottom));
+  }, []);
+
+  const handleScrollToBottom = useCallback(() => {
+    const el = scrollRef.current;
+    if (el) {
+      programmaticRef.current = true;
+      el.scrollTo({ top: el.scrollHeight, behavior: "smooth" });
+      requestAnimationFrame(() => { programmaticRef.current = false; });
+    }
+    autoScrollRef.current = true;
+    setShowScrollBtn(false);
+  }, []);
+
+  return (
+    <div className="relative h-full flex flex-col overflow-hidden">
+      <div
+        ref={scrollRef}
+        className="flex-1 overflow-y-auto"
+        onScroll={handleScroll}
+      >
+        <div className="max-w-2xl mx-auto px-10 pt-10 pb-32">
+          <ReactMarkdown
+            remarkPlugins={[remarkGfm]}
+            components={{
+              h1: ({ children }) => (
+                <h1 className="text-[1.625rem] font-bold tracking-tight mb-3 mt-8 first:mt-0 text-foreground border-b border-border pb-2 leading-tight">
+                  {children}
+                </h1>
+              ),
+              h2: ({ children }) => (
+                <h2 className="text-[1.25rem] font-semibold tracking-tight mb-2.5 mt-7 text-foreground leading-snug">
+                  {children}
+                </h2>
+              ),
+              h3: ({ children }) => (
+                <h3 className="text-[1.0625rem] font-semibold tracking-tight mb-2 mt-5 text-foreground leading-snug">
+                  {children}
+                </h3>
+              ),
+              p: ({ children }) => (
+                <p className="mb-4 leading-[1.8] text-[15px] text-foreground indent-[2em]">
+                  {children}
+                </p>
+              ),
+              ul: ({ children }) => (
+                <ul className="mb-4 ml-6 list-disc space-y-1.5 text-[15px] text-foreground">
+                  {children}
+                </ul>
+              ),
+              ol: ({ children }) => (
+                <ol className="mb-4 ml-6 list-decimal space-y-1.5 text-[15px] text-foreground">
+                  {children}
+                </ol>
+              ),
+              li: ({ children }) => <li className="leading-7">{children}</li>,
+              blockquote: ({ children }) => (
+                <blockquote className="border-l-4 border-primary/30 pl-4 my-4 text-muted-foreground italic text-sm">
+                  {children}
+                </blockquote>
+              ),
+              pre: ({ children }) => (
+                <pre className="mb-4 rounded-md bg-muted/60 overflow-x-auto">
+                  {children}
+                </pre>
+              ),
+              code: ({ className, children }) => {
+                const isBlock = Boolean(className?.startsWith("language-"));
+                return isBlock ? (
+                  <code className="block p-4 text-xs font-mono text-foreground leading-relaxed">
+                    {children}
+                  </code>
+                ) : (
+                  <code className="bg-muted px-1.5 py-0.5 rounded text-xs font-mono text-foreground">
+                    {children}
+                  </code>
+                );
+              },
+            }}
+          >
+            {markdown}
+          </ReactMarkdown>
+          {showCursor && (
+            <span className="inline-block w-0.5 h-4 bg-primary animate-pulse align-middle ml-0.5" />
+          )}
+        </div>
+      </div>
+
+      {showScrollBtn && (
+        <div className="absolute bottom-4 left-0 right-0 flex justify-center z-10 pointer-events-none">
+          <Button
+            size="sm"
+            variant="secondary"
+            className="pointer-events-auto shadow-md gap-1.5"
+            onClick={handleScrollToBottom}
+          >
+            <ArrowDown className="w-3.5 h-3.5" />
+            回到底部
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}

frontend-web/src/open-canvas/components/ai-writing/DraftSync.tsx

@@ -0,0 +1,46 @@
+import { useEffect } from 'react';
+
+import { useCanvasGraphContext } from '../../contexts/CanvasGraphContext';
+import { useCanvasUIContext } from '../../contexts/CanvasUIContext';
+import type { WritingStatus } from '../../types/ai-writing';
+
+interface DraftSyncProps {
+  status: WritingStatus;
+  markdown: string;
+  title: string;
+}
+
+/**
+ * 把 AI 写作草稿在「稳定态」同步到画布 artifact / 编辑权限。
+ *
+ * 流式生成中（writing_draft / revising）**不再**逐 chunk 写入 CanvasUIContext，
+ * 右侧预览改由 ``AIWritingDraftPanel`` 直接从 ``AIWritingContext`` 读章节并渲染 Markdown，
+ * 避免高频 setState 引发更新风暴。
+ */
+export function DraftSync({ status, markdown, title }: DraftSyncProps) {
+  const { setArtifact } = useCanvasGraphContext();
+  const { setIsDraftEditable } = useCanvasUIContext();
+
+  const streaming = status === 'writing_draft' || status === 'revising';
+  // 注意：reviewing（编辑审核）不算 generating —— 审核时草稿已定稿、内容稳定，
+  // 右侧保持编辑器（富文本）视图，不再切回只读 markdown。仅真正在改写正文的
+  // writing_draft / revising 才只读。
+  const generating =
+    status === 'researching' ||
+    status === 'writing_outline' ||
+    streaming;
+
+  useEffect(() => {
+    setIsDraftEditable(!generating);
+  }, [generating, setIsDraftEditable]);
+
+  useEffect(() => {
+    if (streaming || !markdown) return;
+    setArtifact({
+      currentIndex: 0,
+      contents: [{ index: 0, type: 'text', title: title || '草稿', fullMarkdown: markdown }],
+    });
+  }, [streaming, markdown, title, setArtifact]);
+
+  return null;
+}

frontend-web/src/open-canvas/components/ai-writing/WritingSetupChat.tsx

@@ -0,0 +1,171 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { Sparkles } from 'lucide-react';
+import { toast } from 'sonner';
+
+import {
+  PromptInput,
+  PromptInputFooter,
+  PromptInputSubmit,
+  PromptInputTextarea,
+} from '@/components/ai-elements/prompt-input';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import { ArtifactsProvider } from '@/components/workspace/artifacts';
+import {
+  MessageList,
+  type SetupWritingApprovalPayload,
+} from '@/components/workspace/messages';
+import { ThreadContext } from '@/components/workspace/messages/context';
+import { getAPIClient } from '@/core/api';
+import { useModels } from '@/core/models/hooks';
+import { useThreadStream } from '@/core/threads/hooks';
+import { uuid } from '@/core/utils/uuid';
+import { cn } from '@/lib/utils';
+
+import { useArticleTypes } from '../../hooks/useArticleTypes';
+import { useWritingForm } from '../../contexts/WritingFormContext';
+
+/**
+ * 写作配置 Q&A 面板（AI 写作入口页右侧，仅在未开始写作时显示）。
+ *
+ * 复用智能体创建页的「对话 → setup_writing 工具审批卡 → 回填表单」模式：
+ *   - 用 ``useThreadStream`` 起一条独立的 lead_agent 线程，context 带 ``is_writing_setup``，
+ *     后端走写作配置专用 bootstrap（只挂 setup_writing 工具）。
+ *   - 模型调用 setup_writing 被 SetupWritingApprovalMiddleware 拦截成审批卡。
+ *   - 用户点「应用到表单」→ ``applyProposal`` 把建议字段写进左侧写作表单（WritingFormContext）。
+ *
+ * 这条线程只负责「帮用户把表单聊清」，与真正写作的 ai_writing graph 完全解耦。
+ */
+export function WritingSetupChat() {
+  const threadId = useMemo(() => uuid(), []);
+  const [threadPrepared, setThreadPrepared] = useState(false);
+  const [chatModel, setChatModel] = useState('');
+  const { models, isLoading: modelsLoading } = useModels();
+  const { articleTypes } = useArticleTypes();
+  const { applyProposal } = useWritingForm();
+
+  // 首个模型可用时默认选中
+  useEffect(() => {
+    if (models.length === 0) return;
+    setChatModel((prev) => (prev && models.some((m) => m.name === prev) ? prev : models[0]!.name));
+  }, [models]);
+
+  // 注入后端 prompt 的合法文章类型（只取 key/label）
+  const validArticleTypes = useMemo(
+    () => articleTypes.map((t) => ({ key: t.key, label: t.label })),
+    [articleTypes],
+  );
+
+  const [thread, sendMessage] = useThreadStream({
+    threadId,
+    context: {
+      mode: 'flash',
+      is_writing_setup: true,
+      valid_article_types: validArticleTypes,
+      model_name: chatModel || undefined,
+    },
+  });
+
+  const ensureThreadExists = useCallback(async () => {
+    if (threadPrepared) return;
+    await getAPIClient().threads.create({ threadId, metadata: { thread_type: 'writing_setup' } });
+    setThreadPrepared(true);
+  }, [threadId, threadPrepared]);
+
+  // 生成中点提交按钮 = 暂停：取消当前 SSE 流（与主聊天页一致）。
+  const handleChatSubmit = useCallback(
+    async (text: string) => {
+      if (thread.isLoading) {
+        void thread.stop();
+        return;
+      }
+      const trimmed = text.trim();
+      if (!trimmed) return;
+      await ensureThreadExists();
+      await sendMessage(threadId, { text: trimmed, files: [] });
+    },
+    [thread, ensureThreadExists, sendMessage, threadId],
+  );
+
+  // 提交按钮状态：生成中显示「停止」方块，可点击暂停对话
+  const submitStatus = thread.error ? 'error' : thread.isLoading ? 'streaming' : 'ready';
+
+  const handleApprove = useCallback(
+    async (payload: SetupWritingApprovalPayload) => {
+      applyProposal(payload);
+      toast.success('已应用到左侧表单，可继续编辑或开始写作');
+    },
+    [applyProposal],
+  );
+
+  const handleReject = useCallback(async () => {
+    await handleChatSubmit('这份配置先不应用，请继续帮我调整。');
+  }, [handleChatSubmit]);
+
+  return (
+    <ThreadContext.Provider value={{ thread }}>
+      <ArtifactsProvider>
+        <div className="flex size-full flex-col bg-background">
+          <header className="flex shrink-0 items-center gap-2 border-b px-4 py-3">
+            <Sparkles className="size-4 text-primary" />
+            <h2 className="text-sm font-semibold">写作助手</h2>
+            <span className="text-muted-foreground text-xs">描述你想写什么，我来帮你填好左侧配置</span>
+          </header>
+
+          <div className="min-h-0 flex-1">
+            <MessageList
+              className="size-full"
+              threadId={threadId}
+              thread={thread}
+              onClarificationSubmit={handleChatSubmit}
+              onSetupWritingApprove={handleApprove}
+              onSetupWritingReject={handleReject}
+            />
+          </div>
+
+          <div className="bg-background shrink-0 space-y-2 border-t px-4 py-4">
+            <div className="flex items-center gap-2">
+              <span className="text-muted-foreground text-xs">当前对话模型</span>
+              {modelsLoading || models.length === 0 ? (
+                <div className="border-input bg-background text-muted-foreground flex h-7 min-w-[10rem] items-center rounded-md border px-2 text-xs shadow-xs dark:border-[#1B477E] dark:bg-[#022248]">
+                  {modelsLoading ? '加载中…' : '暂无模型'}
+                </div>
+              ) : (
+                <Select value={chatModel} onValueChange={setChatModel} disabled={thread.isLoading}>
+                  <SelectTrigger
+                    className={cn(
+                      'border-input bg-background h-7 min-w-[10rem] px-2 text-xs shadow-xs outline-none',
+                      'dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEFF]',
+                    )}
+                  >
+                    <SelectValue placeholder="选择模型" />
+                  </SelectTrigger>
+                  <SelectContent position="popper" className="w-[var(--radix-select-trigger-width)] dark:border-[#1B477E] dark:bg-[#022248]">
+                    {models.map((model) => (
+                      <SelectItem key={model.name} value={model.name} className="dark:text-[#AACEFF]">
+                        {model.display_name || model.name}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              )}
+            </div>
+            <PromptInput onSubmit={({ text }) => void handleChatSubmit(text)}>
+              <PromptInputTextarea
+                placeholder="例如：帮我写一篇 2000 字、面向行业专家的新能源汽车出口分析"
+              />
+              <PromptInputFooter className="justify-end">
+                <PromptInputSubmit status={submitStatus} />
+              </PromptInputFooter>
+            </PromptInput>
+          </div>
+        </div>
+      </ArtifactsProvider>
+    </ThreadContext.Provider>
+  );
+}

frontend-web/src/open-canvas/components/layout/CanvasResizableLayout.tsx

@@ -13,6 +13,8 @@ import { CanvasStreamProvider } from "../../contexts/CanvasStreamContext";
 import { CanvasChatPanel } from "../chat/CanvasChatPanel";
 import { CanvasArtifactPanel } from "../artifact/CanvasArtifactPanel";
 import { AIWritingPanel } from "../ai-writing/AIWritingPanel";
+import { AIWritingProvider } from "../../contexts/AIWritingContext";
+import { WritingFormProvider } from "../../contexts/WritingFormContext";
 
 const LAYOUT_COLLAPSED = { chat: 0, artifact: 100 };
 const LAYOUT_DEFAULT = { chat: 35, artifact: 65 };
@@ -65,7 +67,13 @@ export function CanvasResizableLayout() {
           </div>
 
           <div className="flex-1 min-h-0 overflow-hidden">
-            {leftMode === "chat" ? <CanvasChatPanel /> : <AIWritingPanel />}
+            {leftMode === "chat" ? <CanvasChatPanel /> : (
+              <AIWritingProvider>
+                <WritingFormProvider>
+                  <AIWritingPanel />
+                </WritingFormProvider>
+              </AIWritingProvider>
+            )}
           </div>
         </ResizablePanel>
 

frontend-web/src/open-canvas/contexts/AIWritingContext.tsx

@@ -0,0 +1,407 @@
+import {
+  createContext,
+  memo,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useReducer,
+  useRef,
+  type Dispatch,
+  type MutableRefObject,
+  type ReactNode,
+  type RefObject,
+} from 'react';
+import { useStream } from '@langchain/langgraph-sdk/react';
+
+import { getAPIClient } from '@/core/api';
+
+import { useCanvasGraphContext } from '../contexts/CanvasGraphContext';
+import { saveAIWritingTranscript } from '../api/ai-writing-sessions';
+import { countWords } from '../utils/wordCount';
+import {
+  INITIAL_STATE,
+  customToProgressEvent,
+  interruptToEvent,
+  nodeUpdatesToEvents,
+  reducer,
+  type Action,
+  type AIWritingValues,
+} from '../hooks/useAIWritingStream';
+import type {
+  AIWritingRequest,
+  AIWritingState,
+  CompletedIntervention,
+  ProgressEvent,
+  UserInterventionPayload,
+  WritingStatus,
+} from '../types/ai-writing';
+
+/** 高频 chunk 类型：合并到同一帧再 dispatch，避免同步嵌套 setState 触发 Maximum update depth。 */
+const BATCHED_CHUNK_TYPES = new Set<ProgressEvent['type']>([
+  'draft_chunk',
+  'outline_chunk',
+  'intent_chunk',
+  'skill_select_chunk',
+  'review_chunk',
+]);
+
+function createProgressEventBatcher(dispatchRef: RefObject<Dispatch<Action>>) {
+  const pending: ProgressEvent[] = [];
+  let rafId = 0;
+
+  const flush = () => {
+    rafId = 0;
+    if (pending.length === 0) return;
+    const events = pending.splice(0, pending.length);
+    if (events.length === 1) {
+      dispatchRef.current?.({ type: 'handle', event: events[0] });
+    } else {
+      dispatchRef.current?.({ type: 'handle_batch', events });
+    }
+  };
+
+  return {
+    push(event: ProgressEvent) {
+      pending.push(event);
+      if (!rafId) rafId = requestAnimationFrame(flush);
+    },
+    pushImmediate(event: ProgressEvent) {
+      // 关键：先把缓冲里的 chunk 同步 flush，再派发立即事件，保证事件顺序。
+      // 否则 *_ready / await_user / step_* 会插队到尚在 rAF 缓冲里的 *_chunk 之前——
+      // ready 先清空流式文本 / 切状态，随后残留 chunk 又被回灌，导致：
+      // 意图/大纲/审核的流式视图清不掉（残留 JSON 尾巴）、切不回结果卡、右侧 markdown 切不回编辑器。
+      if (rafId) cancelAnimationFrame(rafId);
+      flush();
+      dispatchRef.current?.({ type: 'handle', event });
+    },
+    cancel() {
+      if (rafId) cancelAnimationFrame(rafId);
+      rafId = 0;
+      pending.length = 0;
+    },
+  };
+}
+
+type AIWritingStreamApi = Pick<
+  ReturnType<typeof useStream<AIWritingValues>>,
+  'submit' | 'stop' | 'interrupt'
+>;
+
+export type AIWritingApi = {
+  state: AIWritingState;
+  startWriting: (request: AIWritingRequest) => Promise<void>;
+  submitIntervention: (payload: UserInterventionPayload) => Promise<void>;
+  pauseWriting: () => void;
+  resumeWriting: () => void;
+  reset: () => void;
+};
+
+const AIWritingContext = createContext<AIWritingApi | null>(null);
+
+/** 可选读取：不在 Provider 内时返回 null（如 Canvas 布局右侧 artifact 面板）。 */
+export function useAIWritingOptional(): AIWritingApi | null {
+  return useContext(AIWritingContext);
+}
+
+/** 在 ``AIWritingProvider`` 内读取写作状态与操作 API。 */
+export function useAIWriting(): AIWritingApi {
+  const ctx = useContext(AIWritingContext);
+  if (!ctx) {
+    throw new Error('useAIWriting must be used within AIWritingProvider');
+  }
+  return ctx;
+}
+
+/**
+ * 承载 ``useStream`` 的独立组件（render null）。
+ *
+ * 用 ``memo`` 且仅随 ``threadId`` 重渲染，这样 ``draft_chunk`` 等高频 custom 事件
+ * 更新 reducer 时不会重跑 ``useStream``，避免 onCustomEvent → dispatch → 重渲染
+ * → useStream 重入 的更新风暴（Maximum update depth exceeded）。
+ */
+const AIWritingStreamHost = memo(function AIWritingStreamHost({
+  threadId,
+  dispatchRef,
+  sessionIdRef,
+  streamRef,
+  seenInterruptRef,
+}: {
+  threadId: string | undefined;
+  dispatchRef: RefObject<Dispatch<Action>>;
+  sessionIdRef: RefObject<string | null>;
+  streamRef: MutableRefObject<AIWritingStreamApi | null>;
+  seenInterruptRef: MutableRefObject<string | null>;
+}) {
+  const eventBatcherRef = useRef<ReturnType<typeof createProgressEventBatcher> | null>(null);
+  if (!eventBatcherRef.current) {
+    eventBatcherRef.current = createProgressEventBatcher(dispatchRef);
+  }
+
+  const emitProgressEvent = useCallback((event: ProgressEvent) => {
+    if (BATCHED_CHUNK_TYPES.has(event.type)) {
+      eventBatcherRef.current!.push(event);
+    } else {
+      eventBatcherRef.current!.pushImmediate(event);
+    }
+  }, []);
+
+  const stream = useStream<AIWritingValues>({
+    client: getAPIClient(),
+    assistantId: 'ai_writing',
+    threadId,
+    reconnectOnMount: true,
+    onCreated(meta) {
+      dispatchRef.current?.({ type: 'set_session', sessionId: meta.thread_id });
+    },
+    onCustomEvent(event: unknown) {
+      if (typeof window !== 'undefined' && (window as { __AI_WRITING_DEBUG__?: boolean }).__AI_WRITING_DEBUG__) {
+        const t = (event as { type?: string } | null)?.type;
+        // eslint-disable-next-line no-console
+        console.debug(`[ai-writing:custom] +${Math.round(performance.now())}ms type=${t ?? '?'}`, event);
+      }
+      const pe = customToProgressEvent(event, sessionIdRef.current ?? '');
+      if (pe) emitProgressEvent(pe);
+    },
+    onUpdateEvent(data: Record<string, unknown> | undefined) {
+      if (!data) return;
+      if (typeof window !== 'undefined' && (window as { __AI_WRITING_DEBUG__?: boolean }).__AI_WRITING_DEBUG__) {
+        // eslint-disable-next-line no-console
+        console.debug(`[ai-writing:updates] +${Math.round(performance.now())}ms nodes=${Object.keys(data).join(',')}`);
+      }
+      if (Array.isArray((data as Record<string, unknown>).__interrupt__)) {
+        const interrupts = (data as { __interrupt__: unknown[] }).__interrupt__;
+        for (const intr of interrupts) {
+          const value = (intr && typeof intr === 'object' && 'value' in intr)
+            ? (intr as { value: unknown }).value : intr;
+          const ev = interruptToEvent(value, sessionIdRef.current ?? '');
+          if (ev) emitProgressEvent(ev);
+        }
+        return;
+      }
+      for (const nodeOutput of Object.values(data)) {
+        const events = nodeUpdatesToEvents(nodeOutput, sessionIdRef.current ?? '');
+        for (const ev of events) emitProgressEvent(ev);
+      }
+    },
+    onError(err: unknown) {
+      eventBatcherRef.current?.cancel();
+      dispatchRef.current?.({
+        type: 'set_error',
+        message: err instanceof Error ? err.message : String(err),
+      });
+    },
+    onFinish(finishState) {
+      eventBatcherRef.current?.cancel();
+      const finalStatus = (finishState.values as AIWritingValues | undefined)?.status;
+      if (finalStatus === 'done' || finalStatus === 'error') {
+        dispatchRef.current?.({
+          type: 'handle',
+          event: {
+            type: finalStatus === 'error' ? 'error' : 'done',
+            sessionId: finishState.values?.sessionId as string ?? '',
+            message: finalStatus === 'error' ? '写作出错' : '写作完成',
+          },
+        });
+      }
+    },
+  });
+
+  streamRef.current = stream;
+
+  useEffect(() => {
+    const intr = stream.interrupt;
+    if (!intr) {
+      seenInterruptRef.current = null;
+      return;
+    }
+    const key = intr.id ?? JSON.stringify(intr.value);
+    if (seenInterruptRef.current === key) return;
+    seenInterruptRef.current = key;
+    const ev = interruptToEvent(intr.value, sessionIdRef.current ?? '');
+    if (ev) emitProgressEvent(ev);
+  }, [stream.interrupt, emitProgressEvent, seenInterruptRef, sessionIdRef]);
+
+  useEffect(() => () => { eventBatcherRef.current?.cancel(); }, []);
+
+  return null;
+}, (prev, next) => prev.threadId === next.threadId);
+
+export function AIWritingProvider({ children }: { children: ReactNode }) {
+  const { setArtifact } = useCanvasGraphContext();
+  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);
+  const dispatchRef = useRef(dispatch);
+  dispatchRef.current = dispatch;
+  const sessionIdRef = useRef<string | null>(state.sessionId);
+  sessionIdRef.current = state.sessionId;
+  const streamRef = useRef<AIWritingStreamApi | null>(null);
+  const seenInterruptRef = useRef<string | null>(null);
+
+  const threadId = state.sessionId ?? undefined;
+
+  useEffect(() => {
+    const s = state.status;
+    const savable = s === 'done' || s === 'error' || s.startsWith('awaiting_');
+    if (!state.sessionId || !savable || state.progressEvents.length === 0) return;
+    saveAIWritingTranscript(state.sessionId, {
+      progressEvents: state.progressEvents,
+      completedInterventions: state.completedInterventions,
+    }).catch(() => {});
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [state.status, state.sessionId]);
+
+  const startWriting = useCallback(async (request: AIWritingRequest) => {
+    if (state.status !== 'idle' && state.status !== 'done' && state.status !== 'error') return;
+    dispatch({ type: 'start', request });
+    const stream = streamRef.current;
+    if (!stream) return;
+    try {
+      await stream.submit(
+        {
+          user_intent: request.userIntent,
+          // 用户自带大纲原文（留空则后端走自动规划）
+          user_outline_raw: request.userOutline?.trim() || '',
+          article_type: request.articleType,
+          target_audience: request.targetAudience,
+          word_count_target: request.wordCountTarget,
+          keyword_count: Math.max(1, Math.min(10, request.keywordCount)),
+          writing_mode: request.writingMode === 'strict' ? 'strict' : 'loose',
+          material_source: request.materialSource === 'skill' ? 'skill' : 'knowledge_base',
+          revision_count: 0,
+          max_revisions: 3,
+          status: 'researching',
+          drafts: [],
+          progress_events: [],
+          material_package: null,
+          current_outline: null,
+          current_draft: null,
+          review_result: null,
+          last_user_intervention: null,
+        } as Partial<AIWritingValues>,
+        {
+          config: { configurable: { model_name: request.modelName ?? '' } } as Record<string, unknown>,
+          streamMode: ['values', 'updates', 'custom', 'messages-tuple'],
+        },
+      );
+    } catch (err) {
+      dispatch({ type: 'set_error', message: err instanceof Error ? err.message : String(err) });
+    }
+  }, [state.status]);
+
+  const submitIntervention = useCallback(async (payload: UserInterventionPayload) => {
+    if (!state.sessionId || !state.currentPause) return;
+
+    const stream = streamRef.current;
+    if (!stream) return;
+
+    const pausePoint = state.currentPause.pausePoint;
+    const record: CompletedIntervention = {
+      pausePoint: pausePoint as CompletedIntervention['pausePoint'],
+      action: payload.action,
+    };
+    if (pausePoint === 'material_confirm') record.materials = state.materials;
+    else if (pausePoint === 'outline_confirm') record.outline = state.outline ?? undefined;
+    else if (pausePoint === 'draft_confirm') {
+      record.draftTitle = state.currentDraftTitle;
+      record.draftWordCount = countWords(state.currentDraftMarkdown);
+      record.reviewResult = state.reviewResult ?? undefined;
+    } else if (pausePoint === 'review_confirm') {
+      record.reviewResult = state.reviewResult ?? undefined;
+    }
+
+    let pendingRevisionContext: AIWritingState['pendingRevisionContext'] = null;
+    const isApplyingReview = payload.selectedIssueIndices !== undefined && state.reviewResult != null;
+    if (isApplyingReview && state.reviewResult) {
+      const allIssues = state.reviewResult.revisionNotes;
+      const selectedSet = new Set(payload.selectedIssueIndices!);
+      pendingRevisionContext = {
+        submittedIssues: allIssues.filter((_, i) => selectedSet.has(i)),
+        skippedIssues: allIssues.filter((_, i) => !selectedSet.has(i)),
+        oldWordCount: countWords(state.currentDraftMarkdown),
+      };
+    }
+
+    let nextStatus: WritingStatus = state.status;
+    if (pausePoint === 'material_confirm') {
+      nextStatus = (payload.action === 're_search' || payload.action === 'enable_skill_search')
+        ? 'researching' : 'writing_outline';
+    } else if (pausePoint === 'outline_confirm') {
+      nextStatus = payload.action === 're_outline' ? 'writing_outline' : 'writing_draft';
+    } else if (pausePoint === 'draft_confirm') {
+      if (payload.action === 'finalize') nextStatus = 'done';
+      else if (payload.action === 'to_editor') nextStatus = 'reviewing';
+      else nextStatus = 'revising';
+    } else if (pausePoint === 'review_confirm') {
+      nextStatus = payload.action === 'force_finalize' ? 'done' : 'revising';
+    } else if (pausePoint === 'section_help') {
+      nextStatus = payload.sectionDecisions?.some((d) => d.decision === 'supplement')
+        ? 'researching' : 'writing_draft';
+    }
+
+    const resumePayload: Record<string, unknown> = { action: payload.action };
+    if (payload.approvedMaterialIds !== undefined) resumePayload.approvedMaterialIds = payload.approvedMaterialIds;
+    if (payload.extraKeywords !== undefined) resumePayload.extraKeywords = payload.extraKeywords;
+    if (payload.userQuery !== undefined) resumePayload.userQuery = payload.userQuery;
+    if (payload.editedOutline !== undefined) resumePayload.editedOutline = payload.editedOutline;
+    if (payload.outlineFeedback !== undefined) resumePayload.outlineFeedback = payload.outlineFeedback;
+    if (payload.userRevisionNotes !== undefined) resumePayload.userRevisionNotes = payload.userRevisionNotes;
+    if (payload.overrideVerdict !== undefined) resumePayload.overrideVerdict = payload.overrideVerdict;
+    if (payload.sectionDecisions !== undefined) {
+      resumePayload.sectionDecisions = payload.sectionDecisions.map((d) => ({
+        sectionTitle: d.sectionTitle, decision: d.decision,
+      }));
+    }
+
+    const intr = stream.interrupt;
+    if (intr) {
+      seenInterruptRef.current = intr.id ?? JSON.stringify(intr.value);
+    }
+
+    dispatch({ type: 'intervention_submitted', record, nextStatus, pendingRevisionContext });
+
+    try {
+      await stream.submit(undefined, {
+        command: { resume: resumePayload },
+        streamMode: ['values', 'updates', 'custom', 'messages-tuple'],
+      });
+    } catch (err) {
+      dispatch({ type: 'set_error', message: err instanceof Error ? err.message : String(err) });
+    }
+  }, [state.sessionId, state.currentPause, state.materials, state.outline,
+      state.currentDraftTitle, state.currentDraftMarkdown, state.reviewResult,
+      state.status]);
+
+  const pauseWriting = useCallback(() => {
+    void streamRef.current?.stop();
+    dispatch({ type: 'pause' });
+  }, []);
+
+  const resumeWriting = useCallback(() => {
+    dispatch({ type: 'resume_ui' });
+  }, []);
+
+  const reset = useCallback(() => {
+    void streamRef.current?.stop();
+    setArtifact(null);
+    seenInterruptRef.current = null;
+    dispatch({ type: 'reset' });
+  }, [setArtifact]);
+
+  const value = useMemo(
+    () => ({ state, startWriting, submitIntervention, pauseWriting, resumeWriting, reset }),
+    [state, startWriting, submitIntervention, pauseWriting, resumeWriting, reset],
+  );
+
+  return (
+    <AIWritingContext.Provider value={value}>
+      <AIWritingStreamHost
+        threadId={threadId}
+        dispatchRef={dispatchRef}
+        sessionIdRef={sessionIdRef}
+        streamRef={streamRef}
+        seenInterruptRef={seenInterruptRef}
+      />
+      {children}
+    </AIWritingContext.Provider>
+  );
+}

frontend-web/src/open-canvas/contexts/CanvasUIContext.tsx

@@ -17,12 +17,21 @@ export interface CanvasUIContextValue {
   isChatCollapsed: boolean;
   isEditing: boolean;
   isWebSearchOpen: boolean;
+  /** AI 写作：右侧草稿是否正在流式生成。生成中右侧走只读流式视图（自动下滑、禁用编辑/润色/滑词），生成完才可编辑 */
+  isDraftStreaming: boolean;
+  /** AI 写作：流式生成中的草稿 Markdown。生成期间走这条独立通道（不写全局 artifact），避免高频刷新触发编辑器更新风暴 */
+  draftStreamingMarkdown: string;
+  /** AI 写作：草稿是否进入"生成完成的稳定态"（可编辑）。仅此时才挂载带编辑器的渲染器；生成/审核中一律只读 */
+  isDraftEditable: boolean;
   selection: CanvasSelectionState;
   /** Tiptap editor selection for AI rewrite flow */
   writingSelection: WritingSelection | null;
   setIsChatCollapsed: (v: boolean) => void;
   setIsEditing: (v: boolean) => void;
   setIsWebSearchOpen: (v: boolean) => void;
+  setIsDraftStreaming: (v: boolean) => void;
+  setDraftStreamingMarkdown: (v: string) => void;
+  setIsDraftEditable: (v: boolean) => void;
   /** Set text selection; clears any existing code selection. */
   setTextSelection: (s: CanvasTextSelection | null) => void;
   /** Set code selection; clears any existing text selection. */
@@ -42,6 +51,9 @@ export function CanvasUIProvider({ children }: { children: ReactNode }) {
   const [isChatCollapsed, setIsChatCollapsed] = useState(false);
   const [isEditing, setIsEditing] = useState(false);
   const [isWebSearchOpen, setIsWebSearchOpen] = useState(false);
+  const [isDraftStreaming, setIsDraftStreaming] = useState(false);
+  const [draftStreamingMarkdown, setDraftStreamingMarkdown] = useState('');
+  const [isDraftEditable, setIsDraftEditable] = useState(false);
   const [selection, setSelection] =
     useState<CanvasSelectionState>(EMPTY_SELECTION);
   const [writingSelection, setWritingSelection] =
@@ -61,11 +73,17 @@ export function CanvasUIProvider({ children }: { children: ReactNode }) {
         isChatCollapsed,
         isEditing,
         isWebSearchOpen,
+        isDraftStreaming,
+        draftStreamingMarkdown,
+        isDraftEditable,
         selection,
         writingSelection,
         setIsChatCollapsed,
         setIsEditing,
         setIsWebSearchOpen,
+        setIsDraftStreaming,
+        setDraftStreamingMarkdown,
+        setIsDraftEditable,
         setTextSelection,
         setCodeSelection,
         clearSelection: () => setSelection(EMPTY_SELECTION),

frontend-web/src/open-canvas/contexts/WritingFormContext.tsx

@@ -0,0 +1,102 @@
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useState,
+  type ReactNode,
+} from 'react';
+
+import type { SetupWritingApprovalPayload } from '@/components/workspace/messages';
+
+/**
+ * 写作配置表单的共享状态。
+ *
+ * 上提到 Context 是为了让「右侧写作助手 Q&A」在用户批准模型建议后，能把建议字段
+ * 一次性回填到「左侧写作表单」的输入框（``applyProposal``）。表单与 Q&A 面板共用同一份
+ * state，因此 Provider 必须同时包住两侧面板（见 AIWritingPage）。
+ */
+export interface WritingFormValue {
+  intent: string;
+  setIntent: (v: string) => void;
+  showOutline: boolean;
+  setShowOutline: (v: boolean) => void;
+  outlineText: string;
+  setOutlineText: (v: string) => void;
+  articleType: string;
+  setArticleType: (v: string) => void;
+  wordCountInput: string;
+  setWordCountInput: (v: string) => void;
+  audience: string;
+  setAudience: (v: string) => void;
+  strictMode: boolean;
+  setStrictMode: (v: boolean) => void;
+  materialSource: 'knowledge_base' | 'skill' | 'notebook';
+  setMaterialSource: (v: 'knowledge_base' | 'skill' | 'notebook') => void;
+  modelName: string;
+  setModelName: (v: string) => void;
+  /** 把模型建议（setup_writing 审批 payload）回填到表单各字段。 */
+  applyProposal: (payload: SetupWritingApprovalPayload) => void;
+}
+
+const WritingFormContext = createContext<WritingFormValue | null>(null);
+
+export function useWritingForm(): WritingFormValue {
+  const ctx = useContext(WritingFormContext);
+  if (!ctx) {
+    throw new Error('useWritingForm must be used within WritingFormProvider');
+  }
+  return ctx;
+}
+
+export function useWritingFormOptional(): WritingFormValue | null {
+  return useContext(WritingFormContext);
+}
+
+export function WritingFormProvider({ children }: { children: ReactNode }) {
+  const [intent, setIntent] = useState('');
+  const [showOutline, setShowOutline] = useState(false);
+  const [outlineText, setOutlineText] = useState('');
+  const [articleType, setArticleType] = useState('analysis');
+  const [wordCountInput, setWordCountInput] = useState('800');
+  const [audience, setAudience] = useState('普通读者');
+  const [strictMode, setStrictMode] = useState(false);
+  const [materialSource, setMaterialSource] = useState<'knowledge_base' | 'skill' | 'notebook'>('knowledge_base');
+  const [modelName, setModelName] = useState('');
+
+  const applyProposal = useCallback((payload: SetupWritingApprovalPayload) => {
+    if (payload.user_intent?.trim()) setIntent(payload.user_intent.trim());
+    if (payload.article_type?.trim()) setArticleType(payload.article_type.trim());
+    if (typeof payload.word_count_target === 'number' && payload.word_count_target > 0) {
+      setWordCountInput(String(payload.word_count_target));
+    }
+    if (payload.target_audience?.trim()) setAudience(payload.target_audience.trim());
+    if (payload.writing_mode === 'strict') setStrictMode(true);
+    else if (payload.writing_mode === 'loose') setStrictMode(false);
+    if (payload.material_source === 'skill' || payload.material_source === 'knowledge_base') {
+      setMaterialSource(payload.material_source);
+    }
+    if (payload.outline?.trim()) {
+      setOutlineText(payload.outline);
+      setShowOutline(true);
+    }
+  }, []);
+
+  const value = useMemo<WritingFormValue>(
+    () => ({
+      intent, setIntent,
+      showOutline, setShowOutline,
+      outlineText, setOutlineText,
+      articleType, setArticleType,
+      wordCountInput, setWordCountInput,
+      audience, setAudience,
+      strictMode, setStrictMode,
+      materialSource, setMaterialSource,
+      modelName, setModelName,
+      applyProposal,
+    }),
+    [intent, showOutline, outlineText, articleType, wordCountInput, audience, strictMode, materialSource, modelName, applyProposal],
+  );
+
+  return <WritingFormContext.Provider value={value}>{children}</WritingFormContext.Provider>;
+}

frontend-web/src/open-canvas/editor/TiptapExtensions.ts

@@ -1,15 +1,15 @@
 import StarterKit from "@tiptap/starter-kit";
-import Underline from "@tiptap/extension-underline";
 import Placeholder from "@tiptap/extension-placeholder";
 import { Markdown } from "tiptap-markdown";
 import { AiHighlightExtension } from "./AiHighlightExtension";
 
+// 注意：@tiptap v3 的 StarterKit 已内置 underline，不要再单独引入 @tiptap/extension-underline，
+// 否则会触发 "Duplicate extension names ['underline']" 警告并导致 useEditor schema 解析异常。
 export const buildExtensions = (placeholder = "开始写作…") => [
   StarterKit.configure({
     // Disable hard break so Enter creates new paragraph
     hardBreak: false,
   }),
-  Underline,
   Placeholder.configure({
     placeholder,
     emptyEditorClass: "is-editor-empty",

frontend-web/src/open-canvas/hooks/useAIWritingStream.ts

@@ -21,15 +21,6 @@
  * 这样 reducer 逻辑（INITIAL_STATE + switch 各分支）与老 hook 共享同一份代码，
  * 只换"事件源"。阶段 7 删冗余时把老 hook 整个删掉就行。
  */
-import { useCallback, useEffect, useMemo, useReducer, useRef } from 'react';
-import { useStream } from '@langchain/langgraph-sdk/react';
-
-import { getAPIClient } from '@/core/api';
-import { getStoredAuth } from '@/core/auth';
-import { fetchStudioToken } from '@/core/studio/api';
-
-import { useCanvasGraphContext } from '../contexts/CanvasGraphContext';
-import { saveAIWritingTranscript } from '../api/ai-writing-sessions';
 import { countWords } from '../utils/wordCount';
 import type {
   AIWritingRequest,
@@ -49,8 +40,6 @@ import type {
   WritingStatus,
 } from '../types/ai-writing';
 
-// ── INITIAL_STATE 与 reducer 与老 hook 共享 ────────────────────────────────────
-
 const INITIAL_STATE: AIWritingState = {
   sessionId: null,
   status: 'idle',
@@ -83,10 +72,13 @@ const INITIAL_STATE: AIWritingState = {
   pendingRevisionContext: null,
 };
 
+export { INITIAL_STATE };
+
 // reducer action：HANDLE 直接复用老 hook 的 handleEvent switch；剩下的 action 处理
 // 启动 / 干预提交 / 暂停 / 恢复 / 重置 这些"指令式"状态变更。
-type Action =
+export type Action =
   | { type: 'handle'; event: ProgressEvent }
+  | { type: 'handle_batch'; events: ProgressEvent[] }
   | { type: 'start'; request: AIWritingRequest }
   | { type: 'set_session'; sessionId: string }
   | { type: 'intervention_submitted'; record: CompletedIntervention; nextStatus: WritingStatus; pendingRevisionContext: AIWritingState['pendingRevisionContext'] }
@@ -95,11 +87,14 @@ type Action =
   | { type: 'reset' }
   | { type: 'set_error'; message: string };
 
-function reducer(prev: AIWritingState, action: Action): AIWritingState {
+export function reducer(prev: AIWritingState, action: Action): AIWritingState {
   switch (action.type) {
     case 'handle':
       return handleEvent(prev, action.event);
 
+    case 'handle_batch':
+      return action.events.reduce(handleEvent, prev);
+
     case 'start':
       return { ...INITIAL_STATE, status: 'researching', request: action.request };
 
@@ -142,6 +137,26 @@ function reducer(prev: AIWritingState, action: Action): AIWritingState {
   }
 }
 
+// 把"正在流式生成"的草稿章节拼成 Markdown，用于边写边推送到右侧画布。
+// 拼接格式与后端 writer_draft.py 的 _assemble() 对齐（# 文章标题 / ## 章节标题），
+// 但这里是流式预览版：最终的 draft_ready 仍会用后端规范化后的完整 markdown 覆盖。
+export function assembleStreamingDraftMarkdown(
+  sections: AIWritingState['streamingDraftSections'],
+  title: string,
+): string {
+  const ordered = [...sections].sort((a, b) => a.sectionIndex - b.sectionIndex);
+  const body = ordered
+    .map((s) => {
+      const heading = s.sectionTitle ? `## ${s.sectionTitle}` : '';
+      const text = s.text ?? '';
+      return heading ? `${heading}\n\n${text}` : text;
+    })
+    .filter((part) => part.trim().length > 0)
+    .join('\n\n');
+  const head = title ? `# ${title}\n\n` : '';
+  return `${head}${body}`;
+}
+
 // 与老 hook 行为对齐的事件 reducer —— 直接从 useAIWriting.ts 移植，删掉 setArtifact 副作用
 // （副作用单独提到 hook 顶层 useEffect 里处理）。
 function handleEvent(prev: AIWritingState, event: ProgressEvent): AIWritingState {
@@ -272,11 +287,15 @@ function handleEvent(prev: AIWritingState, event: ProgressEvent): AIWritingState
           isDone: done,
         });
       }
+      const streamingTitle = prev.streamingDraftTitle || prev.outline?.title || '';
+      // 流式阶段只累积章节片段；右侧 Markdown 由面板按需拼装，避免每 chunk 改 currentDraftMarkdown
+      // 触发 DraftSync / 全树重渲染导致更新风暴。
       return {
         ...prev,
         status: 'writing_draft',
         streamingDraftSections: sections,
-        streamingDraftTitle: prev.streamingDraftTitle || prev.outline?.title || '',
+        streamingDraftTitle: streamingTitle,
+        currentDraftTitle: streamingTitle || prev.currentDraftTitle,
       };
     }
 
@@ -484,7 +503,7 @@ function normalizeProgressDict(parsed: Record<string, unknown>, sessionId: strin
 }
 
 /** custom 通道事件 → ProgressEvent。事件 ``type`` 字段决定是哪类。 */
-function customToProgressEvent(raw: unknown, sessionId: string): ProgressEvent | null {
+export function customToProgressEvent(raw: unknown, sessionId: string): ProgressEvent | null {
   if (!raw || typeof raw !== 'object') return null;
   const o = raw as Record<string, unknown>;
   const type = String(o.type ?? '');
@@ -517,7 +536,7 @@ function customToProgressEvent(raw: unknown, sessionId: string): ProgressEvent |
 }
 
 /** updates 通道里的节点输出 → 一组 ProgressEvent（progress_events + *_ready 合成）。 */
-function nodeUpdatesToEvents(nodeOutput: unknown, sessionId: string): ProgressEvent[] {
+export function nodeUpdatesToEvents(nodeOutput: unknown, sessionId: string): ProgressEvent[] {
   if (!nodeOutput || typeof nodeOutput !== 'object') return [];
   const out = nodeOutput as Record<string, unknown>;
   const events: ProgressEvent[] = [];
@@ -581,7 +600,7 @@ function nodeUpdatesToEvents(nodeOutput: unknown, sessionId: string): ProgressEv
 }
 
 /** ``stream.interrupt.value`` → await_user ProgressEvent。 */
-function interruptToEvent(value: unknown, sessionId: string): ProgressEvent | null {
+export function interruptToEvent(value: unknown, sessionId: string): ProgressEvent | null {
   if (!value || typeof value !== 'object') return null;
   const v = value as Record<string, unknown>;
   return {
@@ -602,10 +621,9 @@ function interruptToEvent(value: unknown, sessionId: string): ProgressEvent | nu
   };
 }
 
-// ── 主 hook ───────────────────────────────────────────────────────────────────
+export type AIWritingValues = {
-
-type AIWritingValues = {
   user_intent?: string;
+  user_outline_raw?: string;
   article_type?: string;
   status?: string;
   material_package?: unknown;
@@ -614,296 +632,3 @@ type AIWritingValues = {
   review_result?: unknown;
   progress_events?: unknown[];
 };
-
-export function useAIWriting() {
-  const { setArtifact } = useCanvasGraphContext();
-  const [state, dispatch] = useReducer(reducer, INITIAL_STATE);
-
-  // useStream 要求受控 threadId；初次 startWriting 时 useStream 在 onCreated 里回灌
-  // 真实 thread_id，我们存到 state.sessionId。之后 reducer 直接读它。
-  const threadId = state.sessionId ?? undefined;
-
-  // 把已处理的 interrupt id 记下来，避免 useStream re-render 时重复 dispatch
-  const seenInterruptRef = useRef<string | null>(null);
-
-  const stream = useStream<AIWritingValues>({
-    client: getAPIClient(),
-    assistantId: 'ai_writing',
-    threadId,
-    reconnectOnMount: true,
-    onCreated(meta) {
-      // 第一次提交时拿到的 thread_id == 业务表 ai_writing_sessions.id
-      dispatch({ type: 'set_session', sessionId: meta.thread_id });
-    },
-    onCustomEvent(event: unknown) {
-      // 技能检索时机 trace：开 window.__AI_WRITING_DEBUG__ = true 后，控制台按
-      // performance.now() 打印每条 custom 事件到达时刻 + type，用来钉死
-      // skill_search_step（技能检索过程卡）与 skill_select_chunk（筛选技能打字）
-      // 的实际到达顺序，区分"后端未实时 emit" vs "前端渲染滞后"。
-      if (typeof window !== 'undefined' && (window as { __AI_WRITING_DEBUG__?: boolean }).__AI_WRITING_DEBUG__) {
-        const t = (event as { type?: string } | null)?.type;
-        // eslint-disable-next-line no-console
-        console.debug(`[ai-writing:custom] +${Math.round(performance.now())}ms type=${t ?? '?'}`, event);
-      }
-      const pe = customToProgressEvent(event, state.sessionId ?? '');
-      if (pe) dispatch({ type: 'handle', event: pe });
-    },
-    onUpdateEvent(data: Record<string, unknown> | undefined) {
-      // data 形如 { node_name: { ...node_output } }，可能多个节点同一 step
-      if (!data) return;
-      if (typeof window !== 'undefined' && (window as { __AI_WRITING_DEBUG__?: boolean }).__AI_WRITING_DEBUG__) {
-        // eslint-disable-next-line no-console
-        console.debug(`[ai-writing:updates] +${Math.round(performance.now())}ms nodes=${Object.keys(data).join(',')}`);
-      }
-      // 兜底：updates 通道可能直接带 ``__interrupt__`` 数组（节点进 interrupt 时
-      // LangGraph 推 ``{__interrupt__: [...]}``），SDK 主路径只在 values 通道
-      // 暴露 stream.interrupt —— 万一后端 serialize 又把 __interrupt__ 滤掉，
-      // 这里直接合成 await_user 不至于卡死 UI。
-      if (Array.isArray((data as Record<string, unknown>).__interrupt__)) {
-        const interrupts = (data as { __interrupt__: unknown[] }).__interrupt__;
-        for (const intr of interrupts) {
-          const value = (intr && typeof intr === 'object' && 'value' in intr)
-            ? (intr as { value: unknown }).value : intr;
-          const ev = interruptToEvent(value, state.sessionId ?? '');
-          if (ev) dispatch({ type: 'handle', event: ev });
-        }
-        return;
-      }
-      for (const nodeOutput of Object.values(data)) {
-        const events = nodeUpdatesToEvents(nodeOutput, state.sessionId ?? '');
-        for (const ev of events) dispatch({ type: 'handle', event: ev });
-      }
-    },
-    onError(err: unknown) {
-      dispatch({ type: 'set_error', message: err instanceof Error ? err.message : String(err) });
-    },
-    onFinish(state) {
-      // graph 自然终止（END）—— 合成一条 done 事件，UI 切到 done 状态
-      const finalStatus = (state.values as AIWritingValues | undefined)?.status;
-      if (finalStatus === 'done' || finalStatus === 'error') {
-        dispatch({
-          type: 'handle',
-          event: {
-            type: finalStatus === 'error' ? 'error' : 'done',
-            sessionId: state.values?.sessionId as string ?? '',
-            message: finalStatus === 'error' ? '写作出错' : '写作完成',
-          },
-        });
-      }
-    },
-  });
-
-  // interrupt → await_user：useStream 每次 re-render 都会暴露当前 interrupt，
-  // 我们用 id 去重；老 hook 的 reducer 本身对 pausePoint 也有去重，双保险。
-  useEffect(() => {
-    const intr = stream.interrupt;
-    if (!intr) {
-      seenInterruptRef.current = null;
-      return;
-    }
-    const key = intr.id ?? JSON.stringify(intr.value);
-    if (seenInterruptRef.current === key) return;
-    seenInterruptRef.current = key;
-    const ev = interruptToEvent(intr.value, state.sessionId ?? '');
-    if (ev) dispatch({ type: 'handle', event: ev });
-  }, [stream.interrupt, state.sessionId]);
-
-  // 草稿实时同步到右侧 Artifact 面板（与老 hook 行为一致）
-  useEffect(() => {
-    if (state.currentDraftMarkdown) {
-      setArtifact({
-        currentIndex: 0,
-        contents: [{
-          index: 0,
-          type: 'text',
-          title: state.currentDraftTitle || '草稿',
-          fullMarkdown: state.currentDraftMarkdown,
-        }],
-      });
-    }
-  }, [state.currentDraftMarkdown, state.currentDraftTitle, setArtifact]);
-
-  // transcript 持久化（保留老逻辑：进入暂停 / done / error 时全量上传）
-  useEffect(() => {
-    const s = state.status;
-    const savable = s === 'done' || s === 'error' || s.startsWith('awaiting_');
-    if (!state.sessionId || !savable || state.progressEvents.length === 0) return;
-    saveAIWritingTranscript(state.sessionId, {
-      progressEvents: state.progressEvents,
-      completedInterventions: state.completedInterventions,
-    }).catch(() => {});
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [state.status, state.sessionId]);
-
-  // ── 操作 API ────────────────────────────────────────────────────────────────
-
-  const startWriting = useCallback(async (request: AIWritingRequest) => {
-    if (state.status !== 'idle' && state.status !== 'done' && state.status !== 'error') return;
-    dispatch({ type: 'start', request });
-    try {
-      // 如果选择了笔记来源，获取 notebook token 用于后端检索
-      let notebookToken = '';
-      if (request.noteSearchSpaceId) {
-        const email = getStoredAuth()?.email ?? '';
-        if (email) {
-          try {
-            notebookToken = await fetchStudioToken(email);
-          } catch {
-            // 忽略 token 获取失败，后端会优雅降级
-          }
-        }
-      }
-
-      await stream.submit(
-        {
-          user_intent: request.userIntent,
-          article_type: request.articleType,
-          target_audience: request.targetAudience,
-          word_count_target: request.wordCountTarget,
-          keyword_count: Math.max(1, Math.min(10, request.keywordCount)),
-          writing_mode: request.writingMode === 'strict' ? 'strict' : 'loose',
-          material_source: request.materialSource === 'skill' ? 'skill' : 'knowledge_base',
-          revision_count: 0,
-          max_revisions: 3,
-          status: 'researching',
-          drafts: [],
-          progress_events: [],
-          material_package: null,
-          current_outline: null,
-          current_draft: null,
-          review_result: null,
-          last_user_intervention: null,
-          notebook_search_space_id: request.noteSearchSpaceId ?? null,
-          notebook_source_ids: request.noteSourceIds ?? [],
-        } as Partial<AIWritingValues>,
-        {
-          config: {
-            configurable: {
-              model_name: request.modelName ?? '',
-              ...(notebookToken ? { notebook_token: notebookToken } : {}),
-            },
-          } as Record<string, unknown>,
-          streamMode: ['values', 'updates', 'custom', 'messages-tuple'],
-        },
-      );
-    } catch (err) {
-      dispatch({ type: 'set_error', message: err instanceof Error ? err.message : String(err) });
-    }
-  }, [state.status, stream]);
-
-  const submitIntervention = useCallback(async (payload: UserInterventionPayload) => {
-    if (!state.sessionId || !state.currentPause) return;
-
-    const pausePoint = state.currentPause.pausePoint;
-    const record: CompletedIntervention = {
-      pausePoint: pausePoint as CompletedIntervention['pausePoint'],
-      action: payload.action,
-    };
-    if (pausePoint === 'material_confirm') record.materials = state.materials;
-    else if (pausePoint === 'outline_confirm') record.outline = state.outline ?? undefined;
-    else if (pausePoint === 'draft_confirm') {
-      record.draftTitle = state.currentDraftTitle;
-      record.draftWordCount = countWords(state.currentDraftMarkdown);
-      record.reviewResult = state.reviewResult ?? undefined;
-    } else if (pausePoint === 'review_confirm') {
-      record.reviewResult = state.reviewResult ?? undefined;
-    }
-
-    // pendingRevisionContext：编辑打回卡提交时记录本轮被选中 / 跳过的意见，draft_ready 后用于生成摘要
-    let pendingRevisionContext: AIWritingState['pendingRevisionContext'] = null;
-    const isApplyingReview = payload.selectedIssueIndices !== undefined && state.reviewResult != null;
-    if (isApplyingReview && state.reviewResult) {
-      const allIssues = state.reviewResult.revisionNotes;
-      const selectedSet = new Set(payload.selectedIssueIndices!);
-      pendingRevisionContext = {
-        submittedIssues: allIssues.filter((_, i) => selectedSet.has(i)),
-        skippedIssues: allIssues.filter((_, i) => !selectedSet.has(i)),
-        oldWordCount: countWords(state.currentDraftMarkdown),
-      };
-    }
-
-    // 乐观更新到下一阶段，跟老 hook 行为对齐
-    let nextStatus: WritingStatus = state.status;
-    if (pausePoint === 'material_confirm') {
-      // re_search / enable_skill_search 都回到 researching；confirm 才进大纲
-      nextStatus = (payload.action === 're_search' || payload.action === 'enable_skill_search')
-        ? 'researching' : 'writing_outline';
-    } else if (pausePoint === 'outline_confirm') {
-      nextStatus = payload.action === 're_outline' ? 'writing_outline' : 'writing_draft';
-    } else if (pausePoint === 'draft_confirm') {
-      if (payload.action === 'finalize') nextStatus = 'done';
-      else if (payload.action === 'to_editor') nextStatus = 'reviewing';
-      else nextStatus = 'revising';
-    } else if (pausePoint === 'review_confirm') {
-      nextStatus = payload.action === 'force_finalize' ? 'done' : 'revising';
-    } else if (pausePoint === 'section_help') {
-      nextStatus = payload.sectionDecisions?.some((d) => d.decision === 'supplement')
-        ? 'researching' : 'writing_draft';
-    }
-
-    // 后端 pause 节点期望的 resume payload 字段名：保持 camelCase（节点里直接 user_input.get('action')
-    // / approvedMaterialIds 等），所以这里**不要**转 snake_case。
-    const resumePayload: Record<string, unknown> = {
-      action: payload.action,
-    };
-    if (payload.approvedMaterialIds !== undefined) resumePayload.approvedMaterialIds = payload.approvedMaterialIds;
-    if (payload.extraKeywords !== undefined) resumePayload.extraKeywords = payload.extraKeywords;
-    if (payload.userQuery !== undefined) resumePayload.userQuery = payload.userQuery;
-    if (payload.editedOutline !== undefined) resumePayload.editedOutline = payload.editedOutline;
-    if (payload.outlineFeedback !== undefined) resumePayload.outlineFeedback = payload.outlineFeedback;
-    if (payload.userRevisionNotes !== undefined) resumePayload.userRevisionNotes = payload.userRevisionNotes;
-    if (payload.overrideVerdict !== undefined) resumePayload.overrideVerdict = payload.overrideVerdict;
-    if (payload.sectionDecisions !== undefined) {
-      resumePayload.sectionDecisions = payload.sectionDecisions.map((d) => ({
-        sectionTitle: d.sectionTitle, decision: d.decision,
-      }));
-    }
-
-    seenInterruptRef.current = null; // 允许下一个 interrupt 被消费
-
-    // ⚠️ 乐观更新必须放在 await 之前 ——
-    // ``stream.submit(undefined, {command})`` 返回的 Promise **要等整条流跑完**
-    // (resume → 跑 writer_outline → 推 outline_chunk → 到达 pause_outline_confirm
-    // → 推新 interrupt → end) 才 resolve。这中间 useEffect(stream.interrupt) 已经
-    // 把 currentPause 更新到了 outline_confirm；若我们在 await 后才 dispatch
-    // ``intervention_submitted``（含 currentPause: null），就会把新弹的卡片擦掉，
-    // UI 永远卡在 writing_outline skeleton。
-    //
-    // 老 hook 没这个问题：``resumeWritingApi`` 是 POST /resume，几十毫秒就返回。
-    dispatch({ type: 'intervention_submitted', record, nextStatus, pendingRevisionContext });
-
-    try {
-      await stream.submit(undefined, {
-        command: { resume: resumePayload },
-        streamMode: ['values', 'updates', 'custom', 'messages-tuple'],
-      });
-    } catch (err) {
-      dispatch({ type: 'set_error', message: err instanceof Error ? err.message : String(err) });
-    }
-  }, [state.sessionId, state.currentPause, state.materials, state.outline,
-      state.currentDraftTitle, state.currentDraftMarkdown, state.reviewResult,
-      state.status, stream]);
-
-  const pauseWriting = useCallback(() => {
-    void stream.stop();
-    dispatch({ type: 'pause' });
-  }, [stream]);
-
-  const resumeWriting = useCallback(() => {
-    // useStream 在挂载 / threadId 变化时会自动 reconnect，不需要显式 attach。
-    dispatch({ type: 'resume_ui' });
-  }, []);
-
-  const reset = useCallback(() => {
-    void stream.stop();
-    setArtifact(null);
-    seenInterruptRef.current = null;
-    dispatch({ type: 'reset' });
-  }, [stream, setArtifact]);
-
-  // 与老 hook 同名导出对象
-  return useMemo(
-    () => ({ state, startWriting, submitIntervention, pauseWriting, resumeWriting, reset }),
-    [state, startWriting, submitIntervention, pauseWriting, resumeWriting, reset],
-  );
-}

frontend-web/src/open-canvas/hooks/useWritingEditor.ts

@@ -1,4 +1,4 @@
-import { useEffect, useRef } from "react";
+import { useEffect, useMemo, useRef } from "react";
 import { useEditor } from "@tiptap/react";
 import { buildExtensions } from "../editor/TiptapExtensions";
 
@@ -17,17 +17,26 @@ export function useWritingEditor({
 }: UseWritingEditorOptions) {
   const prevMarkdownRef = useRef<string>(markdown);
 
+  // 扩展集合 memo 一次，避免每次渲染生成新数组导致 useEditor 反复重建（v3 下会触发
+  // 重复 schema 解析 / "Duplicate extension names" 警告，极端情况引发更新风暴）。
+  const extensions = useMemo(() => buildExtensions(placeholder), [placeholder]);
+
+  // onChange 用 ref 持有最新值，让 onUpdate 闭包保持稳定，不随父组件回调身份变化而重建编辑器。
+  const onChangeRef = useRef(onChange);
+  useEffect(() => { onChangeRef.current = onChange; }, [onChange]);
+
   const editor = useEditor({
-    extensions: buildExtensions(placeholder),
+    extensions,
     editable,
     content: markdown,
     onUpdate({ editor }) {
-      if (!onChange) return;
+      const fn = onChangeRef.current;
+      if (!fn) return;
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       const md = (editor as any).storage?.markdown?.getMarkdown?.() ?? editor.getText();
-      onChange(md);
+      fn(md);
     },
-  });
+  }, []);
 
   // Sync external markdown changes (e.g. after streaming completes)
   useEffect(() => {

frontend-web/src/open-canvas/pages/AIWritingPage.tsx

@@ -90,6 +90,9 @@ import { CanvasGraphProvider } from '../contexts/CanvasGraphContext';
 import { CanvasUIProvider } from '../contexts/CanvasUIContext';
 import { AIWritingPanel } from '../components/ai-writing/AIWritingPanel';
 import { AIWritingDraftPanel } from '../components/ai-writing/AIWritingDraftPanel';
+import { WritingSetupChat } from '../components/ai-writing/WritingSetupChat';
+import { AIWritingProvider, useAIWriting } from '../contexts/AIWritingContext';
+import { WritingFormProvider } from '../contexts/WritingFormContext';
 import {
   ResizableHandle,
   ResizablePanel,
@@ -103,6 +106,15 @@ const DRAFT_ID   = 'aw-draft';
 // Match the original canvas page proportions (chat=35, artifact=65)
 const DEFAULT_LAYOUT = { [WRITING_ID]: 35, [DRAFT_ID]: 65 };
 
+/**
+ * 右侧面板：未开始写作（idle）时显示「写作助手 Q&A」，帮用户聊清并回填左侧表单；
+ * 一旦开始写作（status !== idle）就切回草稿预览。
+ */
+function AIWritingRightPanel() {
+  const { state } = useAIWriting();
+  return state.status === 'idle' ? <WritingSetupChat /> : <AIWritingDraftPanel />;
+}
+
 export default function AIWritingPage({
   hideAdvancedFields = false,
 }: {
@@ -114,6 +126,8 @@ export default function AIWritingPage({
     <CanvasThreadProvider>
     <CanvasGraphProvider>
       <CanvasUIProvider>
+      <AIWritingProvider>
+      <WritingFormProvider>
       <TooltipProvider delayDuration={300}>
         <div className="h-full flex flex-col overflow-hidden bg-background">
           <div className="flex-1 min-h-0 overflow-hidden">
@@ -145,12 +159,14 @@ export default function AIWritingPage({
                 minSize={40}
                 className="overflow-hidden"
               >
-                <AIWritingDraftPanel />
+                <AIWritingRightPanel />
               </ResizablePanel>
             </ResizablePanelGroup>
           </div>
         </div>
       </TooltipProvider>
+      </WritingFormProvider>
+      </AIWritingProvider>
       </CanvasUIProvider>
     </CanvasGraphProvider>
     </CanvasThreadProvider>

frontend-web/src/open-canvas/types/ai-writing.ts

@@ -220,6 +220,8 @@ export interface UserInterventionPayload {
 
 export interface AIWritingRequest {
   userIntent: string;
+  /** 用户粘贴的「已有大纲」原文（可选）。非空时后端按此大纲生成，不再自动规划 */
+  userOutline?: string;
   articleType: string;
   targetAudience: string;
   wordCountTarget: number;

frontend-web/src/pages/AdminAgentsPage.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { BotIcon, RefreshCwIcon, SearchIcon } from "lucide-react";
+import { AlertCircle, BotIcon, CheckCircle2, RefreshCwIcon, SearchIcon } from "lucide-react";
 import { useMemo, useState } from "react";
 import { toast } from "sonner";
 
@@ -22,9 +22,37 @@ import {
 import { AgentCard } from "@/components/workspace/agents/agent-card";
 import { useAdminSyncAgentSkills, useAllAgentsAdmin } from "@/core/agents";
 import type { AgentSkillsSyncResult } from "@/core/agents/api";
+import { useTheme } from "@/contexts/ThemeContext";
 import { desensitize } from "@/lib/desensitize";
 
+/** 成功 toast：仅暗色模式，浅色走 Sonner 默认 */
+const successToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#106455] !bg-[#052934] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <CheckCircle2 className="size-4 shrink-0 text-[#2FD69A]" />,
+} as const;
+
+/** 失败 toast：仅暗色模式，浅色走 Sonner 默认 */
+const errorToastDarkOptions = {
+  classNames: {
+    toast:
+      "!rounded-[2px] !border !border-[#7F1A2A] !bg-[#311629] !text-[#FFFFFF] shadow-md",
+    title: "!text-[#FFFFFF]",
+    description: "!text-[#FFFFFF]",
+  },
+  icon: <AlertCircle className="size-4 shrink-0 text-[#F5222D]" />,
+} as const;
+
 export default function AdminAgentsPage() {
+  const { theme } = useTheme();
+  const darkToastOpts =
+    theme === "dark"
+      ? { success: successToastDarkOptions, error: errorToastDarkOptions }
+      : { success: undefined, error: undefined };
   const [search, setSearch] = useState("");
   const { agents, isLoading } = useAllAgentsAdmin(true);
   const syncSkills = useAdminSyncAgentSkills();
@@ -39,14 +67,21 @@ export default function AdminAgentsPage() {
       setSyncResult(result);
       setSyncDialogOpen(true);
       if (result.modified === 0) {
-        toast.success("所有智能体的技能均有效，无需清理");
+        toast.success(
+          "所有智能体的技能均有效，无需清理",
+          darkToastOpts.success,
+        );
       } else {
         toast.success(
           `已清理 ${result.modified} 个智能体中的失效技能引用`,
+          darkToastOpts.success,
         );
       }
     } catch (err) {
-      toast.error(err instanceof Error ? err.message : String(err));
+      toast.error(
+        err instanceof Error ? err.message : String(err),
+        darkToastOpts.error,
+      );
     }
   }
 

frontend-web/src/pages/AdminScheduledTasksPage.tsx

@@ -17,6 +17,7 @@ import { toast } from "sonner";
 
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
+import { useTheme } from "@/contexts/ThemeContext";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import {
   Dialog,
@@ -70,6 +71,7 @@ const emptyForm = {
 };
 
 export default function AdminScheduledTasksPage() {
+  const { theme } = useTheme();
   const navigate = useNavigate();
   const [searchParams] = useSearchParams();
   // ?task= carries the task to re-select when returning from a run detail.
@@ -227,7 +229,10 @@ export default function AdminScheduledTasksPage() {
                   onChange={(event) => setSearchInput(event.target.value)}
                   placeholder="按任务名称搜索"
                 />
-                <Button type="submit" variant="outline">
+                <Button
+                  type="submit"
+                  variant={theme === "dark" ? "default" : "outline"}
+                >
                   <Search className="size-4" />
                   搜索
                 </Button>
@@ -440,10 +445,11 @@ export default function AdminScheduledTasksPage() {
       </WorkspaceBody>
 
       <Dialog open={!!editing} onOpenChange={(open) => !open && closeDialog()}>
-        <DialogContent className="max-w-2xl">
+        <DialogContent className="flex max-h-[85vh] max-w-2xl flex-col gap-4 overflow-hidden sm:max-w-2xl">
-          <DialogHeader>
+          <DialogHeader className="shrink-0">
             <DialogTitle>编辑定时任务</DialogTitle>
           </DialogHeader>
+          <div className="min-h-0 flex-1 overflow-y-auto overscroll-contain pr-1">
           <div className="flex flex-col gap-3">
             <Input
               value={form.name}
@@ -470,7 +476,8 @@ export default function AdminScheduledTasksPage() {
               placeholder="时区，例如：Asia/Shanghai"
             />
             <Textarea
-              className="min-h-40"
+              rows={10}
+              className="field-sizing-fixed min-h-40 max-h-48 resize-y overflow-y-auto"
               value={form.prompt}
               onChange={(event) =>
                 setForm((value) => ({ ...value, prompt: event.target.value }))
@@ -478,7 +485,8 @@ export default function AdminScheduledTasksPage() {
               placeholder="任务 Prompt"
             />
           </div>
-          <DialogFooter>
+          </div>
+          <DialogFooter className="shrink-0">
             <Button variant="outline" onClick={closeDialog}>
               取消
             </Button>

frontend-web/src/pages/AdminSkillsPage.tsx

@@ -84,10 +84,10 @@ export default function AdminSkillsPage() {
             )}
             {!isLoading && !error && filteredSkills.length === 0 && (
               <div className="flex h-64 flex-col items-center justify-center gap-3 text-center">
-                <div className="bg-muted flex h-14 w-14 items-center justify-center rounded-full">
+                <div className="bg-muted flex h-14 w-14 items-center justify-center rounded-full dark:bg-[#022248]">
-                  <SparklesIcon className="text-muted-foreground h-7 w-7" />
+                  <SparklesIcon className="text-muted-foreground h-7 w-7 dark:text-[#AACEFF]" />
                 </div>
-                <p className="text-muted-foreground text-sm">
+                <p className="text-muted-foreground text-sm dark:text-[#AACEFF]">
                   当前没有可管理的技能。
                 </p>
               </div>

frontend-web/src/pages/AgentChatPage.tsx

@@ -26,7 +26,7 @@ import { useAgent } from "@/core/agents";
 import { useI18n } from "@/core/i18n/hooks";
 import { useModels } from "@/core/models/hooks";
 import { useNotification } from "@/core/notification/hooks";
-import { useThreadSettings } from "@/core/settings";
+import { saveLastAgentId, useThreadSettings } from "@/core/settings";
 import { useThreadStream } from "@/core/threads/hooks";
 import { textOfMessage } from "@/core/threads/utils";
 import { env } from "@/env";
@@ -114,6 +114,9 @@ export default function AgentChatPage() {
   const handleSubmit = useCallback(
     (message: PromptInputMessage) => {
       setHasStartedConversation(true);
+      // Remember this agent so the new-chat landing screen pre-selects it next
+      // time (covers both direct agent chats and the ChatPage handoff replay).
+      saveLastAgentId(agent_id);
       window.dispatchEvent(
         new CustomEvent("workspace:sandbox-resume-autoscroll"),
       );
@@ -216,6 +219,7 @@ export default function AgentChatPage() {
                 paddingBottom={messageListPaddingBottom}
                 tokenUsageEnabled={tokenUsageEnabled}
                 onClarificationSubmit={handleClarificationSubmit}
+                onEditResubmit={(text) => handleSubmit({ text, files: [] })}
               />
             </div>
 

frontend-web/src/pages/ChatPage.tsx

@@ -23,10 +23,15 @@ import { ThreadTitle } from "@/components/workspace/thread-title";
 import { TodoList } from "@/components/workspace/todo-list";
 import { TokenUsageIndicator } from "@/components/workspace/token-usage-indicator";
 import { Welcome } from "@/components/workspace/welcome";
+import { useAgentSelector } from "@/core/agents";
 import { useI18n } from "@/core/i18n/hooks";
 import { useModels } from "@/core/models/hooks";
 import { useNotification } from "@/core/notification/hooks";
-import { useThreadSettings } from "@/core/settings";
+import {
+  getLastAgentId,
+  saveLastAgentId,
+  useThreadSettings,
+} from "@/core/settings";
 import { useThreadStream } from "@/core/threads/hooks";
 import { useRouteBase } from "@/core/route-base";
 import { textOfMessage } from "@/core/threads/utils";
@@ -47,6 +52,8 @@ export default function ChatPage() {
   const { data: promptPrefixSettings } = usePromptPrefixSettings();
   const [promptPrefixOn, setPromptPrefixOn] = useState(false);
   const [selectedAgentId, setSelectedAgentId] = useState<string | null>(null);
+  const { agents: selectorAgents, isLoading: selectorLoading } =
+    useAgentSelector();
   const { selectedArtifact } = useArtifacts();
   useSpecificChatMode();
 
@@ -58,10 +65,22 @@ export default function ChatPage() {
     if (isNewThread) {
       setHasStartedConversation(false);
       setPromptPrefixOn(false);
-      setSelectedAgentId(null);
+      // Pre-select the agent the user last started a conversation with so a
+      // fresh chat defaults to it. Validated against the selector list below.
+      setSelectedAgentId(getLastAgentId());
     }
   }, [isNewThread, threadId]);
 
+  // Drop a restored last-used agent that is no longer in the selector list
+  // (deleted / unpublished / no longer curated), so we never hand off to a
+  // dead agent. Wait for the list to load before deciding.
+  useEffect(() => {
+    if (selectorLoading || !selectedAgentId) return;
+    if (!selectorAgents.some((a) => a.id === selectedAgentId)) {
+      setSelectedAgentId(null);
+    }
+  }, [selectedAgentId, selectorAgents, selectorLoading]);
+
   const { showNotification } = useNotification();
 
   const [thread, sendMessage, isUploading] = useThreadStream({
@@ -184,6 +203,14 @@ export default function ChatPage() {
     },
     [sendMessage, threadId],
   );
+
+  // Persist the picked agent the moment it changes so the next new chat
+  // defaults to it — even if the user never sends a message this session.
+  // Passing null (the ✕ clear) wipes the stored preference.
+  const handleAgentChange = useCallback((agentId: string | null) => {
+    setSelectedAgentId(agentId);
+    saveLastAgentId(agentId);
+  }, []);
   const handleStop = useCallback(async () => {
     await thread.stop();
   }, [thread]);
@@ -248,6 +275,9 @@ export default function ChatPage() {
                   paddingBottom={messageListPaddingBottom}
                   tokenUsageEnabled={tokenUsageEnabled}
                   onClarificationSubmit={handleClarificationSubmit}
+                  onEditResubmit={(text) =>
+                    handleSubmit({ text, files: [] })
+                  }
                 />
               )}
             </div>
@@ -305,7 +335,7 @@ export default function ChatPage() {
                         isLandingState
                           ? {
                               selectedAgentId,
-                              onAgentChange: setSelectedAgentId,
+                              onAgentChange: handleAgentChange,
                             }
                           : undefined
                       }

frontend-web/src/pages/ChatsPage.tsx

@@ -71,7 +71,7 @@ export default function ChatsPage() {
                   <Link key={thread.thread_id} href={pathOfThread(thread)}>
                     <div className="flex flex-col gap-2 border-b p-4">
                       <div>
-                        <div>{desensitize(titleOfThread(thread))}</div>
+                        <div>{desensitize(titleOfThread(thread, t.pages.newChat))}</div>
                       </div>
                       {thread.updated_at && (
                         <div className="text-muted-foreground text-sm">