pengls/dsh-quick-view

dsh-quick-view

一个 dsh Web 客户端插件，为对话页面添加一个右侧浮动导航器。在长时间的会话中，很难找到你之前在哪里提过某个问题；这个插件会在右边缘列出每一条用户输入，点击即可将对话记录跳转到该消息。

它是一个纯浏览器端（dsh.client）的 bundle —— 没有宿主服务、没有工具、不修改提示词。它注册到 dsh Web bundle 已经声明的 conversation.session.header.utilities 插槽中，因此无需对仓库做任何改动即可组合进已发布的 UI 中。

dsh-quick-view 右侧导航器，静止状态

dsh-quick-view 右侧导航器，悬停面板

安装

有两种方式，与其他 dsh 插件一致。两者都需要 dsh CLI 位于 PATH 中。

1. 从 npm registry 安装（推荐 —— 无需克隆或构建步骤）

dsh plugin --profile web add @pengls/dsh-quick-view

发布的 tarball 附带预构建的 lib/，因此 pnpm 会直接安装它，dsh 会激活其补丁层 —— 不会运行 prepare 脚本。

2. 从 GitHub 源码安装

dsh plugin --profile web add github:pengls/dsh-quick-view

git 安装获取的是源码，在这里没问题：本仓库提交了构建后的 lib/，因此直接执行 dsh plugin add github:pengls/dsh-quick-view 无需构建步骤，也不会触发 allowBuilds 门禁。只有在你编辑 src/ 时才需要重新构建 lib/（npm run build）。

使用

1. 重启 profile：dsh --profile web。
2. 打开一个至少包含两条你自己输入的会话。右边缘会出现一条由短横线组成的导航条，垂直居中 —— 每条用户输入对应一条短横线，按对话顺序排列（第一条在最上方）。最后一条输入的短横线默认被选中（蓝色）。
3. 悬停导航条会展开一个面板，其中每条输入变成一行 文本 + 短横线；点击某一行即可将对话记录滚动到该消息，并将其短横线标记为选中。

工作原理

cordis.patch.yml 插入一行，将本包作为 dsh.client 插件挂载；package.json 声明了 dsh.client（platform: 'web'），因此宿主的 client-modules 节点侧会扫描其 ./client 导出并写入 window.__DSH_BOOT__。浏览器侧（src/client/index.ts）通过 ctx.slots.inject(...) 注册 conversation.session.header.utilities 的一个列表占用项 —— 这是安全的跨包注册方式，会等待 ui-conversation 的插槽声明。

QuickViewPanel.tsx 只读取框架的 session kit（useSession → conversation.chat.order/nodes）并构建列表。点击某个条目时使用聊天视图打上的语义锚点 [data-chat-anchor-key]，然后滚动其 [data-conversation-scroll] 滚动容器 —— 因此它在重排和加载更早内容的分页中都能正常工作。没有 store，没有业务层，没有宿主往返。
浏览器端部分构建为一个仓库外的闭包工厂 bundle：scripts/build.mjs（esbuild）将 shell 基线（react、react/jsx-runtime、@deepseek-ai/cordis、@deepseek-ai/dsh-client-ui-slots、@deepseek-ai/dsh-client-ui-primitives、@deepseek-ai/dsh-client-runtime/client）外部化，并将输出包装在 window.__ModuleLoader__.load({ id, factory: (require) => { … } }) 中。

开发

npm install
npm run build                 # emits lib/index.js + lib/client.js
npm run typecheck             # validates src/ against the dsh type sources

tsconfig.json 继承自 ../../deepseek-harness/tsconfig.base.client.json，因此 @deepseek-ai/* 会解析到真实的类型源；如果你的 dsh 检出位于其他地方，请将 extends 指向它。构建本身使用 esbuild，不需要该检出。

发布新版本

上述两种安装路径解析的是同一个包，因此每次发布都意味着在一次操作中完成版本号提升、推送和发布：

1. Bump the version in package.json (semver: 0.1.1, 0.2.0, …)
2. Rebuild and commit lib/ (kept in git so GitHub installs need no build)
npm run build
git add -A
git commit -m "Release v"
git push origin main
3. Publish to npm (prepack also rebuilds lib/)
npm publish --access public --registry https://registry.npmjs.org/

注意事项：

- 发布需要 npm 身份验证，以及 OTP（追加 --otp ）或启用了 Bypass two-factor authentication 的细粒度访问令牌。--access public 是必需的，因为作用域包默认是私有的。
- 如果你的 npm registry 是只读镜像（例如 npmmirror），请登录并如上所述显式针对 https://registry.npmjs.org/ 进行发布。
- lib/ 是生成的；提交前务必重新构建，以使提交的产物与 src/ 保持一致。

模型体验

此插件不添加任何宿主提示词部分、工具 schema 或模型可见的输入。它唯一的作用是客户端浮动控件；它不会更改会话日志或模型上下文。