前言¶
在 DeepSeek Harness(DSH)里,不少客户端插件需要在聊天区域旁边展示面板。宿主自带的 details 槽位是 single 型,已被工具详情占用;shell.overlay 只是浮层,没有统一的布局协调。结果是各插件各自写 position: fixed; right: 0,互相抢 z-index、各自改 #root 宽度,留宽与收起逻辑重复实现。
dsh-plugin-rightbar(维护者 lo2589,MIT,当前版本 0.1.0)在 Web 客户端上注册一个共享的「聊天右边那一列」:其它插件往 rightbar.tab 槽位挂标签页,而不是各自固定浮层。下面介绍它的定位、安装方式,以及插件作者如何接入。
这是什么¶
插件 id 为 rightbar,分类属于客户端,仅支持 Web(dsh.client.platform = web)。宿主半端是空 apply,整列 UI 在浏览器里完成。
它向 shell.overlay 注册一个条目,用 children 声明 list 型槽位 rightbar.tab(机制与宿主 AppFrame 声明 sidebar / details 相同)。想贴边的插件向该槽位注册标签即可;本插件自身不提供业务标签,没有标签注册时整列不渲染,并让出的宽度归零。
核心功能¶
统一槽位与宽度¶
- 槽位名:
rightbar.tab(kind: 'list'、scope: 'root')。 - 注册方式:
slots.register({ name: 'rightbar.tab', id, label, order }, Component)。 - 页面宽度由本插件通过
<html>上的 CSS 变量--rightbar-w控制;无标签时为0px。 - 一次只渲染当前激活的标签(
renderSlot('rightbar.tab', {}, { only: id }))。
交互与尺寸¶
默认展开,宽度 420px,可拖左边缘调整;最小 280px,最大为窗口宽的 70%;点右上角 › 收成 32px 竖条。层级 z-index: 600(高于常见遗留浮动面板 500–530,低于全屏模态 9997+)。
浏览器偏好写在 localStorage:rightbar.open、rightbar.active、rightbar.width。想默认收起可执行:
localStorage.setItem('rightbar.open', 'false')
跨插件激活¶
无需 import,通过窗口事件切换到自己的标签:
window.dispatchEvent(new CustomEvent('rightbar:activate', { detail: { id: 'my-plugin' } }))
rightbar 未安装时无人监听,事件无害。
可选「让位」兼容¶
仍用 position: fixed; right: 0 的老面板可能与右栏重叠。本插件可按 localStorage['rightbar.adopt'] 做偏移兼容,默认关闭(off)。可选 declared(只处理带 data-rightbar-adopt="1" 的面板)或 all(按样式启发式匹配 body 直接子元素)。正式接入仍应注册 rightbar.tab。
Agent skill¶
安装后 agent 会话 skill 目录会多一条 rightbar-tab(由 cordis.patch.yml 的 rightbar-skill 提供),说明槽位名、注册方式、三条硬性要求与可选座位写法,便于 agent 编写新面板时对齐契约。
安装与启用¶
前置:可运行 Web 客户端的 DeepSeek Harness(--profile web),且 node ≥ 22 在 PATH 上。
从 GitHub 安装(推荐):
cd /path/to/deepseek-harness
node --import tsx/esm apps/cli/src/bin.ts plugin --profile web add github:lo2589/dsh-plugin-rightbar
若已安装全局 dsh 命令,等价于:
dsh plugin --profile web add github:lo2589/dsh-plugin-rightbar
本地目录(改代码时):
cd /path/to/deepseek-harness
node --import tsx/esm apps/cli/src/bin.ts plugin --profile web add link:/path/to/dsh-plugin-rightbar
装完后必须重启一次 dsh;bundle 在启动时组装,不重启插件不会挂上。
装完如何确认¶
没有其它插件注册标签时,右侧空白是正常现象。可先开演示标签验证槽位链是否通:
localStorage.setItem('rightbar.demo', 'true')
在浏览器刷新后应出现「演示 A」「演示 B」两个标签。
卸载¶
cd /path/to/deepseek-harness
node --import tsx/esm apps/cli/src/bin.ts plugin --profile web remove dsh-plugin-rightbar
重启后 rightbar.tab 不再声明;已接入插件的 slots.inject 不会触发,不会因此崩溃。
典型用法:给自己的插件挂标签¶
在插件 client 半端 apply(ctx) 中:
var slots = ctx.get('slots')
slots.inject('rightbar.tab', function () {
return slots.register(
{ name: 'rightbar.tab', id: 'my-plugin', label: '我的面板', order: 20 },
MyPanel,
)
})
要点:
slots.inject会等待槽位声明出现,加载顺序无关;rightbar 卸载时注册自动撤销,重装后自动恢复。- 将 rightbar 视为可选:未安装时 inject 不触发,应保留自有浮动面板作为兜底。
- 面板组件只填满 rightbar 给的盒子:不要
position: fixed、不要改#root宽度、不要自造 z-index 压层。 - 全页只允许一个 rightbar;第二次声明
rightbar.tab会被槽位注册表拒绝。
适用场景与注意¶
适合: 需要在 DSH Web 聊天旁稳定展示面板、且希望与同类 UI 共存的插件作者;愿意用槽位替代各自 fixed 右栏的团队。
不适合: 非 Web profile(本插件 client 平台限定为 web);期望装完立刻看到内容但不注册任何 tab 的使用者——需接入 tab 或开 rightbar.demo。
安全与信任: 插件以当前 dsh 进程权限运行。DSH 生态主张「一切皆插件」;社区目录 SkillHub 插件页 为独立站点,与 DeepSeek / 幻方无官方从属。安装前请阅读 GitHub 仓库 源码与 MIT 许可证。
已知环境差异: Safari 曾因宿主 .frame 的 overflow: hidden 裁剪 fixed overlay;0.1.0 起面板与收起竖条通过 ReactDOM.createPortal 挂到 document.body。隐私模式下 localStorage 可能不可用,偏好会静默退回默认值。
结尾¶
dsh-plugin-rightbar 用单一 list 槽位 rightbar.tab 和 --rightbar-w 把「聊天右侧一列」变成可共享座位,减少 fixed 面板互挡与宽度争抢。插件详情见 SkillHub 目录,源码与契约表见 GitHub:lo2589/dsh-plugin-rightbar。