dsh-ui-settings-icons:DeepSeek Harness 设置侧边栏自定义图标插件

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 的纯生命周期模型,确保插件卸载时所有子插槽、字典和存储订阅都能正确清理。

安装与启用

  1. 确保目标 Host 使用 DSH 0.1.5-rc.1 版本,且依赖图一致。
  2. 停止 dsh web 进程。
  3. 执行安装命令:
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。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜