dsh-rightbar-default-width:右栏默认更窄,拖拽宽度可记住

前言

用 DSH Web 客户端时,右侧栏(聊天、工具面板等)往往一打开就占掉接近半屏。官方 layout 里默认按视口约 45% 初始化,且刷新或重启后不会把上次拖过的宽度写回本地,于是「每次打开都要再拖一次」成了常见操作。纯 CSS 也难两全:内联宽度打不过普通样式表,用 !important 又会把拖拽后的值一并盖掉。

下面介绍社区插件 dsh-rightbar-default-width(维护者 OctoberaYours):在不动拖拽逻辑的前提下,把首次打开的默认宽度改成可配置比例(默认视口的 1/6),并把用户拖拽过的宽度记进 localStorage。

这是什么

dsh-rightbar-default-width 是 DSH 的 Web 客户端插件(分类:客户端)。它通过 Cordis patch 注入到 @deepseek-ai/dsh-client-ui-layout,改的是 layout store 里的 state,而不是用 CSS 硬改渲染结果。

解决的问题可以概括成两点:

  1. 默认宽度从「约半屏(45%)」改为更窄的可配置比例(默认 1/6)。
  2. 保留原有拖拽调宽;拖拽后的像素宽度会被记住,下次启动优先使用。

插件在 SkillHub 目录 可检索;源码与说明见 GitHub。当前 package 版本 0.1.0,许可证 MIT。社区目录为独立站点,与 DeepSeek / 幻方无官方从属关系。

背景:为什么不用 CSS

DSH 右栏宽度最终落在内联样式上(例如 grid 的 gridTemplateColumns、侧栏的 width / --dsh-sidebar-width)。普通样式表规则无法覆盖内联声明;若用带 !important 的规则,又会连拖拽写入的新宽度一起锁死。因此「默认窄」和「可拖拽」无法单靠 CSS 兼得。本插件在 openRightbar 写入默认半屏之前,先调用 layout 的 setRightbar 设好初值,并包装同一 API 以持久化用户拖拽结果。

核心功能

已核实能力如下(均来自项目 README 与 package.json):

  • 可配置默认比例:首次打开右栏前,将宽度设为「视口 × 比例」,默认比例为 1/6,避免半屏默认值被写入。
  • 拖拽不变:拖拽仍走 layout store 的 setRightbar,与官方行为一致。
  • 记住拖拽宽度:用户拖拽后的宽度写入 localStorage;下次启动优先读取;插件自设宽度时用内部标志,避免把初始化误记成拖拽。
  • 静默降级:若当前环境没有 ctx.layout.panels.setRightbar(例如 layout 服务不存在或 API 变更),插件静默退出,不报错。
  • HMR 友好:同一页面内组件重挂时,会在卸载时还原包装,避免链式叠加。

记住的是像素值,不是比例。换显示器或改窗口大小时,若旧值超出 DSH 的 clamp(300, 视口×0.7),会由客户端自行夹回合法区间。

安装与启用

安装方式为 profile 内 link 依赖 + bundle 声明,不是 dsh plugin add github:... 一类命令。README 给出的步骤如下(路径请按本机替换)。

  1. 将仓库放到本地目录,例如:
git clone https://github.com/OctoberaYours/dsh-rightbar-default-width C:\Users\<你>\Code\dsh-rightbar-default-width
  1. 编辑 profile 的 package.json(~/.dsh/profiles/<profile>/package.json)。dependencies 与 dsh.profile.bundles 两处都要写,只写一处可能被静默启停:
{
  "dependencies": {
    "dsh-rightbar-default-width": "link:C:/Users/<你>/Code/dsh-rightbar-default-width"
  },
  "dsh": {
    "profile": {
      "bundles": [
        "dsh-rightbar-default-width"
      ]
    }
  }
}
  1. link 安装需建立真正的 junction(bundle 解析会检查 node_modules/<name>/package.json):
cd ~/.dsh/profiles/<profile>/node_modules
cmd /c mklink /J dsh-rightbar-default-width C:\Users\<你>\Code\dsh-rightbar-default-width
  1. 客户端插件:刷新 Web 页面即可(README 说明 host 侧为空,一般不需要重启 host)。

peer 依赖为 @deepseek-ai/dsh 与 @deepseek-ai/dsh-client-ui-layout(版本范围见仓库 package.json)。安装前建议浏览源码与 LICENSE,确认与当前 DSH 版本匹配;插件在浏览器侧运行,权限边界与当前 profile / 客户端一致。

不对其它 profile 自动生效:每个 profile 需单独装配;若 web 等 profile 也要用,需同样加入依赖与 bundle。

典型用法

运行时改默认比例

在浏览器 DevTools 控制台执行,下次启动生效:

__dshRightbarWidth.setRatio(1/5)   // 1/5 屏;更窄可试 1/8

其它控制台 API

__dshRightbarWidth.current()   // 当前记住的宽度(px),未记过则为 undefined
__dshRightbarWidth.set(420)    // 立即改为 420px 并记住
__dshRightbarWidth.forget()    // 清除拖拽记录,回落到默认比例

改仓库内硬编码默认

若希望默认比例写死在插件里,可编辑 lib/client.js 中的 DEFAULT_RATIO。

适用场景与注意

适合谁

  • 长期用 DSH Web 界面、希望右栏默认占更少横向空间、又不想放弃拖拽的人。
  • 已用 profile + bundle 管理客户端插件、能接受 link 安装方式的开发者。

使用前注意

  • 仅对存在 layout 服务且暴露 setRightbar 的 Web 客户端有效;DSH 大版本若更换 layout API,插件可能静默失效,需关注上游变更。
  • 星标与社区曝光以目录页为准;安装与行为以 GitHub README 与源码为准。
  • 本文未验证 Windows 以外路径下的 junction 写法;非 Windows 环境请对照 DSH profile 文档处理 link: 与 node_modules 布局。

结尾

dsh-rightbar-default-width 用 state 层面的初值与 setRightbar 包装,在默认更窄和拖拽可记住之间做了折中,比纯 CSS 锁宽或每次手拖半屏更贴近日常开发习惯。

  • 目录页:https://www.skillhub.cn/plugins/OctoberaYours/dsh-rightbar-default-width
  • GitHub:https://github.com/OctoberaYours/dsh-rightbar-default-width
羽毛球分组比赛记分
小程序二维码

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

Xiaoye