dsh-conversation-navigator 0.1.19 → 0.1.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -4
- package/lib/client.js +18 -6
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Codex 风格的 **DeepSeek Harness(DSH)Web 端会话导航面板**:在对话页**右侧**悬浮展示按轮折叠的对话大纲,点击任意节点平滑跳转,滚动对话时实时高亮当前阅读位置,步次徽标配色与内置"轨迹"视图统一。
|
|
4
4
|
|
|
5
|
-
纯浏览器插件(无宿主行为)、纯 JavaScript、零构建、零 npm 依赖(
|
|
5
|
+
纯浏览器插件(无宿主行为)、纯 JavaScript、零构建、零 npm 依赖(按钮/Tooltip 复用 DSH 内核 seed 的官方 primitives)。
|
|
6
6
|
|
|
7
7
|
## 功能
|
|
8
8
|
|
|
@@ -18,7 +18,7 @@ Codex 风格的 **DeepSeek Harness(DSH)Web 端会话导航面板**:在对话页*
|
|
|
18
18
|
- **右侧定位**:面板锚定视口右侧,收起/展开左侧边栏时纹丝不动
|
|
19
19
|
- **回到最新 / 全部折叠**:面板底部两个快捷按钮
|
|
20
20
|
- **轨迹配色**:用户/插话 = 业务蓝、上下文 = 成功绿、助手 = 紫罗兰、工具 = 琥珀、压缩 = 中性灰(取自 `dsh-client-ui-trajectory` 的 kindTag 主题 token,自动适配明暗主题)
|
|
21
|
-
- **DSH
|
|
21
|
+
- **DSH 原生风格**:操作按钮复用官方 `Button`/`Tooltip` 组件与官方图标(搜索、关闭);其余操作图标(导航、加载更早、加载全部、回到最新、全部折叠、切换轮次等)为按 DSH 描边风格手绘的内联 SVG,`currentColor` 自动适配明暗主题
|
|
22
22
|
- 切换工作区/会话自动跟随并重建大纲
|
|
23
23
|
|
|
24
24
|
## 安装
|
|
@@ -43,7 +43,7 @@ dsh plugin --profile web add ./dsh-conversation-navigator-<version>.tgz
|
|
|
43
43
|
|
|
44
44
|
## 更新
|
|
45
45
|
|
|
46
|
-
修改 `lib/client.js` 后重启 `dsh web`
|
|
46
|
+
修改 `lib/client.js` 后重启 `dsh web` 即可;插件没有持久状态,展开/折叠、显示/隐藏轮次、搜索关键词等界面状态仅存于页面会话内。
|
|
47
47
|
|
|
48
48
|
## 工作原理
|
|
49
49
|
|
|
@@ -53,7 +53,9 @@ dsh plugin --profile web add ./dsh-conversation-navigator-<version>.tgz
|
|
|
53
53
|
- 跳转定位:复用 DSH 聊天视图自身的稳定 DOM 锚点 `[data-chat-anchor-key]`(与产品内部 paging/scroll 定位同源),`scrollIntoView` 平滑滚动
|
|
54
54
|
- 位置跟踪:捕获 `[data-conversation-scroll]` 滚动容器的 scroll 事件(节流 120ms),计算视口顶部首个可见节点
|
|
55
55
|
- 关键词过滤:仅为 `user` 与 `assistant-step` 节点提取检索文本(`dialogueText`),大小写不敏感匹配,命中片段以 `<mark>` 高亮并按首个命中位置截取显示窗口
|
|
56
|
-
-
|
|
56
|
+
- 悬停全文:轮次头气泡读取 `fullDialogueText`(用户节点全部文本块拼接),用 `Tooltip` 展示并限宽 340px
|
|
57
|
+
- 显示/隐藏轮次:头部按钮切换 `turnsHidden`,隐藏时仅把轮次头标题替换为轨迹徽标(`titleNode` 策略),分组结构不变;搜索框展开时按钮让位
|
|
58
|
+
- 样式:`Button`/`Tooltip`/搜索与关闭图标复用 `@deepseek-ai/dsh-client-ui-primitives`,其余图标为内联 SVG;面板容器自建 `<style>` 注入,颜色使用 `--dsw-*` 主题 token;插件卸载时随 fiber 清理
|
|
57
59
|
|
|
58
60
|
## 兼容性说明
|
|
59
61
|
|
package/lib/client.js
CHANGED
|
@@ -110,17 +110,25 @@ window.__ModuleLoader__.load({
|
|
|
110
110
|
.cnvnav-group-row {
|
|
111
111
|
display: flex; align-items: stretch;
|
|
112
112
|
border-radius: 8px; overflow: hidden;
|
|
113
|
+
position: relative;
|
|
113
114
|
transition: background .16s ease;
|
|
114
115
|
}
|
|
115
116
|
.cnvnav-group-row:hover { background: var(--dsw-alias-bg-layer-2, rgba(128,128,128,.12)); }
|
|
116
|
-
.cnvnav-group-row-active { background: var(--dsw-alias-
|
|
117
|
+
.cnvnav-group-row-active { background: color-mix(in srgb, var(--dsw-alias-brand-primary, #4f46e5) 13%, transparent); }
|
|
118
|
+
.cnvnav-group-row-active::before {
|
|
119
|
+
content: ''; position: absolute; left: 6px; top: 6px; bottom: 6px;
|
|
120
|
+
width: 3px; border-radius: 2px;
|
|
121
|
+
background: var(--dsw-alias-brand-primary, #4f46e5);
|
|
122
|
+
}
|
|
123
|
+
.cnvnav-group-row-active:hover { background: color-mix(in srgb, var(--dsw-alias-brand-primary, #4f46e5) 18%, transparent); }
|
|
117
124
|
.cnvnav-group-row-active .cnvnav-group-title { color: var(--dsw-alias-brand-primary, #4f46e5); }
|
|
125
|
+
.cnvnav-group-row-active .cnvnav-group-sub { color: color-mix(in srgb, var(--dsw-alias-brand-primary, #4f46e5) 45%, var(--dsw-alias-label-secondary, #888)); }
|
|
118
126
|
.cnvnav-group-head-wrap { flex: 1; min-width: 0; display: flex; }
|
|
119
127
|
.cnvnav-group-head {
|
|
120
128
|
width: 100%;
|
|
121
129
|
display: flex; align-items: baseline; gap: 6px; text-align: left;
|
|
122
130
|
border: none; background: transparent; cursor: pointer;
|
|
123
|
-
padding: 5px 0 5px
|
|
131
|
+
padding: 5px 0 5px 17px;
|
|
124
132
|
color: var(--dsw-alias-label-primary, #222);
|
|
125
133
|
}
|
|
126
134
|
.cnvnav-group-title { font-family: var(--dsw-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif); font-size: 14px; font-weight: 700; line-height: 20px; white-space: nowrap; transition: color .16s ease; }
|
|
@@ -157,12 +165,16 @@ window.__ModuleLoader__.load({
|
|
|
157
165
|
transition: background .16s ease;
|
|
158
166
|
}
|
|
159
167
|
.cnvnav-item:hover { background: var(--dsw-alias-bg-layer-2, rgba(128,128,128,.12)); }
|
|
160
|
-
.cnvnav-item-active { background: var(--dsw-alias-
|
|
161
|
-
.cnvnav-item-active
|
|
162
|
-
|
|
163
|
-
|
|
168
|
+
.cnvnav-item-active { background: color-mix(in srgb, var(--dsw-alias-brand-primary, #4f46e5) 13%, transparent); }
|
|
169
|
+
.cnvnav-item-active:hover { background: color-mix(in srgb, var(--dsw-alias-brand-primary, #4f46e5) 18%, transparent); }
|
|
170
|
+
.cnvnav-item-active .cnvnav-item-preview { color: color-mix(in srgb, var(--dsw-alias-brand-primary, #4f46e5) 60%, var(--dsw-alias-label-primary, #222)); }
|
|
171
|
+
.cnvnav-item-active::before,
|
|
172
|
+
.cnvnav-item-active::after {
|
|
173
|
+
content: ''; position: absolute; left: 6px; width: 3px; border-radius: 2px;
|
|
164
174
|
background: var(--dsw-alias-brand-primary, #4f46e5);
|
|
165
175
|
}
|
|
176
|
+
.cnvnav-item-active::before { top: 6px; height: calc(50% - 7.5px); }
|
|
177
|
+
.cnvnav-item-active::after { bottom: 6px; height: calc(50% - 7.5px); }
|
|
166
178
|
.cnvnav-badge {
|
|
167
179
|
flex: none; min-width: 36px; box-sizing: border-box;
|
|
168
180
|
display: inline-flex; align-items: center; justify-content: center;
|