dsh-select-quote 0.3.9 → 0.3.10

package/lib/client.js

@@ -110,6 +110,12 @@ body {
   --dsq-font-delta: var(--dsh-content-font-delta, 0px);
   --dsq-bg-raised: var(--dsw-alias-bg-layer-1, #fff);
   --dsq-bg-toast: var(--dsw-alias-bg-layer-3, rgba(0, 0, 0, 0.78));
+  /* The settings switch mirrors the Host's own switch: neutral track when off,
+     brand fill when on, and a thumb that inverts with the theme. */
+  --dsq-switch-off: var(--dsw-alias-border-l3, rgba(0, 0, 0, 0.12));
+  --dsq-switch-on: var(--dsw-alias-brand-primary, #0f1115);
+  --dsq-switch-thumb-off: var(--dsw-alias-switch-thumb, #fff);
+  --dsq-switch-thumb-on: var(--dsw-alias-label-primary-foreground, #fff);
   --dsq-line: var(--dsw-alias-border-l2, rgba(0, 0, 0, 0.1));
   --dsq-line-divider: var(--dsw-alias-border-l4, rgba(0, 0, 0, 0.12));
   --dsq-focus-ring: var(--dsw-alias-button-primary-fill, #1677ff);
@@ -178,6 +184,26 @@ ${atomRules}
   }
 }
 
+/* Right-click / shortcut menu: transform only, for the same reason as the
+   toolbar — an animated opacity would cut the material layer's backdrop. */
+@keyframes dsq-menu-in {
+  from {
+    transform: translateY(4px) scale(0.97);
+  }
+  to {
+    transform: translateY(0) scale(1);
+  }
+}
+
+@keyframes dsq-menu-in-up {
+  from {
+    transform: translateY(-4px) scale(0.97);
+  }
+  to {
+    transform: translateY(0) scale(1);
+  }
+}
+
 /* 内容层的 rise：悬停面板的列表在用；工具条改用容器 scale 后这条在这里待命。 */
 @keyframes dsq-rise-in {
   from {
@@ -202,14 +228,15 @@ ${atomRules}
 /* 宿主菜单材质（官方 material 图层同款）：填充走 --dsw-menu-surface-fill，模糊走
    --dsw-menu-backdrop-filter（恒为 blur(40px) saturate(150%)），亮暗自动翻。
    画在 z-index:-1 的独立图层上，内容在它之上：模糊只取身后的页面，不会把
-   面板里的文字一起糊掉。工具条、评论气泡、悬停面板三个浮层共用这一条。
+   面板里的文字一起糊掉。所有浮层共用这一条。
    注意：macOS 上宿主另有一个 --dsw-specific-menu（覆写成 94% 不透明）给它的
    菜单用；这里按需求用 surface-fill，所以我们的浮层会比宿主自己的菜单更透。 */
 .dsq_toolbar::before,
 .dsq_commentPop::before,
 .dsq_summaryHoverInner::before,
 .dsq_touchBar::before,
-.dsq_chipPreview::before {
+.dsq_chipPreview::before,
+.dsq_ctxMenu::before {
   content: "";
   position: absolute;
   inset: 0;
@@ -224,7 +251,7 @@ ${atomRules}
 /* 覆层不描边：elevation-prominent 自带的那圈 0 0 0 .5px（--dsw-elevation-stroke-color，
    默认 border-l4）对磨砂覆层是多余的——边缘自带材质分界，再勾一道反而抢视觉，覆写成
    更淡的 border-l1。
-   两个坑，改之前先读：① 这两行必须写在三个浮层自己的选择器上。写在 body 上会随继承
+   两个坑，改之前先读：① 这两行必须写在浮层自己的选择器上。写在 body 上会随继承
    影响页面里其它依赖默认值的面板（宿主带 [data-menu-material] 的菜单有自己的覆写，
    不受影响）。② --dsq-shadow 也必须在这儿声明，不能留在 body：自定义属性是在**声明处**
    展开的，--dsq-shadow 留在 body 上时 var(--dsw-elevation-prominent) 会在 body 就被
@@ -235,11 +262,12 @@ ${atomRules}
 .dsq_summaryHoverInner,
 .dsq_touchBar,
 .dsq_touchSheet,
-.dsq_chipPreview {
+.dsq_chipPreview,
+.dsq_ctxMenu {
   --dsw-elevation-stroke-color: var(--dsw-alias-border-l1);
   --dsq-shadow: var(--dsw-elevation-prominent, 0 0 0 .5px rgba(0, 0, 0, 0.04), 0 3px 8px rgba(0, 0, 0, 0.04), 0 0 20px rgba(0, 0, 0, 0.05));
   /* Every surface above takes the same elevation; declaring it once here is
-     what keeps the six component blocks free of a copied box-shadow. */
+     what keeps the component blocks free of a copied box-shadow. */
   box-shadow: var(--dsq-shadow);
 }
 
@@ -369,6 +397,60 @@ ${atomRules}
   transform: translate(-50%, 8px);
 }
 
+/* Right-click / shortcut menu. Body-level fixed: it must escape the
+   transcript's clipping. It closes on scroll instead of following the text,
+   so it never points at a line that has moved away. */
+.dsq_ctxMenu {
+  position: fixed;
+  z-index: 64;
+  width: max-content;
+  min-width: 172px;
+  max-width: min(280px, calc(100vw - 16px));
+  padding: 4px;
+  border: 0;
+  border-radius: 12px;
+  outline: none;
+  animation: dsq-menu-in 0.14s cubic-bezier(0.2, 0.8, 0.2, 1);
+  transform-origin: top left;
+}
+
+.dsq_ctxMenu[data-side='top'] {
+  animation-name: dsq-menu-in-up;
+  transform-origin: bottom left;
+}
+
+.dsq_ctxItem {
+  width: 100%;
+  gap: 8px;
+  padding: 7px 10px;
+  border-radius: 8px;
+  color: var(--dsq-label);
+  font: inherit;
+  font-size: 13px;
+  line-height: 18px;
+  text-align: left;
+  white-space: nowrap;
+}
+
+.dsq_ctxItem svg {
+  flex: none;
+  color: var(--dsq-label-2);
+}
+
+.dsq_ctxItem:hover,
+.dsq_ctxItem:focus {
+  background: var(--dsq-fill-hover);
+}
+
+.dsq_ctxItem:focus {
+  outline: none;
+}
+
+.dsq_ctxItem:focus-visible {
+  outline: 2px solid var(--dsq-focus-ring);
+  outline-offset: -2px;
+}
+
 /* Annotation stack — inside the composer card (input.overlay), ~1/5 width. */
 .dsq_cardStack {
   position: absolute;
@@ -537,7 +619,8 @@ ${atomRules}
   .dsq_commentPop::before,
   .dsq_summaryHoverInner::before,
   .dsq_touchBar::before,
-  .dsq_chipPreview::before {
+  .dsq_chipPreview::before,
+  .dsq_ctxMenu::before {
     background: var(--dsq-bg-raised);
     backdrop-filter: none;
     -webkit-backdrop-filter: none;
@@ -1060,12 +1143,19 @@ ${atomRules}
    Absolute so the badge adds no inline advance width: annotating never reflows
    the paragraph or moves following words. Bottom (not top) anchors to the last
    fragment: for a mark spanning several lines the containing block is the union
-   of the first and last fragments, so its bottom edge is the last line. */
+   of the first and last fragments, so its bottom edge is the last line.
+   BADGE_BOTTOM / BADGE_HEIGHT / the 2px margin in annotate-text.ts mirror the
+   numbers below for collision measurement. */
 .dsq_annMark[data-dsq-ann-index]::after {
   content: attr(data-dsq-ann-index);
   position: absolute;
   bottom: 8px;
   left: 100%;
+  /* Above the native selection highlight and the background of a later mark:
+     both otherwise paint over the badge when their ranges meet. */
+  z-index: 2;
+  /* JS shifts colliding badges right/up; the resting position is unchanged. */
+  transform: translate(var(--dsq-ann-badge-x, 0px), var(--dsq-ann-badge-y, 0px));
   display: grid;
   place-items: center;
   min-width: 15px;
@@ -1148,6 +1238,202 @@ ${atomRules}
   .dsq_chipPreviewJump {
     min-height: 44px;
   }
+  .dsq_segOption {
+    min-height: 44px;
+  }
+}
+
+/* Settings row (plugin page): an inline segmented control. The page owns the
+   write, so there is no save button — each pick is committed immediately. */
+.dsq_settings {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 2px 0;
+}
+
+.dsq_settingsSection {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.dsq_settingsCopy {
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+}
+
+.dsq_settingsLabel {
+  color: var(--dsq-label);
+  font-size: 13px;
+  font-weight: 500;
+}
+
+.dsq_settingsHint {
+  color: var(--dsq-label-3);
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+/* Shortcut reference under the switch: the two commands and the keycaps the
+   Host currently has in effect, so a rebind shows up here without a reload. */
+.dsq_settingsShortcuts {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.dsq_settingsShortcutRow {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  min-height: 22px;
+}
+
+.dsq_settingsShortcutName {
+  min-width: 0;
+  color: var(--dsq-label-2);
+  font-size: 12px;
+}
+
+.dsq_settingsShortcutKeys {
+  flex: none;
+  color: var(--dsq-label-3);
+  font-size: 12px;
+}
+
+.dsq_keycap {
+  display: inline-block;
+  min-width: 18px;
+  padding: 1px 6px;
+  border: 1px solid var(--dsq-line);
+  border-radius: 5px;
+  background: var(--dsq-fill-hover);
+  color: var(--dsq-label-2);
+  font: inherit;
+  font-size: 11px;
+  line-height: 18px;
+  text-align: center;
+  white-space: nowrap;
+}
+
+.dsq_seg {
+  display: inline-flex;
+  align-self: flex-start;
+  gap: 2px;
+  padding: 2px;
+  border-radius: 8px;
+  background: var(--dsq-fill-hover);
+}
+
+.dsq_segOption {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 28px;
+  padding: 0 12px;
+  border-radius: 6px;
+  color: var(--dsq-label-2);
+  font-size: 13px;
+  cursor: pointer;
+  transition: background-color 0.12s ease, color 0.12s ease;
+}
+
+.dsq_segOption:hover {
+  color: var(--dsq-label);
+}
+
+.dsq_segOption[data-active="true"] {
+  background: var(--dsq-bg-raised);
+  box-shadow: 0 0 0 0.5px var(--dsq-line);
+  color: var(--dsq-label);
+}
+
+.dsq_segOption:has(:focus-visible) {
+  outline: 2px solid var(--dsq-focus-ring-soft);
+  outline-offset: 1px;
+}
+
+.dsq_settingsDivider {
+  height: 1px;
+  background: var(--dsq-line);
+}
+
+/* The whole row is the target: label text, hint, and the switch itself. */
+.dsq_settingsSwitchRow {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  cursor: pointer;
+}
+
+.dsq_settingsSwitchRow .dsq_settingsCopy {
+  flex: 1;
+  min-width: 0;
+}
+
+/* Exactly the Host switch metrics: 36×20 track, 16px thumb, 2px inset, and
+   the same on/off tokens. The thumb only animates its transform, like the
+   product control; the track changes color in one step. */
+.dsq_switch {
+  box-sizing: border-box;
+  position: relative;
+  flex: none;
+  width: 36px;
+  height: 20px;
+  padding: 2px;
+  border: 0;
+  border-radius: 999px;
+  corner-shape: round;
+  background: var(--dsq-switch-off);
+  cursor: pointer;
+}
+
+.dsq_switch[data-on='true'] {
+  background: var(--dsq-switch-on);
+}
+
+.dsq_switchTrack {
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  corner-shape: round;
+  background: var(--dsq-switch-thumb-off);
+  transition: transform 0.12s ease;
+}
+
+.dsq_switch[data-on='true'] .dsq_switchTrack {
+  background: var(--dsq-switch-thumb-on);
+  transform: translateX(16px);
+}
+
+.dsq_switch:has(:focus-visible) {
+  outline: 2px solid var(--dsq-focus-ring-soft);
+  outline-offset: 2px;
+}
+
+/* Visually hidden but still focusable: the native radio/checkbox carries the
+   semantics and keyboard behavior, the label carries the paint. */
+.dsq_srOnly {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  border: 0;
 }
 
 /* Layer 4 — host surface: keyframes, theme flips, and the two rules that reach
@@ -1196,6 +1482,8 @@ const styles = {
 	buttonAddComment: "dsq_buttonAddComment",
 	divider: "dsq_divider",
 	status: "dsq_status",
+	ctxMenu: "dsq_ctxMenu",
+	ctxItem: "dsq_ctxItem",
 	cardStack: "dsq_cardStack",
 	cardClose: "dsq_cardClose",
 	cardPad: "dsq_cardPad",
@@ -1260,9 +1548,73 @@ const styles = {
 	userRow: "dsq_userRow",
 	userStack: "dsq_userStack",
 	userImages: "dsq_userImages",
-	userBubble: "dsq_userBubble"
+	userBubble: "dsq_userBubble",
+	settings: "dsq_settings",
+	settingsSection: "dsq_settingsSection",
+	settingsCopy: "dsq_settingsCopy",
+	settingsLabel: "dsq_settingsLabel",
+	settingsHint: "dsq_settingsHint",
+	settingsShortcuts: "dsq_settingsShortcuts",
+	settingsShortcutRow: "dsq_settingsShortcutRow",
+	settingsShortcutName: "dsq_settingsShortcutName",
+	settingsShortcutKeys: "dsq_settingsShortcutKeys",
+	keycap: "dsq_keycap",
+	settingsDivider: "dsq_settingsDivider",
+	settingsSwitchRow: "dsq_settingsSwitchRow",
+	switch: "dsq_switch",
+	switchTrack: "dsq_switchTrack",
+	seg: "dsq_seg",
+	segOption: "dsq_segOption",
+	srOnly: "dsq_srOnly"
 };
 //#endregion
+//#region src/client/dom/badge-layout.ts
+const STEP_X = 28;
+const STEP_Y = 18;
+/** Rest, then two steps right; after that the stack grows upward. */
+const MAX_COLUMNS = 3;
+const MAX_ROWS = 24;
+function overlaps(a, b) {
+	return a.x < b.x + b.width && a.x + a.width > b.x && a.y < b.y + b.height && a.y + a.height > b.y;
+}
+function fits(anchor, dx, dy, bounds) {
+	if (dx > 0 && bounds.right !== void 0 && anchor.x + dx + anchor.width > bounds.right) return false;
+	if (dy < 0 && bounds.top !== void 0 && anchor.y + dy < bounds.top) return false;
+	return true;
+}
+/**
+* Greedy placement in reading order. Each badge first tries its resting spot,
+* then shifts right a couple of badge widths, and finally stacks upward. The
+* resting spot is always returned when no candidate fits, so a badge never
+* disappears because of an edge.
+*/
+function placeBadges(anchors, bounds = {}) {
+	const placed = [];
+	return anchors.map((anchor) => {
+		for (let row = 0; row < MAX_ROWS; row += 1) for (let column = 0; column < MAX_COLUMNS; column += 1) {
+			const dx = column * STEP_X;
+			const dy = -row * STEP_Y;
+			if (!fits(anchor, dx, dy, bounds)) continue;
+			const candidate = {
+				...anchor,
+				x: anchor.x + dx,
+				y: anchor.y + dy
+			};
+			if (placed.some((box) => overlaps(candidate, box))) continue;
+			placed.push(candidate);
+			return {
+				dx,
+				dy
+			};
+		}
+		placed.push(anchor);
+		return {
+			dx: 0,
+			dy: 0
+		};
+	});
+}
+//#endregion
 //#region src/client/dom/message-text.ts
 /**
 * Message-text geometry: locate a selection inside the transcript and express
@@ -1401,6 +1753,9 @@ function cleanTextOf(item) {
 const MARK_ATTR = "data-dsq-ann-mark";
 const INDEX_ATTR = "data-dsq-ann-index";
 const FLASH_MS = 1500;
+/** Distance from the mark's bottom edge to the badge's bottom edge (CSS). */
+const BADGE_BOTTOM = 8;
+const BADGE_MARGIN = 2;
 const jobs = /* @__PURE__ */ new Map();
 let pendingIds = /* @__PURE__ */ new Set();
 function attrValue(value) {
@@ -1510,6 +1865,47 @@ function refreshMarkIndex(item, job) {
 	if (last.getAttribute(INDEX_ATTR) !== next) last.setAttribute(INDEX_ATTR, next);
 	return true;
 }
+/**
+* Resolve overlapping ordinal badges. Two annotations can end at the same
+* offset (nested ranges), which puts their pseudo-element badges on the same
+* pixel; nearby ends can also touch. Measure every last fragment, then write
+* the offset back as variables inherited by `::after`. The badge's transform
+* never participates in text layout.
+*/
+function layoutBadges(scope) {
+	const marks = Array.from(scope.querySelectorAll(`[${INDEX_ATTR}]`));
+	for (const mark of marks) {
+		mark.style.removeProperty("--dsq-ann-badge-x");
+		mark.style.removeProperty("--dsq-ann-badge-y");
+	}
+	if (marks.length < 2) return;
+	const scroller = marks[0]?.closest("[data-conversation-scroll]");
+	const scrollerRect = scroller instanceof Element ? scroller.getBoundingClientRect() : null;
+	const rightEdge = scrollerRect && scrollerRect.width > 0 ? scrollerRect.right : document.documentElement.clientWidth;
+	const topEdge = scrollerRect && scrollerRect.height > 0 ? scrollerRect.top : 0;
+	const anchors = marks.map((mark) => {
+		const rect = mark.getBoundingClientRect();
+		return {
+			mark,
+			index: Number(mark.getAttribute(INDEX_ATTR) ?? 0),
+			x: rect.right + BADGE_MARGIN,
+			y: rect.bottom - BADGE_BOTTOM - 15,
+			width: 24,
+			height: 15,
+			visible: rect.width > 0 && rect.height > 0
+		};
+	}).filter((anchor) => anchor.visible).sort((a, b) => a.index - b.index);
+	if (anchors.length < 2) return;
+	const offsets = placeBadges(anchors, {
+		right: rightEdge - 4,
+		top: topEdge + 4
+	});
+	anchors.forEach((anchor, i) => {
+		const { dx, dy } = offsets[i];
+		if (dx !== 0) anchor.mark.style.setProperty("--dsq-ann-badge-x", `${dx}px`);
+		if (dy !== 0) anchor.mark.style.setProperty("--dsq-ann-badge-y", `${dy}px`);
+	});
+}
 /** Apply every registered job whose message is currently rendered. */
 function applyAnnotationMarks(root) {
 	if (jobs.size === 0) return;
@@ -1528,6 +1924,7 @@ function applyAnnotationMarks(root) {
 			if (decorateJob(item, job)) decorated = true;
 		}
 	}
+	layoutBadges(scope);
 }
 /** Insert or refresh jobs; identical jobs are no-ops. */
 function upsertAnnotationJobs(next) {
@@ -1593,8 +1990,11 @@ function watchAnnotationMarks(root) {
 		childList: true,
 		subtree: true
 	});
+	const onResize = () => schedule();
+	window.addEventListener("resize", onResize);
 	return () => {
 		observer.disconnect();
+		window.removeEventListener("resize", onResize);
 		if (frame !== 0) window.cancelAnimationFrame(frame);
 	};
 }
@@ -1939,13 +2339,6 @@ function readComposedDraft(text) {
 }
 //#endregion
 //#region src/client/runtime.ts
-/**
-* Shared runtime handles across slot scopes.
-*
-* The selection toolbar mounts at root (`shell.overlay`) while the annotation
-* panel is session-scoped, so both sides read one partition keyed by the
-* session the host minted for the active composer.
-*/
 const runtime = {};
 function setRuntimeSession(sessionId) {
 	if (sessionId) runtime.sessionId = sessionId;
@@ -1957,15 +2350,15 @@ const EMPTY$1 = [];
 /** Bucket for annotations added before a session id is known (never persisted). */
 const MEMORY_KEY = "pending";
 const bySession = /* @__PURE__ */ new Map();
-const listeners = /* @__PURE__ */ new Set();
+const listeners$1 = /* @__PURE__ */ new Set();
 let persistence = null;
 function notify() {
-	for (const listener of [...listeners]) listener();
+	for (const listener of [...listeners$1]) listener();
 }
 function subscribeAnnotations(listener) {
-	listeners.add(listener);
+	listeners$1.add(listener);
 	return () => {
-		listeners.delete(listener);
+		listeners$1.delete(listener);
 	};
 }
 /**
@@ -2158,13 +2551,13 @@ function annotationTitle(annotation) {
 }
 //#endregion
 //#region src/client/dom/popoverPlacement.ts
-const GAP$1 = 8;
+const GAP$2 = 8;
 const MARGIN = 8;
 /**
 * Place `panel` near `anchor`, flipping vertical side when the preferred side
 * lacks room. Keeps the panel inside `bounds` (the viewport by default).
 */
-function placePopover(anchor, panel, preferred = "bottom", gap = GAP$1, bounds) {
+function placePopover(anchor, panel, preferred = "bottom", gap = GAP$2, bounds) {
 	const box = bounds ?? {
 		top: 0,
 		left: 0,
@@ -2262,6 +2655,11 @@ const zh = {
 	"toolbar.commentDialogAria": "添加可选评论",
 	"toolbar.skipComment": "暂不评论",
 	"toolbar.addComment": "添加评论",
+	"menu.aria": "划词菜单",
+	"menu.shortcutLabel": "打开划词菜单",
+	"menu.addShortcutLabel": "将选中文字添加到任务",
+	"menu.noSelection": "先在对话里选中一段文字",
+	"menu.busy": "先完成当前批注",
 	"summary.hint": "悬停查看批注",
 	"summary.hintTouch": "点按查看批注",
 	"summary.dialogAria": "{count} 条划词批注详情",
@@ -2275,7 +2673,18 @@ const zh = {
 	"chip.annotation": "批注 {index}",
 	"chip.previewAria": "批注预览",
 	"chip.jump": "原文",
-	"chip.jumpAria": "跳转到原文"
+	"chip.jumpAria": "跳转到原文",
+	"settings.trigger": "划词入口",
+	"settings.triggerHint": "选中文字后何时显示操作条。触屏始终使用底部操作条。",
+	"settings.trigger.auto": "自动浮出",
+	"settings.trigger.contextmenu": "右键菜单",
+	"settings.trigger.both": "两者都开",
+	"settings.shortcut": "快捷键",
+	"settings.shortcutHint": "开启后，选中文字即可使用下面的快捷键；可在宿主的「快捷键」设置里改键。",
+	"settings.shortcutListAria": "当前快捷键",
+	"settings.shortcutUnavailable": "快捷键暂不可用（可能被其它插件占用）",
+	"settings.shortcutUnbound": "未绑定",
+	"settings.shortcutConflict": "与其它快捷键冲突"
 };
 const en = {
 	"common.selectedText": "Selected text",
@@ -2292,6 +2701,11 @@ const en = {
 	"toolbar.commentDialogAria": "Add an optional comment",
 	"toolbar.skipComment": "Skip comment",
 	"toolbar.addComment": "Add comment",
+	"menu.aria": "Selection menu",
+	"menu.shortcutLabel": "Open selection menu",
+	"menu.addShortcutLabel": "Add selected text to task",
+	"menu.noSelection": "Select text in the conversation first",
+	"menu.busy": "Finish the current annotation first",
 	"summary.hint": "Hover to view annotations",
 	"summary.hintTouch": "Tap to view annotations",
 	"summary.dialogAria": "Annotation details: {count}",
@@ -2307,7 +2721,18 @@ const en = {
 	"chip.annotation": "Annotation {index}",
 	"chip.previewAria": "Annotation preview",
 	"chip.jump": "Original",
-	"chip.jumpAria": "Jump to original"
+	"chip.jumpAria": "Jump to original",
+	"settings.trigger": "Trigger",
+	"settings.triggerHint": "When the action bar appears after you select text. Touch screens always use the bottom bar.",
+	"settings.trigger.auto": "Automatic",
+	"settings.trigger.contextmenu": "Right-click",
+	"settings.trigger.both": "Both",
+	"settings.shortcut": "Shortcut",
+	"settings.shortcutHint": "When on, the shortcuts below work on the selected text. Rebind them in the Host's Keyboard shortcuts settings.",
+	"settings.shortcutListAria": "Active shortcuts",
+	"settings.shortcutUnavailable": "Shortcuts are unavailable (another plugin may already use the keys).",
+	"settings.shortcutUnbound": "Unbound",
+	"settings.shortcutConflict": "Conflicts with another shortcut"
 };
 /**
 * Russian is not a shipped host locale: it is added through
@@ -2329,6 +2754,11 @@ const ru = {
 	"toolbar.commentDialogAria": "Добавить необязательный комментарий",
 	"toolbar.skipComment": "Без комментария",
 	"toolbar.addComment": "Добавить комментарий",
+	"menu.aria": "Меню выделения",
+	"menu.shortcutLabel": "Открыть меню выделения",
+	"menu.addShortcutLabel": "Добавить выделенный текст к задаче",
+	"menu.noSelection": "Сначала выделите текст в диалоге",
+	"menu.busy": "Сначала завершите текущую аннотацию",
 	"summary.hint": "Наведите, чтобы увидеть аннотации",
 	"summary.hintTouch": "Нажмите, чтобы увидеть аннотации",
 	"summary.dialogAria": "Детали аннотаций: {count}",
@@ -2348,7 +2778,18 @@ const ru = {
 	"chip.annotation": "Аннотация {index}",
 	"chip.previewAria": "Просмотр аннотации",
 	"chip.jump": "Оригинал",
-	"chip.jumpAria": "Перейти к оригиналу"
+	"chip.jumpAria": "Перейти к оригиналу",
+	"settings.trigger": "Триггер",
+	"settings.triggerHint": "Когда показывать панель действий после выделения текста. На сенсорных экранах всегда используется нижняя панель.",
+	"settings.trigger.auto": "Автоматически",
+	"settings.trigger.contextmenu": "По правому клику",
+	"settings.trigger.both": "Оба способа",
+	"settings.shortcut": "Горячая клавиша",
+	"settings.shortcutHint": "Когда включено, сочетания ниже работают с выделенным текстом. Изменить их можно в настройках горячих клавиш.",
+	"settings.shortcutListAria": "Текущие сочетания",
+	"settings.shortcutUnavailable": "Сочетания недоступны (возможно, клавиши заняты другим плагином).",
+	"settings.shortcutUnbound": "Не назначено",
+	"settings.shortcutConflict": "Конфликтует с другим сочетанием"
 };
 /** Both shipped host locales, required together by the typed `register()`. */
 const SHIPPED_DICTS = Object.freeze({
@@ -3179,6 +3620,67 @@ function AnnotationPanel({ useInput, inputActions, sessionId }) {
 /** Alias kept for overlay registration. */
 const QuoteCard = AnnotationPanel;
 //#endregion
+//#region src/client/config.ts
+const DEFAULT_CONFIG = Object.freeze({
+	triggerMode: "auto",
+	shortcut: false
+});
+const TRIGGER_MODES = /* @__PURE__ */ new Set([
+	"auto",
+	"contextmenu",
+	"both"
+]);
+/** Collapse an untrusted snapshot value onto the known shape. */
+function normalizeConfig(value) {
+	if (typeof value !== "object" || value === null) return { ...DEFAULT_CONFIG };
+	const record = value;
+	return {
+		triggerMode: TRIGGER_MODES.has(record.triggerMode) ? record.triggerMode : DEFAULT_CONFIG.triggerMode,
+		shortcut: typeof record.shortcut === "boolean" ? record.shortcut : DEFAULT_CONFIG.shortcut
+	};
+}
+function resolveTriggers(config) {
+	return {
+		auto: config.triggerMode === "auto" || config.triggerMode === "both",
+		contextMenu: config.triggerMode === "contextmenu" || config.triggerMode === "both",
+		shortcut: config.shortcut
+	};
+}
+let current = { ...DEFAULT_CONFIG };
+const listeners = /* @__PURE__ */ new Set();
+function getConfig() {
+	return current;
+}
+function subscribeConfig(listener) {
+	listeners.add(listener);
+	return () => {
+		listeners.delete(listener);
+	};
+}
+/** Publish a snapshot value; returns the normalized config actually stored. */
+function publishConfig(value) {
+	const next = normalizeConfig(value);
+	if (next.triggerMode === current.triggerMode && next.shortcut === current.shortcut) return current;
+	current = next;
+	for (const listener of [...listeners]) listener();
+	return current;
+}
+/**
+* Follow one Host config form. Works with a live form and with the fake one in
+* `verify`; the caller owns disposal.
+*/
+function attachConfigForm(form) {
+	const publish = () => {
+		publishConfig(form.getSnapshot().value);
+	};
+	publish();
+	const off = form.subscribe(publish);
+	return () => {
+		off();
+		publishConfig(void 0);
+	};
+}
+//#endregion
 //#region src/client/dom/floating-layer.ts
 /**
 * Mount point for the selection UI: a zero-size host inside the transcript's
@@ -3399,6 +3901,17 @@ function isFirstLineOnScreen(rect) {
 	return rect.bottom > 0 && rect.top < window.innerHeight && rect.right > 0 && rect.left < window.innerWidth;
 }
 /**
+* First-line box of the live selection in viewport coordinates.
+*
+* The keyboard entry has no pointer to anchor to, so it opens the same menu
+* beside the selected words; the first line is what the reader is looking at.
+*/
+function selectionFirstLineRect() {
+	const selection = window.getSelection();
+	if (!selection || selection.rangeCount === 0 || selection.isCollapsed) return null;
+	return getRangeFirstLineRect(selection.getRangeAt(0)) ?? null;
+}
+/**
 * Read the live selection when it is a non-empty range inside a conversation
 * message and outside the composer / our own chrome.
 */
@@ -3494,30 +4007,548 @@ function linkTarget(text, anchorHref) {
 	return selectionUrl(text) ?? (anchorHref ? selectionUrl(anchorHref) : null);
 }
 //#endregion
-//#region src/client/ui/touch.ts
-/**
-* The same query the coarse-pointer CSS uses. Keeping JS and CSS on one
-* criterion means a device never gets the bottom bar with desktop positioning
-* (or the reverse).
-*/
-const COARSE_POINTER = "(hover: none), (pointer: coarse)";
-function coarsePointer() {
-	if (typeof window === "undefined" || typeof window.matchMedia !== "function") return false;
-	return window.matchMedia(COARSE_POINTER).matches;
-}
-function useCoarsePointer() {
-	const [coarse, setCoarse] = (0, react.useState)(coarsePointer);
-	(0, react.useEffect)(() => {
-		if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
-		const query = window.matchMedia(COARSE_POINTER);
-		const onChange = (event) => setCoarse(event.matches);
-		setCoarse(query.matches);
-		query.addEventListener("change", onChange);
-		return () => query.removeEventListener("change", onChange);
-	}, []);
-	return coarse;
-}
-function measure() {
+//#region src/client/selection/SelectionMenu.tsx
+/** Space between the anchor line's bottom and the menu. */
+const ANCHOR_GAP = 2;
+function SelectionMenu({ snapshot, x, y, onAction, onClose, initialFocus = "first" }) {
+	const rootRef = (0, react.useRef)(null);
+	const firstRef = (0, react.useRef)(null);
+	const [placement, setPlacement] = (0, react.useState)(null);
+	const items = [
+		...linkTarget(snapshot.text, snapshot.anchorHref) ? [{
+			key: "open",
+			icon: "external-link",
+			label: t("toolbar.openLink")
+		}] : [],
+		{
+			key: "copy",
+			icon: "copy",
+			label: t("toolbar.copy")
+		},
+		{
+			key: "add",
+			icon: "plus",
+			label: t("toolbar.addToTask")
+		}
+	];
+	(0, react.useLayoutEffect)(() => {
+		const el = rootRef.current;
+		if (!el) return;
+		const anchor = DOMRect.fromRect({
+			x,
+			y,
+			width: 0,
+			height: 0
+		});
+		setPlacement(placePopover(anchor, {
+			width: el.offsetWidth,
+			height: el.offsetHeight
+		}, "bottom", ANCHOR_GAP));
+	}, [
+		x,
+		y,
+		items.length
+	]);
+	(0, react.useLayoutEffect)(() => {
+		if (!placement) return;
+		if (initialFocus === "menu") rootRef.current?.focus({ preventScroll: true });
+		else firstRef.current?.focus({ preventScroll: true });
+	}, [placement, initialFocus]);
+	(0, react.useEffect)(() => {
+		const inside = (node) => node instanceof Node && rootRef.current?.contains(node) === true;
+		const onPointerDown = (event) => {
+			if (inside(event.target)) return;
+			onClose();
+		};
+		const onContextMenu = (event) => {
+			if (inside(event.target)) {
+				event.preventDefault();
+				return;
+			}
+			onClose();
+		};
+		const onScroll = () => onClose();
+		const onResize = () => onClose();
+		const onBlur = () => onClose();
+		document.addEventListener("pointerdown", onPointerDown, true);
+		document.addEventListener("contextmenu", onContextMenu, true);
+		document.addEventListener("scroll", onScroll, true);
+		window.addEventListener("resize", onResize);
+		window.addEventListener("blur", onBlur);
+		return () => {
+			document.removeEventListener("pointerdown", onPointerDown, true);
+			document.removeEventListener("contextmenu", onContextMenu, true);
+			document.removeEventListener("scroll", onScroll, true);
+			window.removeEventListener("resize", onResize);
+			window.removeEventListener("blur", onBlur);
+		};
+	}, [onClose]);
+	const handleKeyDown = (0, react.useCallback)((event) => {
+		if (event.key === "Escape") {
+			event.preventDefault();
+			event.stopPropagation();
+			onClose();
+			return;
+		}
+		if (event.key === "Tab") {
+			onClose();
+			return;
+		}
+		const step = event.key === "ArrowDown" ? 1 : event.key === "ArrowUp" ? -1 : 0;
+		if (step === 0 && event.key !== "Home" && event.key !== "End") return;
+		const buttons = [...rootRef.current?.querySelectorAll("[role=\"menuitem\"]") ?? []];
+		if (buttons.length === 0) return;
+		event.preventDefault();
+		const current = buttons.indexOf(document.activeElement);
+		const fromMenu = current === -1;
+		buttons[event.key === "Home" ? 0 : event.key === "End" ? buttons.length - 1 : fromMenu ? step > 0 ? 0 : buttons.length - 1 : (current + step + buttons.length) % buttons.length]?.focus({ preventScroll: true });
+	}, [onClose]);
+	const keepSelection = (0, react.useCallback)((event) => {
+		event.preventDefault();
+		event.currentTarget.focus({ preventScroll: true });
+	}, []);
+	return (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		ref: rootRef,
+		className: cx(A.col, styles.ctxMenu),
+		role: "menu",
+		"aria-label": t("menu.aria"),
+		"data-dsq-menu": "true",
+		"data-side": placement?.side ?? "bottom",
+		tabIndex: -1,
+		style: {
+			top: placement?.top ?? 0,
+			left: placement?.left ?? 0,
+			visibility: placement ? "visible" : "hidden"
+		},
+		onKeyDown: handleKeyDown,
+		children: items.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+			ref: index === 0 ? firstRef : void 0,
+			type: "button",
+			role: "menuitem",
+			className: cx(A.plain, A.row, styles.ctxItem),
+			tabIndex: -1,
+			onPointerDown: keepSelection,
+			onPointerEnter: (event) => event.currentTarget.focus({ preventScroll: true }),
+			onClick: () => onAction(item.key),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LucideIcon, {
+				name: item.icon,
+				size: 15
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: item.label })]
+		}, item.key))
+	}), document.body);
+}
+//#endregion
+//#region src/client/selection/ToolbarView.tsx
+/**
+* Paint-only halves of the selection UI: the anchored desktop toolbar/popover
+* and the touch bottom bar/sheet. All state, persistence and placement stay in
+* `SelectionToolbar`; this module owns markup, portals and ARIA only.
+*/
+function ActionRow({ actions, stacked }) {
+	return actions.map((action, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [!stacked && index > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: styles.divider,
+		"aria-hidden": "true"
+	}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: cx(A.plain, stacked ? A.col : A.inlineRow, stacked ? styles.touchAction : styles.button),
+		onClick: action.onClick,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LucideIcon, {
+			name: action.icon,
+			size: stacked ? 18 : 14
+		}), stacked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: action.label }) : action.label]
+	})] }, action.key));
+}
+function CommentField({ comment, touch, commentRef, onChange, onKeyDown }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+		ref: commentRef,
+		className: cx(A.box, styles.commentInput, touch && styles.touchComment),
+		placeholder: t("common.commentPlaceholder"),
+		value: comment,
+		onChange: (event) => onChange(event.target.value),
+		onKeyDown
+	});
+}
+function CommentActions({ comment, touch, onFinishComment }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: cx(A.row, styles.commentActions, touch && styles.touchActions),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: cx(A.plain, A.inlineRow, styles.button, touch && styles.touchSecondary),
+			onClick: () => onFinishComment(false),
+			children: t("toolbar.skipComment")
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: cx(A.plain, A.inlineRow, styles.button, styles.buttonAddComment),
+			disabled: !comment.trim(),
+			onClick: () => onFinishComment(true),
+			children: t("toolbar.addComment")
+		})]
+	});
+}
+function ToolbarView({ touch, phase, active, status, viewport, actions, comment, menuOpen, toolbarStyle, toolbarRef, commentWrapRef, commentRef, onToolbarPointerDown, onCommentChange, onCommentKeyDown, onFinishComment, onCloseSheet }) {
+	const commentField = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentField, {
+		comment,
+		touch,
+		commentRef,
+		onChange: onCommentChange,
+		onKeyDown: onCommentKeyDown
+	});
+	const commentActions = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentActions, {
+		comment,
+		touch,
+		onFinishComment
+	});
+	if (touch) {
+		const bottom = `calc(${viewport.inset}px + 8px + env(safe-area-inset-bottom, 0px))`;
+		return (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+			phase === "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				ref: toolbarRef,
+				className: cx(A.row, styles.touchBar),
+				style: { bottom },
+				role: "toolbar",
+				"aria-label": t("toolbar.aria"),
+				"data-dsq-toolbar": "true",
+				"data-touch": "true",
+				onPointerDown: onToolbarPointerDown,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ActionRow, {
+					actions,
+					stacked: true
+				})
+			}) : null,
+			phase === "comment" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: styles.touchScrim,
+				"aria-hidden": "true"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				ref: commentWrapRef,
+				className: cx(A.col, styles.touchSheet),
+				style: {
+					bottom,
+					maxHeight: `${Math.max(240, Math.round(viewport.height * .72))}px`
+				},
+				role: "dialog",
+				"aria-label": t("toolbar.commentDialogAria"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: cx(A.row, styles.touchSheetHead),
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: styles.touchSheetTitle,
+							children: t("toolbar.commentHint")
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: cx(A.plain, A.gridMid, styles.touchSheetClose),
+							"aria-label": t("common.close"),
+							onClick: onCloseSheet,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LucideIcon, {
+								name: "x",
+								size: 18
+							})
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: styles.touchQuote,
+						children: active.text
+					}),
+					commentField,
+					commentActions
+				]
+			})] }) : null,
+			status ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: styles.touchStatus,
+				style: { bottom: `calc(${viewport.inset}px + 72px + env(safe-area-inset-bottom, 0px))` },
+				role: "status",
+				children: status
+			}) : null
+		] }), document.body);
+	}
+	return (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		menuOpen ? null : phase === "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			ref: toolbarRef,
+			className: cx(A.row, styles.toolbar),
+			style: toolbarStyle,
+			role: "toolbar",
+			"aria-label": t("toolbar.aria"),
+			"data-dsq-toolbar": "true",
+			"data-anchor": active.below ? "below" : "above",
+			onPointerDown: onToolbarPointerDown,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: cx(A.inlineRow, styles.toolbarInner),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ActionRow, {
+					actions,
+					stacked: false
+				})
+			})
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			ref: toolbarRef,
+			className: cx(A.row, styles.toolbar),
+			role: "toolbar",
+			"aria-label": t("toolbar.aria"),
+			"data-dsq-toolbar": "true",
+			"data-anchor": "popover-top",
+			onPointerDown: onToolbarPointerDown,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: cx(A.inlineRow, styles.toolbarInner),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: {
+						padding: "0 8px",
+						fontSize: 13,
+						opacity: .8,
+						whiteSpace: "nowrap"
+					},
+					children: t("toolbar.commentHint")
+				})
+			})
+		}),
+		!menuOpen && phase === "comment" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			ref: commentWrapRef,
+			className: cx(A.col, styles.commentPop),
+			role: "dialog",
+			"aria-label": t("toolbar.commentDialogAria"),
+			onPointerDown: onToolbarPointerDown,
+			children: [commentField, commentActions]
+		}) : null,
+		status ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: styles.status,
+			style: toolbarStyle,
+			role: "status",
+			children: status
+		}) : null
+	] }), active.layer.host);
+}
+//#endregion
+//#region src/client/dom/comment-placement.ts
+const GAP$1 = 8;
+/** Horizontal slack around the popover, and the minimum margin to the box. */
+const EDGE = 8;
+/** Gap between the popover corner and the "add a comment" toolbar. */
+const TOOLBAR_GAP = 6;
+function placeCommentSurfaces({ layer, selection, toolbar, panel }) {
+	const bounds = layer.bounds();
+	const home = layer.fromContent(selection.left, selection.top);
+	const anchor = {
+		left: home.left - toolbar.width / 2,
+		top: home.top - (selection.below ? 0 : toolbar.height),
+		width: toolbar.width,
+		height: toolbar.height
+	};
+	const belowTop = layer.fromContent(0, selection.selectionBottom).top + GAP$1;
+	const aboveTop = anchor.top - panel.height - GAP$1;
+	const top = belowTop <= bounds.bottom - EDGE - panel.height ? belowTop : aboveTop >= bounds.top + EDGE ? aboveTop : Math.max(bounds.top + EDGE, Math.min(belowTop, bounds.bottom - EDGE - panel.height));
+	const half = panel.width / 2 + EDGE;
+	const min = bounds.left + half;
+	const center = Math.min(Math.max(anchor.left + anchor.width / 2, min), Math.max(min, bounds.right - half));
+	const popover = layer.toContent(center, top);
+	let leftView = layer.fromContent(popover.left, popover.top).left - panel.width / 2;
+	let topView = top - TOOLBAR_GAP - toolbar.height;
+	if (topView < bounds.top + EDGE) topView = top + panel.height + TOOLBAR_GAP;
+	leftView = Math.max(bounds.left + EDGE, Math.min(leftView, bounds.right - EDGE - toolbar.width));
+	topView = Math.max(bounds.top + EDGE, Math.min(topView, bounds.bottom - EDGE - toolbar.height));
+	return {
+		popover,
+		toolbar: layer.toContent(leftView, topView)
+	};
+}
+//#endregion
+//#region src/client/selection/useCommentPlacement.ts
+/**
+* Measures the comment popover and its hint toolbar, then writes the geometry
+* from `dom/comment-placement.ts` back as content coordinates. The React
+* component keeps the refs; this hook owns the measure/place lifecycle.
+*/
+function useCommentPlacement({ touch, phase, active, toolbarRef, commentWrapRef }) {
+	const place = (0, react.useCallback)(() => {
+		if (touch) return;
+		const layer = active?.layer;
+		const toolbar = toolbarRef.current;
+		const pop = commentWrapRef.current;
+		if (!active || !layer || !toolbar || !pop) return;
+		pop.style.display = "flex";
+		pop.style.visibility = "hidden";
+		const panel = {
+			width: pop.offsetWidth || 320,
+			height: pop.offsetHeight || 180
+		};
+		pop.style.visibility = "";
+		const at = placeCommentSurfaces({
+			layer,
+			selection: active,
+			toolbar: {
+				width: toolbar.offsetWidth,
+				height: toolbar.offsetHeight
+			},
+			panel
+		});
+		pop.style.top = `${at.popover.top}px`;
+		pop.style.left = `${at.popover.left}px`;
+		toolbar.style.left = `${at.toolbar.left}px`;
+		toolbar.style.top = `${at.toolbar.top}px`;
+	}, [
+		active,
+		commentWrapRef,
+		toolbarRef,
+		touch
+	]);
+	(0, react.useLayoutEffect)(() => {
+		if (phase === "comment") place();
+	}, [phase, place]);
+	(0, react.useEffect)(() => {
+		if (touch) return;
+		window.addEventListener("resize", place);
+		return () => window.removeEventListener("resize", place);
+	}, [place, touch]);
+	return place;
+}
+//#endregion
+//#region src/client/dom/menu-trigger.ts
+function shouldOpenSelectionMenu(signal) {
+	return signal.contextMenuEnabled && !signal.touch && !signal.defaultPrevented && signal.targetInTranscript && signal.pointInSelection && signal.hasSelection;
+}
+/**
+* True when `(x, y)` falls inside any of the selection's line boxes.
+*
+* The union box is wrong here: a short first line leaves empty space to its
+* right that belongs to no word, and a right-click there is not "on the
+* selection". Each line rect plus a small tolerance matches what the user sees.
+*/
+function pointInRects(x, y, rects, tolerance = 2) {
+	for (const rect of rects) if (x >= rect.left - tolerance && x <= rect.right + tolerance && y >= rect.top - tolerance && y <= rect.bottom + tolerance) return true;
+	return false;
+}
+//#endregion
+//#region src/client/selection/useSelectionWatcher.ts
+/**
+* Transcript-wide pointer/selection observation for the toolbar.
+*
+* The controller owns the state; this hook owns *when* to re-read it. Keeping
+* the listener choreography here means the toolbar component does not have to
+* know about the drag/context-menu/scroll ordering rules.
+*/
+/** The menu's own chrome; a press inside it must not dismiss the selection. */
+const MENU_SELECTOR = "[data-dsq-menu]";
+function useSelectionWatcher({ toolbarRef, commentWrapRef, phaseRef, touch, dismissMenu, refresh, flushComment, hide, openMenu }) {
+	(0, react.useEffect)(() => {
+		let scheduled = false;
+		const schedule = () => {
+			if (scheduled) return;
+			scheduled = true;
+			window.setTimeout(() => {
+				scheduled = false;
+				refresh();
+			}, 0);
+		};
+		let dragging = false;
+		const onPointerDown = (event) => {
+			const target = event.target;
+			if (!(target instanceof Node)) return;
+			const inToolbar = toolbarRef.current?.contains(target) === true;
+			const inComment = commentWrapRef.current?.contains(target) === true;
+			const inMenu = target instanceof Element && target.closest(MENU_SELECTOR) !== null;
+			if (inToolbar || inComment || inMenu) return;
+			dragging = true;
+			if (phaseRef.current === "comment") {
+				flushComment();
+				hide();
+				return;
+			}
+			const selection = window.getSelection();
+			if (selection && !selection.isCollapsed && selection.rangeCount > 0) {
+				schedule();
+				return;
+			}
+			hide();
+		};
+		const onPointerUp = () => {
+			dragging = false;
+			schedule();
+		};
+		const onSelectionChange = () => {
+			if (dragging) return;
+			schedule();
+		};
+		const onContextMenu = (event) => {
+			if (dismissMenu()) refresh();
+			if (event.defaultPrevented) return;
+			const target = event.target;
+			if (!(target instanceof Node)) return;
+			if (toolbarRef.current?.contains(target)) return;
+			if (target instanceof Element && target.closest(MENU_SELECTOR)) return;
+			if (touch || phaseRef.current === "comment") return;
+			const contextMenuEnabled = resolveTriggers(getConfig()).contextMenu;
+			if (!contextMenuEnabled) return;
+			const selection = window.getSelection();
+			const hasSelection = selection !== null && !selection.isCollapsed && selection.rangeCount > 0;
+			const pointInSelection = selection !== null && hasSelection && pointInRects(event.clientX, event.clientY, selection.getRangeAt(0).getClientRects());
+			if (!shouldOpenSelectionMenu({
+				defaultPrevented: event.defaultPrevented,
+				contextMenuEnabled,
+				touch,
+				targetInTranscript: isInsideTranscript(target),
+				pointInSelection,
+				hasSelection
+			})) return;
+			const snapshot = readSelectionSnapshot(toolbarRef.current);
+			if (!snapshot) return;
+			event.preventDefault();
+			event.stopPropagation();
+			openMenu(snapshot, event.clientX, event.clientY, "menu");
+		};
+		const onScroll = (event) => {
+			const target = event.target;
+			if (target instanceof Node && (toolbarRef.current?.contains(target) === true || commentWrapRef.current?.contains(target) === true)) return;
+			schedule();
+		};
+		document.addEventListener("pointerdown", onPointerDown, true);
+		document.addEventListener("pointerup", onPointerUp, true);
+		document.addEventListener("keyup", schedule, true);
+		document.addEventListener("selectionchange", onSelectionChange);
+		document.addEventListener("contextmenu", onContextMenu);
+		window.addEventListener("resize", schedule);
+		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);
+			document.removeEventListener("contextmenu", onContextMenu);
+			window.removeEventListener("resize", schedule);
+			document.removeEventListener("scroll", onScroll, true);
+		};
+	}, [
+		commentWrapRef,
+		dismissMenu,
+		flushComment,
+		hide,
+		openMenu,
+		phaseRef,
+		refresh,
+		toolbarRef,
+		touch
+	]);
+}
+//#endregion
+//#region src/client/ui/touch.ts
+/**
+* The same query the coarse-pointer CSS uses. Keeping JS and CSS on one
+* criterion means a device never gets the bottom bar with desktop positioning
+* (or the reverse).
+*/
+const COARSE_POINTER = "(hover: none), (pointer: coarse)";
+function coarsePointer() {
+	if (typeof window === "undefined" || typeof window.matchMedia !== "function") return false;
+	return window.matchMedia(COARSE_POINTER).matches;
+}
+function useCoarsePointer() {
+	const [coarse, setCoarse] = (0, react.useState)(coarsePointer);
+	(0, react.useEffect)(() => {
+		if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
+		const query = window.matchMedia(COARSE_POINTER);
+		const onChange = (event) => setCoarse(event.matches);
+		setCoarse(query.matches);
+		query.addEventListener("change", onChange);
+		return () => query.removeEventListener("change", onChange);
+	}, []);
+	return coarse;
+}
+function measure() {
 	if (typeof window === "undefined") return {
 		inset: 0,
 		height: 0
@@ -3557,7 +4588,7 @@ function useVisualViewport(enabled) {
 	return metrics;
 }
 //#endregion
-//#region src/client/SelectionToolbar.tsx
+//#region src/client/selection/SelectionToolbar.tsx
 /** Cap for the auto-growing comment box; beyond this it scrolls internally. */
 const COMMENT_MAX_HEIGHT = 220;
 function SelectionToolbar({ sessionId }) {
@@ -3569,8 +4600,13 @@ function SelectionToolbar({ sessionId }) {
 	const [phase, setPhase] = (0, react.useState)("idle");
 	const [comment, setComment] = (0, react.useState)("");
 	const [status, setStatus] = (0, react.useState)(null);
+	const [menu, setMenu] = (0, react.useState)(null);
 	const activeRef = (0, react.useRef)(null);
 	activeRef.current = active;
+	const menuRef = (0, react.useRef)(null);
+	menuRef.current = menu;
+	const phaseRef = (0, react.useRef)(phase);
+	phaseRef.current = phase;
 	/** Annotation saved when the comment step opened; the box only edits it. */
 	const pendingIdRef = (0, react.useRef)(null);
 	const touch = useCoarsePointer();
@@ -3579,13 +4615,25 @@ function SelectionToolbar({ sessionId }) {
 		ensureToolbarStyles();
 		if (sessionId) bindAnnotationSession(sessionId);
 	}, [sessionId]);
+	/**
+	* Drop the menu state **and** its ref in one tick. A refresh that runs right
+	* after a dismissal must see the menu as closed; reading the stale ref made
+	* it keep `active`, which raised the auto toolbar in contextmenu mode.
+	*/
+	const dismissMenu = (0, react.useCallback)(() => {
+		if (!menuRef.current) return false;
+		menuRef.current = null;
+		setMenu(null);
+		return true;
+	}, []);
 	const hide = (0, react.useCallback)(() => {
 		pendingIdRef.current = null;
+		dismissMenu();
 		setActive(null);
 		setPhase("idle");
 		setComment("");
 		setStatus(null);
-	}, []);
+	}, [dismissMenu]);
 	/**
 	* Keep what was typed when the comment popover goes away without an explicit
 	* cancel. The annotation itself was saved when the step opened, so dropping
@@ -3599,9 +4647,7 @@ function SelectionToolbar({ sessionId }) {
 		if (typed.trim()) updateAnnotationComment(void 0, id, typed);
 	}, []);
 	/** Save the current selection without a comment; returns the store id. */
-	const saveSelection = (0, react.useCallback)(() => {
-		const snapshot = activeRef.current;
-		if (!snapshot) return null;
+	const saveSelection = (0, react.useCallback)((snapshot) => {
 		return saveAnnotation(void 0, {
 			text: snapshot.text,
 			sources: snapshot.source ? [{
@@ -3613,139 +4659,107 @@ function SelectionToolbar({ sessionId }) {
 			}] : void 0
 		}).id;
 	}, []);
-	const refresh = (0, react.useCallback)(() => {
-		const next = readSelectionSnapshot(toolbarRef.current);
-		if (!next) {
-			if (phaseRef.current === "idle") setActive(null);
-			return;
-		}
-		const current = activeRef.current;
-		if (phaseRef.current === "comment" && current && current.text !== next.text) {
-			flushComment();
-			setPhase("idle");
-			setComment("");
-		}
-		setActive((prev) => prev && prev.text === next.text && prev.left === next.left && prev.top === next.top && prev.below === next.below && prev.layer === next.layer ? prev : next);
-	}, [flushComment]);
-	const phaseRef = (0, react.useRef)(phase);
-	phaseRef.current = phase;
-	(0, react.useEffect)(() => {
-		let scheduled = false;
-		const schedule = () => {
-			if (scheduled) return;
-			scheduled = true;
-			window.setTimeout(() => {
-				scheduled = false;
-				refresh();
-			}, 0);
-		};
-		let dragging = false;
-		const onPointerDown = (event) => {
-			const target = event.target;
-			if (!(target instanceof Node)) return;
-			const inToolbar = toolbarRef.current?.contains(target) === true;
-			const inComment = commentWrapRef.current?.contains(target) === true;
-			if (inToolbar || inComment) return;
-			dragging = true;
-			if (phaseRef.current === "comment") {
-				flushComment();
-				hide();
-				return;
-			}
-			const selection = window.getSelection();
-			if (selection && !selection.isCollapsed && selection.rangeCount > 0) {
-				schedule();
-				return;
-			}
-			hide();
-		};
-		const onPointerUp = () => {
-			dragging = false;
-			schedule();
-		};
-		const onSelectionChange = () => {
-			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;
-			schedule();
-		};
-		document.addEventListener("pointerdown", onPointerDown, true);
-		document.addEventListener("pointerup", onPointerUp, true);
-		document.addEventListener("keyup", schedule, true);
-		document.addEventListener("selectionchange", onSelectionChange);
-		window.addEventListener("resize", schedule);
-		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", schedule);
-			document.removeEventListener("scroll", onScroll, true);
-		};
+	/**
+	* "Add to task" is the commit: the quote is saved immediately, with or
+	* without a comment. The popover only edits that saved entry, so dismissing
+	* it (outside click, new selection) can never undo the annotation.
+	*/
+	const beginComment = (0, react.useCallback)((snapshot) => {
+		pendingIdRef.current = saveSelection(snapshot);
+		setActive(snapshot);
+		dismissMenu();
+		setPhase("comment");
+		setComment("");
+		setStatus(null);
+	}, [dismissMenu, saveSelection]);
+	const refresh = (0, react.useCallback)(() => {
+		const next = readSelectionSnapshot(toolbarRef.current);
+		if (!next) {
+			dismissMenu();
+			if (phaseRef.current === "idle") setActive(null);
+			return;
+		}
+		if (menuRef.current && menuRef.current.snapshot.text !== next.text) dismissMenu();
+		if (!touch && !resolveTriggers(getConfig()).auto) {
+			if (phaseRef.current === "idle" && !menuRef.current) setActive(null);
+			return;
+		}
+		const current = activeRef.current;
+		if (phaseRef.current === "comment" && current && current.text !== next.text) {
+			flushComment();
+			setPhase("idle");
+			setComment("");
+		}
+		setActive((prev) => prev && prev.text === next.text && prev.left === next.left && prev.top === next.top && prev.below === next.below && prev.layer === next.layer ? prev : next);
 	}, [
+		dismissMenu,
 		flushComment,
-		hide,
-		refresh
+		touch
 	]);
-	const placeCommentPop = (0, react.useCallback)(() => {
+	/** Latch the selection and anchor; the menu outlives later refresh passes. */
+	const openMenu = (0, react.useCallback)((snapshot, x, y, initialFocus) => {
+		setStatus(null);
+		setActive(snapshot);
+		setMenu({
+			snapshot,
+			x,
+			y,
+			initialFocus
+		});
+	}, []);
+	(0, react.useEffect)(() => subscribeConfig(() => {
+		dismissMenu();
+		refresh();
+	}), [dismissMenu, refresh]);
+	useSelectionWatcher({
+		toolbarRef,
+		commentWrapRef,
+		phaseRef,
+		touch,
+		dismissMenu,
+		refresh,
+		flushComment,
+		hide,
+		openMenu
+	});
+	(0, react.useEffect)(() => {
 		if (touch) return;
-		const snapshot = activeRef.current;
-		const layer = snapshot?.layer;
-		const toolbar = toolbarRef.current;
-		const pop = commentWrapRef.current;
-		if (!snapshot || !layer || !toolbar || !pop) return;
-		const bounds = layer.bounds();
-		const toolbarW = toolbar.offsetWidth;
-		const toolbarH = toolbar.offsetHeight;
-		const home = layer.fromContent(snapshot.left, snapshot.top);
-		const anchor = {
-			left: home.left - toolbarW / 2,
-			top: home.top - (snapshot.below ? 0 : toolbarH),
-			width: toolbarW,
-			height: toolbarH
+		const bridge = {
+			state: () => {
+				if (phaseRef.current !== "idle") return "busy";
+				return readSelectionSnapshot(toolbarRef.current) ? "ready" : "no-selection";
+			},
+			open: () => {
+				if (phaseRef.current !== "idle") return;
+				const snapshot = readSelectionSnapshot(toolbarRef.current);
+				if (!snapshot) return;
+				const rect = selectionFirstLineRect();
+				if (!rect) return;
+				openMenu(snapshot, rect.left, rect.bottom, "first");
+			},
+			add: () => {
+				if (phaseRef.current !== "idle") return;
+				const snapshot = readSelectionSnapshot(toolbarRef.current);
+				if (!snapshot) return;
+				beginComment(snapshot);
+			}
 		};
-		pop.style.display = "flex";
-		pop.style.visibility = "hidden";
-		const panel = {
-			width: pop.offsetWidth || 320,
-			height: pop.offsetHeight || 180
+		runtime.selection = bridge;
+		return () => {
+			if (runtime.selection === bridge) delete runtime.selection;
 		};
-		pop.style.visibility = "";
-		const gap = 8;
-		const margin = 8;
-		const belowTop = layer.fromContent(0, snapshot.selectionBottom).top + gap;
-		const aboveTop = anchor.top - panel.height - gap;
-		const top = belowTop <= bounds.bottom - margin - panel.height ? belowTop : aboveTop >= bounds.top + margin ? aboveTop : Math.max(bounds.top + margin, Math.min(belowTop, bounds.bottom - margin - panel.height));
-		const half = panel.width / 2 + 8;
-		const min = bounds.left + half;
-		const center = Math.min(Math.max(anchor.left + anchor.width / 2, min), Math.max(min, bounds.right - half));
-		const at = layer.toContent(center, top);
-		pop.style.top = `${at.top}px`;
-		pop.style.left = `${at.left}px`;
-		const sideGap = 6;
-		const popLeftView = layer.fromContent(at.left, at.top).left - panel.width / 2;
-		const popTopView = top;
-		let leftView = popLeftView;
-		let topView = popTopView - sideGap - toolbarH;
-		if (topView < bounds.top + margin) topView = popTopView + panel.height + sideGap;
-		leftView = Math.max(bounds.left + margin, Math.min(leftView, bounds.right - margin - toolbarW));
-		topView = Math.max(bounds.top + margin, Math.min(topView, bounds.bottom - margin - toolbarH));
-		const toolbarAt = layer.toContent(leftView, topView);
-		toolbar.style.left = `${toolbarAt.left}px`;
-		toolbar.style.top = `${toolbarAt.top}px`;
-	}, [touch]);
-	(0, react.useLayoutEffect)(() => {
-		if (phase === "comment" && !touch) placeCommentPop();
 	}, [
-		active,
-		phase,
-		placeCommentPop,
+		beginComment,
+		openMenu,
 		touch
 	]);
+	const placeCommentPop = useCommentPlacement({
+		touch,
+		phase,
+		active,
+		toolbarRef,
+		commentWrapRef
+	});
 	const layer = active?.layer;
 	(0, react.useLayoutEffect)(() => {
 		if (!layer || touch) return;
@@ -3759,12 +4773,6 @@ function SelectionToolbar({ sessionId }) {
 	(0, react.useEffect)(() => {
 		if (phase === "comment" && !touch) commentRef.current?.focus();
 	}, [phase, touch]);
-	(0, react.useEffect)(() => {
-		if (touch) return;
-		const onResize = () => placeCommentPop();
-		window.addEventListener("resize", onResize);
-		return () => window.removeEventListener("resize", onResize);
-	}, [placeCommentPop, touch]);
 	(0, react.useLayoutEffect)(() => {
 		if (phase !== "comment") return;
 		const area = commentRef.current;
@@ -3782,9 +4790,8 @@ function SelectionToolbar({ sessionId }) {
 		event.preventDefault();
 		event.stopPropagation();
 	}, []);
-	const handleCopy = (0, react.useCallback)(async () => {
-		const snapshot = activeRef.current;
-		if (!snapshot) return;
+	/** Copy a latched quote; a failure leaves the caller's surface in place. */
+	const copySnapshot = (0, react.useCallback)(async (snapshot) => {
 		try {
 			await copyText(snapshot.text);
 			clearNativeSelection();
@@ -3793,18 +4800,14 @@ function SelectionToolbar({ sessionId }) {
 			setStatus(t("toolbar.copyFailed"));
 		}
 	}, [hide]);
-	/**
-	* "Add to task" is the commit: the quote is saved immediately, with or
-	* without a comment. The popover only edits that saved entry, so dismissing
-	* it (outside click, new selection) can never undo the annotation.
-	*/
+	const handleCopy = (0, react.useCallback)(() => {
+		const snapshot = activeRef.current;
+		if (snapshot) copySnapshot(snapshot);
+	}, [copySnapshot]);
 	const openComment = (0, react.useCallback)(() => {
-		if (!activeRef.current) return;
-		pendingIdRef.current = saveSelection();
-		setPhase("comment");
-		setComment("");
-		setStatus(null);
-	}, [saveSelection]);
+		const snapshot = activeRef.current;
+		if (snapshot) beginComment(snapshot);
+	}, [beginComment]);
 	/**
 	* Hand the selected link to the system browser.
 	*
@@ -3814,14 +4817,33 @@ function SelectionToolbar({ sessionId }) {
 	* arbitrary URLs there is what wedges it). Only http(s) selections get this
 	* button — every other scheme is refused by that handler.
 	*/
-	const handleOpenLink = (0, react.useCallback)(() => {
-		const snapshot = activeRef.current;
-		const url = snapshot ? linkTarget(snapshot.text, snapshot.anchorHref) : null;
+	const openLinkSnapshot = (0, react.useCallback)((snapshot) => {
+		const url = linkTarget(snapshot.text, snapshot.anchorHref);
 		if (!url) return;
 		window.open(url, "_blank", "noopener,noreferrer");
 		clearNativeSelection();
 		hide();
 	}, [hide]);
+	const handleOpenLink = (0, react.useCallback)(() => {
+		const snapshot = activeRef.current;
+		if (snapshot) openLinkSnapshot(snapshot);
+	}, [openLinkSnapshot]);
+	/** Dismissal without an action hands control back to the normal toolbar rules. */
+	const closeMenu = (0, react.useCallback)(() => {
+		if (!dismissMenu()) return;
+		refresh();
+	}, [dismissMenu, refresh]);
+	const handleMenuAction = (0, react.useCallback)((action) => {
+		const current = menuRef.current;
+		if (!current) return;
+		if (action === "add") beginComment(current.snapshot);
+		else if (action === "copy") copySnapshot(current.snapshot);
+		else openLinkSnapshot(current.snapshot);
+	}, [
+		beginComment,
+		copySnapshot,
+		openLinkSnapshot
+	]);
 	/** Close the optional comment step; the annotation stays saved either way. */
 	const finishComment = (0, react.useCallback)((keepComment) => {
 		if (keepComment) flushComment();
@@ -3839,6 +4861,18 @@ function SelectionToolbar({ sessionId }) {
 		flushComment();
 		hide();
 	}, [flushComment, hide]);
+	const handleCommentKeyDown = (0, react.useCallback)((event) => {
+		if (event.key === "Escape") {
+			event.preventDefault();
+			pendingIdRef.current = null;
+			hide();
+			return;
+		}
+		if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+			event.preventDefault();
+			finishComment(true);
+		}
+	}, [finishComment, hide]);
 	if (!active) return null;
 	const toolbarStyle = {
 		left: active.left,
@@ -3855,7 +4889,7 @@ function SelectionToolbar({ sessionId }) {
 			key: "copy",
 			icon: "copy",
 			label: t("toolbar.copy"),
-			onClick: () => void handleCopy()
+			onClick: handleCopy
 		},
 		{
 			key: "add",
@@ -3864,154 +4898,344 @@ function SelectionToolbar({ sessionId }) {
 			onClick: openComment
 		}
 	];
-	const actionRow = (stacked) => actions.map((action, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [!stacked && index > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-		className: styles.divider,
-		"aria-hidden": "true"
-	}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-		type: "button",
-		className: cx(A.plain, stacked ? A.col : A.inlineRow, stacked ? styles.touchAction : styles.button),
-		onClick: action.onClick,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LucideIcon, {
-			name: action.icon,
-			size: stacked ? 18 : 14
-		}), stacked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: action.label }) : action.label]
-	})] }, action.key));
-	const commentField = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
-		ref: commentRef,
-		className: cx(A.box, styles.commentInput, touch && styles.touchComment),
-		placeholder: t("common.commentPlaceholder"),
-		value: comment,
-		onChange: (e) => setComment(e.target.value),
-		onKeyDown: (e) => {
-			if (e.key === "Escape") {
-				e.preventDefault();
-				pendingIdRef.current = null;
-				hide();
-				return;
-			}
-			if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
-				e.preventDefault();
-				finishComment(true);
-			}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarView, {
+		touch,
+		phase,
+		active,
+		status,
+		viewport,
+		actions,
+		comment,
+		toolbarStyle,
+		toolbarRef,
+		commentWrapRef,
+		commentRef,
+		menuOpen: menu !== null,
+		onToolbarPointerDown: handleToolbarPointerDown,
+		onCommentChange: setComment,
+		onCommentKeyDown: handleCommentKeyDown,
+		onFinishComment: finishComment,
+		onCloseSheet: closeCommentSheet
+	}), menu ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectionMenu, {
+		snapshot: menu.snapshot,
+		x: menu.x,
+		y: menu.y,
+		initialFocus: menu.initialFocus,
+		onAction: handleMenuAction,
+		onClose: closeMenu
+	}) : null] });
+}
+//#endregion
+//#region src/client/shortcut-menu.ts
+const SELECTION_MENU_COMMAND_ID = "select-quote.openMenu";
+const ADD_TO_TASK_COMMAND_ID = "select-quote.addToTask";
+/**
+* Defaults per device profile.
+*
+* The two commands never share a binding. Web Linux admits only
+* `primary+Slash`, `primary+shift+Comma` and `primary+shift+Period`, and the
+* Host owns `primary+Slash` for its shortcut panel, so the menu takes comma and
+* add-to-task takes period. Web macOS/Windows accept two-modifier combinations;
+* theirs avoid the browser's own menu keys. Desktop Windows/Linux also take
+* period for add-to-task: `Ctrl+Alt+L` is AltGr+L on several layouts, and on
+* Windows the shell dispatches configured shortcuts before input regions.
+*/
+const SELECTION_MENU_DEFAULTS = Object.freeze({
+	"desktop:macos": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary"])
+	}),
+	"desktop:windows": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"desktop:linux": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"web:macos": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"web:windows": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"web:linux": Object.freeze({
+		code: "Comma",
+		modifiers: Object.freeze(["primary", "shift"])
+	})
+});
+const ADD_TO_TASK_DEFAULTS = Object.freeze({
+	"desktop:macos": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"desktop:windows": Object.freeze({
+		code: "Period",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"desktop:linux": Object.freeze({
+		code: "Period",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"web:macos": Object.freeze({
+		code: "KeyL",
+		modifiers: Object.freeze(["primary", "alt"])
+	}),
+	"web:windows": Object.freeze({
+		code: "Period",
+		modifiers: Object.freeze(["primary", "shift"])
+	}),
+	"web:linux": Object.freeze({
+		code: "Period",
+		modifiers: Object.freeze(["primary", "shift"])
+	})
+});
+function resolveSelectionAction(action) {
+	const bridge = runtime.selection;
+	if (!bridge) return {
+		status: "blocked",
+		reason: t("menu.noSelection")
+	};
+	const state = bridge.state();
+	if (state === "busy") return {
+		status: "blocked",
+		reason: t("menu.busy")
+	};
+	if (state === "no-selection") return {
+		status: "blocked",
+		reason: t("menu.noSelection")
+	};
+	return {
+		status: "handled",
+		run: () => bridge[action]()
+	};
+}
+function selectionMenuCommand() {
+	return {
+		id: SELECTION_MENU_COMMAND_ID,
+		label: () => t("menu.shortcutLabel"),
+		aliases: ["selection menu", "quote menu"],
+		defaults: SELECTION_MENU_DEFAULTS,
+		regions: ["page"],
+		modals: [],
+		resolve: () => resolveSelectionAction("open")
+	};
+}
+function addToTaskCommand() {
+	return {
+		id: ADD_TO_TASK_COMMAND_ID,
+		label: () => t("menu.addShortcutLabel"),
+		aliases: ["add to task", "annotate selection"],
+		defaults: ADD_TO_TASK_DEFAULTS,
+		regions: ["page"],
+		modals: [],
+		resolve: () => resolveSelectionAction("add")
+	};
+}
+let shortcutRows = [];
+const shortcutListeners = /* @__PURE__ */ new Set();
+function getShortcutRows() {
+	return shortcutRows;
+}
+function subscribeShortcutRows(listener) {
+	shortcutListeners.add(listener);
+	return () => {
+		shortcutListeners.delete(listener);
+	};
+}
+function publishShortcutRows(next) {
+	if (next.length === shortcutRows.length && next.every((row, index) => {
+		const previous = shortcutRows[index];
+		return previous.id === row.id && previous.label === row.label && previous.enabled === row.enabled && previous.keys.length === row.keys.length && previous.keys.every((key, keyIndex) => key === row.keys[keyIndex]);
+	})) return;
+	shortcutRows = next;
+	for (const listener of [...shortcutListeners]) listener();
+}
+/**
+* Mirror the two live catalog rows. The Host drops a command from the catalog
+* while it is unregistered, and marks a rebound conflict; the settings page
+* reads this instead of restating the defaults.
+*/
+function publishShortcutCatalog(ctx) {
+	const catalog = ctx.shortcuts.catalog.getSnapshot();
+	const next = [];
+	for (const id of [SELECTION_MENU_COMMAND_ID, ADD_TO_TASK_COMMAND_ID]) {
+		const row = catalog.find((candidate) => candidate.id === id);
+		if (!row) continue;
+		next.push({
+			id,
+			label: row.label,
+			keys: row.keys,
+			enabled: row.issue === null && row.conflicts.length === 0
+		});
+	}
+	publishShortcutRows(next);
+}
+/** Keep both commands registered exactly while the setting is on. */
+function installSelectionShortcut(ctx) {
+	const disposers = [];
+	const unregisterAll = () => {
+		while (disposers.length > 0) disposers.pop()?.();
+	};
+	const sync = () => {
+		unregisterAll();
+		if (!getConfig().shortcut) return;
+		for (const command of [selectionMenuCommand(), addToTaskCommand()]) try {
+			disposers.push(ctx.shortcuts.register(command));
+		} catch (error) {
+			console.warn(`[dsh-select-quote] shortcut registration failed for ${command.id}:`, error);
 		}
+	};
+	ctx.effect(() => {
+		const syncCatalog = () => publishShortcutCatalog(ctx);
+		syncCatalog();
+		const offCatalog = ctx.shortcuts.catalog.subscribe(syncCatalog);
+		sync();
+		const off = subscribeConfig(sync);
+		return () => {
+			off();
+			offCatalog();
+			unregisterAll();
+			publishShortcutRows([]);
+		};
+	}, "dsh-select-quote: shortcut commands");
+}
+//#endregion
+//#region src/client/settings/ConfigRow.tsx
+const CHOICES = [
+	"auto",
+	"contextmenu",
+	"both"
+];
+function ConfigRow({ view, form, t: slotTranslate }) {
+	useLocale();
+	if (view !== "page" || form === void 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfigSection, {
+		form,
+		slotTranslate
 	});
-	const commentActions = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: cx(A.row, styles.commentActions, touch && styles.touchActions),
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			type: "button",
-			className: cx(A.plain, A.inlineRow, styles.button, touch && styles.touchSecondary),
-			onClick: () => finishComment(false),
-			children: t("toolbar.skipComment")
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			type: "button",
-			className: cx(A.plain, A.inlineRow, styles.button, styles.buttonAddComment),
-			disabled: !comment.trim(),
-			onClick: () => finishComment(true),
-			children: t("toolbar.addComment")
-		})]
-	});
-	if (touch) {
-		const bottom = `calc(${viewport.inset}px + 8px + env(safe-area-inset-bottom, 0px))`;
-		return (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-			phase === "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				ref: toolbarRef,
-				className: cx(A.row, styles.touchBar),
-				style: { bottom },
-				role: "toolbar",
-				"aria-label": t("toolbar.aria"),
-				"data-dsq-toolbar": "true",
-				"data-touch": "true",
-				onPointerDown: handleToolbarPointerDown,
-				children: actionRow(true)
-			}) : null,
-			phase === "comment" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: styles.touchScrim,
+}
+/**
+* The bundle config entry gets no `form` prop from the Host (unlike a row
+* page), so it subscribes to the row's form controller itself. The controller
+* owns write ordering and revisions; `set` is the one-field convenience.
+*/
+function ConfigSection({ form, slotTranslate }) {
+	const subscribe = (0, react.useCallback)((listener) => form.subscribe(listener), [form]);
+	const getSnapshot = (0, react.useCallback)(() => form.getSnapshot(), [form]);
+	const current = normalizeConfig((0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot).value);
+	const shortcuts = (0, react.useSyncExternalStore)(subscribeShortcutRows, getShortcutRows, getShortcutRows);
+	const t$1 = slotTranslate ?? t;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: styles.settings,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: styles.settingsSection,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: styles.settingsCopy,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.settingsLabel,
+						children: t$1("settings.trigger")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.settingsHint,
+						children: t$1("settings.triggerHint")
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: styles.seg,
+					role: "radiogroup",
+					"aria-label": t$1("settings.trigger"),
+					children: CHOICES.map((mode) => {
+						const active = mode === current.triggerMode;
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+							className: styles.segOption,
+							"data-active": active,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+								type: "radio",
+								className: styles.srOnly,
+								name: "dsq-trigger-mode",
+								value: mode,
+								checked: active,
+								onChange: () => {
+									if (active) return;
+									form.set("triggerMode", mode);
+								}
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t$1(`settings.trigger.${mode}`) })]
+						}, mode);
+					})
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: styles.settingsDivider,
 				"aria-hidden": "true"
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				ref: commentWrapRef,
-				className: cx(A.col, styles.touchSheet),
-				style: {
-					bottom,
-					maxHeight: `${Math.max(240, Math.round(viewport.height * .72))}px`
-				},
-				role: "dialog",
-				"aria-label": t("toolbar.commentDialogAria"),
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: cx(A.row, styles.touchSheetHead),
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: styles.touchSheetTitle,
-							children: t("toolbar.commentHint")
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-							type: "button",
-							className: cx(A.plain, A.gridMid, styles.touchSheetClose),
-							"aria-label": t("common.close"),
-							onClick: closeCommentSheet,
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LucideIcon, {
-								name: "x",
-								size: 18
-							})
-						})]
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: styles.touchQuote,
-						children: active.text
-					}),
-					commentField,
-					commentActions
-				]
-			})] }) : null,
-			status ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: styles.touchStatus,
-				style: { bottom: `calc(${viewport.inset}px + 72px + env(safe-area-inset-bottom, 0px))` },
-				role: "status",
-				children: status
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				className: styles.settingsSwitchRow,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: styles.settingsCopy,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.settingsLabel,
+						children: t$1("settings.shortcut")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.settingsHint,
+						children: t$1("settings.shortcutHint")
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: styles.switch,
+					"data-on": current.shortcut,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						type: "checkbox",
+						className: styles.srOnly,
+						"aria-label": t$1("settings.shortcut"),
+						checked: current.shortcut,
+						onChange: (event) => {
+							const next = event.target.checked;
+							if (next === current.shortcut) return;
+							form.set("shortcut", next);
+						}
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.switchTrack,
+						"aria-hidden": "true"
+					})]
+				})]
+			}),
+			current.shortcut ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+				className: styles.settingsShortcuts,
+				"aria-label": t$1("settings.shortcutListAria"),
+				children: shortcuts.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
+					className: styles.settingsHint,
+					children: t$1("settings.shortcutUnavailable")
+				}) : shortcuts.map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+					className: styles.settingsShortcutRow,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.settingsShortcutName,
+						children: row.label
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: styles.settingsShortcutKeys,
+						children: row.enabled ? row.keys.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("kbd", {
+							className: styles.keycap,
+							children: row.keys.join("")
+						}) : t$1("settings.shortcutUnbound") : t$1("settings.shortcutConflict")
+					})]
+				}, row.id))
 			}) : null
-		] }), document.body);
-	}
-	return (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			ref: toolbarRef,
-			className: cx(A.row, styles.toolbar),
-			style: phase === "comment" ? void 0 : toolbarStyle,
-			role: "toolbar",
-			"aria-label": t("toolbar.aria"),
-			"data-dsq-toolbar": "true",
-			"data-anchor": phase === "comment" ? "popover-top" : active.below ? "below" : "above",
-			onPointerDown: handleToolbarPointerDown,
-			children: phase === "comment" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: cx(A.inlineRow, styles.toolbarInner),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					style: {
-						padding: "0 8px",
-						fontSize: 13,
-						opacity: .8,
-						whiteSpace: "nowrap"
-					},
-					children: t("toolbar.commentHint")
-				})
-			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: cx(A.inlineRow, styles.toolbarInner),
-				children: actionRow(false)
-			})
-		}),
-		phase === "comment" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			ref: commentWrapRef,
-			className: cx(A.col, styles.commentPop),
-			role: "dialog",
-			"aria-label": t("toolbar.commentDialogAria"),
-			onPointerDown: handleToolbarPointerDown,
-			children: [commentField, commentActions]
-		}) : null,
-		status ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: styles.status,
-			style: toolbarStyle,
-			role: "status",
-			children: status
-		}) : null
-	] }), active.layer.host);
+		]
+	});
 }
 //#endregion
+//#region src/shared/identity.ts
+/**
+* Names the Loader and the settings layer agree on.
+*
+* The row id lives in `cordis.patch.yml` (and the local `dev.patch.yml`); the
+* Host config form is keyed by it, so renaming either without this constant
+* would silently orphan the form. The bundle config section is keyed by the
+* package name instead.
+*/
+const PACKAGE_NAME = "dsh-select-quote";
+const ROW_ID = "select-quote";
+//#endregion
 //#region src/client/transcript/quote-registry.ts
 /**
 * Quotes rendered for a user message, keyed by that message's flow key.
@@ -5030,6 +6254,19 @@ function apply(ctx) {
 		subscribe: (listener) => ctx.locale.subscribe(listener)
 	});
 	ctx.effect(() => subscribeLocale(() => refreshDirectiveChips()), "dsh-select-quote: chip language");
+	ctx.inject(["configForms"], (scope) => {
+		scope.effect(() => attachConfigForm(scope.configForms.get(ROW_ID)), "dsh-select-quote: config");
+		const form = scope.configForms.get(ROW_ID);
+		scope.effect(() => scope.configForms.whileServed([ROW_ID], () => scope.slots.inject("plugins.bundle.config", () => scope.slots.register({
+			name: "plugins.bundle.config",
+			key: PACKAGE_NAME,
+			locale: LOCALE_NS,
+			inject: () => ({ form })
+		}, ConfigRow))), "dsh-select-quote: settings section");
+	});
+	ctx.inject(["shortcuts"], (scope) => {
+		installSelectionShortcut(scope);
+	});
 	ctx.effect(() => watchAnnotationDirectives(), "dsh-select-quote: annotation directives");
 	ctx.effect(() => watchAnnotationMarks(), "dsh-select-quote: annotation marks");
 	ctx.effect(() => watchSubmissionEcho(), "dsh-select-quote: submission echo");