顶栏高度拖拽 jiangshirong/dsh-ui-panel-resize

description: "对话顶栏高度拖动 / 拖过最小值即收起：给 DSH Web GUI 的会话标题栏加上可拖动的下边界。"

@dsh/ui-panel-resize

DSH plugin
license: MIT

这是 DSH（DeepSeek Harness）的客户端插件：装进 DSH profile 后，给 Web GUI 的对话顶栏加一条可拖动的下边界。
仓库话题：dsh · dsh-plugin · deepseek-harness · cordis-plugin · dsh-client-plugin

它解决的问题

对话内的顶栏（会话标题 + 子智能体 / 模式 / 后台任务徽标 + “对话 / 轨迹” 标签页）高度完全由内容决定，没有任何调节入口：鼠标移到它的下边界时光标不会变化，也没有办法把它压扁或收起来。
本插件把那条边界变成可拖动的手柄。

左栏的“拖过最小宽度即收起”曾经也在本插件里，已删除（见文末「为什么不做左栏」）。

交互

| 操作 | 结果 |
| 鼠标移到顶栏下边界 | 光标变 row-resize（上下箭头），并浮出一小段把手 |
| 向上拖 | 顶栏变矮，内容超出部分被裁掉；最低 44px（只留标题行） |
| 在最低高度以下继续向上拖 40px 以上 | 把手变蓝 + 提示「松开以收起顶栏」 |
| 在上一步松手 | 顶栏收成 8px 细条 |
| 收起后：点击细条 | 展开回上次的高度（未设过则回到自然高度） |
| 收起后：向下拖 24px 以上 | 同上 |
| 向下拖 | 顶栏变高，在自然高度以上最多再长 160px |
| 在把手上双击 | 清除手动高度，回到内容自然高度 |

拖动过程中把手旁会显示实时高度（xx px），越过收起阈值时改为提示文字。

参数（lib/client.js 顶部）

| 常量 | 值 | 含义 |
| HEADER_MIN | 44 | 最低可见高度（保留标题行，裁掉标签页） |
| HEADER_COLLAPSE_SLACK | 40 | 比最低高度再矮多少才算“要收起” |
| HEADER_COLLAPSED | 8 | 收起后保留的细条高度 |
| HEADER_MAX_GROWTH | 160 | 自然高度之上允许的最大增高 |
| HEADER_DRAG_SLOP | 3 | 超过多少像素才算拖动（否则算点击） |
| HEADER_RESTORE_TRAVEL | 24 | 收起状态下向下拖多少像素算展开 |

实现

只用稳定的 DOM 钩子，不依赖被哈希的 CSS 类名，也不改动任何由 React 管理的子树：

- 顶栏用 [data-conversation-header-leading] 的父元素定位（回退：最宽的 header[data-window-drag]），给它打上插件自有的 data-dsh-panel-resize="header"，并通过 CSS 变量 --dsh-panel-resize-header-height 控制高度（!important 覆盖宿主 min-height:76px）。
- 把手是挂在 document.body 上的 position: fixed 元素，几何只取自顶栏自身的
getBoundingClientRect()。这一点很关键：顶栏的父节点是槽位宿主，可能是 display: contents
（边框盒为 0），早期版本因此算出 left:0;width:0 的隐形把手。把手跨在边界上：约 7px 在顶栏内（正好落在标签页自身的下内边距里）、约 3px 在正文侧；若右侧面板占用轨道（[data-rightbar-col] 宽度 > 0），把手会裁到轨道左边缘。
- 偏好写在 localStorage['dsh.ui-panel-resize.header'] = {"height":number|null,"collapsed":boolean}。
- 所有节点与监听器都归 ctx.effect() 管理，关闭或热替换插件时自动移除；样式是单个。

插件不申请任何服务（inject: []），纯 DOM chrome。

安装

git clone https://github.com/jiangshirong/dsh-ui-panel-resize.git
cd dsh-ui-panel-resize
powershell -ExecutionPolicy Bypass -File install.ps1

（装了 PowerShell 7 的话 pwsh -File install.ps1 等价。）

脚本会把当前目录复制到 %USERPROFILE%\.dsh\profiles\desktop\node_modules\@dsh\ui-panel-resize，并在 %USERPROFILE%\.dsh\profiles\desktop\cordis.patch.yml 末尾写入 loader 条目（已存在则跳过）。

如果你所在网络访问 github.com 不稳定，install.ps1 也可以离线使用：把仓库目录（或压缩包解压后的目录）放到任意位置，在该目录里运行 pwsh -File install.ps1 即可。

手工安装（等价两步）

1. 把本仓库目录复制到 %USERPROFILE%\.dsh\profiles\desktop\node_modules\@dsh\ui-panel-resize；
2. 在 %USERPROFILE%\.dsh\profiles\desktop\cordis.patch.yml 末尾追加：

- insert:
- id: ui-panel-resize
name: "@dsh/ui-panel-resize"
disabled: false

insert 是必须的：只写 id + name 的行是覆盖已有条目，条目不存在时会被静默丢弃。

宿主 Loader 会立即新增该条目，浏览器端通过模块图（HMR）热加载，通常不需要重启；改 lib/client.js 后同样会自动重载，改 lib/index.js（宿主半边）才需要重启。

卸载

删除 cordis.patch.yml 里的 insert 条目（或在「设置 → 插件」里关闭该条目），再删掉 node_modules\@dsh\ui-panel-resize 目录。插件所有 DOM 节点与样式会随卸载一起消失。

诊断

浏览器端把关键事件写进自有的 localStorage 环形缓冲 dsh.ui-panel-resize.trace（每次激活重置），宿主端插件把它镜像到 %USERPROFILE%\.dsh\profiles\\ui-panel-resize-trace.log。
页面内插件没有 devtools 控制台，这是唯一的外报通道。

| 标记 | 含义 |
| A:apply | 客户端半边已激活 |
| H:found: | 已定位顶栏， 为自然高度；后附 anchors= / pos= |
| H:handle | 已创建把手 |
| H:detach::live= | 顶栏节点被宿主替换（React 重建 ），live=0 表示旧节点已断开 |
| H:collapsed / H:height: / H:restore: / H:reset | 收起 / 设高 / 展开 / 复位 |
| D:handle= / D:atHandle= | 激活后 1.2s 的命中采样：把手几何 + 该点上最上层元素 |
| E: | 异常（含类型与消息） |

为什么不做左栏

初版还实现了「左栏拖动过最小宽度即收起」（ChatGPT 那套）。后来删掉了，理由是它作为功能不成立：

1. 结果本来就一步可达：Ctrl+B 和侧栏自带的收起控件都能收起左栏。实现里的降级方案就是合成一次 Ctrl+B —— 当一个手势的兜底是一次按键时，这个手势没有新增能力。
2. 它有代价，不只是零收益：按宿主契约，收起会忘掉拖出来的宽度，重新展开回到默认 280px。
于是“拖宽度”这个原本安全的动作变成危险动作：过冲一下，整栏消失，刚调好的宽度也没了。
3. 窄窗口语义不一致：窗口 < 1024px 时 toggleSidebar() 切换的是“窄屏覆盖式展开”状态，手势与快捷键的后果并不等价。
4. 它是整个插件里唯一需要和 React 拖动生命周期抢指针的部分（捕获阶段拦截 pointerup、 stopPropagation 阻止宿主回写宽度、手动释放指针捕获、再用 280/720ms 反向补发兜底），风险最高、最难维护，而服务的是一个重复功能。

顶栏没有等价入口，所以留下。

已知边界

- 把手宽 10px、跨在边界上；约 7px 落在顶栏内（标签页自身的下内边距里），约 3px 落在正文顶部。
- 顶栏收成 8px 细条后，若当前主面板不是对话（例如打开设置面板），把手自动隐藏。
- 顶栏高度覆盖在「空白会话 ↔ 有会话」切换时会重新测量自然高度（监听 class 变化），手动设定的高度会被夹到新的合法区间。