dsh-conversation-navigator 0.2.9 → 0.2.10

package/README.en.md

@@ -27,6 +27,7 @@ Browser-only (no host behavior), plain JavaScript, zero build step, zero npm dep
 
 - **Turn-folded outline**: shows "Turn N + your question" rows by default, long conversations at a glance
 - **Keyword filter**: click the top-left search icon to reveal the inline input; matches only your questions + the assistant's actual reply text (context, tool calls, commands, compaction and reasoning never match); hits are highlighted and the list text is windowed to the keyword
+- **Jump straight to the hit**: clicking a search result scrolls to where the keyword actually appears in the conversation (not just the top of the message) and marks every occurrence inside that message — a brief flash that eases into a soft persistent tint, so long replies no longer need hunting
 - **Expand / collapse steps**: the arrow button on the right of each turn row (`▸ N`, rotates to `▾` when expanded) smoothly expands or collapses the turn's step details (assistant replies, tool calls, commands, compaction points, etc.)
 - **Hover full text**: rest the mouse on a turn row and a bubble shows the user's complete question, no longer truncated to one line
 - **Full / Hidden / Minimal-left modes**: the header toggle cycles three states —
@@ -101,7 +102,7 @@ Official v0.1.2-rc.1 made a breaking change to the conversation data layer (conv
 
 | Host `dsh-client-ui-conversation` | Matching plugin version | npm tag |
 |---|---|---|
-| **≥ 0.1.2-rc.1** (has the `uiConversation` service) | **0.2.6 and later** (currently 0.2.9) | `latest` (default) |
+| **≥ 0.1.2-rc.1** (has the `uiConversation` service) | **0.2.6 and later** (currently 0.2.10) | `latest` (default) |
 | **≤ 0.1.1-rc.2** (no `uiConversation`, legacy `session.chat` snapshot) | **0.2.5 and earlier** | `legacy` |
 
 - New hosts can install the latest normally (`dsh plugin --profile web add dsh-conversation-navigator`).
@@ -122,11 +123,14 @@ example.patch.yml    # patch example for manual installs
 
 ## Traffic
 
-![Traffic trend](./docs/traffic/traffic-trend.svg)
+Window **2026-08-17 → 2026-09-20** (refreshed daily by GitHub Actions):
 
-- Refreshed daily by GitHub Actions (top: GitHub unique visitors / unique cloners; bottom: npm daily downloads; orange dashed lines mark releases).
-- Details: [traffic-report.md](./docs/traffic/traffic-report.md) | raw archive: [traffic-archive.json](./docs/traffic/traffic-archive.json) | docs & manual refresh: [docs/traffic](./docs/traffic/README.md)
-- Why an archive: GitHub's traffic API only keeps a rolling 14-day window, and older data is lost forever — this repo merges every fetch into a durable, append-mostly daily series.
+| npm downloads | GitHub unique visitors | GitHub unique cloners | Stars | Forks |
+| ---: | ---: | ---: | ---: | ---: |
+| 6,206 | 540 | 335 | 23 | 1 |
+
+- Details: [traffic-report.md](./docs/traffic/traffic-report.md) | raw archive: [traffic-archive.json](./docs/traffic/traffic-archive.json) | chart & docs: [docs/traffic](./docs/traffic/README.md)
+- Caveats: npm downloads include mirrors, CI and reinstalls, with a 1–2 day settlement lag; GitHub unique visitors / cloners are closer to real user counts.
 
 ## License
 

package/README.md

@@ -27,6 +27,7 @@
 
 - **按轮折叠大纲**:默认只显示"第 N 轮 + 你的问题"列表,长对话一目了然
 - **关键词过滤**:点击左上角搜索图标呼出输入框,只按「你的提问 + 助手实际回复文本」过滤(上下文、工具、命令、压缩、推理等不参与匹配),命中词高亮,列表文本自动定位到关键词处
+- **搜索命中直达**:点击命中的搜索结果,直接滚动到关键词在会话正文中出现的位置(不再只对齐消息顶部),并把该条消息内所有命中处标出来——先亮一下,再平滑淡出为常驻淡色,长回复里不用再自己找
 - **展开/折叠步次**:点击轮次行右侧的箭头按钮(`▸ N`,展开时旋转为 `▾`)平滑展开/折叠该轮的步次明细(助手回复、工具调用、命令、压缩点等)
 - **悬停查看全文**:鼠标在轮次行停留片刻,气泡显示该轮用户提问的完整原文,不再被单行截断
 - **显示 / 隐藏 / 极简·左三种形态**:头部切换按钮三态循环——「显示轮次」为经典分组视图(压缩等系统事件与轮次同级加粗展示)→「隐藏轮次」每行统一为轨迹徽标 + 文本(用户 = 业务蓝、助手 = 紫罗兰、压缩 = 中性灰)→「极简·左」锚定对话区左缘(为 dsh-better-sidebar 让出右侧,并与官方右侧轨道零重叠),再回到「显示轮次」;「极简·右」形态自 0.2.6 起暂缓(与官方 TurnNavigator 轨道视觉重叠),代码保留;
@@ -98,7 +99,7 @@ dsh plugin --profile web add ./dsh-conversation-navigator-<version>.tgz
 
 | 宿主 `dsh-client-ui-conversation` | 对应插件版本 | npm 标签 |
 |---|---|---|
-| **≥ 0.1.2-rc.1**（有 `uiConversation` 服务） | **0.2.6 及以后**（当前 0.2.9） | `latest`（默认） |
+| **≥ 0.1.2-rc.1**（有 `uiConversation` 服务） | **0.2.6 及以后**（当前 0.2.10） | `latest`（默认） |
 | **≤ 0.1.1-rc.2**（无 `uiConversation`，旧 `session.chat` 快照） | **0.2.5 及以前** | `legacy` |
 
 - 新宿主直接安装最新版即可（`dsh plugin --profile web add dsh-conversation-navigator`）。
@@ -119,11 +120,14 @@ example.patch.yml    # 手动安装时的补丁示例
 
 ## 流量
 
-![流量趋势](./docs/traffic/traffic-trend.svg)
+统计区间 **2026-08-17 → 2026-09-20**（GitHub Actions 每日自动刷新）：
 
-- 上图由 GitHub Actions 每日自动刷新（上半区 GitHub 独立访客/独立克隆者，下半区 npm 每日下载，橙色虚线为发版日）。
-- 明细报告：[traffic-report.md](./docs/traffic/traffic-report.md)｜原始归档：[traffic-archive.json](./docs/traffic/traffic-archive.json)｜说明与本地刷新：[docs/traffic](./docs/traffic/README.md)
-- 为什么需要归档：GitHub 流量 API 只保留最近 14 天，过期即永久丢失；本仓库把每次抓取合并留存，逐日序列只增不减。
+| npm 下载 | GitHub 独立访客 | GitHub 独立克隆者 | Stars | Forks |
+| ---: | ---: | ---: | ---: | ---: |
+| 6,206 | 540 | 335 | 23 | 1 |
+
+- 明细报告：[traffic-report.md](./docs/traffic/traffic-report.md)｜原始归档：[traffic-archive.json](./docs/traffic/traffic-archive.json)｜趋势图与说明：[docs/traffic](./docs/traffic/README.md)
+- 口径：npm 下载含镜像站、CI 与重复安装，且有 1–2 天结算延迟；GitHub 独立访客 / 独立克隆者更接近真实人数。
 
 ## License
 

package/lib/client.js

@@ -232,6 +232,7 @@ window.__ModuleLoader__.load({
   background: color-mix(in srgb, var(--dsw-alias-state-warn-primary, #f59e0b) 30%, transparent);
   color: inherit; border-radius: 2px; padding: 0 1px; font-weight: 600;
 }
+
 .cnvnav-empty { padding: 18px 10px; text-align: center; color: var(--dsw-alias-label-secondary, #888); }
 /* ---------- 极简模式 ---------- */
 .cnvnav-mini-wrap {
@@ -911,13 +912,223 @@ window.__ModuleLoader__.load({
 				return null;
 			}
 			let lastActive = null;
-			function jumpTo(key) {
+						/* ---------- 会话正文内的命中定位(点击搜索命中后把关键词标在正文里) ---------- */
+			const FIND_STEPS = 28;     /* 淡出用的预置层数(层名 cnvnav-find-s0 … s27) */
+			const FIND_HOT_PCT = 55;   /* 命中瞬间的背景浓度(%) */
+			const FIND_DIM_PCT = 22;   /* 最终常驻的淡色浓度(%) */
+			const FIND_HOLD_MS = 300;  /* 最亮保持时长 */
+			const FIND_FADE_MS = 900;  /* 变淡时长(easeOutCubic 逐帧换层) */
+			const FIND_MAX_RANGES = 200;
+			const FIND_BLOCK_TAGS = { P: 1, DIV: 1, LI: 1, UL: 1, OL: 1, PRE: 1, BLOCKQUOTE: 1, TD: 1, TH: 1, TR: 1, TABLE: 1, SECTION: 1, ARTICLE: 1, H1: 1, H2: 1, H3: 1, H4: 1, H5: 1, H6: 1 };
+			let findRaf = null;    /* 淡出动画句柄 */
+			let findStep = null;   /* 当前注册的层号 */
+			let findMark = null;   /* 当前高亮的 Highlight 对象(各层共用同一份 Range) */
+			function findLayerName(step) {
+				return "cnvnav-find-s" + step;
+			}
+			function findAlphaPct(step) {
+				const k = FIND_STEPS <= 1 ? 1 : step / (FIND_STEPS - 1);
+				return FIND_HOT_PCT + (FIND_DIM_PCT - FIND_HOT_PCT) * k;
+			}
+			/* ::highlight 伪元素不支持 transition/animation, 只能预置多层不同浓度逐帧切换 */
+			function findFadeCss() {
+				let out = "\n/* 会话正文内的命中高亮: 逐帧换层实现平滑淡出(::highlight 不支持 transition) */";
+				for (let i = 0; i < FIND_STEPS; i++) {
+					out += "\n::highlight(" + findLayerName(i) + ") {\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary, #f59e0b) " + findAlphaPct(i).toFixed(1) + "%, transparent);\n  color: inherit;\n}";
+				}
+				return out;
+			}
+			(function injectFindFadeCss() {
+				try {
+					const el = document.createElement("style");
+					el.textContent = findFadeCss();
+					document.head.appendChild(el);
+				} catch (err) { console.error(err); }
+			})();
+			/* 模块顶部的 const CSS 是插件自己的样式字符串, 会遮蔽浏览器全局 CSS, 故走 globalThis */
+			function highlightApi() {
+				try {
+					const api = typeof globalThis === "undefined" ? undefined : globalThis.CSS;
+					if (api === undefined || api === null || api.highlights === undefined) return null;
+					return api.highlights;
+				} catch (err) { return null; }
+			}
+			function highlightCtor() {
+				try {
+					return typeof globalThis === "undefined" ? undefined : globalThis.Highlight;
+				} catch (err) { return undefined; }
+			}
+			function dropFindLayer() {
+				const store = highlightApi();
+				if (store !== null && findStep !== null) store.delete(findLayerName(findStep));
+				findStep = null;
+			}
+			function showFindStep(step) {
+				const store = highlightApi();
+				if (store === null || findMark === null) return;
+				const next = Math.max(0, Math.min(FIND_STEPS - 1, step));
+				if (next === findStep) return;
+				if (findStep !== null) store.delete(findLayerName(findStep));
+				store.set(findLayerName(next), findMark);
+				findStep = next;
+			}
+			function stopFindFade() {
+				if (findRaf !== null) {
+					if (typeof cancelAnimationFrame === "function") cancelAnimationFrame(findRaf);
+					findRaf = null;
+				}
+			}
+			function startFindFade() {
+				stopFindFade();
+				if (typeof requestAnimationFrame !== "function") { showFindStep(FIND_STEPS - 1); return; }
+				const now = () => (typeof performance !== "undefined" && typeof performance.now === "function" ? performance.now() : Date.now());
+				const started = now();
+				const tick = () => {
+					const t = now() - started;
+					if (t <= FIND_HOLD_MS) showFindStep(0);
+					else if (t >= FIND_HOLD_MS + FIND_FADE_MS) { showFindStep(FIND_STEPS - 1); findRaf = null; return; }
+					else {
+						const u = (t - FIND_HOLD_MS) / FIND_FADE_MS;
+						const eased = 1 - Math.pow(1 - u, 3); /* easeOutCubic */
+						showFindStep(Math.round(eased * (FIND_STEPS - 1)));
+					}
+					findRaf = requestAnimationFrame(tick);
+				};
+				findRaf = requestAnimationFrame(tick);
+			}
+			function clearFindHighlight() {
+				try {
+					stopFindFade();
+					dropFindLayer();
+					findMark = null;
+				} catch (err) { console.error(err); }
+			}
+			/* 最近的块级祖先: 跨块边界补一个分隔符, 避免两段文字被误判成一个词 */
+			function findBlockOf(node) {
+				let el = node.parentElement;
+				while (el !== null && el !== undefined) {
+					if (FIND_BLOCK_TAGS[el.tagName] === 1) return el;
+					el = el.parentElement;
+				}
+				return null;
+			}
+			/* 收集锚点子树内可见的文本节点(跳过脚本/样式) */
+			function collectFindTextNodes(root) {
+				const out = [];
+				const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, {
+					acceptNode(node) {
+						const text = node.nodeValue;
+						if (text === null || text === "" || text.trim() === "") return NodeFilter.FILTER_REJECT;
+						const parent = node.parentElement;
+						if (parent === null || parent === undefined) return NodeFilter.FILTER_REJECT;
+						const tag = parent.tagName;
+						if (tag === "SCRIPT" || tag === "STYLE" || tag === "NOSCRIPT" || tag === "TEXTAREA") return NodeFilter.FILTER_REJECT;
+						return NodeFilter.FILTER_ACCEPT;
+					},
+				});
+				for (let node = walker.nextNode(); node !== null; node = walker.nextNode()) out.push(node);
+				return out;
+			}
+			/* 归一化索引: 连续空白折叠成单个空格; map[i] = [文本节点, 节点内偏移] */
+			function buildFindIndex(root) {
+				const nodes = collectFindTextNodes(root);
+				let text = "";
+				const map = [];
+				let prevBlock = null;
+				let pendingSpace = false;
+				for (const node of nodes) {
+					const value = node.nodeValue;
+					const block = findBlockOf(node);
+					if (text !== "" && (block === null || block !== prevBlock)) pendingSpace = true;
+					prevBlock = block;
+					for (let i = 0; i < value.length; i++) {
+						const ch = value.charAt(i);
+						if (ch === " " || ch === "\t" || ch === "\n" || ch === "\r" || ch === "\f" || ch === "\v") { pendingSpace = text !== ""; continue; }
+						if (pendingSpace) { text += " "; map.push([node, i]); pendingSpace = false; }
+						text += ch;
+						map.push([node, i]);
+					}
+				}
+				return { text, map };
+			}
+			function findNeedle(kw) {
+				return String(kw).replace(/\s+/g, " ").trim().toLowerCase();
+			}
+			/* 关键词在 DOM 里的每一处出现 → Range(最多 FIND_MAX_RANGES 处) */
+			function findKeywordRanges(root, needle) {
+				const ranges = [];
+				if (needle === "") return ranges;
+				const index = buildFindIndex(root);
+				if (index.text === "") return ranges;
+				let hay = index.text.toLowerCase();
+				if (hay.length !== index.text.length) hay = index.text; /* 极端 Unicode 大小写长度变化时退回原串 */
+				let from = 0;
+				for (;;) {
+					const at = hay.indexOf(needle, from);
+					if (at === -1) break;
+					const start = index.map[at];
+					const end = index.map[at + needle.length - 1];
+					if (start !== undefined && end !== undefined) {
+						try {
+							const range = document.createRange();
+							range.setStart(start[0], start[1]);
+							range.setEnd(end[0], end[1] + 1);
+							ranges.push(range);
+						} catch (err) { /* 节点已被宿主重渲染替换: 跳过这一处 */ }
+					}
+					from = at + needle.length;
+					if (ranges.length >= FIND_MAX_RANGES) break;
+				}
+				return ranges;
+			}
+			/* 把首个命中滚到视口偏上处(而不是消息顶部) */
+			function scrollRangeIntoView(range) {
+				try {
+					const rect = range.getBoundingClientRect();
+					const scrollport = document.querySelector("[data-conversation-scroll]");
+					if (scrollport !== null && scrollport !== undefined) {
+						const box = scrollport.getBoundingClientRect();
+						const delta = rect.top - box.top - Math.max(72, box.height * 0.32);
+						if (typeof scrollport.scrollBy === "function") scrollport.scrollBy({ top: delta, behavior: "smooth" });
+						else scrollport.scrollTop += delta;
+						return;
+					}
+					const host = range.startContainer;
+					const el = host.nodeType === 1 ? host : host.parentElement;
+					if (el !== null && el !== undefined && typeof el.scrollIntoView === "function") el.scrollIntoView({ behavior: "smooth", block: "center" });
+				} catch (err) { console.error(err); }
+			}
+			/* 正文内定位并高亮: 先最亮, 再 easeOut 逐帧变淡到常驻淡色; 返回是否成功 */
+			function locateInConversation(row, kw) {
+				clearFindHighlight();
+				try {
+					const store = highlightApi();
+					const Ctor = highlightCtor();
+					if (store === null || typeof Ctor !== "function") return false;
+					const needle = findNeedle(kw);
+					const ranges = findKeywordRanges(row, needle);
+					if (ranges.length === 0) return false;
+					findMark = new Ctor(...ranges);
+					showFindStep(0);
+					startFindFade();
+					scrollRangeIntoView(ranges[0]);
+					return true;
+				} catch (err) {
+					console.error(err);
+					clearFindHighlight();
+					return false;
+				}
+			}
+			function jumpTo(key, kw) {
 				try {
 					const el = findAnchor(key);
 					if (el === null) return false;
-					el.scrollIntoView({ behavior: "smooth", block: "start" });
 					lastActive = key;
 					setState({ activeKey: key });
+					/* 搜索命中: 直接定位到关键词所在处并在正文里高亮; 其余情况退回消息顶部 */
+					if (typeof kw === "string" && kw !== "" && locateInConversation(el, kw)) return true;
+					clearFindHighlight();
+					el.scrollIntoView({ behavior: "smooth", block: "start" });
 					return true;
 				} catch (err) {
 					console.error(err);
@@ -1095,6 +1306,7 @@ window.__ModuleLoader__.load({
 				}
 				function toggleSearch() {
 					if (searchOpen) setFilter("");
+					clearFindHighlight();
 					setSearchOpen(!searchOpen);
 				}
 				/* ---------- 拖动定位(仅面板形式, 极简条不参与) ---------- */
@@ -1504,7 +1716,7 @@ window.__ModuleLoader__.load({
 						ref: (el) => { itemEls[item.key] = el; },
 						className: "cnvnav-item" + (item.key === snap.activeKey ? " cnvnav-item-active" : "") + (staggerMs !== undefined ? " cnvnav-fade-item" : ""),
 						style: staggerMs !== undefined ? { animationDelay: staggerMs + "ms" } : undefined,
-						onClick: () => jumpTo(item.key),
+						onClick: () => jumpTo(item.key, filtering && hit(item.search) ? kw : null),
 					},
 						React.createElement("span", { className: "cnvnav-badge cnvnav-badge-" + item.cls }, item.label),
 						hasPreview
@@ -1521,6 +1733,8 @@ window.__ModuleLoader__.load({
 					const useSnippet = filtering && hit(headSearch);
 					const sub = useSnippet ? snippetNodes(headSearch, kw, 5, 55) : g.subtitle;
 					const hasSub = sub !== "" && (!Array.isArray(sub) || sub.length > 0);
+					/* 组头自身命中时, 点击同样在正文里定位关键词 */
+					const headKw = filtering && g.headIsUser && g.items.length > 0 && hit(g.items[0].search) ? kw : null;
 					/* 标题策略:
 					   显示轮次: 轮次行 = 加粗「第 N 轮」; 压缩等非轮次行 = 加粗类型标签, 视作轮次同级
 					   隐藏轮次: 每行统一轨迹徽标 — 轮次头 = 「用户」业务蓝(助手开头则助手紫), 非轮次行 = 各自徽标(压缩=中性灰) */
@@ -1557,7 +1771,7 @@ window.__ModuleLoader__.load({
 								React.createElement("button", {
 									type: "button",
 									className: "cnvnav-group-head",
-									onClick: () => jumpTo(g.headKey),
+									onClick: () => jumpTo(g.headKey, headKw),
 								},
 									titleNode,
 									hasSub
@@ -1702,7 +1916,7 @@ window.__ModuleLoader__.load({
 								placeholder: "请输入关键词",
 								value: filter,
 								autoFocus: true,
-								onChange: (e) => setFilter(e.target.value),
+								onChange: (e) => { clearFindHighlight(); setFilter(e.target.value); },
 							})
 							: null,
 						searchOpen

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-conversation-navigator",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "description": "DSH(DeepSeek Harness)会话导航插件:按轮折叠的对话大纲面板,支持节点点击跳转、滚动位置高亮与轨迹视图同款配色。",
   "keywords": [
     "dsh",