前言¶
在 DSH Web GUI 中，一个会话往往包含多轮用户消息、agent 运行中发送的 steering 消息，以及对应的模型回复。对话变长之后，靠上下滚动定位某一轮消息并不方便。
下面介绍 KeLearns/dsh-navigation-bar：它把单个会话里的用户消息映射为一排“钢琴键”，支持悬停预览和点击跳转，用于会话内多轮对话导航。
这是什么¶
KeLearns/dsh-navigation-bar 是一个 DSH 客户端插件，面向 DSH Web GUI 的单个会话提供多轮对话导航。
- 维护者：
KeLearns - 许可证：
MIT - 平台声明：
dsh.client.platform为web - 插件形态：基于 DSH 官方双面插件机制（host + browser half），不侵入 DSH 源码
它的核心思路是：一根键对应一条用户消息，模型回复不单独占键，而是并入对应轮次的预览中。
核心功能¶
会话内导航¶
导航条只锚定用户消息：
- 一根键 = 一条用户消息
- 包含 agent 运行中发送的 steering 消息
- 按键按时间正序排列
- 模型回复不单独占键，并入对应轮次的预览
这样导航条的粒度是“一轮用户输入”，而不是每条消息都单独生成一个导航项。
视觉规格¶
导航条采用参考图级视觉规格：
- 键距：
10px - 键高：
2px - 最短长度：
6px - 悬停长度：
26px（约4.3×） - 位置：在消息区内垂直居中
配色按参考图逐像素测量：
浅色主题：#D2D3D3 / #767779 / #1A1C1F
深色主题：#454545 / #A3A3A3 / #FFFFFF
悬停阶梯¶
悬停某根键时，该键会变长、变色，上下相邻键形成 3 级阶梯：
20px / 14px / 10px
≈77% / 54% / 38%
第 4 邻键恢复最短长度。首键或尾键悬停时，阶梯会在边界处自然单侧裁剪。
悬停气泡¶
悬停时会显示该轮消息预览：
- 用户消息：单行省略
- 对应模型回复：最多 3 行
- 截断方式：宽度模型 JS 截断 +
-webkit-line-clamp双保险 - 超出部分：以
…省略
当前位高亮与跳转¶
非悬停状态下，当前查看内容对应的键仅变色，长度不变，并随滚动实时联动。
点击对应键可以跳转到该轮消息位置。插件支持深浅色主题自适应：
data-ds-dark-theme
prefers-color-scheme
安装与启用¶
正式包安装到 web profile：
dsh plugin --profile web add @kelearns/dsh-navigation-bar
执行后需要重启 dsh web 实例，再刷新页面，使插件在浏览器侧生效。
也可以在 dsh 设置页的 Plugin Market（dsh-market）中搜索 navigation-bar，进行一键安装。
本地开发¶
本地开发时可以使用 link 方式安装：
dsh plugin --profile web add link:<本目录>
修改 lib/client.js 后，刷新页面即可看到变化。
运行与依赖要求如下：
{
"engines": {
"node": "^22.19.0 || >=24.0.0"
},
"peerDependencies": {
"@deepseek-ai/dsh-client-ui-slots": "^0.1.0-rc.6",
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
}
平台声明为 web：
dsh.client.platform: web
数据来源与 DOM 锚点¶
据资料声明，插件使用 DSH 官方 API 获取当前会话数据：
ctx.sessions.binding(currentId).session → ConversationSnapshot
页面定位依赖以下 DOM 锚点：
滚动容器：[data-conversation-scroll]
消息行：[data-chat-anchor-key]
这意味着导航条主要围绕当前会话快照和已有消息锚点进行渲染，不依赖额外自造消息结构。
适用场景与注意¶
这个插件适合在 DSH Web GUI 中使用，并且希望快速定位某一轮用户输入、agent steering 消息或对应模型回复的场景。
安装前建议：
- 检查源码与
MIT许可证是否可接受。 - 确认运行环境满足 Node 版本与 peer 依赖要求。
- 注意插件会以当前
dsh进程权限运行，安装来源应可验证。 - 新装插件后重启
dsh web实例，再刷新页面。
该插件已收录于 awesome-dsh-plugin 精选目录。
链接¶
- GitHub：
https://github.com/KeLearns/dsh-navigation-bar - 插件线索中给出的目录页 URL：
https://www.skillhub.cn/plugins/KeLearns/dsh-navigation-bar（该 URL 来自插件线索，未能在已抓取资料中核验，访问前请先确认）
