dsh-conversation-navigator 0.1.21 → 0.1.23

package/README.md

@@ -1,6 +1,14 @@
 # DSH 会话导航插件(dsh-conversation-navigator)
 
-Codex 风格的 **DeepSeek Harness(DSH)Web 端会话导航面板**:在对话页**右侧**悬浮展示按轮折叠的对话大纲,点击任意节点平滑跳转,滚动对话时实时高亮当前阅读位置,步次徽标配色与内置"轨迹"视图统一。
+[![npm](https://img.shields.io/npm/v/dsh-conversation-navigator?style=flat-square&color=blue)](https://www.npmjs.com/package/dsh-conversation-navigator)
+[![downloads](https://img.shields.io/npm/dm/dsh-conversation-navigator?style=flat-square&color=blue)](https://www.npmjs.com/package/dsh-conversation-navigator)
+[![stars](https://img.shields.io/github/stars/gjj-star/dsh-conversation-navigator?style=flat-square&color=green)](https://github.com/gjj-star/dsh-conversation-navigator)
+[![license](https://img.shields.io/github/license/gjj-star/dsh-conversation-navigator?style=flat-square&color=teal)](https://github.com/gjj-star/dsh-conversation-navigator)
+[![dependencies](https://img.shields.io/badge/dependencies-0-brightgreen?style=flat-square)](https://www.npmjs.com/package/dsh-conversation-navigator)
+[![awesome · DSH plugin](https://awesome-dsh-plugin.com/badge.svg)](https://github.com/awesome-dsh-plugin/awesome-dsh-plugin)
+[![DeepSeek Harness](https://img.shields.io/badge/DeepSeek_Harness-Plugin-blue?style=flat-square)](https://github.com/deepseek-ai/deepseek-harness)
+
+**DeepSeek Harness(DSH)Web 端会话导航面板**:在对话页**右侧**悬浮展示按轮折叠的对话大纲,点击任意节点平滑跳转,滚动对话时实时高亮当前阅读位置,步次徽标配色与内置"轨迹"视图统一。
 
 纯浏览器插件(无宿主行为)、纯 JavaScript、零构建、零 npm 依赖(按钮/Tooltip 复用 DSH 内核 seed 的官方 primitives)。
 
@@ -21,7 +29,7 @@ Codex 风格的 **DeepSeek Harness(DSH)Web 端会话导航面板**:在对话页*
 - **位置跟踪**:手动滚动对话时,面板自动高亮并跟随当前正在阅读的轮次
 - **右侧定位**:面板锚定视口右侧,收起/展开左侧边栏时纹丝不动
 - **回到最新 / 全部折叠**:面板底部两个快捷按钮
-- **轨迹配色**:用户/插话 = 业务蓝、上下文 = 成功绿、助手 = 紫罗兰、工具 = 琥珀、压缩 = 中性灰(取自 `dsh-client-ui-trajectory` 的 kindTag 主题 token,自动适配明暗主题)
+- **轨迹配色**:用户/插话 = 业务蓝、上下文 = 成功绿、助手 = 紫罗兰、工具 = 琥珀、压缩 = 中性灰(与内置轨迹视图一致的 `--dsw` 主题 token,自动适配明暗主题)
 - **DSH 原生风格**:操作按钮复用官方 `Button`/`Tooltip` 组件与官方图标(搜索、关闭);其余操作图标(导航、加载更早、加载全部、回到最新、全部折叠、切换轮次等)为按 DSH 描边风格手绘的内联 SVG,`currentColor` 自动适配明暗主题
 - 切换工作区/会话自动跟随并重建大纲
 
@@ -73,6 +81,8 @@ dsh plugin --profile web add ./dsh-conversation-navigator-<version>.tgz
 lib/
   index.js   # 宿主侧空入口(纯浏览器插件)
   client.js  # 浏览器端完整实现(window.__ModuleLoader__ 模块格式)
+assets/
+  screenshots/   # 截图(README 主图 + 市场截图墙)
 cordis.patch.yml     # 组合包补丁层(插入插件行)
 example.patch.yml    # 手动安装时的补丁示例
 ```

package/lib/client.js

@@ -92,6 +92,7 @@ window.__ModuleLoader__.load({
   transition: opacity .18s ease, transform .18s ease;
 }
 .cnvnav-panel-hidden { opacity: 0; transform: translateY(-6px) scale(.985); pointer-events: none; }
+.cnvnav-panel-unplaced { visibility: hidden; }
 .cnvnav-head {
   display: flex; align-items: center; gap: 8px;
   padding: 10px 12px;
@@ -571,23 +572,59 @@ window.__ModuleLoader__.load({
 
 				React.useEffect(() => {
 					if (!snap.open) return;
+					let lastKey = null;
+					let stableTicks = 0;
+					let misses = 0;
 					function place() {
 						const panel = panelEl;
-						if (panel === null) return;
+						if (panel === null) return false;
 						const vw = document.documentElement.clientWidth || 1000;
 						const vh = document.documentElement.clientHeight || 800;
 						const sp = document.querySelector("[data-conversation-scroll]");
-						const rect = sp !== null ? sp.getBoundingClientRect() : { top: 60, height: vh - 90 };
 						const width = 288;
-						const left = Math.max(8, vw - width - 12);
-						panel.style.left = Math.round(left) + "px";
-						panel.style.top = Math.max(8, Math.round(rect.top + 8)) + "px";
-						panel.style.maxHeight = Math.round(Math.min(rect.height - 24, vh - 40)) + "px";
+						if (sp === null) {
+							/* 会话视图可能尚未挂载(刷新/重启/切会话时面板先就位);
+							   非会话页(设置页等)则永远没有该容器。
+							   连续 15 次(约 6s)仍未出现才回退到视口定位, 否则保持隐藏等待校准。 */
+							misses += 1;
+							if (misses >= 15) {
+								panel.style.left = Math.max(8, vw - width - 12) + "px";
+								panel.style.top = Math.max(8, 60) + "px";
+								panel.style.maxHeight = Math.round(vh - 90) + "px";
+								panel.classList.remove("cnvnav-panel-unplaced");
+								return true;
+							}
+							return false;
+						}
+						const r = sp.getBoundingClientRect();
+						const key = [Math.round(r.top), Math.round(r.height), Math.round(vw), Math.round(vh)].join("|");
+						if (key !== lastKey) {
+							lastKey = key;
+							panel.style.left = Math.max(8, vw - width - 12) + "px";
+							panel.style.top = Math.max(8, Math.round(r.top + 8)) + "px";
+							panel.style.maxHeight = Math.round(Math.min(r.height - 24, vh - 40)) + "px";
+						}
+						panel.classList.remove("cnvnav-panel-unplaced");
+						return true;
 					}
 					place();
+					/* 每 400ms 复查: 容器出现即校准; 布局连续 3 次无变化后停止 */
+					let id = setInterval(() => {
+						const before = lastKey;
+						if (!place()) return;
+						if (lastKey !== null && lastKey === before) {
+							stableTicks += 1;
+							if (stableTicks >= 3) clearInterval(id);
+						} else {
+							stableTicks = 0;
+						}
+					}, 400);
 					window.addEventListener("resize", place);
-					return () => window.removeEventListener("resize", place);
-				}, [snap.open]);
+					return () => {
+						clearInterval(id);
+						window.removeEventListener("resize", place);
+					};
+				}, [snap.open, snap.sessionId]);
 
 				React.useEffect(() => {
 					if (!snap.open) return;
@@ -821,7 +858,7 @@ window.__ModuleLoader__.load({
 
 				return React.createElement("div", {
 					ref: (el) => { panelEl = el; },
-					className: "cnvnav-panel" + (snap.open ? "" : " cnvnav-panel-hidden"),
+					className: "cnvnav-panel cnvnav-panel-unplaced" + (snap.open ? "" : " cnvnav-panel-hidden"),
 					role: "complementary",
 					"aria-label": "会话导航",
 					"aria-hidden": !snap.open,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-conversation-navigator",
-  "version": "0.1.21",
-  "description": "Codex 风格的 DSH(DeepSeek Harness)会话导航插件:按轮折叠的对话大纲面板,支持节点点击跳转、滚动位置高亮与轨迹视图同款配色。",
+  "version": "0.1.23",
+  "description": "DSH(DeepSeek Harness)会话导航插件:按轮折叠的对话大纲面板,支持节点点击跳转、滚动位置高亮与轨迹视图同款配色。",
   "keywords": [
     "dsh",
     "deepseek-harness",
@@ -14,6 +14,10 @@
     "会话导航"
   ],
   "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/gjj-star/dsh-conversation-navigator.git"
+  },
   "type": "module",
   "main": "lib/index.js",
   "exports": {