メインコンテンツへスキップ
M

dsh-topbar-drawer-xyy

mengnanxyyyy/dsh-topbar-drawer-xyy

DSH plugin: makes the session header (top bar) collapsible as a drawer with smooth CSS transition animation

インストール

dsh plugin --profile web add github:mengnanxyyyy/dsh-topbar-drawer-xyy

README

dsh-topbar-drawer-xyy

这是一个给 DSH 顶栏增加收缩功能的插件,通过拉环就能收缩和展开。

npm version npm downloads license GitHub stars language English LINUX DO

效果展示

🟢 展开状态 — 顶栏完全可见,拉环悬挂在底部边缘

展开状态

🔴 收缩状态 — 顶栏隐藏,拉环悬停在左上角

收缩状态

功能特性

  • ✨ 在顶部栏底部边缘添加拉绳式折叠/展开按钮(琥珀色拉环)
  • 🎨 平滑的 CSS 过渡动画效果(max-height + opacity)
  • 💾 折叠状态持久化(localStorage),跨会话/页面刷新保持
  • 🎯 纯客户端实现,无需服务端逻辑
  • 🌗 支持 DSH 主题色(拉环按钮跟随 --dsw-alias-state-warn-* 变量)

能力表格

能力说明
Client UI顶部栏底部的拉环按钮 + CSS 折叠动画
状态持久化localStorage 记住折叠状态
样式注入自动注入折叠状态样式(idempotent)

安装

从 npm 安装(推荐)

# 一键安装(自动注册到 cordis.patch.yml)
dsh plugin add dsh-topbar-drawer-xyy

从 GitHub 安装

# 从 GitHub 仓库直接安装
dsh plugin add github:mengnanxyyyy/dsh-topbar-drawer-xyy

从本地目录安装(开发)

# 安装依赖
pnpm install

# 构建 client bundle
pnpm build

# 安装到 profile
dsh plugin add .

安装后刷新页面即可看到顶部栏底部边缘的拉环按钮。点击拉环折叠/展开顶部栏,状态自动持久化。

使用方法

安装插件后,顶部栏底部边缘会出现一个琥珀色拉环按钮:

  • 点击拉环:折叠顶部栏(隐藏)
  • 再次点击:展开顶部栏(恢复)
  • 状态在页面刷新和会话切换后保持

卸载

# 从 profile 移除插件(自动清理 cordis.patch.yml)
dsh plugin remove dsh-topbar-drawer-xyy

开发

项目结构

dsh-topbar-drawer-xyy/
├── package.json            # 插件配置(dsh.client 声明)
├── index.mjs               # Node half 入口(Cordis 插件)
├── src/
│   └── client.ts           # Client half 源码(TypeScript)
├── lib/
│   └── client.js           # Client half 构建产物(CJS,入库)
├── scripts/
│   └── build.mjs           # esbuild 构建脚本
├── docs/
│   └── images/             # 截图
├── tsconfig.json           # TypeScript 配置
├── LICENSE                 # MIT 许可证
└── README.md

构建

# 安装依赖
pnpm install

# 构建 client bundle
pnpm build

# 检查构建产物是否最新(CI 门禁)
pnpm check

产物入库lib/client.js 为构建产物并提交进仓库——git 源安装不跑构建,产物直接可用。修改 src/client.ts 后运行 pnpm build 并提交新产物。

发布

# 1. 确保构建产物最新
pnpm check

# 2. 更新版本号
npm version patch  # 或 minor / major

# 3. 发布到 npm
npm publish

# 4. 推送 tag 到 GitHub
git push --follow-tags

许可证

MIT License — 详见 LICENSE


运行在 DeepSeek Harness

関連プラグイン