DeepSeek Harness (DSH) 的设置界面目前没有为每个功能模块提供独立的图标支持。这导致侧边栏导航在视觉上较为单调,开发者难以通过图标快速识别特定的功能模块。dsh-ui-settings-icons 是一个 DSH UI 插件,它通过引入一个新的插槽机制,为设置侧边栏添加了自定义图标能力,并为部分已知能力包提供了预设图标。
该插件由 suntianc 维护,归类为“趣味换装”类别。它主要解决的是 DSH 设置导航侧边栏的图标显示问题。
核心功能¶
Keyed Icon Slot¶
插件在 settings shell 下声明了新的键值子插槽 settings.section.icon。任何在 settings.section 下注册设置分区的第三方插件,都可以通过匹配 section id 的 key 来注入自定义的 SVG 或 React 图标组件。插槽具有动态响应性,图标更新会自动触发重渲染,无需重启 web 界面。
内置预设与回退¶
插件内置了 16x16 矢量图标,用于 codex-auth/GPT Auth、antigravity-auth、以及 DSH 标准部分如 models、agent-presets、plugins。当分区未提供自定义图标且不匹配预设时,会优雅地回退到 DSH 的标准齿轮图标。
Chrome 与可访问性一致性¶
插件保留了与 DSH 默认设置外壳 100% 的功能和视觉一致性。支持键盘导航(Escape 关闭对话框并恢复焦点)、ARIA 对话框属性、宽/紧凑侧边栏触发器状态,以及配置文件启动器的原生支持。
零冲突 Cordis 组合¶
通过 cordis.patch.yml 替换默认的 ui-settings-general 行,防止了插槽声明冲突。它严格遵循 DSH 的纯生命周期模型,确保插件卸载时所有子插槽、字典和存储订阅都能正确清理。
安装与启用¶
- 确保目标 Host 使用 DSH
0.1.5-rc.1版本,且依赖图一致。 - 停止
dsh web进程。 - 执行安装命令:
dsh plugin --profile web add dsh-ui-settings-icons@0.1.3-rc.1
dsh plugin --profile web list
安装完成后,刷新浏览器即可生效。
典型用法¶
若开发者想在插件中为设置分区添加自定义导航图标,需注册设置分区并注入图标插槽:
import type { Context } from '@deepseek-ai/cordis'
import type {} from '@deepseek-ai/dsh-client-ui-renderer/client'
import type {} from '@deepseek-ai/dsh-client-ui-settings/client'
import type {} from 'dsh-ui-settings-icons/client'
import { MyPluginIcon } from './MyPluginIcon.tsx'
import { MySettingsPanel } from './MySettingsPanel.tsx'
export function apply(ctx: Context): void {
// 1. 注册设置分区主体
ctx.slots.inject('settings.section', () => ctx.slots.register({
name: 'settings.section',
id: 'my-plugin',
order: 50,
label: () => 'My Plugin',
}, MySettingsPanel))
// 2. 注册自定义导航图标(key 需匹配 section id)
ctx.slots.inject('settings.section.icon', () => ctx.slots.register({
name: 'settings.section.icon',
key: 'my-plugin',
}, MyPluginIcon))
}
适用场景与注意¶
- 版本依赖: 插件需要 DeepSeek Harness
0.1.5-rc.1作为开发和最低支持基线。需要 Node.js^22.19.0或>=24.0.0。 - 安装前准备: 安装前必须停止
dsh web进程。 - 兼容性: 0.1.2 及之前的插件版本针对已废弃的 DSH
0.1.1-rc.1客户端拓扑,无法在0.1.2-alpha.5上加载。
总结¶
通过引入 settings.section.icon 插槽,该插件让 DSH 设置页面的图标定制变得可行,提升了界面的可识别性。更多细节可参考 GitHub。