dsh-kimi-shell:把 DSH Web 会话侧栏改成 Kimi 风格底部浮层

前言

DeepSeek Harness(DSH)的 Web 界面按桌面布局设计。在窄屏手机上,左侧会话侧栏会挤占主内容区,展开收起也缺少常见的移动端交互模式。社区里曾有 dsh-web-mobile 等方案;dsh-kimi-shell 从 v0.3 起改为独立移动壳,单插件安装、无额外依赖,把会话抽屉改造成 Kimi 风格的底部上滑浮层,桌面端通过媒体查询与指针类型完全隔离,不受影响。

下面介绍插件定位、能力边界、安装方式与调试要点。事实以 GitHub 仓库 README 为准。

这是什么

dsh-kimi-shell 是 DSH 的 Web 客户端插件(维护者 Bill-666code),面向 dsh-web 的手机浏览器场景:在触屏、窄屏条件下,将会话侧栏呈现为 100vw × 82dvh 的底部浮层(圆角顶、抓手、遮罩),并用右下角 FAB 作为唯一入口;选中会话或点遮罩后自动收起。插件使用自有 data-kimi-* 命名空间,不 patch 宿主组件,不写宿主半逻辑。

分类上属于 客户端 改造;与官方 DeepSeek / 幻方无从属关系,安装来源为社区目录与 GitHub,使用前宜自行审阅源码与 MIT 许可证。

核心功能

底部浮层与会话入口

浮层开合采用与宿主 data-sidebar-collapsed 绑定的 display 语义,避免宿主模态冻结机制把过渡动画钉在半途。收起态仅保留系统色自适应的 FAB;展开后列表铺满整宽,触屏行高约 44px,工作区分组改为紧凑小节头,并隐藏品牌行。

v0.5.0:项目行与重命名

宿主在文件夹行上靠 :hover 才显示「新建会话」等按钮,触屏设备无法 hover。插件在文件夹行尾 常显 34px 新建按钮,点按即在对应文件夹新建会话;同容器内带删除工作区等操作的 ⋯ 菜单仍保持隐藏,会话行的归档/置顶 likewise 不动,降低误触。

宿主将「双击标题」绑定为重命名,手机快速连点易误弹。插件拦截真实双击,改为 长按会话行 500ms(短震动)唤起原生重命名,松手不再顺带切换会话。

v0.4.0:设置弹窗手机化

桌面双栏设置小窗改为近全屏单列:顶部分类为横滑药丸标签,内容全宽纵滚,主题三选横排等分。作用域锚定 :has(> nav),重命名/删除确认等小弹窗保持宿主样式,并统一叠在浮层之上。

输入法、主题与 viewport

切换或新建会话后 不再自动聚焦输入框,避免键盘挡住会话列表;直接点输入框仍可正常输入。

若用户主题偏好仍为 system,手机端首次加载会 一次性 改为 light 并写入宿主 user-settings(服务端持久化);已显式选择 dark 的不改动。

补齐 viewport-fit=cover、interactive-widget=resizes-content,禁用双击缩放,输入区 16px 以防 iOS 聚焦放大。

生效范围与互斥

全部逻辑锁在 (max-width: 1023px) and (pointer: coarse),鼠标指针在任何窗口宽度下不生效。

若已安装 dsh-web-mobile,本插件 自动休眠(控制台有提示);卸载后者后自动接管。README 记载可与 dsh-better-sidebar 0.24.1 在 dsh 0.2.0-rc.1 下共存。

环境要求

  • DeepSeek Harness dsh ≥ 0.2.0-rc.1(README 在 0.2.0-rc.1 实测;帧探测钩子在 0.1.7-rc.2 亦可用)
  • 无插件依赖(v0.2 及更早依赖 dsh-web-mobile,v0.3 起独立)

安装与启用

插件在 web profile 下安装,热生效,无需重启服务:

dsh plugin --profile web add github:Bill-666code/dsh-kimi-shell

卸载:

dsh plugin --profile web rm dsh-kimi-shell

装好后用手机浏览器打开 DSH Web 即可;桌面端不受影响。

注意: 插件随当前 DSH 进程与 Web profile 加载,具备与宿主相同的运行上下文。安装前应阅读仓库源码与许可证,确认符合你的部署策略。

工作原理(摘要)

  1. 外壳 reconciler:通过 [data-shell-overlay] 的父元素定位宿主帧并标记 data-kimi-frame(MutationObserver + rAF),保证 FAB / 遮罩存在并在宿主重渲染后自愈。
  2. CSS:媒体查询门控下将侧栏列改为底部浮层布局;开合由宿主 data-sidebar-collapsed 驱动,并辅以 300ms 巡检内联兜底。
  3. 开合 API:使用官方 ctx.layout.toggleSidebar()(dsh 0.2.0 起插件需在 manifest 中 inject: ['layout','theme'])。
  4. 主题:ctx.theme.setTheme('light') 仅在偏好为 system 时一次性写入。

会话树等选择器采用 [class*="sessionRow"] 等子串匹配以适配 CSS Modules;宿主大版本改类名时可能需要跟随更新插件版本。

典型用法与调试

日常使用: 安装后无需额外配置。窄屏触屏下点 FAB 打开浮层浏览/切换会话;点遮罩或选中会话后浮层收起。

桌面浏览器模拟移动效果: 原生 media query 不受 JS 测试开关影响,无头或桌面窗口默认看不到移动壳。可在控制台执行后刷新:

sessionStorage.setItem('kimi-test','1')

此时 CSS 会去掉 media 包装、JS 外壳强制启用。退出可用 URL 参数 ?kimi-test=0。TEST 模式下不会改写服务端主题偏好。

适用场景与注意

适合: 经常在手机上用 DSH Web 查看会话、切换工作区,希望侧栏交互接近主流「底部抽屉 + FAB」的产品习惯,且不想同时维护 dsh-web-mobile 的用户。

注意:

  • 与 dsh-web-mobile 二选一(后者在场时本插件休眠)。
  • 依赖宿主 DOM 结构与官方 layout/theme 注入能力,升级 DSH 或侧栏相关插件后建议回归测试。
  • 社区目录页:skillhub.cn 插件条目;源码与 issue:GitHub。

结尾

dsh-kimi-shell 把 DSH Web 在触屏窄屏下的会话导航收成 Kimi 风格底部浮层,并补齐 hover 缺失、误触重命名、设置弹窗与键盘遮挡等移动端细节,同时保证桌面零影响。若你的 workflow 以手机浏览器访问 DSH 为主,可按上文命令在 web profile 安装验证。

  • 目录页:https://www.skillhub.cn/plugins/Bill-666code/dsh-kimi-shell
  • GitHub:https://github.com/Bill-666code/dsh-kimi-shell
羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye