dsh-select-quote 0.2.0 → 0.3.0

package/README.md

@@ -19,11 +19,19 @@
 | 项 | 值 |
 |---|---|
 | dsh | `0.1.7-rc.1`（2026-09-24 实测：划词、批注卡片、正文标记、对话记录渲染全通） |
-| profile | web（`dsh web`） |
+| profile | web（`dsh web`）与桌面端（desktop）都可用；桌面端在 0.2.0 及更早版本会楔死渲染进程，本仓库已修复，详见下节 |
 | 运行时 | 只有浏览器半有业务；Node 半仅用于让包被 Loader 挂载 |
 
 实现依赖若干产品内部约定（槽位名、composer DOM、深色主题属性等），升级 dsh 后请先跑 `npm run check`，再照 [`docs/internals.md`](docs/internals.md) 末尾的复核清单人工回归一遍。
 
+### 桌面端（desktop profile）
+
+桌面端是 Electron 外壳 + 同一个 Web 客户端，插件声明的 `dsh.client.platform: "web"` 在桌面端同样加载，槽位与 DOM 契约都在，功能本身可用（实测批注随消息送达模型、模型回指渲染为 chip 均正常）。
+
+> ⚠️ **0.2.0 及更早版本在桌面端会楔死渲染进程**，见 [#1](https://github.com/latte03/dsh-select-quote/issues/1)：App 能启动、界面完整渲染，但整个输入区无法点击，renderer 子进程单核 100% 持续旋转。根因在插件自己的装饰器里——协议头部逐字写出了 `:dsh-annotation{index="N"}`，当文本含有这个字面量而严格正则一条都没匹配上时，装饰器仍然替换了一次内容完全相同的 Text 节点，于是被自己的 `MutationObserver` 反复触发，微任务队列永远排不空，宏任务和定时器再也得不到执行。触发条件是文本内容，与 Electron 或 `dsh-app://` 无关，桌面端只是恰好把那段文本送进了 Text 节点。完整机制与两道防线记录在 [`docs/internals.md`](docs/internals.md) 关键机制 8。
+
+> **现在的状态**：修复已进主干，Windows 桌面端 0.2.0-rc.2 实测重新启用插件后批注正常送达、Turn 正常结束、输入框可点击、没有新的崩溃日志。npm 上可安装的仍是 `0.2.0`，也就是带缺陷的那一版，因此桌面端用户在修复版发布之前请在 `dsh.profile.bundles` 中摘除本插件，或改用浏览器访问同一个端口。[#1](https://github.com/latte03/dsh-select-quote/issues/1) 保持 open，等报告人复验后关闭。
+
 ## 安装
 
 ### 方式一：从 npm 安装（bundle）
@@ -33,7 +41,7 @@ dsh plugin --profile web add dsh-select-quote
 dsh --profile web
 ```
 
-> ⚠️ npm 上目前只有 `0.1.0`，那是旧版「引用块」行为，不含批注卡片、正文标记与模型回指。要用现在这套，请先用方式二，或从仓库目录安装：`dsh plugin --profile web add <本仓库绝对路径>`。
+> npm 上目前最新是 `0.2.0`（2026-09-24 发布）：带批注卡片、正文标记与模型回指，但界面只有简体中文，桌面端还会楔死渲染进程（见兼容性一节）。本仓库的 `0.3.0` 修掉了楔死、加了简体中文 / English / Русский 三语，并把对话记录里的批注卡片改到用户气泡内，**还没发布到 npm**。要用 `0.3.0` 的行为，先按方式二从本地 checkout 加载；发布完成后这一节需要更新。仓库里另有 `0.1.0`，那是旧版「引用块」，不要装错。
 
 ### 方式二：本地 checkout 加载（`--patch`）
 
@@ -53,6 +61,27 @@ dsh web --patch "$PWD/dev.patch.yml"
 4. 正常打字、按 Enter 发送。批注随消息一起交给模型，卡片随之消失
 5. 模型回答里指向某条批注的位置，会显示成可点的 chip
 
+## 语言 / Localization
+
+界面文案支持 **简体中文 / English / Русский**，默认跟随浏览器语言：
+
+| 语言 | 默认值 |
+|---|---|
+| `zh` | 原文案，同时作为缺失键的兜底词典 |
+| `en` | 非中文环境 |
+| `ru` | `ru` / `ru-RU` 等标签 |
+
+想固定语言，在 Web GUI 控制台里设置后刷新页面：
+
+```js
+localStorage.setItem('dsq-locale', 'ru') // 'ru' | 'en' | 'zh'
+localStorage.removeItem('dsq-locale')    // 恢复跟随浏览器
+```
+
+**刻意不翻译的部分**：`> [选中文本]`、`<response-annotations>`、`:dsh-annotation{index="N"}` 这些是模型与解析器约定的传输格式；`# Response annotations:` 那段是给模型的指令正文，不是界面文案。只有面向人的 chrome 走 `t()`。
+
+新增文案：在 `src/client/i18n.ts` 的三份词典里各加一条，再在组件里 `t('key', { ... })` 调用。带 `{count}` 的键可以写成复数形式对象（中文用 `other`，俄语用 `one` / `few` / `many`）。
+
 ## 已知限制
 
 - **待发批注只在内存里**：刷新页面或切换会话后会丢，卡片不持久化（已发送消息里的批注不受影响）。

package/lib/client.js

@@ -642,17 +642,19 @@ const CSS = `
   gap: 6px;
 }
 
-/* Transcript cards — in-flow Chat node (conversation history), stacked. */
+/* Transcript cards — in-flow rows under the user bubble, side by side. */
 .dsq_tCardStack {
   display: flex;
-  flex-direction: column;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: flex-end;
   align-items: stretch;
   gap: 6px;
   margin: 4px 0 8px;
-  /* Match composer summary width; sit on the user-bubble side (right). */
-  width: 20%;
-  min-width: 148px;
-  max-width: 220px;
+  /* Cards lay out horizontally and wrap onto the next row when they run out of
+     width. Each card carries the selected text plus the user's comment, so they
+     stay compact and stay on the user-bubble side (right). */
+  max-width: 100%;
   margin-left: auto;
   margin-right: 0;
 }
@@ -729,6 +731,77 @@ const CSS = `
   white-space: nowrap;
 }
 
+/* Transcript card wrapper: the card itself is a click target that scrolls back
+   to the marked text. Unlike the composer summary (one collapsed row per
+   message) each history card shows its own comment, so the fixed 64px height
+   and the single-line clamps are lifted here. */
+.dsq_tCardButton {
+  appearance: none;
+  display: block;
+  /* Compact cards: several fit in one row before wrapping. */
+  flex: 0 1 auto;
+  width: 230px;
+  max-width: 100%;
+  padding: 0;
+  border: none;
+  background: transparent;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+  border-radius: 14px;
+}
+
+.dsq_tCardButton:focus-visible {
+  outline: 2px solid var(--dsw-static-blue-500, #3b82f6);
+  outline-offset: 2px;
+}
+
+.dsq_tCardButton .dsq_tCard {
+  height: auto;
+  min-height: 0;
+  align-items: flex-start;
+  width: 100%;
+  gap: 8px;
+  padding: 8px;
+  border-radius: 14px;
+}
+
+.dsq_tCardButton .dsq_tCardIcon {
+  width: 22px;
+  height: 22px;
+  border-radius: 8px;
+  font-size: 11px;
+}
+
+.dsq_tCardButton .dsq_tCardTitle {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  white-space: normal;
+  overflow-wrap: anywhere;
+  font-size: 13px;
+  line-height: 18px;
+}
+
+.dsq_tCardButton .dsq_tCardSubtitle {
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  margin-top: 2px;
+  font-size: 12px;
+  line-height: 16px;
+}
+
+/* A comment is the user's own words — give it more presence than the neutral
+   "no comment" placeholder. */
+.dsq_tCardButton .dsq_tCardSubtitle[data-dsq-has-comment='true'] {
+  color: var(--dsw-alias-label-secondary, rgba(0, 0, 0, 0.65));
+}
+
 /* Replacement user bubble (quote block stripped from display). */
 .dsq_userRow {
   display: flex;
@@ -916,6 +989,7 @@ const styles = {
 	commentInput: "dsq_commentInput",
 	commentActions: "dsq_commentActions",
 	tCardStack: "dsq_tCardStack",
+	tCardButton: "dsq_tCardButton",
 	tCard: "dsq_tCard",
 	tCardIcon: "dsq_tCardIcon",
 	tCardBody: "dsq_tCardBody",
@@ -1338,16 +1412,6 @@ function contentBlocksToText(content) {
 		return "";
 	}).join("");
 }
-/**
-* Best-effort plain text from a durable `user/message` event. A surface event
-* carries its blocks directly on `data.content`; `data.message.content` is only
-* a fallback for the older shape.
-*/
-function extractUserText(event) {
-	const data = event?.data;
-	if (!data) return "";
-	return contentBlocksToText(data.content ?? data.message?.content);
-}
 /** Short one-line card title from selected body text. */
 function previewTitle$1(text, max = 48) {
 	const oneLine = text.replace(/\s+/g, " ").trim();
@@ -1526,10 +1590,6 @@ function scanAnnotatedMessage(text) {
 		rest
 	};
 }
-/** Convenience: annotations only. */
-function parseAnnotatedMessage(text) {
-	return scanAnnotatedMessage(text).annotations;
-}
 //#endregion
 //#region src/client/state/annotation-store.ts
 /** Per-session pending selection annotations (composer-side store). */
@@ -1704,7 +1764,220 @@ function LucideIcon({ name, size = 15 }) {
 	});
 }
 //#endregion
+//#region src/client/i18n.ts
+const LOCALES = [
+	"ru",
+	"en",
+	"zh"
+];
+const STORAGE_KEY = "dsq-locale";
+const MESSAGES = {
+	ru: {
+		"common.selectedText": "Выделенный текст",
+		"common.commentPlaceholder": "Добавить необязательный комментарий…",
+		"common.cancel": "Отмена",
+		"common.save": "Сохранить",
+		"toolbar.aria": "Действия с выделенным текстом",
+		"toolbar.commentHint": "Добавить аннотацию…",
+		"toolbar.copy": "Копировать",
+		"toolbar.copyFailed": "Не удалось скопировать",
+		"toolbar.addToTask": "Добавить к задаче",
+		"toolbar.commentDialogAria": "Добавить необязательный комментарий",
+		"toolbar.skipComment": "Без комментария",
+		"toolbar.addComment": "Добавить комментарий",
+		"card.commentSubtitle": "Комментарий · {comment}",
+		"card.ariaIndexed": "Аннотация {index}",
+		"card.ariaPlain": "Аннотация к выделенному тексту",
+		"card.editComment": "Изменить комментарий",
+		"card.remove": "Удалить аннотацию",
+		"summary.hint": "Наведите, чтобы увидеть аннотации",
+		"summary.dialogAria": "Детали аннотаций: {count}",
+		"summary.edit": "Изменить аннотацию {index}",
+		"summary.remove": "Удалить аннотацию {index}",
+		"summary.userComment": "Комментарий пользователя",
+		"summary.noComment": "Комментарий не добавлен",
+		"summary.aria": {
+			one: "{count} аннотация. Наведите, чтобы увидеть детали.",
+			few: "{count} аннотации. Наведите, чтобы увидеть детали.",
+			many: "{count} аннотаций. Наведите, чтобы увидеть детали."
+		},
+		"summary.title": {
+			one: "{count} аннотация",
+			few: "{count} аннотации",
+			many: "{count} аннотаций"
+		},
+		"summary.removeAll": "Удалить все аннотации",
+		"chip.annotation": "Аннотация {index}"
+	},
+	en: {
+		"common.selectedText": "Selected text",
+		"common.commentPlaceholder": "Add an optional comment…",
+		"common.cancel": "Cancel",
+		"common.save": "Save",
+		"toolbar.aria": "Selection actions",
+		"toolbar.commentHint": "Add annotation…",
+		"toolbar.copy": "Copy",
+		"toolbar.copyFailed": "Copy failed",
+		"toolbar.addToTask": "Add to task",
+		"toolbar.commentDialogAria": "Add an optional comment",
+		"toolbar.skipComment": "Skip comment",
+		"toolbar.addComment": "Add comment",
+		"card.commentSubtitle": "Comment · {comment}",
+		"card.ariaIndexed": "Annotation {index}",
+		"card.ariaPlain": "Selection annotation",
+		"card.editComment": "Edit comment",
+		"card.remove": "Remove annotation",
+		"summary.hint": "Hover to view annotations",
+		"summary.dialogAria": "Annotation details: {count}",
+		"summary.edit": "Edit annotation {index}",
+		"summary.remove": "Remove annotation {index}",
+		"summary.userComment": "User comment",
+		"summary.noComment": "No comment added",
+		"summary.aria": {
+			one: "{count} annotation. Hover to view details.",
+			other: "{count} annotations. Hover to view details."
+		},
+		"summary.title": {
+			one: "{count} annotation",
+			other: "{count} annotations"
+		},
+		"summary.removeAll": "Remove all annotations",
+		"chip.annotation": "Annotation {index}"
+	},
+	zh: {
+		"common.selectedText": "选中的文本",
+		"common.commentPlaceholder": "添加可选评论…",
+		"common.cancel": "取消",
+		"common.save": "保存",
+		"toolbar.aria": "划词操作",
+		"toolbar.commentHint": "添加批注…",
+		"toolbar.copy": "复制",
+		"toolbar.copyFailed": "复制失败",
+		"toolbar.addToTask": "添加到任务",
+		"toolbar.commentDialogAria": "添加可选评论",
+		"toolbar.skipComment": "暂不评论",
+		"toolbar.addComment": "添加评论",
+		"card.commentSubtitle": "评论 · {comment}",
+		"card.ariaIndexed": "批注 {index}",
+		"card.ariaPlain": "划词批注",
+		"card.editComment": "编辑评论",
+		"card.remove": "移除批注",
+		"summary.hint": "悬停查看批注",
+		"summary.dialogAria": "{count} 条划词批注详情",
+		"summary.edit": "编辑批注 {index}",
+		"summary.remove": "移除批注 {index}",
+		"summary.userComment": "用户评论",
+		"summary.noComment": "未添加评论",
+		"summary.aria": { other: "{count} 条划词批注。悬停查看详情。" },
+		"summary.title": { other: "{count} 条批注" },
+		"summary.removeAll": "移除全部划词批注",
+		"chip.annotation": "批注 {index}"
+	}
+};
+let cached = null;
+function matchLocale(tag) {
+	const lower = tag.toLowerCase();
+	for (const locale of LOCALES) if (lower === locale || lower.startsWith(`${locale}-`) || lower.startsWith(`${locale}_`)) return locale;
+	return null;
+}
+function localStore() {
+	return globalThis.localStorage;
+}
+function readOverride() {
+	try {
+		const raw = localStore()?.getItem(STORAGE_KEY);
+		return raw ? matchLocale(raw) : null;
+	} catch {
+		return null;
+	}
+}
+function detectLocale() {
+	const override = readOverride();
+	if (override) return override;
+	const nav = globalThis.navigator;
+	const tags = nav ? [...nav.languages ?? [], nav.language].filter(Boolean) : [];
+	for (const tag of tags) {
+		const hit = matchLocale(tag);
+		if (hit) return hit;
+	}
+	return "en";
+}
+/** Active locale (resolved once, then cached). */
+function getLocale() {
+	cached ??= detectLocale();
+	return cached;
+}
+function pluralize(forms, locale, count) {
+	if (locale === "ru") {
+		const mod10 = count % 10;
+		const mod100 = count % 100;
+		if (mod10 === 1 && mod100 !== 11) return forms.one ?? forms.other ?? "";
+		if (mod10 >= 2 && mod10 <= 4 && (mod100 < 12 || mod100 > 14)) return forms.few ?? forms.other ?? "";
+		return forms.many ?? forms.other ?? "";
+	}
+	if (locale === "en") return (count === 1 ? forms.one : void 0) ?? forms.other ?? "";
+	return forms.other ?? forms.many ?? "";
+}
+function interpolate(template, params) {
+	return template.replace(/\{(\w+)\}/g, (whole, name) => name in params ? String(params[name]) : whole);
+}
+/**
+* Translate a key for the active locale.
+* `{name}` placeholders are filled from `params`; a numeric `count` also
+* selects the right plural form when the message is a `PluralForms` object.
+*/
+function t(key, params = {}) {
+	const locale = getLocale();
+	const value = MESSAGES[locale][key] ?? MESSAGES.zh[key] ?? key;
+	return interpolate(typeof value === "string" ? value : pluralize(value, locale, typeof params.count === "number" ? params.count : 0), params);
+}
+//#endregion
 //#region src/client/ui/AnnotationCardView.tsx
+function AnnotationCardView({ title, text, comment, variant, index, onRemove, onEditComment }) {
+	const composer = variant === "composer";
+	const subtitle = comment ? composer ? t("card.commentSubtitle", { comment }) : comment : composer ? t("common.selectedText") : t("summary.noComment");
+	return (0, react_jsx_runtime.jsxs)("div", {
+		className: composer ? styles.card : styles.tCard,
+		role: "group",
+		"aria-label": index ? t("card.ariaIndexed", { index }) : t("card.ariaPlain"),
+		children: [
+			(0, react_jsx_runtime.jsx)("div", {
+				className: composer ? styles.cardIcon : styles.tCardIcon,
+				"aria-hidden": true,
+				children: index ? String(index) : "AI"
+			}),
+			(0, react_jsx_runtime.jsxs)("div", {
+				className: composer ? styles.cardBody : styles.tCardBody,
+				children: [(0, react_jsx_runtime.jsx)("div", {
+					className: composer ? styles.cardTitle : styles.tCardTitle,
+					title: text,
+					children: title
+				}), (0, react_jsx_runtime.jsx)("div", {
+					className: composer ? styles.cardSubtitle : styles.tCardSubtitle,
+					...comment ? {
+						title: comment,
+						"data-dsq-has-comment": "true"
+					} : {},
+					children: subtitle
+				})]
+			}),
+			composer && onEditComment ? (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: styles.cardAction,
+				"aria-label": t("card.editComment"),
+				onClick: onEditComment,
+				children: "✎"
+			}) : null,
+			composer && onRemove ? (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: styles.cardClose,
+				"aria-label": t("card.remove"),
+				onClick: onRemove,
+				children: "×"
+			}) : null
+		]
+	});
+}
 /** Grace period so pointer transit between the summary and the panel never closes it. */
 const CLOSE_DELAY = 320;
 /** After a viewport change, wait this long before position-checking the pointer. */
@@ -1720,7 +1993,7 @@ const SETTLE_DELAY = 600;
 * other cancels. Comment editing happens inline in the list — the panel stays
 * put and auto-close is suppressed while an edit is open.
 */
-function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemove, onItemEdit, hint = "悬停查看批注" }) {
+function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemove, onItemEdit, hint = t("summary.hint") }) {
 	const rootRef = (0, react.useRef)(null);
 	const popRef = (0, react.useRef)(null);
 	const closeTimerRef = (0, react.useRef)(null);
@@ -1876,7 +2149,7 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 		ref: popRef,
 		className: `${styles.summaryHover} ${styles.summaryHoverOpen}`,
 		role: "dialog",
-		"aria-label": `${count} 条划词批注详情`,
+		"aria-label": t("summary.dialogAria", { count }),
 		onPointerEnter: openPop,
 		onPointerLeave,
 		children: (0, react_jsx_runtime.jsx)("div", {
@@ -1895,20 +2168,20 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 							}),
 							(0, react_jsx_runtime.jsx)("div", {
 								className: styles.summaryItemLabel,
-								children: "选中的文本"
+								children: t("common.selectedText")
 							}),
 							!isEditing && (onItemRemove || onItemEdit) ? (0, react_jsx_runtime.jsxs)("div", {
 								className: styles.summaryItemActions,
 								children: [onItemEdit ? (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									className: styles.summaryItemAction,
-									"aria-label": `编辑批注 ${i + 1}`,
+									"aria-label": t("summary.edit", { index: i + 1 }),
 									onClick: () => startEdit(i),
 									children: (0, react_jsx_runtime.jsx)(LucideIcon, { name: "pencil" })
 								}) : null, onItemRemove ? (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									className: styles.summaryItemAction,
-									"aria-label": `移除批注 ${i + 1}`,
+									"aria-label": t("summary.remove", { index: i + 1 }),
 									onClick: () => onItemRemove(i, item),
 									children: (0, react_jsx_runtime.jsx)(LucideIcon, { name: "trash-2" })
 								}) : null]
@@ -1923,12 +2196,12 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 							}),
 							(0, react_jsx_runtime.jsx)("div", {
 								className: styles.summaryItemLabel,
-								children: "用户评论"
+								children: t("summary.userComment")
 							}),
 							(0, react_jsx_runtime.jsx)("textarea", {
 								ref: editInputRef,
 								className: styles.annEditInput,
-								placeholder: "添加可选评论…",
+								placeholder: t("common.commentPlaceholder"),
 								value: editDraft,
 								onChange: (e) => setEditDraft(e.target.value),
 								onKeyDown: (e) => {
@@ -1949,12 +2222,12 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 									type: "button",
 									className: styles.annEditCancel,
 									onClick: () => setEditing(null),
-									children: "取消"
+									children: t("common.cancel")
 								}), (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									className: styles.annEditSave,
 									onClick: commitEdit,
-									children: "保存"
+									children: t("common.save")
 								})]
 							})
 						]
@@ -1974,11 +2247,11 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 								}),
 								(0, react_jsx_runtime.jsx)("div", {
 									className: styles.summaryItemLabel,
-									children: "用户评论"
+									children: t("summary.userComment")
 								}),
 								(0, react_jsx_runtime.jsx)("div", {
 									className: item.comment ? styles.summaryItemText : `${styles.summaryItemText} ${styles.summaryItemTextEmpty}`,
-									children: item.comment || "未添加评论"
+									children: item.comment || t("summary.noComment")
 								})
 							]
 						})
@@ -1992,7 +2265,7 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 		className: styles.summary,
 		tabIndex: 0,
 		"data-selection-annotation-summary": "true",
-		"aria-label": `${count} 条划词批注。悬停查看详情。`,
+		"aria-label": t("summary.aria", { count }),
 		"aria-expanded": open,
 		onPointerEnter,
 		onPointerLeave,
@@ -2009,7 +2282,7 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 				className: styles.summaryBody,
 				children: [(0, react_jsx_runtime.jsx)("div", {
 					className: styles.summaryTitle,
-					children: `${count} 条批注`
+					children: t("summary.title", { count })
 				}), (0, react_jsx_runtime.jsx)("div", {
 					className: styles.summaryHint,
 					children: hint
@@ -2018,7 +2291,7 @@ function AnnotationSummary({ count, items, onRemoveAll, onItemSelect, onItemRemo
 			onRemoveAll ? (0, react_jsx_runtime.jsx)("button", {
 				type: "button",
 				className: styles.cardClose,
-				"aria-label": "移除全部划词批注",
+				"aria-label": t("summary.removeAll"),
 				onClick: onRemoveAll,
 				children: (0, react_jsx_runtime.jsx)(LucideIcon, {
 					name: "x",
@@ -2310,6 +2583,8 @@ async function copyText(text) {
 }
 //#endregion
 //#region src/client/SelectionToolbar.tsx
+/** Cap for the auto-growing comment box; beyond this it scrolls internally. */
+const COMMENT_MAX_HEIGHT = 220;
 function SelectionToolbar({ sessionId }) {
 	const toolbarRef = (0, react.useRef)(null);
 	const commentWrapRef = (0, react.useRef)(null);
@@ -2376,19 +2651,24 @@ function SelectionToolbar({ sessionId }) {
 			if (dragging) return;
 			schedule();
 		};
+		const onScroll = (event) => {
+			const target = event.target;
+			if (target instanceof Node && (toolbarRef.current?.contains(target) === true || commentWrapRef.current?.contains(target) === true)) return;
+			hide();
+		};
 		document.addEventListener("pointerdown", onPointerDown, true);
 		document.addEventListener("pointerup", onPointerUp, true);
 		document.addEventListener("keyup", schedule, true);
 		document.addEventListener("selectionchange", onSelectionChange);
 		window.addEventListener("resize", hide);
-		document.addEventListener("scroll", hide, true);
+		document.addEventListener("scroll", onScroll, true);
 		return () => {
 			document.removeEventListener("pointerdown", onPointerDown, true);
 			document.removeEventListener("pointerup", onPointerUp, true);
 			document.removeEventListener("keyup", schedule, true);
 			document.removeEventListener("selectionchange", onSelectionChange);
 			window.removeEventListener("resize", hide);
-			document.removeEventListener("scroll", hide, true);
+			document.removeEventListener("scroll", onScroll, true);
 		};
 	}, [hide, refresh]);
 	const placeCommentPop = (0, react.useCallback)(() => {
@@ -2415,6 +2695,18 @@ function SelectionToolbar({ sessionId }) {
 			commentRef.current?.focus();
 		}
 	}, [phase, placeCommentPop]);
+	(0, react.useEffect)(() => {
+		if (phase !== "comment") return;
+		const area = commentRef.current;
+		if (!area) return;
+		area.style.height = "auto";
+		area.style.height = `${Math.min(area.scrollHeight, COMMENT_MAX_HEIGHT)}px`;
+		placeCommentPop();
+	}, [
+		phase,
+		comment,
+		placeCommentPop
+	]);
 	const handleToolbarPointerDown = (0, react.useCallback)((event) => {
 		event.preventDefault();
 		event.stopPropagation();
@@ -2427,7 +2719,7 @@ function SelectionToolbar({ sessionId }) {
 			clearNativeSelection();
 			hide();
 		} catch {
-			setStatus("复制失败");
+			setStatus(t("toolbar.copyFailed"));
 		}
 	}, [hide]);
 	const openComment = (0, react.useCallback)(() => {
@@ -2436,7 +2728,7 @@ function SelectionToolbar({ sessionId }) {
 		setComment("");
 		setStatus(null);
 	}, []);
-	/** Quick-add without opening the comment step (double-tap / “暂不评论”). */
+	/** Quick-add without opening the comment step (double-tap / “Skip comment”). */
 	const commitAnnotation = (0, react.useCallback)((body) => {
 		const snapshot = activeRef.current;
 		if (!snapshot) {
@@ -2471,7 +2763,7 @@ function SelectionToolbar({ sessionId }) {
 			className: styles.toolbar,
 			style: toolbarStyle,
 			role: "toolbar",
-			"aria-label": "划词操作",
+			"aria-label": t("toolbar.aria"),
 			"data-dsq-toolbar": "true",
 			onPointerDown: handleToolbarPointerDown,
 			children: phase === "comment" ? (0, react_jsx_runtime.jsx)("div", {
@@ -2486,7 +2778,7 @@ function SelectionToolbar({ sessionId }) {
 						fontSize: 13,
 						opacity: .8
 					},
-					children: "添加批注…"
+					children: t("toolbar.commentHint")
 				})
 			}) : (0, react_jsx_runtime.jsxs)("div", {
 				style: {
@@ -2502,7 +2794,7 @@ function SelectionToolbar({ sessionId }) {
 						children: [(0, react_jsx_runtime.jsx)(LucideIcon, {
 							name: "copy",
 							size: 14
-						}), "复制"]
+						}), t("toolbar.copy")]
 					}),
 					(0, react_jsx_runtime.jsx)("span", {
 						className: styles.divider,
@@ -2515,7 +2807,7 @@ function SelectionToolbar({ sessionId }) {
 						children: [(0, react_jsx_runtime.jsx)(LucideIcon, {
 							name: "plus",
 							size: 14
-						}), "添加到任务"]
+						}), t("toolbar.addToTask")]
 					})
 				]
 			})
@@ -2525,12 +2817,12 @@ function SelectionToolbar({ sessionId }) {
 			className: styles.commentPop,
 			style: void 0,
 			role: "dialog",
-			"aria-label": "添加可选评论",
+			"aria-label": t("toolbar.commentDialogAria"),
 			onPointerDown: handleToolbarPointerDown,
 			children: [(0, react_jsx_runtime.jsx)("textarea", {
 				ref: commentRef,
 				className: styles.commentInput,
-				placeholder: "添加可选评论…",
+				placeholder: t("common.commentPlaceholder"),
 				value: comment,
 				onChange: (e) => setComment(e.target.value),
 				onKeyDown: (e) => {
@@ -2550,13 +2842,13 @@ function SelectionToolbar({ sessionId }) {
 					type: "button",
 					className: styles.button,
 					onClick: () => commitAnnotation(void 0),
-					children: "暂不评论"
+					children: t("toolbar.skipComment")
 				}), (0, react_jsx_runtime.jsx)("button", {
 					type: "button",
 					className: styles.button,
 					disabled: !comment.trim(),
 					onClick: () => commitAnnotation(comment),
-					children: "添加评论"
+					children: t("toolbar.addComment")
 				})]
 			})]
 		}) : null,
@@ -2581,11 +2873,14 @@ function decorateTextNode(node) {
 	const parent = node.parentElement;
 	if (!parent || parent.closest(`[data-${DECO}]`)) return;
 	if (parent.closest("pre, code, [data-dsq-toolbar]")) return;
+	if (parent.closest("textarea, input, [data-lexical-editor=\"true\"]")) return;
 	const frag = document.createDocumentFragment();
 	let last = 0;
+	let matched = false;
 	const re = new RegExp(ANNOTATION_DIRECTIVE_RE.source, "g");
 	let m;
 	while ((m = re.exec(value)) !== null) {
+		matched = true;
 		if (m.index > last) frag.append(document.createTextNode(value.slice(last, m.index)));
 		const index = Number(m[1]);
 		const chip = document.createElement("button");
@@ -2593,7 +2888,7 @@ function decorateTextNode(node) {
 		chip.className = "dsq_annDirective";
 		chip.dataset[DECO] = String(index);
 		chip.setAttribute("data-dsq-deco", "true");
-		chip.textContent = `批注 ${index}`;
+		chip.textContent = t("chip.annotation", { index });
 		chip.addEventListener("click", () => {
 			const mark = findAnnotationMarkBefore(index, chip);
 			if (mark) flashAnnotationMark(mark);
@@ -2601,6 +2896,7 @@ function decorateTextNode(node) {
 		frag.append(chip);
 		last = m.index + m[0].length;
 	}
+	if (!matched) return;
 	if (last < value.length) frag.append(document.createTextNode(value.slice(last)));
 	parent.replaceChild(frag, node);
 }
@@ -2635,7 +2931,16 @@ function watchAnnotationDirectives(root) {
 }
 //#endregion
 //#region src/client/transcript/TranscriptQuoteCard.tsx
-/** History-side annotation summary — same chrome as the composer. */
+/**
+* History-side cards for one user message's annotations.
+*
+* One card per annotation, each showing the selected text **and** the user's
+* comment. The comment is how the user recognizes their own annotation, so it
+* belongs on the visible card — not behind a hover panel that has to be
+* discovered. Clicking a card scrolls back to the marked text in the source
+* message; the ordinal badge matches the `:dsh-annotation{index="N"}` the model
+* refers to.
+*/
 function TranscriptQuoteCard({ node }) {
 	ensureToolbarStyles();
 	const stackRef = (0, react.useRef)(null);
@@ -2652,28 +2957,37 @@ function TranscriptQuoteCard({ node }) {
 			endOffset: quote.endOffset
 		})));
 	}, [quotes]);
-	const onItemSelect = (0, react.useCallback)((index, item) => {
-		scrollToAnnotation(index + 1, item.text, item.id);
-	}, []);
 	const markIdOf = (0, react.useCallback)((index) => {
 		const ownerKey = stackRef.current?.closest("[data-chat-flow-key]")?.getAttribute("data-chat-flow-key");
 		return ownerKey ? `dqsm_${ownerKey}_${index}` : void 0;
 	}, []);
+	const onSelect = (0, react.useCallback)((index, text) => {
+		scrollToAnnotation(index + 1, text, markIdOf(index));
+	}, [markIdOf]);
 	if (quotes.length === 0) return null;
 	return (0, react_jsx_runtime.jsx)("div", {
 		ref: stackRef,
 		className: styles.tCardStack,
 		"data-dsq-deco": "true",
-		children: (0, react_jsx_runtime.jsx)(AnnotationSummary, {
-			count: quotes.length,
-			items: quotes.map((quote, index) => ({
-				id: markIdOf(index),
+		children: quotes.map((quote, index) => (0, react_jsx_runtime.jsx)("div", {
+			className: styles.tCardButton,
+			role: "button",
+			tabIndex: 0,
+			"aria-label": quote.title,
+			onClick: () => onSelect(index, quote.text),
+			onKeyDown: (event) => {
+				if (event.key !== "Enter" && event.key !== " ") return;
+				event.preventDefault();
+				onSelect(index, quote.text);
+			},
+			children: (0, react_jsx_runtime.jsx)(AnnotationCardView, {
+				variant: "transcript",
 				title: quote.title,
 				text: quote.text,
-				comment: quote.comment || void 0
-			})),
-			onItemSelect
-		})
+				comment: quote.comment || void 0,
+				index: index + 1
+			})
+		}, `ann-${index}`))
 	});
 }
 //#endregion
@@ -2691,101 +3005,69 @@ function contentImages(content) {
 }
 /**
 * Replacement for the built-in `user` Chat node view.
-* Strips the `<response-annotations>` protocol block from the bubble.
+*
+* Strips the `<response-annotations>` protocol block from the bubble **and**
+* renders one card per annotation right under it.
+*
+* Why the cards live here instead of on a `select-quote` Chat node:
+* `conversation.chat.node` is gated by the shipped `TURN_PROCESS_INDEPENDENT_KINDS`
+* allowlist (system-prompt, user, steering, turn-trigger, turn-process,
+* turn-error, turn-max-tokens, turn-tail). A node whose kind is not on that list
+* is classified as a turn-process member and `hidden` inside the collapsed
+* process disclosure of a completed turn — mounted, then invisible. `user` is on
+* the list, so rendering the cards inside this component is the only placement
+* that survives turn folding.
 */
 function UserMessageDisplay({ node, renderMessageImages }) {
 	ensureToolbarStyles();
 	const raw = contentBlocksToText(node.data?.content);
 	const scanned = scanAnnotatedMessage(raw);
 	const text = scanned.annotations.length > 0 ? scanned.rest : displayTextWithoutQuote(raw).trim();
+	const quotes = scanned.annotations;
 	const images = contentImages(node.data?.content);
-	if (!text && images.length === 0) return null;
+	if (!text && images.length === 0 && quotes.length === 0) return null;
 	return (0, react_jsx_runtime.jsx)("div", {
 		className: styles.userRow,
 		children: (0, react_jsx_runtime.jsxs)("div", {
 			className: styles.userStack,
-			children: [images.length > 0 && renderMessageImages !== void 0 ? (0, react_jsx_runtime.jsx)("div", {
-				className: styles.userImages,
-				"data-message-attachments": true,
-				children: renderMessageImages({
-					images,
-					align: "end",
-					compact: images.length > 1
-				})
-			}, "images") : null, text ? (0, react_jsx_runtime.jsx)("div", {
-				className: styles.userBubble,
-				children: text
-			}, "bubble") : null]
+			children: [
+				images.length > 0 && renderMessageImages !== void 0 ? (0, react_jsx_runtime.jsx)("div", {
+					className: styles.userImages,
+					"data-message-attachments": true,
+					children: renderMessageImages({
+						images,
+						align: "end",
+						compact: images.length > 1
+					})
+				}, "images") : null,
+				text ? (0, react_jsx_runtime.jsx)("div", {
+					className: styles.userBubble,
+					children: text
+				}, "bubble") : null,
+				quotes.length > 0 ? (0, react_jsx_runtime.jsx)(TranscriptQuoteCard, { node: { data: { quotes } } }, "quotes") : null
+			]
 		})
 	});
 }
 //#endregion
-//#region src/client/transcript/transcript-node.ts
-const KIND = "select-quote";
-function createSelectQuoteDefinition() {
-	return {
-		kind: KIND,
-		target: "chat",
-		match(event) {
-			if (event.type !== "user/message") return null;
-			if (parseAnnotatedMessage(extractUserText(event)).length === 0) return null;
-			return {
-				id: `${KIND}-${event.seq ?? 0}`,
-				role: "start"
-			};
-		},
-		start(_context, match) {
-			const quotes = parseAnnotatedMessage(extractUserText(match.event));
-			if (quotes.length === 0) throw new Error("select-quote: missing annotation payload on start");
-			return {
-				quotes,
-				seq: match.event.seq ?? 0
-			};
-		},
-		update(context) {
-			return context.state;
-		},
-		buildViewNode(context) {
-			if (context.state === void 0) return null;
-			const anchor = context.start?.event.seq ?? context.matches?.[0]?.event.seq ?? context.state.seq ?? 0;
-			const location = context.start?.location ?? context.matches?.[0]?.location ?? { kind: "unresolved" };
-			return {
-				key: context.key,
-				kind: KIND,
-				id: context.id,
-				target: "chat",
-				anchorSeq: anchor,
-				location,
-				visibility: "visible",
-				data: context.state
-			};
-		}
-	};
-}
-function registerSelectQuoteNode(ctx) {
-	const uiConversation = ctx.uiConversation;
-	if (!uiConversation) {
-		console.warn("[dsh-select-quote] uiConversation unavailable; transcript card disabled");
-		return;
-	}
-	ctx.effect(() => uiConversation.events.register(createSelectQuoteDefinition()), "dsh-select-quote: conversation node definition");
-}
-//#endregion
 //#region src/client/index.tsx
 /**
 * Browser half of dsh-select-quote.
 *
 * Selection toolbar is root-scoped (`shell.overlay`) so transcript selections
 * are always observed. Annotation summary stays on the session composer.
+*
+* History cards render **inside** the `user` Chat node view, not on a
+* `select-quote` Chat node. `conversation.chat.node` is gated by the shipped
+* `TURN_PROCESS_INDEPENDENT_KINDS` allowlist (system-prompt, user, steering,
+* turn-trigger, turn-process, turn-error, turn-max-tokens, turn-tail): any other
+* kind is classified as a turn-process member and `hidden` when the completed
+* turn's process disclosure is folded — mounted, but invisible. `user` is on
+* that allowlist, so the bubble is the only placement that is reliably visible.
 */
-const inject = [
-	"slots",
-	"sessions",
-	"uiConversation"
-];
+const inject = ["slots", "sessions"];
 function apply(ctx) {
 	ensureToolbarStyles();
-	registerSelectQuoteNode(ctx);
 	ctx.effect(() => watchAnnotationDirectives(), "dsh-select-quote: annotation directives");
 	ctx.effect(() => watchAnnotationMarks(), "dsh-select-quote: annotation marks");
 	ctx.effect(() => {
@@ -2814,10 +3096,6 @@ function apply(ctx) {
 		}, SessionBridge);
 	});
 	ctx.slots.inject("conversation.chat.node", () => {
-		ctx.slots.register({
-			name: "conversation.chat.node",
-			key: "select-quote"
-		}, TranscriptQuoteCard);
 		ctx.slots.register({
 			name: "conversation.chat.node",
 			key: "user",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-select-quote",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "DeepSeek Harness web plugin: annotate text selected in the conversation — the selection rides along with your next message, is marked in the source text, and the model points back at it.",
   "keywords": [
     "deepseek",
@@ -68,6 +68,7 @@
     "@types/react-dom": "~18.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "tsdown": "0.23.0",
     "typescript": "^5.8.0"
   }
 }