dsh-figmark 1.2.2 → 1.2.3

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## 1.2.3 — 2026-11-02
+
+本版增加输入框附图标注，并修复导出 SVG 与画布 Pin 编号的显示问题。
+
+### Added
+
+- 直接点击输入框里的图片缩略图即可打开原图标注浮层，支持画笔、箭头、矩形、椭圆、Pin、颜色、撤销/重做与缩放。
+- 「加入输入框」生成独立的 `*.annotated.png`，并把同编号的逐条评论写入现有草稿；原图不变，也不会自动发送。
+
+### Improved
+
+- 标注浮层去掉整块外框，工具条悬浮在图片右侧；底部只保留「下载 PNG」和「加入输入框」两个小按钮。
+- 评论输入沿用原版单胶囊样式，不再显示标题栏、说明行或额外按钮。
+
+### Fixed
+
+- 修复活动画布中 Pin 编号被 SVG 继承描边染黑的问题；预览与导出现在都是白色数字。
+- 修复 Visio SVG 导出时丢失根命名空间和继承样式的问题。
+
 ## 1.2.2 — 2026-11-01
 
 本版集中完善「本机网页」批注、批注卡片导航和公开展示文档。

package/README.md

@@ -51,6 +51,14 @@ dsh-figmark 把三样东西一起交给智能体：
 | 本机网页 | `http://localhost` / `127.0.0.1` / `[::1]` | ✅ 在右侧栏「本机网页」里发现并打开；真实脚本、路由、媒体与元素锚定可用 |
 | Office | `doc` `docx` `ppt` `pptx` `xls` `xlsx` | ⏳ 待接入，仍由内置预览器打开 |
 
+## 输入框附图的独立批注（测试功能）
+
+添加图片后，直接点击输入框里的原生缩略图即可在原图上标注；工具条悬浮在图片右侧，支持画笔、箭头、矩形、椭圆和 Pin 评论，以及移动、缩放标记、改色、撤销/重做。
+
+「加入输入框」会生成标注 PNG，并把逐条评论追加到现有草稿一起发送；原图保持不变，已有文字保留，之后由你确认附件和评论并按宿主的发送按钮。编辑、取消和下载均不调用智能体，不建立批注队列，也不写侧车文件。
+
+当前保留一张图的临时批注，刷新或明确清除后不保留可编辑图层；导出的 PNG 为静态副本。完整步骤、宿主兼容性与待实测项目见 [附图标注测试说明](docs/attachment-annotator-testing.md)。
+
 ## 安装
 
 ### 从插件市场安装（推荐）

package/lib/client.js

@@ -3808,6 +3808,7 @@ window.__ModuleLoader__.load({
 					fontSize: pinFontSizeOf(unit),
 					fontWeight: 700,
 					fill: PIN_NUMBER_COLOR,
+					stroke: "none",
 					textAnchor: "middle",
 					dominantBaseline: "central",
 					children: number
@@ -4026,6 +4027,7 @@ window.__ModuleLoader__.load({
 				fontSize,
 				fontWeight: 600,
 				fill: CODE_TEXT_COLOR,
+				stroke: "none",
 				dominantBaseline: "central",
 				children: code
 			})] });
@@ -5498,9 +5500,15 @@ window.__ModuleLoader__.load({
 		*/
 		function figureSvg(layer, lit = []) {
 			if (layer.kind === "raster") return `<image x="0" y="0" width="${layer.width}" height="${layer.height}" href="${layer.dataUrl}"/>`;
-			const viewBox = layer.viewBox === void 0 ? "" : ` viewBox="${layer.viewBox}"`;
-			const inner = lightMarkup(layer.markup, lit).replace(/^<\?xml[^>]*\?>\s*/u, "").replace(/^<svg[^>]*>/iu, "").replace(/<\/svg>\s*$/iu, "");
-			return `<svg x="0" y="0" width="${layer.width}" height="${layer.height}"${viewBox} preserveAspectRatio="xMidYMid meet">${inner}</svg>`;
+			const litMarkup = lightMarkup(layer.markup, lit);
+			const root = new DOMParser().parseFromString(litMarkup, "image/svg+xml").documentElement;
+			root.setAttribute("x", "0");
+			root.setAttribute("y", "0");
+			root.setAttribute("width", String(layer.width));
+			root.setAttribute("height", String(layer.height));
+			if (layer.viewBox !== void 0) root.setAttribute("viewBox", layer.viewBox);
+			root.setAttribute("preserveAspectRatio", "xMidYMid meet");
+			return new XMLSerializer().serializeToString(root);
 		}
 		/**
 		* Encode bytes as a `data:` URL.
@@ -9456,6 +9464,46 @@ button.da-card:hover .da-card-go{background:var(--da-accent-soft,rgba(23,109,242
 				]
 			});
 		}
+		/** Put one more copy beside the existing sheet. */
+		function CopyIcon() {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+				className: "da-ico",
+				viewBox: "0 0 24 24",
+				"aria-hidden": "true",
+				focusable: "false",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+						x: "8",
+						y: "8",
+						width: "11.5",
+						height: "11.5",
+						rx: "2.2"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M16 8V6.5a2.2 2.2 0 0 0-2.2-2.2H6.7a2.2 2.2 0 0 0-2.2 2.2v7.1A2.2 2.2 0 0 0 6.7 15.8H8" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M13.75 11.3v5M11.25 13.8h5" })
+				]
+			});
+		}
+		/** Save a file out of the editor. */
+		function DownloadIcon() {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+				className: "da-ico",
+				viewBox: "0 0 24 24",
+				"aria-hidden": "true",
+				focusable: "false",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 3.5v11M7.8 10.5 12 14.7l4.2-4.2" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M4.5 16.5v2a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2v-2" })]
+			});
+		}
+		/** Dismiss the editor without suggesting that the draft should be saved. */
+		function CloseIcon() {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				className: "da-ico",
+				viewBox: "0 0 24 24",
+				"aria-hidden": "true",
+				focusable: "false",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M6.5 6.5l11 11M17.5 6.5l-11 11" })
+			});
+		}
 		/** A step back, as the usual curved arrow. */
 		function UndoIcon() {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
@@ -9539,7 +9587,7 @@ button.da-card:hover .da-card-go{background:var(--da-accent-soft,rgba(23,109,242
 		*/
 		const travelHeight = (fraction) => `calc(var(--da-track-inset) + var(--da-knob-size) / 2 + (100% - 2 * var(--da-track-inset) - var(--da-knob-size)) * ${fraction})`;
 		/** Tools in toolbar order. */
-		const TOOLS = [
+		const TOOLS$1 = [
 			{
 				tool: "select",
 				label: "toolSelect"
@@ -15079,7 +15127,7 @@ button.da-card:hover .da-card-go{background:var(--da-accent-soft,rgba(23,109,242
 				stripRef: paletteRef,
 				style: paletteStyle,
 				handle: paletteHandle,
-				tools: isVector || isHtml ? TOOLS : TOOLS.filter((entry) => !ELEMENT_TOOLS.has(entry.tool)),
+				tools: isVector || isHtml ? TOOLS$1 : TOOLS$1.filter((entry) => !ELEMENT_TOOLS.has(entry.tool)),
 				tool,
 				elementGuide: tool === "element" ? {
 					label: pickLevel === void 0 ? `${t("toolElementMode")}, ${t("toolElementHint")}, ${t("toolElementKeys")}` : `${t("toolElementMode")}, ${t("toolElementDepth", {
@@ -17278,6 +17326,1057 @@ button.da-card:hover .da-card-go{background:var(--da-accent-soft,rgba(23,109,242
 			});
 		}
 		//#endregion
+		//#region src/client/attachment-annotator/model.ts
+		/** One explicitly opened image at a time; retained across sidebar remounts. */
+		function createAttachmentStore() {
+			let job = null;
+			const listeners = /* @__PURE__ */ new Set();
+			const publish = () => {
+				for (const listener of listeners) listener();
+			};
+			return {
+				getSnapshot: () => job,
+				subscribe(listener) {
+					listeners.add(listener);
+					return () => {
+						listeners.delete(listener);
+					};
+				},
+				/** Refuse to overwrite an unfinished image, including one in another Session. */
+				open(sessionId, source) {
+					if (job !== null) return job.sessionId === sessionId && job.source.id === source.id;
+					job = {
+						sessionId,
+						source,
+						marks: [],
+						added: null
+					};
+					publish();
+					return true;
+				},
+				change(source, marks) {
+					if (job === null || job.source !== source || job.marks === marks) return;
+					job = {
+						...job,
+						marks
+					};
+					publish();
+				},
+				rememberCopy(source, marks, id) {
+					if (job === null || job.source !== source) return;
+					job = {
+						...job,
+						added: {
+							marks,
+							id
+						}
+					};
+					publish();
+				},
+				clear() {
+					job = null;
+					publish();
+				},
+				dispose() {
+					job = null;
+					listeners.clear();
+				}
+			};
+		}
+		/** Submission phases never accept a result; an attachment sent or removed is never resurrected. */
+		function canAttach(job, sessionId, input) {
+			return sessionId === job.sessionId && input.attachmentIds.includes(job.source.id) && (input.phase === "plain" || input.phase === "claimed");
+		}
+		/**
+		* The text that keeps each numbered comment searchable after the flattened image
+		* is staged. The image and the list carry the same ordinals, so the model can
+		* connect a sentence to the mark it describes without relying on OCR.
+		*/
+		function attachmentMessage(fileName, marks) {
+			const counted = /* @__PURE__ */ new Map();
+			const lines = marks.map((mark) => {
+				const ordinal = (counted.get(mark.kind) ?? 0) + 1;
+				counted.set(mark.kind, ordinal);
+				return describeMark(mark, ordinal, "zh");
+			});
+			return [
+				`【附图批注】已附上「${fileName.trim() || "图片"}」的标注副本，共 ${marks.length} 处。请按编号逐条处理：`,
+				...lines,
+				"",
+				"逐条修改原图的生成源。"
+			].join("\n");
+		}
+		/** Stage one copy and its numbered comments without replacing the original or sending. */
+		function attachCopy(job, sessionId, input, conversation, actions, file) {
+			if (!canAttach(job, sessionId, input)) throw new Error("原附件已移除、已发送，或输入框正在发送。请下载批注副本。");
+			if (!conversation.resolveDraftAttachments([job.source.id]).some((draft) => draft.id === job.source.id && draft.kind === "image" && "file" in draft && draft.file === job.source.file)) throw new Error("原附件已失效，请下载批注副本。");
+			const ids = conversation.createDrafts(sessionId, [file], false).map((draft) => draft.id);
+			let attached = false;
+			try {
+				if (ids.length !== 1 || !actions.addAttachments(ids)) throw new Error("输入框未接受副本；原附件保持不变。");
+				attached = true;
+				const message = attachmentMessage(job.source.file.name, job.marks);
+				actions.setDraft(input.draft.trim() === "" ? message : `${input.draft}\n\n${message}`);
+				return ids[0];
+			} catch (error) {
+				if (attached) try {
+					actions.setDraft(input.draft);
+				} catch {}
+				for (const id of ids) conversation.releaseDraftAttachment(id);
+				throw error;
+			}
+		}
+		/** Older hosts can keep all existing Figmark features without crashing this optional entry. */
+		function attachmentConversation(value) {
+			if (typeof value !== "object" || value === null) return void 0;
+			const candidate = value;
+			return typeof candidate.resolveDraftAttachments === "function" && typeof candidate.createDrafts === "function" && typeof candidate.releaseDraftAttachment === "function" ? candidate : void 0;
+		}
+		//#endregion
+		//#region src/client/attachment-annotator/export.ts
+		/** Plain XML text; comments must never become SVG markup. */
+		function escapeText(value) {
+			return value.replace(/&/gu, "&amp;").replace(/</gu, "&lt;").replace(/>/gu, "&gt;");
+		}
+		/** Build one self-contained SVG with a readable legend below the original image. */
+		function attachmentSvg(dataUrl, size, marks) {
+			const layer = {
+				kind: "raster",
+				dataUrl,
+				...size
+			};
+			const paper = reviewSize(layer, marks);
+			const numbers = markOrdinals(marks);
+			const font = Math.max(14, Math.min(32, paper.width / 45));
+			const width = Math.max(paper.width, 320);
+			const columns = Math.max(10, Math.floor((width - 32) / font));
+			const lines = marks.flatMap((mark) => {
+				if (mark.detail === void 0 || mark.detail.trim() === "") return [];
+				return `${mark.kind === "point" ? "Pin" : mark.kind} ${numbers.get(mark.id)} · ${mark.detail}`.split(/\r?\n/u).flatMap((line) => {
+					const chars = Array.from(line);
+					const wrapped = [];
+					for (let at = 0; at < chars.length; at += columns) wrapped.push(chars.slice(at, at + columns).join(""));
+					return wrapped;
+				});
+			});
+			const height = paper.height + (lines.length === 0 ? 0 : 32 + lines.length * font * 1.5);
+			return {
+				svg: `<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}"><rect width="100%" height="100%" fill="white"/>${composeReviewSvg(layer, marks)}${lines.map((line, at) => `<text x="16" y="${paper.height + 24 + at * font * 1.5}" font-size="${font}" fill="#222" font-family="sans-serif">${escapeText(line)}</text>`).join("")}</svg>`,
+				width,
+				height,
+				scale: Math.min(1, 8192 / width, 8192 / height, Math.sqrt(16e6 / (width * height)))
+			};
+		}
+		/** Read only when exporting; the host's preview URL remains owned by the host. */
+		async function exportAttachment(file, size, marks) {
+			const image = attachmentSvg(await new Promise((resolve, reject) => {
+				const reader = new FileReader();
+				reader.onload = () => {
+					resolve(reader.result);
+				};
+				reader.onerror = () => {
+					reject(/* @__PURE__ */ new Error("无法读取原图，请重试。"));
+				};
+				reader.readAsDataURL(file);
+			}), size, marks);
+			const blob = await rasterizePng(image.svg, image.width, image.height, image.scale);
+			return new File([blob], `${file.name.replace(/\.[^.]*$/u, "") || "image"}.annotated.png`, { type: "image/png" });
+		}
+		/** Download is explicit and does not involve any Session. */
+		function downloadAttachment(file) {
+			const url = URL.createObjectURL(file);
+			const link = document.createElement("a");
+			link.href = url;
+			link.download = file.name;
+			link.click();
+			setTimeout(() => {
+				URL.revokeObjectURL(url);
+			}, 1e3);
+		}
+		//#endregion
+		//#region src/client/attachment-annotator/styles.ts
+		/** Styles for the composer-thumbnail annotation overlay. */
+		const ATTACHMENT_CSS = `
+.da-attachment-anchor{display:block;width:0;height:0;overflow:hidden;pointer-events:none}
+.da-attachment{
+  --da-accent:#e03131;
+  --da-blue:#176df2;
+  --da-ink:#242529;
+  --da-muted:#74777f;
+  --da-faint:#9699a1;
+  --da-line:rgba(36,37,41,.11);
+  --da-paper:#fff;
+  --da-rail:#2b2c30;
+  position:fixed;
+  inset:0;
+  z-index:2147483000;
+  color:var(--da-ink);
+  font-family:var(--dsw-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
+  font-size:13px;
+  outline:none;
+}
+.da-attachment,.da-attachment *{box-sizing:border-box}
+.da-attachment button,.da-attachment textarea,.da-attachment input{font:inherit}
+.da-attachment button{cursor:pointer}
+.da-attachment button:focus-visible,.da-attachment textarea:focus-visible,.da-attachment input:focus-visible{outline:2px solid #6ea2ff;outline-offset:2px}
+.da-attachment button[aria-disabled=true]{opacity:.38;cursor:default}
+.da-attachment-backdrop{
+  position:absolute;
+  inset:0;
+  display:grid;
+  place-items:center;
+  padding:24px;
+  background:rgba(18,19,22,.58);
+  backdrop-filter:blur(7px);
+  animation:da-attachment-fade .18s ease-out both;
+}
+.da-attachment-dialog{
+  position:relative;
+  isolation:isolate;
+  display:grid;
+  grid-template-rows:minmax(0,1fr) auto;
+  width:min(1240px,calc(100vw - 32px));
+  height:min(860px,calc(100vh - 32px));
+  min-width:520px;
+  min-height:420px;
+  overflow:visible;
+  background:transparent;
+  animation:da-attachment-rise .22s cubic-bezier(.22,1,.36,1) both;
+}
+.da-attachment svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
+.da-attachment-stage{
+  position:relative;
+  display:flex;
+  min-width:0;
+  min-height:0;
+  overflow:auto;
+  padding:34px 100px 30px 34px;
+  background:transparent;
+  scrollbar-width:thin;
+  overscroll-behavior:contain;
+}
+.da-attachment-canvas{
+  position:relative;
+  flex:0 0 auto;
+  margin:auto;
+}
+.da-attachment-paper{
+  position:relative;
+  transform-origin:top left;
+  overflow:visible;
+  background:transparent;
+}
+.da-attachment-paper[data-busy=true]{cursor:progress}
+.da-attachment-paper>img{position:absolute;inset:0;display:block;width:100%;height:100%;border-radius:inherit;pointer-events:none;user-select:none}
+.da-attachment-paper>.da-overlay{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;touch-action:none}
+.da-attachment-paper>.da-overlay[data-tool=select] [data-da-mark]{cursor:move}
+.da-attachment-rail{
+  position:absolute;
+  z-index:20;
+  top:50%;
+  right:16px;
+  display:flex;
+  flex-direction:column;
+  align-items:center;
+  gap:3px;
+  width:48px;
+  max-height:calc(100% - 34px);
+  overflow-y:auto;
+  padding:7px 6px;
+  transform:translateY(-50%);
+  border:1px solid rgba(255,255,255,.09);
+  border-radius:17px;
+  background:var(--da-rail);
+  color:#fff;
+  box-shadow:0 12px 30px rgba(18,19,23,.3),inset 0 1px 0 rgba(255,255,255,.08);
+  scrollbar-width:none;
+}
+.da-attachment-rail::-webkit-scrollbar{display:none}
+.da-attachment-close svg{width:16px;height:16px}
+.da-attachment-tool{
+  display:flex;
+  align-items:center;
+  justify-content:center;
+  width:35px;
+  height:35px;
+  flex:0 0 auto;
+  padding:0;
+  border:0;
+  border-radius:10px;
+  background:transparent;
+  color:rgba(255,255,255,.72);
+  font-size:18px;
+  line-height:1;
+}
+.da-attachment-tool:hover{background:rgba(255,255,255,.1);color:#fff}
+.da-attachment-tool[aria-pressed=true]{background:rgba(255,255,255,.19);color:#fff}
+.da-attachment-tool[aria-disabled=true]:hover{background:transparent;color:rgba(255,255,255,.72)}
+.da-attachment-tool svg{width:17px;height:17px}
+.da-attachment-separator{width:22px;height:1px;flex:0 0 auto;margin:3px 0;background:rgba(255,255,255,.15)}
+.da-attachment-color{
+  position:relative;
+  display:flex;
+  align-items:center;
+  justify-content:center;
+  width:35px;
+  height:35px;
+  flex:0 0 auto;
+  border-radius:10px;
+  cursor:pointer;
+}
+.da-attachment-color:hover{background:rgba(255,255,255,.1)}
+.da-attachment-color::after{content:"";position:absolute;inset:9px;border:2px solid #fff;border-radius:50%;background:var(--da-accent);box-shadow:0 0 0 1px rgba(0,0,0,.15)}
+.da-attachment-color input{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;opacity:0;cursor:pointer}
+.da-attachment-zoom{
+  display:block;
+  min-width:34px;
+  padding:2px 0 3px;
+  color:rgba(255,255,255,.55);
+  font-size:8.5px;
+  font-variant-numeric:tabular-nums;
+  line-height:1;
+  text-align:center;
+}
+.da-attachment-footer{
+  display:flex;
+  flex-direction:column;
+  align-items:center;
+  gap:6px;
+  align-self:center;
+  width:auto;
+  margin:0 auto 14px;
+  padding:0;
+}
+.da-attachment-status{
+  display:flex;
+  flex-direction:column;
+  align-items:center;
+  gap:3px;
+  max-width:min(560px,calc(100vw - 56px));
+  padding:6px 10px;
+  border-radius:9px;
+  background:rgba(23,24,27,.82);
+  color:rgba(255,255,255,.72);
+  font-size:10px;
+  line-height:1.4;
+  text-align:center;
+  backdrop-filter:blur(12px);
+}
+.da-attachment-warning{color:#9a6418}
+.da-attachment-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}
+.da-attachment-action{
+  display:inline-flex;
+  align-items:center;
+  justify-content:center;
+  gap:7px;
+  height:31px;
+  padding:0 11px;
+  border:.5px solid rgba(255,255,255,.28);
+  border-radius:999px;
+  background:rgba(251,251,252,.92);
+  color:#4f5157;
+  font-size:10.5px;
+  font-weight:580;
+  line-height:1;
+  white-space:nowrap;
+  box-shadow:0 5px 18px rgba(5,6,9,.18);
+}
+.da-attachment-action:hover{background:#eeeef0;color:var(--da-ink)}
+.da-attachment-action svg{width:14px;height:14px}
+.da-attachment-action-primary{border-color:#26272b;background:#26272b;color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.14)}
+.da-attachment-action-primary:hover{background:#3a3b40;color:#fff}
+.da-attachment-comment-pill{
+  position:absolute;
+  z-index:15;
+  width:286px;
+  max-width:calc(100% - 16px);
+  padding:3px;
+  border:.5px solid var(--da-line);
+  border-radius:20px;
+  background:color-mix(in srgb,var(--da-paper) 94%,transparent);
+  color:var(--da-ink);
+  box-shadow:0 5px 18px rgba(20,40,80,.14),0 0 0 .5px rgba(20,40,80,.06);
+  backdrop-filter:blur(10px);
+}
+.da-attachment-comment-pill textarea{
+  width:100%;
+  min-height:0;
+  max-height:min(180px,42vh);
+  resize:none;
+  padding:7px 10px;
+  border:0;
+  outline:0;
+  background:transparent;
+  color:var(--da-ink);
+  font:inherit;
+  font-size:13px;
+  line-height:1.55;
+  field-sizing:content;
+  overflow-y:auto;
+  scrollbar-width:none;
+}
+.da-attachment-comment-pill textarea::-webkit-scrollbar{width:0;height:0}
+.da-attachment-comment-pill textarea::placeholder{color:#a1a4ab}
+.da-attachment .da-attachment-comment-pill textarea:focus-visible{outline:0}
+.da-attachment-confirm{
+  position:absolute;
+  z-index:40;
+  left:50%;
+  bottom:82px;
+  display:flex;
+  align-items:center;
+  justify-content:space-between;
+  gap:20px;
+  width:min(500px,calc(100% - 40px));
+  padding:12px 12px 12px 15px;
+  transform:translateX(-50%);
+  border:1px solid rgba(180,35,24,.2);
+  border-radius:13px;
+  background:rgba(255,252,251,.98);
+  box-shadow:0 14px 38px rgba(50,25,20,.18);
+}
+.da-attachment-confirm>div:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}
+.da-attachment-confirm strong{color:#352f2e;font-size:11.5px;font-weight:650}
+.da-attachment-confirm span{color:#827875;font-size:9.5px;line-height:1.35}
+.da-attachment-confirm-actions{display:flex;gap:6px;flex:0 0 auto}
+.da-attachment-confirm button{height:29px;padding:0 10px;border:.5px solid rgba(36,37,41,.13);border-radius:8px;background:#fff;color:#666970;font-size:10.5px}
+.da-attachment-confirm button:hover{background:#f1f1f2}
+.da-attachment-confirm .da-attachment-danger{border-color:rgba(180,35,24,.22);color:#a1281f}
+.da-attachment-confirm .da-attachment-danger:hover{background:#fae9e7}
+@keyframes da-attachment-fade{from{opacity:0}to{opacity:1}}
+@keyframes da-attachment-rise{from{opacity:0;transform:translateY(8px) scale(.992)}to{opacity:1;transform:none}}
+@media(max-width:760px){
+  .da-attachment-backdrop{padding:0}
+  .da-attachment-dialog{width:100vw;height:100vh;min-width:0;min-height:0}
+  .da-attachment-stage{padding:16px 70px 18px 16px}
+  .da-attachment-rail{right:9px;width:46px}
+  .da-attachment-footer{gap:6px;margin-bottom:10px}
+  .da-attachment-status{max-width:calc(100vw - 32px)}
+  .da-attachment-actions{justify-content:flex-end}
+  .da-attachment-action{flex:0 0 auto}
+  .da-attachment-comment-pill{width:248px}
+}
+@media(pointer:coarse){
+  .da-attachment-tool,.da-attachment-color{width:40px;height:40px}
+  .da-attachment-rail{width:53px}
+}
+@media(prefers-reduced-motion:reduce){
+  .da-attachment-backdrop,.da-attachment-dialog{animation:none}
+}
+`;
+		//#endregion
+		//#region src/client/attachment-annotator/editor.tsx
+		/** A comp-access annotation overlay opened from a composer image thumbnail. */
+		const TOOL_LABELS = {
+			select: "选择",
+			pen: "画笔",
+			arrow: "箭头",
+			rect: "矩形",
+			ellipse: "椭圆",
+			point: "Pin 评论"
+		};
+		const TOOLS = [
+			"select",
+			"pen",
+			"arrow",
+			"rect",
+			"ellipse",
+			"point"
+		].map((tool) => [tool, TOOL_LABELS[tool]]);
+		const ZOOMS = [
+			1,
+			1.5,
+			2,
+			4
+		];
+		const ZOOM_IN = {
+			1: 1.5,
+			1.5: 2,
+			2: 4,
+			4: 4
+		};
+		const ZOOM_OUT = {
+			1: 1,
+			1.5: 1,
+			2: 1.5,
+			4: 2
+		};
+		function PointerIcon() {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				viewBox: "0 0 24 24",
+				"aria-hidden": "true",
+				focusable: "false",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: POINTER_PATH })
+			});
+		}
+		function ToolGlyph({ tool }) {
+			return tool === "select" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PointerIcon, {}) : ToolIcon(tool);
+		}
+		function imagesOf(conversation, attachmentIds) {
+			if (conversation === void 0) return [];
+			return conversation.resolveDraftAttachments(attachmentIds).filter((draft) => draft.kind === "image" && "file" in draft);
+		}
+		/** Where a mark's adjacent comment should be anchored, in figure pixels. */
+		function attachmentFocusPoint(mark) {
+			if (mark.kind === "arrow") return mark.points[mark.points.length - 1] ?? [0, 0];
+			if (mark.kind === "rect" || mark.kind === "ellipse") {
+				const first = mark.points[0] ?? [0, 0];
+				const second = mark.points[1] ?? first;
+				return [(first[0] + second[0]) / 2, (first[1] + second[1]) / 2];
+			}
+			if (mark.kind === "pen") {
+				const points = mark.points.length === 0 ? [[0, 0]] : mark.points;
+				const xs = points.map((point) => point[0]);
+				const ys = points.map((point) => point[1]);
+				return [(Math.min(...xs) + Math.max(...xs)) / 2, (Math.min(...ys) + Math.max(...ys)) / 2];
+			}
+			return mark.points[0] ?? [0, 0];
+		}
+		function canEditAttachment(job, sessionId, input) {
+			return canAttach(job, sessionId, input);
+		}
+		/** Mounted once per Session. It has no visible row until a draft image is clicked. */
+		function AttachmentOverlay(props) {
+			const { store, sessionId, conversation, useInput } = props;
+			const draft = useInput((input) => input.draft);
+			const attachmentIds = useInput((input) => input.attachmentIds);
+			const input = {
+				draft,
+				attachmentIds,
+				phase: useInput((input) => input.phase)
+			};
+			const job = (0, react.useSyncExternalStore)(store.subscribe, store.getSnapshot);
+			const images = imagesOf(conversation, attachmentIds);
+			const imagesRef = (0, react.useRef)(images);
+			const pendingThumbnail = (0, react.useRef)(null);
+			const anchor = (0, react.useRef)(null);
+			imagesRef.current = images;
+			(0, react.useEffect)(() => {
+				const card = anchor.current?.closest("[data-composer-card]");
+				if (card === null || card === void 0) return;
+				const openImage = (event) => {
+					if (!(event instanceof MouseEvent)) return;
+					if (event.button !== 0) return;
+					const target = event.target;
+					if (!(target instanceof Element)) return;
+					const imageNode = target instanceof HTMLImageElement ? target : target.closest("button")?.querySelector("img") ?? null;
+					if (imageNode === null) return;
+					const previewUrl = imageNode.getAttribute("src");
+					if (previewUrl === null) return;
+					const image = imagesRef.current.find((draft) => draft.previewUrl === previewUrl);
+					if (image === void 0 && imagesRef.current.length > 0) return;
+					event.preventDefault();
+					event.stopPropagation();
+					if (image !== void 0) {
+						store.open(sessionId, image);
+						return;
+					}
+					pendingThumbnail.current = previewUrl;
+				};
+				card.addEventListener("click", openImage, true);
+				return () => {
+					card.removeEventListener("click", openImage, true);
+				};
+			}, [sessionId, store]);
+			(0, react.useEffect)(() => {
+				const previewUrl = pendingThumbnail.current;
+				if (previewUrl === null) return;
+				const image = images.find((draft) => draft.previewUrl === previewUrl);
+				if (image === void 0) return;
+				pendingThumbnail.current = null;
+				store.open(sessionId, image);
+			}, [
+				images,
+				sessionId,
+				store
+			]);
+			(0, react.useEffect)(() => {
+				if (job === null) return;
+				if (job.sessionId !== sessionId || !canEditAttachment(job, sessionId, input)) store.clear();
+			}, [
+				input.attachmentIds,
+				input.phase,
+				job,
+				sessionId,
+				store
+			]);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				ref: anchor,
+				className: "da-attachment-anchor",
+				"aria-hidden": "true"
+			}), job !== null && job.sessionId === sessionId ? (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AttachmentEditor, {
+				...props,
+				job
+			}, `${job.sessionId}/${job.source.id}`), document.body) : null] });
+		}
+		/** The whole editor is one modal surface; the host's own composer remains intact. */
+		function AttachmentEditor(props) {
+			const { store, sessionId, conversation, useInput, inputActions, job } = props;
+			const input = {
+				draft: useInput((input) => input.draft),
+				attachmentIds: useInput((input) => input.attachmentIds),
+				phase: useInput((input) => input.phase)
+			};
+			const history = useAnnotationHistory(job.marks);
+			const latest = (0, react.useRef)({
+				input,
+				sessionId
+			});
+			latest.current = {
+				input,
+				sessionId
+			};
+			const mounted = (0, react.useRef)(true);
+			const root = (0, react.useRef)(null);
+			const paper = (0, react.useRef)(null);
+			const viewport = (0, react.useRef)(null);
+			const canvasInput = (0, react.useRef)(null);
+			const busyRef = (0, react.useRef)(false);
+			const [previewUrl, setPreviewUrl] = (0, react.useState)();
+			const [tool, setTool] = (0, react.useState)("select");
+			const [color, setColor] = (0, react.useState)("#e03131");
+			const [selectedId, setSelectedId] = (0, react.useState)(null);
+			const [size, setSize] = (0, react.useState)(null);
+			const [zoom, setZoom] = (0, react.useState)(1);
+			const [viewportSize, setViewportSize] = (0, react.useState)({
+				width: 760,
+				height: 520
+			});
+			const [notice, setNotice] = (0, react.useState)("");
+			const [busy, setBusy] = (0, react.useState)(false);
+			const [confirmClose, setConfirmClose] = (0, react.useState)(false);
+			(0, react.useEffect)(() => {
+				mounted.current = true;
+				root.current?.focus();
+				return () => {
+					mounted.current = false;
+				};
+			}, []);
+			(0, react.useEffect)(() => {
+				const url = URL.createObjectURL(job.source.file);
+				setPreviewUrl(url);
+				return () => {
+					URL.revokeObjectURL(url);
+				};
+			}, [job.source.file]);
+			(0, react.useEffect)(() => {
+				store.change(job.source, history.marks);
+			}, [
+				history.marks,
+				job.source,
+				store
+			]);
+			(0, react.useEffect)(() => {
+				const node = viewport.current;
+				/* v8 ignore next -- the effect runs after the stage ref has attached. */
+				if (node === null) return;
+				const measure = () => {
+					setViewportSize({
+						width: Math.max(280, node.clientWidth),
+						height: Math.max(240, node.clientHeight)
+					});
+				};
+				measure();
+				const observer = new ResizeObserver(measure);
+				observer.observe(node);
+				return () => {
+					observer.disconnect();
+				};
+			}, []);
+			const scale = (size === null ? 1 : Math.min(1, Math.max(.1, (viewportSize.width - 112) / size.width), Math.max(.1, (viewportSize.height - 56) / size.height))) * zoom;
+			const selected = history.marks.find((mark) => mark.id === selectedId) ?? null;
+			const ready = canEditAttachment(job, sessionId, input) && conversation !== void 0;
+			const percentage = Math.round(zoom * 100);
+			const select = (id) => {
+				setSelectedId(id);
+			};
+			const remove = (id) => {
+				history.commit(removedMarks(history.marks, id));
+				setSelectedId(null);
+			};
+			const requestClose = () => {
+				canvasInput.current?.cancel();
+				if (history.marks.length === 0) store.clear();
+				else setConfirmClose(true);
+			};
+			const finish = async (download) => {
+				const liveConversation = conversation;
+				if (busyRef.current || size === null || history.marks.length === 0) return;
+				if (!download && (!ready || liveConversation === void 0)) return;
+				canvasInput.current?.cancel();
+				busyRef.current = true;
+				setBusy(true);
+				setNotice(download ? "正在生成 PNG…" : "正在生成标注副本…");
+				try {
+					const file = await exportAttachment(job.source.file, size, history.marks);
+					if (!mounted.current || store.getSnapshot()?.source !== job.source) return;
+					const editor = root.current;
+					if (editor !== null && typeof editor.checkVisibility === "function" && !editor.checkVisibility()) throw new Error("标注浮层已关闭，请重新打开后重试");
+					if (download) {
+						downloadAttachment(file);
+						setNotice("已下载 PNG；原图和输入框未改变。");
+						return;
+					}
+					if (store.getSnapshot()?.marks !== history.marks) throw new Error("生成过程中批注已更改，请重新生成");
+					/* v8 ignore next -- the callable form above already refused an absent Host. */
+					if (liveConversation === void 0) return;
+					const live = latest.current;
+					const id = attachCopy(job, live.sessionId, live.input, liveConversation, inputActions, file);
+					store.rememberCopy(job.source, history.marks, id);
+					store.clear();
+				} catch (error) {
+					if (mounted.current && store.getSnapshot() !== null) setNotice(`生成或加入副本失败：${String(error)}。批注已保留，可重试或下载。`);
+				} finally {
+					busyRef.current = false;
+					if (mounted.current && store.getSnapshot() !== null) setBusy(false);
+				}
+			};
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				ref: root,
+				className: "da-attachment",
+				tabIndex: -1,
+				role: "dialog",
+				"aria-modal": "true",
+				"aria-label": "附图标注编辑器",
+				onKeyDown: (event) => {
+					event.stopPropagation();
+					if (event.target instanceof HTMLTextAreaElement || event.target instanceof HTMLInputElement) return;
+					if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "z") {
+						event.preventDefault();
+						if (event.shiftKey) history.redo();
+						else history.undo();
+					} else if (event.key === "Escape") {
+						canvasInput.current?.cancel();
+						setSelectedId(null);
+						requestClose();
+					} else if ((event.key === "Delete" || event.key === "Backspace") && selectedId !== null) {
+						event.preventDefault();
+						remove(selectedId);
+					}
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: ATTACHMENT_CSS }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "da-attachment-backdrop",
+					onPointerDown: (event) => {
+						if (event.target === event.currentTarget) requestClose();
+					},
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "da-attachment-dialog",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "da-attachment-stage",
+								ref: viewport,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "da-attachment-canvas",
+									style: size === null ? {} : {
+										width: size.width * scale,
+										height: size.height * scale
+									},
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										ref: paper,
+										className: "da-attachment-paper",
+										"data-busy": busy || void 0,
+										style: size === null ? {} : {
+											width: size.width,
+											height: size.height,
+											transform: `scale(${scale})`
+										},
+										onPointerDownCapture: (event) => {
+											if (!busyRef.current) return;
+											event.preventDefault();
+											event.stopPropagation();
+										},
+										children: [
+											previewUrl !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+												src: previewUrl,
+												alt: "待标注原图",
+												draggable: false,
+												onLoad: (event) => {
+													const image = event.currentTarget;
+													if (image.naturalWidth === 0 || image.naturalHeight === 0) {
+														setSize(null);
+														setNotice("图片尺寸无效。");
+														return;
+													}
+													setSize({
+														width: image.naturalWidth,
+														height: image.naturalHeight
+													});
+												},
+												onError: () => {
+													setSize(null);
+													setNotice("原图加载失败；请重新添加图片后重试。");
+												}
+											}),
+											size !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Canvas, {
+												width: size.width,
+												height: size.height,
+												marks: history.marks,
+												tool,
+												color,
+												containerRef: paper,
+												inputRef: canvasInput,
+												anchoring: false,
+												scale,
+												selectedId,
+												onSelect: select,
+												onAdd: (mark) => {
+													if (history.marks.length >= 100) {
+														setNotice("单张图片最多 100 条批注。");
+														return;
+													}
+													history.commit([...history.marks, mark]);
+												},
+												onMove: (id, points, anchor) => {
+													const next = movedMarks(history.marks, id, points, anchor);
+													if (next !== null) history.commit(next);
+												},
+												onUpdate: (id, patch) => {
+													history.commit(patchedMarks(history.marks, id, patch));
+												},
+												onRemove: remove,
+												onEdit: (id) => {
+													setSelectedId(id);
+													setTool("select");
+												},
+												onDrawn: (id) => {
+													setSelectedId(id);
+													if (tool !== "pen") setTool("select");
+												}
+											}),
+											selected !== null && size !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentPill, {
+												mark: selected,
+												size,
+												scale,
+												onChange: (value) => {
+													history.amend((marks) => detailedMarks(marks, selected.id, value));
+												},
+												onClose: () => {
+													setSelectedId(null);
+												}
+											})
+										]
+									})
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "da-attachment-rail",
+									role: "toolbar",
+									"aria-label": "绘图工具",
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											className: "da-attachment-tool da-attachment-close",
+											"aria-label": "关闭附图标注",
+											title: "关闭",
+											onClick: requestClose,
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CloseIcon, {})
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "da-attachment-separator" }),
+										TOOLS.map(([value, label]) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											className: "da-attachment-tool",
+											"aria-label": label,
+											title: label,
+											"aria-pressed": tool === value,
+											onClick: () => {
+												canvasInput.current?.cancel();
+												setTool(value);
+											},
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolGlyph, { tool: value })
+										}, value)),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "da-attachment-separator" }),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+											className: "da-attachment-color",
+											title: "批注颜色",
+											style: { "--da-accent": color },
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+												type: "color",
+												"aria-label": "批注颜色",
+												value: color,
+												onChange: (event) => {
+													setColor(event.target.value);
+													if (selectedId !== null) history.commit(patchedMarks(history.marks, selectedId, { color: event.target.value }));
+												}
+											})
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											className: "da-attachment-tool",
+											"aria-label": "撤销",
+											title: "撤销",
+											"aria-disabled": history.depth.past === 0,
+											onClick: history.undo,
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UndoIcon, {})
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											className: "da-attachment-tool",
+											"aria-label": "重做",
+											title: "重做",
+											"aria-disabled": history.depth.future === 0,
+											onClick: history.redo,
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RedoIcon, {})
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "da-attachment-separator" }),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											className: "da-attachment-tool",
+											"aria-label": "缩小",
+											title: "缩小",
+											"aria-disabled": zoom === ZOOMS[0],
+											onClick: () => {
+												setZoom(ZOOM_OUT[zoom]);
+											},
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+												"aria-hidden": "true",
+												children: "−"
+											})
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+											className: "da-attachment-zoom",
+											"aria-label": "当前缩放",
+											children: [percentage, "%"]
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											className: "da-attachment-tool",
+											"aria-label": "放大",
+											title: "放大",
+											"aria-disabled": zoom === ZOOMS[ZOOMS.length - 1],
+											onClick: () => {
+												setZoom(ZOOM_IN[zoom]);
+											},
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+												"aria-hidden": "true",
+												children: "+"
+											})
+										})
+									]
+								})]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("footer", {
+								className: "da-attachment-footer",
+								children: [(notice !== "" || !ready) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "da-attachment-status",
+									children: [notice !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										role: "status",
+										"aria-live": "polite",
+										children: notice
+									}), !ready && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: "da-attachment-warning",
+										children: "原附件已移除、已发送，或输入框正在发送。仍可下载 PNG。"
+									})]
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "da-attachment-actions",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+										type: "button",
+										className: "da-attachment-action",
+										"aria-disabled": busy || size === null || history.marks.length === 0,
+										onClick: () => {
+											finish(true);
+										},
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DownloadIcon, {}), "下载 PNG"]
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+										type: "button",
+										className: "da-attachment-action da-attachment-action-primary",
+										"aria-disabled": busy || size === null || history.marks.length === 0 || !ready,
+										title: "生成标注图片，并把逐条评论写入输入框；原图不变，也不会自动发送",
+										onClick: () => {
+											finish(false);
+										},
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CopyIcon, {}), "加入输入框"]
+									})]
+								})]
+							}),
+							confirmClose && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "da-attachment-confirm",
+								role: "alert",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: "放弃这些本地批注？" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "原图不会改变；未生成的批注会在关闭后清除。" })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "da-attachment-confirm-actions",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										onClick: () => {
+											setConfirmClose(false);
+										},
+										children: "继续编辑"
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: "da-attachment-danger",
+										onClick: () => {
+											store.clear();
+										},
+										children: "放弃批注"
+									})]
+								})]
+							})
+						]
+					})
+				})]
+			});
+		}
+		function CommentPill(props) {
+			const { mark, size, scale } = props;
+			const input = (0, react.useRef)(null);
+			(0, react.useEffect)(() => {
+				input.current?.focus();
+			}, [mark.id]);
+			const [x, y] = attachmentFocusPoint(mark);
+			const right = x > size.width * .62;
+			const below = y < 92;
+			const translateX = right ? "calc(-100% - 14px)" : "14px";
+			const translateY = below ? "14px" : "calc(-100% - 14px)";
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "da-attachment-comment-pill",
+				role: "group",
+				"aria-label": "批注评论",
+				style: {
+					left: `${x}px`,
+					top: `${y}px`,
+					transform: `scale(${1 / scale}) translate(${translateX}, ${translateY})`,
+					transformOrigin: `${right ? "right" : "left"} ${below ? "top" : "bottom"}`
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+					ref: input,
+					"data-mark": mark.id,
+					"aria-label": `批注 ${mark.id} 评论`,
+					placeholder: "说明这里要怎么改…",
+					rows: 1,
+					maxLength: MAX_DETAIL_CHARS,
+					value: mark.detail ?? "",
+					onChange: (event) => {
+						props.onChange(event.target.value);
+					},
+					onKeyDown: (event) => {
+						if (event.key === "Escape") {
+							event.preventDefault();
+							props.onClose();
+						}
+					}
+				})
+			});
+		}
+		//#endregion
+		//#region src/client/attachment-annotator/register.ts
+		const ATTACHMENT_BODY_ID = "dsh-figmark/attachment";
+		/**
+		* One invisible floating seat. It listens only to its Session's native draft
+		* thumbnails, so the shell keeps ownership of uploads, removal and sending.
+		*/
+		function registerAttachmentAnnotator(ctx, slots) {
+			const store = createAttachmentStore();
+			ctx.effect(() => () => {
+				store.dispose();
+			}, "dsh-figmark: attachment draft lifecycle");
+			const injected = (_sessionId) => ({
+				store,
+				conversation: attachmentConversation(ctx.get("conversation"))
+			});
+			ctx.effect(() => slots.inject("conversation.input.overlay", () => slots.register({
+				name: "conversation.input.overlay",
+				id: ATTACHMENT_BODY_ID,
+				order: 80,
+				inject: injected
+			}, AttachmentOverlay)), "dsh-figmark: attachment overlay");
+		}
+		//#endregion
 		//#region src/client/index.tsx
 		/** Plugin name reported to the client module loader. */
 		const name = "dsh-figmark-client";
@@ -17530,6 +18629,7 @@ button.da-card:hover .da-card-go{background:var(--da-accent-soft,rgba(23,109,242
 					localeId: locale.getLocale().locale ?? "zh"
 				})
 			}, PendingCard)), "dsh-figmark: parked annotation");
+			registerAttachmentAnnotator(ctx, slots);
 		}
 		//#endregion
 		exports.BODY_ID = BODY_ID;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-figmark",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "private": false,
   "description": "DSH 插件：在右侧栏预览里对科研配图、SVG、PDF 与本机网页直接圈画批注，标注写进侧车文件并可一键交给智能体改图源",
   "license": "MIT",