dsh-model-grid：把 DSH 模型选择器变成响应式卡片网格

前言¶

在 DeepSeek Harness（DSH）中，composer 的模型选择器通常以单行列表的形式呈现，选项多时需要频繁滚动。这种方式在宽屏上浪费空间，在窄屏上又难以快速定位。dsh-model-grid 把这个列表改成按提供商分组的响应式卡片网格，让模型选择更直观。

是什么¶

dsh-model-grid 是一个 DSH 客户端插件，由 anonamerjaxon-dev 维护。它的作用是在 DSH 的模型选择弹窗中插入一组响应式的卡片布局，按提供商分组，而不是单行列表。

核心功能¶

1. 响应式网格布局¶

网格列数根据弹窗宽度自动填充（auto-fill），最小列数为 1，窄窗口时会自然降级。卡片之间有可配置的间距。

2. 按提供商分组¶

每个提供商保持独立的区块，标题横跨整行，便于区分不同厂商的模型。

3. 兼容两种模型菜单¶

原生 dsh-client-ui-model-selection 下拉菜单
第三方 dsh-peakrate 模型菜单（可选）

选择器通过属性和类名匹配，不依赖任意插件存在。

4. 可配置项¶

通过 config 传入以下参数（默认值）：

配置项	默认值	说明
`maxWidth`	`900`	弹窗最大宽度（CSS px），限制范围 240–4000
`minCardWidth`	`200`	卡片最小宽度（CSS px），限制范围 80–1200
`gap`	`6`	卡片间距（CSS px），限制范围 0–64
`maxHeightVh`	`76`	弹窗高度上限（`vh`），限制范围 20–100
`hideCountdown`	`true`	隐藏价格标签中的长倒计时（如“· 14h 23m”）
`enabled`	`true`	禁用时不再注入样式

5. Host-only，升级安全¶

样式通过 webserver/index-inject 事件注入到页面 <head>，无需重新构建客户端 bundle，插件在 DSH 更新后仍可正常工作。

6. 无运行时依赖¶

插件不依赖任何运行时库。

安装与启用¶

这是一个 DSH profile 插件，需要放在 dsh.profile.bundles 中。

添加依赖到 profile：

dsh plugin --profile web add github:anonamerjaxon-dev/dsh-model-grid

在 ~/.dsh/profiles/web/package.json 的 dsh.profile.bundles 中加入 "dsh-model-grid"，然后重启 profile：

dsh web

如需本地 checkout：

dsh plugin --profile web add link:/path/to/dsh-model-grid

同样需要把 "dsh-model-grid" 加入 dsh.profile.bundles 并重启 profile。

重启 profile 是必须的：插件在启动时加载，样式在页面服务时注入。

典型用法¶

在 profile 的 cordis.patch.yml 中添加配置示例：

- insert:
    - id: model-grid
      name: 'dsh-model-grid'
      config:
        maxWidth: 1100
        minCardWidth: 180
        hideCountdown: false

配置会与默认值合并，直接覆盖需要修改的字段。

适用场景与注意¶

适合在需要频繁切换模型、提供商较多的项目中使用，尤其是宽屏显示器，能让模型列表一目了然。

插件以当前 DSH 进程的权限运行，安装前建议查看源码与许可证（MIT）。

结尾¶

dsh-model-grid 用一套 host-only 的注入方案，把模型选择器从单行列表改成了响应式卡片网格，配置灵活，兼容原生与第三方菜单。安装后重启 profile 即可生效。

目录页：https://www.skillhub.cn/plugins/anonamerjaxon-dev/dsh-model-grid
GitHub：https://github.com/anonamerjaxon-dev/dsh-model-grid