@wszhoho/dsh-file-attachment 0.5.0 → 0.5.2

package/README.md

@@ -1,20 +1,27 @@
 # dsh-file-attachment
 
-DeepSeek Harness (dsh) web GUI 插件：在会话输入框中**拖入或 Ctrl+V 粘贴文档（支持多文件，一次可拖入/粘贴多个文件）**时，浏览器端批量读取全文，保存到**当前会话工作区根目录下的 `.dsh-file-attachment/`**，并在输入框光标处插入 `@<保存副本绝对路径>` 引用。agent 读取 `@路径` 时直接读到落盘副本，不再依赖原始文件位置。
+DeepSeek Harness (dsh) web GUI 插件：在会话输入框中**拖入或 Ctrl+V 粘贴文档/图片（支持多文件，一次可拖入/粘贴多个文件）**、或通过 **📎 附件按钮上传**时，浏览器端批量读取全文，保存到**当前会话工作区根目录下的 `.dsh-file-attachment/`**，并在输入框光标处插入 `@<保存副本绝对路径>` 引用。agent 读取 `@路径` 时直接读到落盘副本，不再依赖原始文件位置。
 
-图片文件由插件接管后走 dsh web 既有草稿图片流程（`addImages`）：不落盘、不进文件条、不缩放；仅当输入框未就绪且为纯图片时，才原样交回原生。
+图片与文档走**同一条落盘管线**：图片在输入框**内联附件条**中以缩略图预览（点击放大），在聊天区渲染为**可点击放大的缩略图**；文档在附件条中以类型图标 + 文件名条目显示，在聊天区保持芯片样式。当前会话模型不支持多模态时，图片自动调用**可配置 VLM** 识别生成中文描述回填草稿，文本模型也能「看懂」图片。
 
-另外，输入框工具栏（加号之后）提供了一个**上传按钮（📎 回形针图标）**，点击后弹出系统文件选择框，可多选文档/图片，复用与拖入/粘贴完全一致的落盘 + `@路径` 插入管线。PC 与移动端浏览器均适用（移动端走原生文件选择器）。
+插件接管 dsh 原生 **📎 附件上传按钮**（hero / composer 两种输入模式共用同一位置：加号右侧、modes 左侧），点击后弹出系统文件选择框，可多选文档/图片，复用与拖入/粘贴完全一致的落盘 + `@路径` 插入管线。PC 与移动端浏览器均适用（移动端走原生文件选择器）。
 
 ## 界面
 
-**演示**：拖入/粘贴文档 → 落盘并在输入框插入 `@` 引用 → 输入框上方 dock 文件条待发送状态（完整流程见 gif）。
+**演示**：拖入/粘贴文档或图片 → 落盘并在输入框插入 `@` 引用 → 输入框内联附件条待发送状态（完整流程见 gif）。
 
 ![插件演示](docs/demo.gif)
 
-**上传按钮**：输入框工具栏 `+` 之后的 📎 回形针图标，点击弹出系统文件选择框（可多选文档/图片）。
+**内联附件条**：上传后在 composer 卡片内部、编辑区上方显示——图片为缩略图（点击放大），文档为类型图标 + 文件名条目；条目可移除（同步清除草稿中对应 `@引用`），发送后自动清空。
 
-**可上传类型设置**：「设置 → 文件附件」页可按 文档 / 代码 / 配置文件 三类增删扩展名（小写、不带点），图片恒可发送。
+**聊天区图片缩略图**：历史对话中用户消息里的 `@图片路径` 渲染为缩略图（点击打开 Lightbox 放大层）；`@文件路径` 保持芯片样式。
+
+**上传按钮**：接管 dsh 原生 📎 附件按钮（加号右侧、modes 左侧），点击弹出系统文件选择框（可多选文档/图片）。
+
+**设置页**：「设置 → 文件附件」页两部分：
+
+- **可上传类型**：按 文档 / 代码 / 配置文件 三类增删扩展名（小写、不带点），图片恒可发送；
+- **多模态识别参数（VLM）**：Base URL / API Key / 模型 / 思考模式开关（默认禁用），仅当前会话模型不支持多模态时调用，未填 API Key 时静默跳过。
 
 ![可上传类型设置](docs/settings-file-types.png)
 
@@ -22,14 +29,15 @@ DeepSeek Harness (dsh) web GUI 插件：在会话输入框中**拖入或 Ctrl+V
 
 | 操作 | 行为 |
 | --- | --- |
-| 点击**上传按钮（📎）**，在系统文件选择框中**多选**文档/图片 | 与拖入/粘贴同一管线：文档 → 落盘 + 光标插入全部 `@` 路径；图片 → 走既有草稿图片流程；`accept` 限定图片 + 常见文档扩展名，移动端自动弹出文件选择器 |
-| 拖入/粘贴 **文档/代码/配置文件**（非图片，默认 doc·code·config 三类扩展名，如 docx/xlsx/pdf/md/txt/js/json） | 浏览器读全文 → base64 → 宿主落盘 `<会话工作区>/.dsh-file-attachment/<日期>/<文件名>` → 光标插入 `@绝对路径`，成功不提示、失败简短 toast |
+| 点击 **📎 附件按钮**（插件接管 dsh 原生按钮），在系统文件选择框中**多选**文档/图片 | 与拖入/粘贴同一管线：图片与文档统一落盘 + 光标插入全部 `@` 引用；移动端自动弹出文件选择器 |
+| 拖入/粘贴 **文档/代码/配置文件**（默认 doc·code·config 三类扩展名，如 docx/xlsx/pdf/md/txt/js/json） | 浏览器读全文 → base64 → 宿主落盘 `<会话工作区>/.dsh-file-attachment/<日期>/<文件名>` → 光标插入 `@绝对路径` chip，成功不提示、失败简短 toast |
 | 一次拖入/粘贴 **多个文件**（支持多文件） | 批量处理：逐个读取全文 → base64 → 落盘 → 在光标处一次性插入全部 `@` 引用；全部成功不提示，部分失败仅简短提示「N 个已跳过」 |
+| 拖入/粘贴 **图片** | 与文档同一落盘管线：插入 `@绝对路径` 引用 + 附件条登记缩略图；聊天区渲染为可点击放大的缩略图 |
+| 图片需要被理解，而当前模型**不支持多模态** | 粘贴/上传图片时自动调用可配置 VLM（OpenAI 兼容 `chat/completions`）生成中文描述回填草稿（仅注入模型上下文，不进对话界面）；agent 也可主动调用 `describe_image` 工具识别已落盘图片（含历史消息中的 `@图片` 引用） |
 | 拖入 **目录** | 拒绝，toast 提示「不支持拖入目录」，不插入引用 |
-| 拖入/粘贴 **图片** | 接管后走 dsh 既有草稿图片流程（`addImages`）：不落盘、不进文件条、不缩放；输入框未就绪且纯图片时原样交原生 |
 | 粘贴 **纯文本**（含从地址栏复制的目录路径字符串） | 不改写，完全原生行为 |
 | 重复拖入同名文件（同一天内） | 追加 `-1`、`-2` 序号，绝不覆盖 |
-| 点文件条（dock）`×` 移除 | 移除 dock 条目，并清除输入框中指向该文件路径的**全部** `@` 引用 chip（同一文件拖入多次产生的多个 chip 一并清除）；其他文件的引用不受影响 |
+| 点附件条 `×` 移除 | 移除附件条目，并清除输入框中指向该文件路径的**全部** `@` 引用 chip（同一文件上传多次产生的多个 chip 一并清除）；其他文件的引用不受影响 |
 | 单文件 > 50MB | 跳过并提示 |
 
 ### 文件命名
@@ -82,21 +90,30 @@ packages/dsh-file-attachment/
 ├── package.json          # dsh.client 声明 + bundle patch 指向
 ├── cordis.patch.yml      # bundle 补丁：插入本插件行
 └── lib/
-    ├── index.js          # Host 半：webServer 路由（POST /dsh-file-attachment/save），node:fs/promises 写盘
-    └── client.js         # Client 半：document 级 capture drop/paste/dragenter 监听 + 槽组件
+    ├── index.js          # Host 半：webServer 路由（/save /config /describe）+ describe_image 工具
+    └── client.js         # Client 半：document 级 capture drop/paste 监听 + 📎 按钮接管 + 槽组件
 ```
 
-- **Host 半**：`webServer.register` 前缀路由 `/dsh-file-attachment`，POST `/dsh-file-attachment/save` 接收 `{name, data(base64), sessionId}`，base64 解码后用 `node:fs/promises` 写盘到会话工作区 `.dsh-file-attachment/`，返回 `{ok, value:{path,dir,name,size}}`。
-- **Client 半**：`conversation.input.dock`（list 槽，同步桥状态，不渲染文本；经会话作用域取输入机，hero 首轮空白态也挂载）+ `shell.overlay`（list 槽，toast 通知展示）+ `conversation.input.left`（list 槽，**上传按钮**，渲染为左动作簇第 3 项），document 级 capture 监听先于应用 bubble 监听执行。
-- **上传按钮**：`FaUploadButton` 组件注入 `conversation.input.left`（`order:10`），内部是隐藏 `<input type="file" multiple accept>`（`accept` 限定 `image/*` + 常见文档扩展名），点击触发原生选择框；`onChange` 按 `file.type` 是否为 `image/` 分派到 `runBatch`（文档落盘插 `@`、图片走草稿图片流程），完成后清空 `input.value` 以便重复选择同一文件。图标为内联 SVG 回形针（📎，`stroke=currentColor`，随主题变色）。
+- **Host 半**：`webServer.register` 前缀路由 `/dsh-file-attachment`：
+  - POST `/save`：接收 `{name, data(base64), sessionId}`，base64 解码后用 `node:fs/promises` 写盘到会话工作区 `.dsh-file-attachment/`，返回 `{ok, value:{path,dir,name,size}}`；
+  - GET/POST `/config`：读写插件配置（可上传类型 + VLM 参数）；
+  - POST `/describe`：接收 `{dataUrl, prompt}`，调 VLM（OpenAI 兼容 `chat/completions`）识别图片，返回中文描述；
+  - `describe_image` 工具（Host 注册）：agent 需要理解 `@图片` 引用时调用——读已落盘图片 → VLM 识别 → 描述直接作为工具输出返回（UI 展示 + 模型可见）。
+- **Client 半**槽位：
+  - `conversation.input.attachments`（shadow 原生附件条，priority -100）：**内联附件条**，渲染自维护的附件登记表——图片为 data URL 缩略图（点击放大）、文档为类型图标 + 文件名；条目可移除（同步清除草稿 `@引用`），发送后自动清空，不依赖 dsh 附件草稿链路（文本模型可正常发送）；
+  - `conversation.chat.node` keyed `user`（shadow 原生用户消息渲染器，priority -100）：聊天区 `@图片路径` 渲染为缩略图（经宿主 `/api/file?path=` 读取落盘图片，点击打开 Lightbox 放大层），`@文件路径` 保持芯片样式；原生 image/file 附件块（多模态模型场景）仍交 dsh 渲染；
+  - `conversation.input.dock`：仅保留 `FaBridge` 桥槽（经会话作用域同步 shell/actions/input 状态，hero 首轮空白态也挂载），原文件条渲染已移除；
+  - `shell.overlay`（list 槽，toast 通知展示）。
+  - **📎 按钮接管**：capture 阶段拦截原生 `fileInput` 的 change 事件，文件进入插件自定义管线（图片/文档统一落盘 + 插 `@引用`）；纯文本粘贴完全原生，不做改写。document 级 capture 监听先于应用 bubble 监听执行。
 - **通知**：`shell.overlay` frame-wide 浮动 toast（不参与文档流，不破坏布局），4 秒自动消失。
 - **浮层**：拖入任何文件时 capture 阶段拦截应用自带「拖入图片…」DropOverlay（文案面向图片，对文档是误导）。
 
 ## 开发说明
 
 - `lib/*.js`、`package.json`、`cordis.patch.yml`、`README.md` 当前均为 **UTF-8 无 BOM**（以仓库实测为准）；编辑时保持原编码，不引入 BOM。
-- Host 半用 `webServer.register({ kind: 'prefix', path: '/dsh-file-attachment', handler })` 收文件，纯 ESM 无构建，不依赖装饰器/远程反射。
+- Host 半用 `webServer.register({ kind: 'prefix', path: '/dsh-file-attachment', handler })` 提供 `/save`、`/config`、`/describe` 三个路由，并经 `tools.register` 注册 `describe_image` 工具；纯 ESM 无构建，不依赖装饰器/远程反射。
 - Client 半保存用 `fetch('/dsh-file-attachment/save', { method: 'POST', body: JSON.stringify({ name, data, sessionId }) })`，信封为 `{ ok, value | error }`。
+- VLM 走 OpenAI 兼容 `chat/completions`（Base URL / API Key / 模型 / 思考模式可在设置页配置，默认关闭思考模式）；未填 API Key 时识别静默跳过，不影响落盘。
 - 项目根 = 会话工作区（`session.header.cwd` → `sandboxPolicy.workspaceRoot` → `process.cwd()` 兜底）。
 - 50MB 上限两侧一致（client 跳过 + host 校验）。
 

package/lib/client.js

@@ -28,7 +28,7 @@ window.__ModuleLoader__.load({
 		// ---- 模块级状态：document 监听器 / dock 槽（同步桥）/ overlay 槽（toast）共享 ----
 		let ctxRef = null // apply 时记下 ctx，供远程调用与降级判断
 		const bridge = {
-			shell: null,          // 输入机 shell（insertReference/snapshot），来自当前会话
+			shell: null,          // 输入机 shell（insertText/snapshot），来自当前会话
 			actions: null,        // InputActions（setDraft/addImages...），来自当前会话
 			input: undefined,     // 最新 InputState（draft/phase...），随渲染刷新
 			conversation: undefined, // conversation 服务：登记草稿图片
@@ -189,10 +189,10 @@ window.__ModuleLoader__.load({
 			noticeTimer = setTimeout(() => { noticeTimer = null; if (bridge.noticeText === text) publishNotice(null) }, NOTICE_MS)
 		}
 
-		// ---- 已附加文件（待发送）：runBatch 插入 chip 成功后登记，FaFileDock 渲染，发送后清空 ----
+		// ---- 已附加文件（待发送）：runBatch 插入 @路径 成功后登记，FaAttachments（输入框内附件条）渲染，发送后清空 ----
 		let faSeq = 0
 		const attached = new Map() // id -> { id, name, path, isImage, url, sessionId }
-		const attachedListeners = new Set() // 变化订阅（FaFileDock 重渲染）
+		const attachedListeners = new Set() // 变化订阅（FaAttachments 重渲染）
 		function emitAttached() { for (const fn of attachedListeners) { try { fn() } catch (err) { /* 忽略 */ } } }
 		function attachFile(entry) { attached.set(entry.id, entry); emitAttached() }
 		function detachFile(id) { if (attached.delete(id)) emitAttached() }
@@ -202,38 +202,40 @@ window.__ModuleLoader__.load({
 			if (changed) emitAttached()
 		}
 
-		// 文件条移除时清除草稿中指向给定路径的全部 @引用 chip（同一文件拖多次会留多个 chip，需全清）。
-		// 兼容两代 dsh 输入机：旧版（Lexical）draft 是 clipboard 投影（chip 展开为 @路径 文本），
-		// 新版（纯文本机，chip 外观是文本上的扫描装饰）draft 是纯文本——两代里 occurrence 的
-		// [offset, offset+length) 都是 snap.draft 内的文本区间，故统一 setDraft 整文拼接删除
-		//（新版 consumeToken 的 span 分支内部本就是 setDraft 拼接）。每轮删一个目标区间
-		//（连带 chip 后机器自动补的尾随空格 gap），draftRev 递增后重读 snapshot，循环至无目标。
+		// 附件条移除时清除草稿中指向给定路径的引用。
+		// chip 模式下 snap.draft（clipboardText 投影）包含 chip 的 @完整路径；
+		// setDraft 会清空所有 Lexical 节点（含 chip）重建为纯文本——调用后 chip 变为
+		// @路径 纯文本（TextRefNode 颜色装饰，可发送）。子串须位于行首或前面是空白，
+		// 防误伤用户文本；同一文件拖多次会留多份，循环至无目标。
 		function removeDraftRefs(path) {
 			const shell = bridge.shell
 			if (shell === null || typeof path !== 'string' || path === '') return
 			if (typeof shell.setDraft !== 'function') return
 			const plain = '@' + path
 			const quoted = '@"' + path + '"'
-			const isTarget = (oc) => oc.ref === plain || oc.ref === quoted
-				|| (oc.clipboardText !== void 0 && (oc.clipboardText === plain || oc.clipboardText === quoted))
 			for (let n = 0; n < 64; n++) {
 				const snap = readShellSnapshot(shell)
 				if (snap === null || snap === void 0 || typeof snap.draft !== 'string') break
-				// 发送进行中不动草稿（此时 occurrence 会随发送完成清空）
+				// 发送进行中不动草稿（此时 @引用 会随发送完成清空）
 				if (snap.phase === 'adjudicating' || snap.phase === 'submitting') break
-				// 取第一个有效（类型+边界健全）且指向目标路径的 occurrence，边界失配直接跳过防误伤用户文本
-				const occs = snap.occurrences || []
-				let oc = null
-				for (let i = 0; i < occs.length; i++) {
-					const o = occs[i]
-					if (typeof o.offset !== 'number' || typeof o.length !== 'number' || o.length <= 0) continue
-					if (o.offset < 0 || o.offset + o.length > snap.draft.length) continue
-					if (isTarget(o)) { oc = o; break }
+				const draft = snap.draft
+				let idx = -1
+				for (let i = 0; i <= draft.length; i++) {
+					const p = draft.indexOf(plain, i)
+					if (p === -1) break
+					if (p === 0 || /\s/.test(draft[p - 1])) { idx = p; break }
 				}
-				if (oc === null) break
-				let end = oc.offset + oc.length
-				if (snap.draft.charCodeAt(end) === 32) end += 1 // 吃掉插入 chip 时机器自动补的尾随空格 gap
-				shell.setDraft(snap.draft.slice(0, oc.offset) + snap.draft.slice(end))
+				if (idx === -1) {
+					for (let i = 0; i <= draft.length; i++) {
+						const p = draft.indexOf(quoted, i)
+						if (p === -1) break
+						if (p === 0 || /\s/.test(draft[p - 1])) { idx = p; break }
+					}
+				}
+				if (idx === -1) break
+				let end = idx + plain.length
+				if (draft.charCodeAt(end) === 32) end += 1 // 吃掉插入时补的尾随空格 gap
+				shell.setDraft(draft.slice(0, idx) + draft.slice(end))
 			}
 		}
 
@@ -510,7 +512,7 @@ window.__ModuleLoader__.load({
 				announce('输入框不可用')
 				return true
 			}
-			// 有输入桥：接管全部（图片与文档统一落盘 → @引用芯片，方案 B 绕开 dsh image 能力检查）
+			// 有输入桥：接管全部（图片与文档统一落盘 → @路径 纯文本，方案 B 绕开 dsh image 能力检查）
 			e.preventDefault()
 			e.stopImmediatePropagation()
 			dismissDropOverlay()
@@ -518,8 +520,8 @@ window.__ModuleLoader__.load({
 			return true
 		}
 
-		// 异步批处理：文档 + 图片统一落盘 → shell.insertReference 芯片（不显示长路径，发送还原 @ 路径）。
-		// 图片不走 dsh 草稿附件链路（方案 B：文本模型被 dsh 拒绝 image 附件），改与文档同链路：落盘 → @引用 → 文件条登记。
+		// 异步批处理：文档 + 图片统一落盘 → shell.insertReference chip（label=短文件名显示，clipboardText=@完整路径发送）。
+		// 图片不走 dsh 草稿附件链路（方案 B：文本模型被 dsh 拒绝 image 附件），改与文档同链路：落盘 → chip 引用 → 附件条登记。
 		// 目录拒绝；扩展名按配置校验（图片恒允许）。
 		async function runBatch(images, docs) {
 			const shell = bridge.shell
@@ -563,7 +565,7 @@ window.__ModuleLoader__.load({
 				const it = pending[i]
 				try {
 					if (it.isImage) {
-						// 图片：落盘 → @引用芯片 + 文件条登记（方案 B：走文件引用链路，
+						// 图片：落盘 → @路径 纯文本 + 附件条登记（方案 B：走文件引用链路，
 						// 不触发 dsh 的 image 能力检查，文本模型可正常发送到历史）
 						const data = it.file
 						const name = it.name
@@ -582,7 +584,7 @@ window.__ModuleLoader__.load({
 						// 每次插入前重取 snapshot（draftRev 随插入递增，span 取当前末尾）
 						const snap = readShellSnapshot(shell)
 						// 前导分隔空格：聊天记录对 @引用 的 file-chip 渲染（projectUserText）
-						// 要求 @ 前是行首或空白，而 insertReference 只在 chip 后补空格。
+						// 要求 @ 前是行首或空白；纯文本 @路径 也遵循同样边界。
 						// 草稿末尾紧贴文字时先补一格，否则发送后聊天记录显示裸 @路径。
 						if (snap !== void 0 && typeof snap.draft === 'string' && snap.draft !== ''
 							&& !isSpace(snap.draft.charCodeAt(snap.draft.length - 1))) {
@@ -594,10 +596,9 @@ window.__ModuleLoader__.load({
 							}
 						}
 						// 补空格会递增 draftRev，重新取快照后再定插入 span。
-						// 关键：insertReference 的 span 是 detect 坐标（编辑器实际节点坐标），
-						// draft.length 是 clipboard 投影坐标（chip 展开为 @路径 文本），草稿含 chip 时两者不一致
-						// 会导致 selectSpan 越界失败（span.end > detectLength → null → ok:false）。
-						// 用 shell.caretSpan() 拿 detect 坐标（有光标返回光标处，否则返回文档末尾）。
+						// 关键：insertText 的 span 是 detect 坐标（编辑器实际节点坐标），
+						// draft.length 是投影坐标，纯文本机下两者一致；仍优先 shell.caretSpan()
+						// 拿 detect 坐标（有光标返回光标处，否则返回文档末尾），与历史行为对齐。
 						const snap2 = readShellSnapshot(shell)
 						let span
 						if (typeof shell.caretSpan === 'function') {
@@ -610,25 +611,17 @@ window.__ModuleLoader__.load({
 						} else {
 							span = { draftRev: snap2.draftRev, start: snap2.draft.length, end: snap2.draft.length }
 						}
-						const okInsert = shell.insertReference(
-							{
-								source: 'reference', // 复用内置已注册的 @引用 source（带 codec.serialize），否则报 no serializer
-								ref: clipboardText, // codec.serialize 原样返回 ref 作为模型文本，故放完整 @路径
-								label: name,
-								appearance: 'file',
-								clipboardText: clipboardText,
-							},
-							span,
-						)
-						if (typeof console !== 'undefined' && console.log) console.log('[dsh-file-attachment] image insertReference result', { ok: okInsert, span, clipboardText, draftRev: snap2.draftRev, draftLen: snap2.draft.length })
+						// chip 插入：label=短文件名（显示用），clipboardText=@完整路径（发送用）
+						const okInsert = shell.insertReference({ source: 'reference', ref: clipboardText, label: name, appearance: 'file', clipboardText: clipboardText }, span)
+						if (typeof console !== 'undefined' && console.log) console.log('[dsh-file-attachment] image insertReference result', { ok: okInsert, span, name, clipboardText, draftRev: snap2.draftRev })
 						if (okInsert) {
 							inserted += 1
-							// 登记到文件条（图片：data URL 缩略图 + 点击打开；发送后随 chip 清空）
+							// 登记到附件条（图片：data URL 缩略图 + 点击打开；发送后随 @引用 清空）
 							attachFile({ id: 'fa' + (++faSeq), name, path: res.path, isImage: true, url: thumbUrl, sessionId: bridge.sessionId })
 						} else failed += 1
 						continue
 					}
-					// 文档：原样落盘 → @引用芯片 + 文件条登记
+					// 文档：原样落盘 → @路径 纯文本 + 附件条登记
 					const data = it.file
 					const name = it.name
 					if (data === null || typeof data.size !== 'number' || data.size === 0) throw new Error('size')
@@ -641,7 +634,7 @@ window.__ModuleLoader__.load({
 					// 每次插入前重取 snapshot（draftRev 随插入递增，span 取当前末尾）
 					const snap = readShellSnapshot(shell)
 					// 前导分隔空格：聊天记录对 @引用 的 file-chip 渲染（projectUserText）
-					// 要求 @ 前是行首或空白，而 insertReference 只在 chip 后补空格。
+					// 要求 @ 前是行首或空白；纯文本 @路径 也遵循同样边界。
 					// 草稿末尾紧贴文字时先补一格，否则发送后聊天记录显示裸 @路径
 					//（旧版 insertTextAtCaret 的 padStart 同款保底）。
 					if (snap !== void 0 && typeof snap.draft === 'string' && snap.draft !== ''
@@ -650,12 +643,11 @@ window.__ModuleLoader__.load({
 						if (typeof shell.insertText === 'function') {
 							try { shell.insertText(' ', leadSpan) } catch (err) { /* 忽略：补空格失败不阻塞插入 */ }
 						} else if (typeof shell.setDraft === 'function') {
-							// 含 chip 的草稿末尾必为空白（chip 自动尾随空格），故此处必为纯文本，拼接安全
 							try { shell.setDraft(snap.draft + ' ') } catch (err) { /* 忽略 */ }
 						}
 					}
 					// 补空格会递增 draftRev，重新取快照后再定插入 span。
-					// 与图片分支同理：insertReference 的 span 须为 detect 坐标，优先 shell.caretSpan()。
+					// 与图片分支同理：insertText 的 span 须为 detect 坐标，优先 shell.caretSpan()。
 					const snap2 = readShellSnapshot(shell)
 					let span
 					if (typeof shell.caretSpan === 'function') {
@@ -668,19 +660,11 @@ window.__ModuleLoader__.load({
 					} else {
 						span = { draftRev: snap2.draftRev, start: snap2.draft.length, end: snap2.draft.length }
 					}
-					const okInsert = shell.insertReference(
-						{
-							source: 'reference', // 复用内置已注册的 @引用 source（带 codec.serialize），否则报 no serializer
-							ref: clipboardText, // codec.serialize 原样返回 ref 作为模型文本，故放完整 @路径
-							label: name,
-							appearance: 'file',
-							clipboardText: clipboardText,
-						},
-						span,
-					)
+					// chip 插入：label=短文件名（显示用），clipboardText=@完整路径（发送用）
+					const okInsert = shell.insertReference({ source: 'reference', ref: clipboardText, label: name, appearance: 'file', clipboardText: clipboardText }, span)
 					if (okInsert) {
 						inserted += 1
-						// 登记到文件条（图片：data URL 缩略图；文档：类型图标；发送后随 chip 清空）
+						// 登记到附件条（图片：data URL 缩略图；文档：类型图标；发送后随 @引用 清空）
 						attachFile({ id: 'fa' + (++faSeq), name, path: res.path, isImage: false, url: null, sessionId: bridge.sessionId })
 					} else failed += 1
 				} catch (err) {
@@ -770,15 +754,9 @@ window.__ModuleLoader__.load({
 					if (conversation !== void 0 && actx !== void 0) {
 						shell = conversation.input.for(actx)
 						if (shell !== null) {
-							addImages = (files) => {
-								try {
-									const drafts = conversation.createDrafts(sessionId, files)
-									if (!shell.addAttachments(drafts.map((draft) => draft.id))) conversation.releaseDraftAttachments(drafts)
-									return null
-								} catch (error) {
-									return error instanceof Error ? error.message : String(error)
-								}
-							}
+							// 不再注册 dsh 原生附件（createDrafts + addAttachments 会导致原生附件条重复显示）
+							// 插件已接管图片落盘 + chip 引用 + 自定义附件条（FaAttachments）
+							addImages = (files) => { return null }
 						}
 					}
 				}
@@ -812,8 +790,10 @@ window.__ModuleLoader__.load({
 			)
 		}
 
-		// 文件条（输入框上方 dock）：图片真缩略图 / 文件类型图标，点击用默认程序打开，可移除，发送后自动清空。
-		function FaFileDock() {
+		// 输入框内附件条（conversation.input.attachments 槽，shadow 原生 ComposerAttachments）：
+		// 图片显示真缩略图预览 / 文件仅类型图标；文件名横排显示在缩略图/图标右侧（草稿 @引用 chip
+		// 已改为只留图标不显示文字，避免双份名称）；可移除（先清草稿 @引用 再登记移除）；发送后自动清空。
+		function FaAttachments() {
 			const [, force] = react.useState(0)
 			react.useEffect(() => {
 				const fn = () => force(n => n + 1)
@@ -839,26 +819,25 @@ window.__ModuleLoader__.load({
 			if (entries.length === 0) return null
 			return react.createElement('div', {
 				style: {
-					display: 'flex', flexWrap: 'wrap', gap: '6px', alignItems: 'center',
-					width: '100%', maxWidth: 'calc(var(--dsh-composer-card-max-width, 720px) - 24px)',
-					margin: '0 auto 6px', padding: '2px 4px', boxSizing: 'border-box',
+					display: 'flex', flexWrap: 'wrap', gap: '8px', alignItems: 'center',
+					width: '100%', boxSizing: 'border-box',
 				},
 			},
 				entries.map(e =>
 					react.createElement('div', { key: e.id, style: {
-						display: 'inline-flex', alignItems: 'center', gap: '6px',
+						display: 'inline-flex', alignItems: 'center', gap: '8px',
 						background: 'rgba(128,128,128,0.12)', border: '1px solid rgba(128,128,128,0.2)',
-						borderRadius: '8px', padding: '3px 8px', fontSize: '12px', lineHeight: '1.4', maxWidth: '240px',
+						borderRadius: '10px', padding: '4px 8px', fontSize: '12px', lineHeight: '1.4', maxWidth: '260px',
 					} },
 						e.isImage && e.url
-							? react.createElement('img', { src: e.url, alt: '', style: { width: '20px', height: '20px', objectFit: 'cover', borderRadius: '4px', flex: 'none' } })
+							? react.createElement('img', { src: e.url, alt: e.name, title: e.name, style: { width: '56px', height: '56px', objectFit: 'cover', borderRadius: '8px', flex: 'none', display: 'block' } })
 							: react.createElement('span', { style: { display: 'inline-flex', width: '20px', height: '20px', flex: 'none', color: 'inherit' } }, fileGlyph(e.name)),
 						react.createElement('span', {
 							style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', minWidth: 0 },
 						}, e.name),
 						react.createElement('span', {
 							onClick: () => {
-								// 先清草稿中指向该文件的全部 @引用 chip，再移除文件条条目
+								// 先清草稿中指向该文件的全部 @引用 chip，再移除附件条条目
 								try { removeDraftRefs(e.path) } catch (err) { /* 忽略：引用清理失败不阻塞移除 */ }
 								detachFile(e.id)
 							},
@@ -870,12 +849,231 @@ window.__ModuleLoader__.load({
 			)
 		}
 
+		// ---- 聊天区用户消息渲染器（shadow conversation.chat.node keyed 'user'）----
+		// 需求：图片在聊天区也要预览（缩略图 + 点击放大）；文件自始至终不需要预览（保持 chip）。
+		// 方案 B 下用户消息以 @绝对路径 文本形式落库（无原生附件块），故核心是扫描 text 块内的
+		// @路径：图片路径 → /api/file?path= 缩略图（宿主既有文件服务路由，同 AssistantMarkdown
+		// localPathMediaUrl 机制）；文件路径 → 复刻 dsh projectUserText 的 refChip 样式（无预览）。
+		// 原生 image/file 附件块（多模态模型场景）→ 尽力渲染（renderMessageImages / 文件卡片）。
+		// 本插件自包含（无法 import dsh 包），全部 react.createElement + 内联样式复刻。
 
-		// 扩展名规范化：小写/去前导点/仅 [a-z0-9]；非法返回 null
-		function normExt(v) {
-			const s = String(v == null ? '' : v).trim().toLowerCase().replace(/^\.+/u, '')
-			return (s !== '' && /^[a-z0-9]+$/u.test(s)) ? s : null
+		// 图片扩展名集合（与 host IMAGE_EXT 一致：png/jpg/jpeg/gif/webp/bmp）
+		const IMAGE_EXT_SET = new Set(['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp'])
+		function isImagePath(p) {
+			if (typeof p !== 'string' || p === '') return false
+			const dot = p.lastIndexOf('.')
+			if (dot <= 0) return false
+			return IMAGE_EXT_SET.has(p.slice(dot + 1).toLowerCase())
+		}
+		// 复刻 dsh fileSizeText：字节数 → 人类可读
+		function fileSizeText(bytes) {
+			if (typeof bytes !== 'number' || !isFinite(bytes) || bytes < 0) return ''
+			if (bytes < 1024) return bytes + ' B'
+			if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1).replace(/\.0$/u, '') + ' KB'
+			if (bytes < 1024 * 1024 * 1024) return (bytes / (1024 * 1024)).toFixed(1).replace(/\.0$/u, '') + ' MB'
+			return (bytes / (1024 * 1024 * 1024)).toFixed(1).replace(/\.0$/u, '') + ' GB'
+		}
+		// 复刻 dsh contentParts：用户消息 content（块数组）拆 text/attachments/rest
+		function contentParts(content) {
+			const texts = []
+			const attachments = []
+			const rest = []
+			if (!Array.isArray(content)) {
+				return { text: (typeof content === 'string' ? content : ''), attachments, rest }
+			}
+			for (const block of content) {
+				const b = (block !== null && typeof block === 'object') ? block : null
+				if (b !== null && b.type === 'text' && typeof b.text === 'string') texts.push(b.text)
+				else if (b !== null && b.type === 'image' && b.attachment !== void 0) attachments.push({ type: 'image', image: b.attachment })
+				else if (b !== null && b.type === 'file' && b.attachment !== void 0) attachments.push({ type: 'file', file: b.attachment })
+				else if (b !== null) rest.push(block)
+			}
+			return { text: texts.join(''), attachments, rest }
+		}
+		// 复刻 dsh projectUserText 的 @路径 正则（含引号形式），扫描 text 中的引用 token。
+		// 返回 [{ start, end, raw, path }]：raw=完整 token（含@），path=去 @ 与前导引号后的路径。
+		function scanRefTokens(text) {
+			const out = []
+			if (typeof text !== 'string' || text === '') return out
+			const re = /(^|\s)(\/[\w-]+(?=\s|$)|@"[^"\n]+"|@[^\s]+)/gu
+			let m = null
+			while ((m = re.exec(text)) !== null) {
+				const tokenStart = m.index + (m[1] || '').length
+				const raw = m[2]
+				if (typeof raw !== 'string' || raw.charAt(0) !== '@') continue // /name 是 skill/command，保持文本
+				let path = raw.slice(1)
+				if (path.charAt(0) === '"' && path.length > 1 && path.charAt(path.length - 1) === '"') path = path.slice(1, -1)
+				out.push({ start: tokenStart, end: tokenStart + raw.length, raw, path })
+			}
+			return out
 		}
+		// 复刻 dsh IconBrowseOutline16 的 SVG path（16×16 viewBox，文件浏览图标，currentColor）
+		function fileBrowseGlyph(size) {
+			return react.createElement('svg', { width: size, height: size, viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', 'aria-hidden': true, style: { display: 'block' } },
+				react.createElement('path', { d: 'M11.2426 4.80473V6.10551H4.75819V4.80473H11.2426Z', fill: 'currentColor' }),
+				react.createElement('path', { d: 'M9.40858 7.84478V9.14557H4.75819V7.84478H9.40858Z', fill: 'currentColor' }),
+				react.createElement('path', {
+					d: 'M9.23438 0.546389C10.1941 0.546389 10.9683 0.544914 11.5859 0.611819C12.2161 0.680096 12.7634 0.825745 13.2393 1.17139C13.5172 1.3733 13.7619 1.61812 13.9639 1.896C14.3096 2.37183 14.4551 2.91922 14.5234 3.54932C14.5903 4.16686 14.5889 4.94133 14.5889 5.90088V10.0981C14.5889 11.0576 14.5903 11.8321 14.5234 12.4497C14.4552 13.0798 14.3094 13.6272 13.9639 14.103C13.7619 14.381 13.5172 14.6257 13.2393 14.8276C12.7633 15.1734 12.2163 15.3189 11.5859 15.3872C10.9683 15.4541 10.1942 15.4536 9.23438 15.4536H6.76563C5.80591 15.4536 5.03168 15.4541 4.41407 15.3872C3.78385 15.3189 3.23665 15.1734 2.76074 14.8276C2.48291 14.6257 2.23802 14.3809 2.03614 14.103C1.69066 13.6272 1.54483 13.0798 1.47657 12.4497C1.40973 11.8321 1.41114 11.0576 1.41114 10.0981V5.90088C1.41113 4.94132 1.40966 4.16686 1.47657 3.54932C1.54488 2.91921 1.69042 2.37184 2.03614 1.896C2.2381 1.61807 2.4828 1.37333 2.76074 1.17139C3.23665 0.825682 3.78386 0.680109 4.41407 0.611819C5.03168 0.544905 5.80591 0.546389 6.76563 0.546389H9.23438ZM6.76563 1.896C5.77586 1.896 5.0876 1.89738 4.55957 1.95459C4.0443 2.01043 3.76214 2.11349 3.55469 2.26416C3.39135 2.38284 3.24761 2.52662 3.12891 2.68994C2.97821 2.89736 2.8752 3.17967 2.81934 3.69483C2.76214 4.22279 2.76075 4.91131 2.76074 5.90088V10.0981C2.76074 11.0876 2.76221 11.7762 2.81934 12.3042C2.87516 12.8194 2.97829 13.1026 3.12891 13.3101C3.24754 13.4733 3.39147 13.6172 3.55469 13.7358C3.76213 13.8865 4.04438 13.9896 4.55957 14.0454C5.0876 14.1026 5.77586 14.103 6.76563 14.103H9.23438C10.2242 14.103 10.9124 14.1026 11.4404 14.0454C11.9556 13.9896 12.2379 13.8865 12.4453 13.7358C12.6086 13.6172 12.7525 13.4733 12.8711 13.3101C13.0217 13.1026 13.1248 12.8195 13.1807 12.3042C13.2378 11.7762 13.2393 11.0876 13.2393 10.0981V5.90088C13.2393 4.91131 13.2379 4.22279 13.1807 3.69483C13.1248 3.17969 13.0218 2.89736 12.8711 2.68994C12.7524 2.52667 12.6086 2.38281 12.4453 2.26416C12.2379 2.11355 11.9556 2.01041 11.4404 1.95459C10.9124 1.8974 10.2241 1.896 9.23438 1.896H6.76563Z', fill: 'currentColor' }),
+			)
+		}
+		// 聊天区 @文件路径 → refChip（复刻 dsh css.refChip：inline + 主题色 + 图标 + 末段名；无预览）
+		function renderRefChip(raw, path) {
+			let name = path
+			const sl = path.lastIndexOf('/')
+			if (sl >= 0 && sl < path.length - 1) name = path.slice(sl + 1)
+			const isFolder = raw.charAt(raw.length - 1) === '/' || path.charAt(path.length - 1) === '/'
+			return react.createElement('span', {
+				title: raw,
+				style: {
+					display: 'inline', margin: '0 2px', whiteSpace: 'nowrap',
+					color: 'var(--dsw-alias-state-business-primary)', fontWeight: 500,
+				},
+			},
+				react.createElement('span', { style: { display: 'inline-block', width: '1em', height: '1em', marginRight: '4px', verticalAlign: '-0.125em', color: 'inherit' } },
+					fileBrowseGlyph(16)),
+				name,
+			)
+		}
+		// 图片放大预览（Lightbox）：模块级状态，FaUserMessage 缩略图点击打开，FaLightbox 渲染
+		let lightboxSrc = null
+		let lightboxName = ''
+		let lightboxListener = null
+		function openLightbox(src, name) {
+			lightboxSrc = src
+			lightboxName = name || ''
+			if (lightboxListener !== null) lightboxListener()
+		}
+		function FaLightbox() {
+			const [, force] = react.useState(0)
+			react.useEffect(() => {
+				lightboxListener = () => force(n => n + 1)
+				return () => { if (lightboxListener !== null) lightboxListener = null }
+			}, [])
+			const src = lightboxSrc
+			if (src === null || src === '') return null
+			const close = () => { openLightbox(null, '') }
+			return react.createElement('div', {
+				onClick: close,
+				style: {
+					position: 'fixed', inset: '0', zIndex: 3000,
+					background: 'rgba(0,0,0,0.74)', display: 'flex', alignItems: 'center', justifyContent: 'center',
+					cursor: 'zoom-out',
+				},
+			},
+				react.createElement('img', { src, alt: lightboxName, style: { maxWidth: '90vw', maxHeight: '90vh', borderRadius: '8px', boxShadow: '0 8px 40px rgba(0,0,0,0.5)' } }),
+				react.createElement('span', {
+					onClick: (e) => { e.stopPropagation(); close() },
+					title: '关闭',
+					style: { position: 'absolute', top: '18px', right: '24px', color: '#fff', fontSize: '30px', cursor: 'pointer', lineHeight: '1', userSelect: 'none' },
+				}, '×'),
+			)
+		}
+		// 宿主文件服务 URL：与 dsh AssistantMarkdown.localPathMediaUrl 同机制
+		function imageUrlFor(path) {
+			return '/api/file?path=' + encodeURIComponent(path)
+		}
+		// 聊天区 @图片路径 → 缩略图（<img /api/file?path=> + 点击放大 Lightbox）
+		function renderImageThumb(path, raw) {
+			const src = imageUrlFor(path)
+			return react.createElement('img', {
+				src,
+				alt: '',
+				title: raw,
+				onClick: () => { openLightbox(src, path) },
+				style: {
+					maxWidth: '240px', maxHeight: '240px', width: 'auto', height: 'auto',
+					objectFit: 'contain', borderRadius: '12px', display: 'inline-block',
+					verticalAlign: 'middle', cursor: 'zoom-in', margin: '2px 2px',
+				},
+			})
+		}
+		// text 块 → 节点序列：普通文本 run + @路径（图片→缩略图 / 文件→chip）
+		function projectTextWithImages(text) {
+			const tokens = scanRefTokens(text)
+			if (tokens.length === 0) return react.createElement('span', null, text)
+			const parts = []
+			let cursor = 0
+			for (const tk of tokens) {
+				if (tk.start > cursor) parts.push(react.createElement('span', { key: 't' + cursor }, text.slice(cursor, tk.start)))
+				if (isImagePath(tk.path)) parts.push(react.createElement('span', { key: 'i' + tk.start }, renderImageThumb(tk.path, tk.raw)))
+				else parts.push(react.createElement('span', { key: 'r' + tk.start }, renderRefChip(tk.raw, tk.path)))
+				cursor = tk.end
+			}
+			if (cursor < text.length) parts.push(react.createElement('span', { key: 't' + cursor }, text.slice(cursor)))
+			return react.createElement(react.Fragment, null, parts)
+		}
+		// 聊天区文件附件块 → 文件卡片（名 + 扩展名/大小 meta；无预览）
+		function renderFileCard(file, key) {
+			const ext = (file && typeof file.name === 'string' ? file.name.lastIndexOf('.') : -1) > 0
+				? String(file.name.slice(file.name.lastIndexOf('.') + 1)).toUpperCase().slice(0, 8)
+				: ''
+			const meta = [ext, fileSizeText(file && file.bytes)].filter(Boolean).join(' ')
+			return react.createElement('span', {
+				key, title: file && file.name,
+				style: {
+					display: 'inline-flex', flex: '0 0 240px', alignItems: 'center', gap: '10px',
+					width: '240px', minHeight: '64px', padding: '8px 12px',
+					border: '0.5px solid var(--dsw-alias-border-l2, rgba(0,0,0,0.12))',
+					borderRadius: '16px', background: 'var(--dsw-specific-input-major, transparent)',
+					boxSizing: 'border-box',
+				},
+			},
+				react.createElement('span', { style: { display: 'inline-flex', width: '20px', height: '20px', flex: 'none' } },
+					fileGlyph(file && file.name ? file.name : 'file')),
+				react.createElement('span', { style: { display: 'flex', flexDirection: 'column', minWidth: 0 } },
+					react.createElement('span', { style: { fontSize: '13px', fontWeight: 500, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' } }, file && file.name),
+					react.createElement('span', { style: { fontSize: '11px', opacity: 0.7 } }, meta),
+				),
+			)
+		}
+		// 聊天区用户消息渲染器：气泡 + @图片缩略图预览 / @文件 chip；附件块尽力渲染
+		function FaUserMessage(props) {
+			const node = props && props.node
+			const data = node ? node.data : null
+			const content = data ? data.content : []
+			const renderMessageImages = props && props.renderMessageImages
+			const { text, attachments, rest } = contentParts(content)
+			const showBubble = text !== '' || rest.length > 0
+			const rows = []
+			// 附件块（image → 原生缩略图画廊 / file → 文件卡片）
+			for (let i = 0; i < attachments.length; i++) {
+				const a = attachments[i]
+				if (a.type === 'image') {
+					// 原生 image 附件块：交 dsh 缩略图画廊渲染（ChatNodeOwnerProps.renderMessageImages，
+					// 由 CHAT_NODE_INJECT 注入，宿主必有）
+					if (typeof renderMessageImages === 'function') {
+						rows.push(react.createElement(react.Fragment, { key: 'image:' + i }, renderMessageImages({ images: [{ attachment: a.image }], align: 'end', compact: attachments.length > 1 })))
+					}
+				} else {
+					rows.push(renderFileCard(a.file, 'file:' + i))
+				}
+			}
+			// 气泡（text + rest）
+			if (showBubble) {
+				rows.push(react.createElement('div', {
+					key: 'bubble',
+					style: {
+						maxWidth: '100%', background: 'var(--dsw-specific-bubble)', borderRadius: '22px',
+						padding: '10px 16px', fontSize: 'var(--dsh-content-font-size, 14px)',
+						lineHeight: 'calc(22px + var(--dsh-content-font-delta, 0px))',
+						whiteSpace: 'pre-wrap', wordBreak: 'break-word',
+					},
+				},
+					projectTextWithImages(text),
+					rest.map((block, i) => {
+						let label = ''
+						try { label = JSON.stringify(block) } catch (err) { label = String(block) }
+						if (label.length > 200) label = label.slice(0, 200) + '…'
+						return react.createElement('div', { key: 'rest' + i, style: { fontSize: '12px', opacity: 0.75, marginTop: '4px' } }, label)
+					}),
+				))
+			}
+			if (rows.length === 0) return null
+			return react.createElement('div', { style: { display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: '6px' } },
+				react.createElement('div', { style: { display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: '8px', minWidth: 0, maxWidth: 'min(calc(var(--dsh-chat-content-width, 748px) * 0.702), 82%)' } }, rows),
+			)
+		}
+
 		function addExt(setList, value, current) {
 			const s = normExt(value)
 			if (s === null || current.indexOf(s) >= 0) return
@@ -927,6 +1125,11 @@ window.__ModuleLoader__.load({
 			)
 		}
 
+		// 扩展名规范化：小写/去前导点/仅 [a-z0-9]；非法返回 null
+		function normExt(v) {
+			const s = String(v == null ? '' : v).trim().toLowerCase().replace(/^\.+/u, '')
+			return (s !== '' && /^[a-z0-9]+$/u.test(s)) ? s : null
+		}
 		// 设置页：配置可上传的文档/代码/配置文件扩展名，保存写 ~/.dsh/file-attachment.json
 		function FaSettingsPage() {
 			const [doc, setDoc] = react.useState(DEFAULT_TYPES.doc.slice())
@@ -1075,15 +1278,28 @@ window.__ModuleLoader__.load({
 					},
 					FaBridge
 				))
-				// 文件条：渲染已附加文件（缩略图/类型图标 + 点击打开 + 可移除），发送后清空
-				slots.inject('conversation.input.dock', () => slots.register(
-					{ name: 'conversation.input.dock', id: 'dsh-file-attachment-dock', order: 400 },
-					FaFileDock
+				// 输入框内附件条：shadow 原生 ComposerAttachments（priority -100 < ui-attachment 的 0，
+				// lowest wins），图片缩略图预览 / 文件条目（无预览），发送后清空
+				slots.inject('conversation.input.attachments', () => slots.register(
+					{ name: 'conversation.input.attachments', id: 'dsh-file-attachment-attachments', priority: -100 },
+					FaAttachments
+				))
+				// 聊天区用户消息：shadow 原生 UserMessageNodeView（keyed 'user'，priority -100 < 0，
+				// lowest wins；Reusing a key replaces that node renderer），@图片路径→缩略图预览，
+				// @文件路径→chip（无预览）
+				slots.inject('conversation.chat.node', () => slots.register(
+					{ name: 'conversation.chat.node', key: 'user', priority: -100 },
+					FaUserMessage
 				))
 				slots.inject('shell.overlay', () => slots.register(
 					{ name: 'shell.overlay', id: 'dsh-file-attachment-toast', order: 100 },
 					FaToast
 				))
+				// 图片放大预览（Lightbox）：list 槽，与 toast 共存（order 200 渲染在 toast 之上）
+				slots.inject('shell.overlay', () => slots.register(
+					{ name: 'shell.overlay', id: 'dsh-file-attachment-lightbox', order: 200 },
+					FaLightbox
+				))
 				// 设置页：文件附件类型配置（左侧菜单项 + 右侧配置页）
 				slots.inject('settings.section', () => [
 					slots.register({

package/lib/index.js

@@ -8,7 +8,6 @@ import { access, mkdir, readFile, writeFile } from 'node:fs/promises'
 import { homedir } from 'node:os'
 import { join, resolve } from 'node:path'
 import { defineTool } from '@deepseek-ai/dsh-tools'
-import { createUserMessage } from '@deepseek-ai/dsh-llm'
 
 /** 本包声明依赖的 Host 服务。 */
 export const name = 'dsh-file-attachment'
@@ -227,17 +226,18 @@ async function handleSave(root, body) {
  * @returns 图片的简洁中文描述。
  * @throws VLM 请求失败或未返回有效内容时抛错。
  */
-async function describeImage(vlm, dataUrl) {
+async function describeImage(vlm, dataUrl, prompt) {
   const url = vlm.baseURL.replace(/\/+$/u, '') + '/chat/completions'
+  const userPrompt = (typeof prompt === 'string' && prompt.trim() !== '') ? prompt.trim() : '请描述这张图片。'
   const payload = {
     model: vlm.model,
     thinkingType: vlm.thinkingType,
     messages: [
-      { role: 'system', content: '你是图片描述助手，用简洁中文描述图片主要内容。' },
+      { role: 'system', content: '你是图片描述助手，用简洁中文回答。' },
       {
         role: 'user',
         content: [
-          { type: 'text', text: '请描述这张图片。' },
+          { type: 'text', text: userPrompt },
           { type: 'image_url', image_url: { url: dataUrl } },
         ],
       },
@@ -326,7 +326,7 @@ function registerRoutes(ctx) {
           return
         }
         try {
-          const description = await describeImage(vlm, dataUrl)
+          const description = await describeImage(vlm, dataUrl, body.prompt)
           json(res, { ok: true, value: { description } })
           return
         } catch (err) {
@@ -359,8 +359,8 @@ function mimeFromPath(p) {
 
 /**
  * 注册 describe_image 工具：模型看到用户消息里的图片路径引用（@/绝对路径）时调用，
- * 读图片 → 调 VLM 识别 → 描述仅注入模型上下文（deferContext，不进 UI/session 历史），
- * UI 只渲染简短确认。实现「图片进历史后自动识别、结果不发给用户」。
+ * 读图片 → 调 VLM 识别 → 识别结果直接作为工具输出返回：
+ * UI 展示描述文本，同时该输出即模型可见内容（tool/result 的 content 是 model-facing）。
  */
 function registerTools(ctx) {
   const tools = (ctx !== undefined && ctx !== null && typeof ctx.tools === 'object' && ctx.tools !== null)
@@ -372,13 +372,17 @@ function registerTools(ctx) {
   }
   tools.register(defineTool({
     name: 'describe_image',
-    description: '当用户消息里出现图片路径引用（形如 @/绝对路径，扩展名 png/jpg/jpeg/gif/webp/bmp）且需要理解图片内容时调用此工具，获取该图片的中文内容描述。path 参数填去掉前导 @ 的绝对路径。',
+    description: '当用户消息里出现图片路径引用（形如 @/绝对路径，扩展名 png/jpg/jpeg/gif/webp/bmp）且需要理解图片内容时调用此工具，获取该图片的中文内容描述。path 参数填去掉前导 @ 的绝对路径。prompt 可选，指定要关注的内容（如"识别图中文字"、"描述 UI 布局"）。',
     parameters: {
       path: {
         type: 'string',
         required: true,
         description: '图片文件的绝对路径（去掉前导 @）',
       },
+      prompt: {
+        type: 'string',
+        description: '可选。告诉多模态模型要关注什么（如"识别图中的文字"、"描述 UI 布局"）。不填则默认"请描述这张图片"。',
+      },
     },
     output: {
       schema: {
@@ -386,11 +390,15 @@ function registerTools(ctx) {
         additionalProperties: false,
         properties: {
           ok: { type: 'boolean', required: true },
+          description: { type: 'string' },
         },
       },
-      render: (_args, value) => [
-        { type: 'text', text: (value && value.ok === true) ? '（图片已识别，描述已注入上下文）' : '（图片识别失败）' },
-      ],
+      render: (_args, value) => {
+        if (value && value.ok === true && typeof value.description === 'string' && value.description !== '') {
+          return [{ type: 'text', text: '图片识别结果：' + value.description }]
+        }
+        return [{ type: 'text', text: (value && value.ok === true) ? '（图片已识别）' : '（图片识别失败）' }]
+      },
     },
     async execute(args, exec) {
       let path = typeof args.path === 'string' ? args.path.trim() : ''
@@ -402,13 +410,10 @@ function registerTools(ctx) {
       const dataUrl = 'data:' + mimeFromPath(path) + ';base64,' + bytes.toString('base64')
       const cfg = await readConfig()
       if (cfg.vlm.apiKey === '') throw new Error('未配置多模态 API Key（设置→文件附件填写），无法识别图片')
-      const description = await describeImage(cfg.vlm, dataUrl)
-      // 描述仅注入模型上下文（不进 session 历史 / UI），实现「结果不发给用户」
-      exec.deferContext(createUserMessage({
-        content: [{ type: 'text', text: '图片 ' + path + ' 的内容描述：' + description }],
-        source: { kind: 'plugin', plugin: 'dsh-file-attachment' },
-      }))
-      return { ok: true }
+      const description = await describeImage(cfg.vlm, dataUrl, args.prompt)
+      // 识别结果直接作为工具输出返回：UI 直接展示描述文本，
+      // 同时该输出就是模型可见内容（tool/result 的 content），无需额外 deferContext 注入。
+      return { ok: true, description }
     },
   }))
   console.log('[dsh-file-attachment] describe_image tool registered')

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@wszhoho/dsh-file-attachment",
-  "version": "0.5.0",
-  "description": "文件附件：输入框上传按钮 + 拖拽/粘贴文件（支持多文件）；图片走 dsh 原生图片草稿机制（addImages，不缩放/不落盘），文档落盘到 .dsh-file-attachment 并以芯片 @短名 引用（发送时还原 @绝对路径）；非多模态模型下图片自动调用可配置 VLM 识别生成中文描述回填草稿；文档/代码/配置文件可上传类型可在设置页配置；支持 PC 与移动端浏览器",
+  "version": "0.5.2",
+  "description": "文件附件：拖拽/粘贴/上传文件（支持多文件）；图片与文档统一落盘到 .dsh-file-attachment 并以 @绝对路径 引用发送（文本模型可正常使用）；输入框内联显示图片缩略图预览与文件条目，聊天区图片同样渲染为可点击放大的缩略图、文件保持芯片样式；非多模态模型下图片自动调用可配置 VLM 识别生成中文描述回填草稿；文档/代码/配置文件可上传类型可在设置页配置；支持 PC 与移动端浏览器",
   "keywords": [
     "dsh",
     "plugin",