- Início
- Plugins
- Melhorias de UI
- dsh-sidebar-left-split
dsh-sidebar-left-split
yhprime/dsh-sidebar-left-split
Turn the seam between the sidebar panel list and the workspace list into a divider you can drag, snapping one row at a time, with the panel list scrolling when squeezed.
Instalar
dsh plugin --profile web add github:yhprime/dsh-sidebar-left-splitREADME
dsh-sidebar-left-split
左侧栏(DSH 原生 sidebar)本来是上下两段:上面是全局面板列表(一行一个面板,末尾是「更多」), 下面是「工作区」浏览区(会话树)。面板列表高度由内容决定、不可调,窗口一矮,「工作区」就被 压到几乎看不见;反过来想把会话树留大一点,也没有抓手。
这个插件只做一件事:把两段之间的交接变成按行磁吸的可拖动分隔条。
- 悬浮交接处出现一条细分隔线(2px)和上下拖动光标;按住上下拖动时,面板列表按 「一个按钮」为一格跳:往下拖一格露一行,往上拖一格收一行,不会停在半行上;
- 最小一格是只露一行(其余靠滚动条);最大是所有按钮都露出来、不需要滚动, 再往下拖也到顶了;
- 滚动也按行磁吸:被压小后滚轮一格跳一行(触控板小碎步先攒着),拖滚动条/键盘停下后 自动对齐到最近整行;全部按钮都露出来时不拦滚轮,照常滚页面;
- 双击交接处回到「按内容自适应」(面板列表恢复自然高度);
- 面板列表被压小后自己长出滚动条(
overflow-y: auto,不溢出就不出条),行不会被裁掉; - 记的是「留几行」不是像素,刷新/重启后仍对齐行;窗口变矮时自动回收到「工作区」的最小高度(120px);
- 侧栏收起成窄轨(
*_collapsed)时自动让开,不影响窄轨图标列; - 滚动条外观沿用宿主:
dsh-client-ui-theme已给全站::-webkit-scrollbar定了宽度与主题色, 这里只用--dsw-alias-border-l1/-l2画分隔线,不另设颜色。
不改 node_modules 里的任何第三方包,也不改 DSH 自身;不插入子节点(React 管着那棵树的
children),只用标记属性 + CSS 变量驱动样式,上游重渲染不会把分隔条冲掉。选择器只依赖上游
CSS Module 的类名后缀(_regionArea / _panelList)与结构位置,不依赖哈希前缀。
安装
git clone https://github.com/yhPrime/dsh-sidebar-left-split.git
在 DSH 里用插件管理安装(plugin_manager → install_bundle,target 为克隆下来的目录绝对路径),
然后刷新页面;插件管理里会看到「侧栏工作区分隔 / Sidebar workspace splitter」。
建议先
pnpm pack出 tarball、再用 tarball 的绝对路径当 target:直接传目录会建 pnpm link(link:), 之后卸载插件时可能连带删掉源码目录。装了新版本后如果application报restart-required(清单层的版本号变了),需要重启 DSH 才会加载。
测试
node test/check.mjs # 静态自检 45 项
node test/client.test.mjs # 行为自检 67 项(最小 DOM 替身,无浏览器)
用法
| 操作 | 效果 |
|---|---|
| 悬停在「更多」与「工作区」之间 | 出现分隔线与上下拖动光标 |
| 按住上下拖动 | 按行磁吸:一格 = 一个按钮;往下露一行、往上收一行 |
| 往上拖到底 | 只留一行(1 个按钮),其余靠滚动条 |
| 往下拖到底 | 所有按钮都显示出来,不再往下走 |
| 压小后在列表里滚动 | 一行一步;拖滚动条停下后自动对齐最近整行 |
| 双击交接处 | 恢复自适应(清掉记忆的行数) |
文件
| 文件 | 作用 |
|---|---|
index.js | Host 半,空 apply(浏览器半才是本体) |
client.js | 浏览器半:样式注入 + 交接手势 + 高度记忆 |
cordis.patch.yml | bundle 行 |
locale/en.json、locale/zh.json | 插件管理里的标题与描述 |
icon.svg | 插件图标(16 栅格、currentColor 描边,与宿主图标同族画法) |
test/check.mjs | 静态自检 |
test/client.test.mjs | 行为自检(最小 DOM 替身,无浏览器) |
已知边界
- 交接处是几何命中(距「工作区」上边缘 ±5px),不存在可聚焦的 DOM 抓手,键盘不可达; 需要无障碍控制的话得上游把分隔条做成真控件。
- 磁吸格距按实测行高 + 行距算(不硬编码),所以换主题/字号仍然对齐行;面板增减行时 记忆的行数会被夹到当前行数上限。
- 上游若重命名
regionArea/panelList这两个 CSS Module 类名,插件会静默不生效(不报错、不改布局)。
Plugins relacionados
dsh-web (dsh-task-board)
zhu1090093659/dsh-web
dsh-web (dsh-web-all)
zhu1090093659/dsh-web
dsh-TUI
ccch1mneyyy/dsh-tui
dsh-web-ui (dsh-task-board)
zhu1090093659/dsh-web-ui