← Back to home@me9rez

dsh-pwsh-style

修改 DSH 会话回复中 pwsh(PowerShell) 工具卡片的主题、字体与可读性增强。Restyle pwsh tool-call cards in DSH: themes, system fonts, copy & expand, workdir display.

Stars
0
Language
JavaScript
Created
Aug 28, 2026
Updated
Aug 28, 2026
Web UITheme
GitHub repo

Introduction

dsh-pwsh-style

License: MIT DSH

为 DSH 会话回复中的 pwsh（PowerShell）工具卡片 提供主题、字体与可读性增强。 架构沿袭 dsh-file-mentions：Host 半（设置 + 配置路由）+ Client 半（__ModuleLoader__ bundle，CSS 注入 + 可选 DOM 装饰）。

特性

  • 🎨 八套主题：ps-blue / monokai / classic / dracula / nord / tokyo-night / solarized-dark / github-light，只作用于插件新增的元素，绝不改写原生输出配色
  • 🅿️ "PowerShell" 徽标：卡片标题行自动注入 PS 图标药丸
  • 📋 复制命令按钮：从 tool/call 事件精确读取 arguments.command，复制内容不混入描述、输出或按钮文本
  • 📖 展开/收起按钮：显示完整命令（长命令不再被省略号截断），并展示调用时的 工作目录
  • 🔤 字体配置：以下拉框选择系统已安装字体（font-list 枚举），支持字号（11–16px）与字重（300–700）微调
  • 🛡️ 零 hash class 依赖：全部钩子基于稳定的 data-* 属性，DSH 升级重写 CSS-module 类名也不失效

截图

pwsh 卡片效果

命令面板展开效果

安装

需要 pnpm 在 PATH 上（dsh plugin 会转发给 pnpm）：

dsh plugin --profile web add "github:me9rez/dsh-pwsh-style#main"

然后重启 dsh web——bundle 层在启动时组合，HMR 不生效。本地开发时也可用 link 方式安装：

dsh plugin --profile web add "link:C:/workspace/dsh-pwsh-style"

配置

打开 DSH Web GUI → 设置，找到本插件的配置卡片。

配置项说明
启用开关插件整体效果
主题八套预设，见下表
字体下拉框，来自系统已安装字体（重启 dsh web 后刷新；枚举失败回退内置常用列表），末项「默认等宽字体」恢复内置栈
字号11–16px
字重300（细）/ 400（常规）/ 500（中）/ 600（半粗）/ 700（粗）

主题

主题背景前景强调色
ps-blue#161b29#dbe4ff#2b6cff
monokai#272822#f8f8f2#a6e22e
classic跟随 DSH 当前主题--
dracula#282a36#f8f8f2#bd93f9
nord#2e3440#d8dee9#88c0d0
tokyo-night#1a1b26#a9b1d6#7aa2f7
solarized-dark#002b36#93a1a1#b58900
github-light#f6f8fa#1f2328#0969da

主题只通过 --pwsh-panel-* 变量作用于插件自有元素（徽标、工具条、命令面板）；原生 pwsh 终端配色、官方 --dsw-*/--dsl-* token 一律不覆盖。唯一的例外是字体——为让命令提示行与输出区跟随所选字体，会整体覆盖官方 token --dsw-font-markdown-code-block-small（仅 font 呈现，不改任何颜色，默认值时不注入任何样式）。

工作原理

外层锚点：@deepseek-ai/dsh-client-ui-tool 中只有 "bash" 注册了 keyed toolview；pwsh 虽被归类为 bash 变体（TOOL_VARIANTS: { pwsh: "bash" }），但它的 entryKey 仍是字面工具名 "pwsh"，命不中 bash toolview，回退到 GenericToolCard——其根元素稳定打上 data-tool="pwsh"（client.js:718）。bash 卡片不会携带此属性。

命令数据：从 tool/call 事件的 arguments 读取 command / workdir，通过祖先节点的 data-chat-call-id 精确关联到卡片（该属性在外层调用节点上，需用 closest() 获取）。不从摘要 DOM 反推文本。

注入方式：

  1. CSS 注入（主方案）：向 <head> 注入 <style>，以 [data-tool="pwsh"] 为作用域提供主题变量；不依赖 React 渲染，不受重渲染影响。
  2. MutationObserver（DOM 装饰）：徽标、按钮、命令面板需要新建节点，官方渲染入口被占用（与 file-mentions 相同约束），用观察器动态插入，React 重渲染清掉节点后下一帧自动补回。

开发

dsh-pwsh-style/
├── lib/
│   ├── index.js      # Host 半: settings 命名空间 + /api/pwsh-style/config|fonts
│   └── client.js     # Client 半: __ModuleLoader__ bundle（CSS 注入 + DOM 装饰）
├── cordis.patch.yml  # bundle 挂载声明
└── package.json      # dsh.bundle / dsh.client 声明
  • 增删主题：改 lib/client.js 的 THEMES（主题下拉自动出现）
  • 调整徽标：改 PS_BADGE_SVG
  • FONT_PRESETS 只是系统字体枚举失败时的回退列表，正常无需维护
  • 修改后重启 dsh web 并硬刷新浏览器页面

许可

MIT © me9rez