dsh-style-setting

中文 · English

为 DSH NEXT 提供独立的样式设置页：配色、卡片圆角、字体回退与对话密度。

界面名称： 样式设置 / Style Setting · 当前版本： 0.7.0

功能

独立配色：浅色、深色分别设置背景、面板和强调色。
主题预设：默认、浅紫、深灰、晨雾、墨青，一键应用配色。
卡片效果：调整外间距、共享圆角和阴影；关闭后保留参数。
字体回退：按顺序使用本机字体，不下载字体、不改变代码字体。
对话密度：紧凑、默认、宽松，不改变字号。
对比度提示：检查生效颜色，仅提示、不自动改色。
折叠分类：按类别展开设置，折叠保留未保存输入。
模型可用：注册 dsh_style_settings 工具，可用 get／set／reset 读写上述设置；该工具会出现在 DSH 的工具列表中。

安装

需要 DSH NEXT。源码构建需要 Node.js 22+ 和 npm。

下载本仓库源码并进入项目目录：

npm ci --ignore-scripts
npm run build

在 DSH 插件管理器中安装本地构建目录，安装来源使用 file:<项目目录的绝对路径>。也可生成安装包：

npm run pack:release

将生成的 local-dsh-style-setting-0.7.0.tgz 作为本地包安装来源。安装或更新后重启 DSH，再打开 设置 → 样式设置。

保持已有本地链接时无需重复安装。新增 Host 配置需要重启加载；仅停用再启用不保证清除缓存。控件提示重启时，请先重启再使用。

包标识保持 @local/dsh-style-setting；不会迁移或重置已有偏好。当前保留 private: true，用于 GitHub 源码发布和本地包安装，不支持直接 npm publish。

使用

分类	设置
配色与主题	预设、背景、主面板与侧边栏、强调色
卡片与圆角	卡片开关、圆角、外间距、阴影
对话与字体	对话密度、字体回退
对比度检查	生效配色检查与重新测量

修改后点击应用；颜色和字体输入支持 Enter 提交。
颜色输入为 #RRGGBB；留空恢复该模式的主题默认色。
字体示例：Arial, Microsoft YaHei, sans-serif。最多 16 项、512 字符；留空恢复默认。
圆角范围 0–32px，外间距 0–24px，阴影 0–30%；默认 18px / 12px / 10%。
恢复此组默认 只重置当前组，不影响其他设置。
命名预设仅修改对应模式的配色并请求切换模式；默认仅恢复当前模式配色，不切换模式。

模型工具

插件注册 dsh_style_settings 工具，支持 get、set、reset：

分组重置：background、surface、accent、font、card、density、all；all 是默认组。
card 只重置圆角、外间距与阴影三项，不改变卡片开关；density 只恢复原生对话密度。
参数在完整校验后通过官方设置服务原子保存，无效输入不产生写入。
兼容旧工具 dsh_background_colors，它只处理背景组。

逐字段说明与开发细节见工具与重置。

内置配色

预设	模式	背景	面板	强调色
浅紫	浅色	`#c4b7d7`	`#f5f5f5`	`#8f00ff`
深灰	深色	`#393836`	`#181616`	`#00bfff`
晨雾	浅色	`#eef5f2`	`#f8fcfa`	`#267568`
墨青	深色	`#20292e`	`#162126`	`#67c7b0`

注意事项

主面板与侧边栏共用颜色；输入框、历史用户消息及文件卡片跟随自定义背景。
共享圆角随卡片开关启用，圆形、胶囊与开关控件保留原生形状；对话密度独立于卡片开关。
正文、代码字体及成功／错误／警告语义颜色保持原样。
对比度参考文字 4.5:1、图标 3:1。未保存输入不参与；不能测量的颜色显示「无法测量」。这不是完整无障碍检查。
配色保存与模式切换是两个步骤；模式切换失败会提示配色已保存，不代表模式已持久化。
使用官方设置与主题接口，但部分样式依赖原生 CSS。布局和对话 UI 适配基于 0.2.0-rc.2，DSH 升级后需重新验证。

项目结构

dsh-style-setting/
├── src/                          # 32 个 TypeScript / TSX 源文件
│   ├── index.ts                  # Host 入口
│   ├── client.tsx                # Client 入口与生命周期
│   ├── background.ts             # 共享公开 API 的兼容入口
│   ├── contracts.ts              # Client、表单与行组件类型契约
│   ├── contrast.ts               # 颜色解析与 WCAG 对比度计算
│   ├── presets.ts                # 配色预设、原子保存与模式切换
│   ├── surfaces.ts               # 面板、背景、共享圆角与密度 CSS
│   ├── host/                     # Host 配置与工具
│   │   ├── config.ts             # Config schema
│   │   ├── contracts.ts          # Host 服务类型契约
│   │   ├── tool-schema.ts        # 工具输入和输出 schema
│   │   ├── tool-validation.ts    # 工具参数校验与写入操作生成
│   │   └── tools.ts              # 工具注册、执行和分组重置
│   ├── shared/                   # 共享模型、校验与主题同步
│   │   ├── model.ts              # 字段、默认值、范围与枚举
│   │   ├── colors.ts             # HEX 颜色校验和规范化
│   │   ├── cards.ts              # 卡片数值校验
│   │   ├── density.ts            # 密度枚举校验
│   │   ├── fonts.ts              # 字体列表解析和安全校验
│   │   ├── persisted.ts          # 已保存配置读取与兼容回退
│   │   ├── font-css.ts           # 字体覆盖 CSS
│   │   └── theme-layer.ts        # 主题令牌层同步、重入防护与清理
│   └── ui/                       # 设置页面与样式贡献
│       ├── StylePage.tsx         # 分类布局与组件组合
│       ├── SurfaceStyles.tsx     # 将生效设置转换为全局样式
│       ├── localization.ts       # 中英文页面文案
│       ├── row-face.ts           # 表单保存接口适配
│       ├── styles.ts             # 设置页自身 CSS
│       └── rows/                 # 独立设置行组件
│           ├── ColorRow.tsx      # 背景、面板与强调色
│           ├── CardRow.tsx       # 卡片效果开关
│           ├── CardParametersRow.tsx # 圆角、间距和阴影
│           ├── DensityRow.tsx    # 对话密度
│           ├── FontRow.tsx       # 字体回退列表
│           ├── PresetRow.tsx     # 配色预设
│           └── ContrastRow.tsx   # 生效颜色测量和对比度提示
├── tests/                        # 17 个测试文件；覆盖校验、UI、模块和发布
├── img/                          # 对外文档插图：设置页、晨雾和深灰预设外观
├── scripts/
│   └── build.mjs                 # Host ESM / Client ModuleLoader 构建
├── locale/                       # 插件元数据翻译，非设置页文案
│   ├── zh.json                   # 中文名称与描述
│   └── en.json                   # 英文名称与描述
├── cordis.patch.yml              # Cordis bundle 插件入口声明
├── icon.svg                      # 插件图标
├── package.json                  # 包身份、依赖、导出、脚本与打包白名单
├── package-lock.json             # npm 依赖锁定
├── tsconfig.json                 # TypeScript 类型检查配置
├── .gitignore                    # Git 忽略规则
├── .gitattributes                # 换行和二进制文件规则
├── .prettierrc.json              # 格式规范
├── .prettierignore               # 格式化排除规则
├── README.md                     # 项目主页与使用说明
├── README.en.md                  # 英文项目主页
├── DEVELOPMENT.md                # 逐文件职责、开发与发布指南
└── LICENSE                       # MIT 许可证

构建后的 dist/、安装依赖 node_modules/、本地验收 artifacts/ 和生成的 .tgz 不属于源码提交内容。README 引用的插图来自 img/，artifacts/ 中的历史截图含个人内容、不作为公开文档插图。每个源码、测试和配置文件的职责见逐文件说明。

开发与发布

npm run format:check
npm test
npm run pack:check

测试包含单元测试、真实 DSH 工具注册和 Chromium 样式检查；后两项依赖本机环境，缺失时明确跳过。

开发说明、模块边界和发布清单见 DEVELOPMENT.md，问题反馈请使用 Issues。

许可证

本项目采用 MIT License 许可证授权。

dsh-style-setting

中文 · English

为 DSH NEXT 提供独立的样式设置页：配色、卡片圆角、字体回退与对话密度。

界面名称： 样式设置 / Style Setting · 当前版本： 0.7.0

功能

独立配色：浅色、深色分别设置背景、面板和强调色。
主题预设：默认、浅紫、深灰、晨雾、墨青，一键应用配色。
卡片效果：调整外间距、共享圆角和阴影；关闭后保留参数。
字体回退：按顺序使用本机字体，不下载字体、不改变代码字体。
对话密度：紧凑、默认、宽松，不改变字号。
对比度提示：检查生效颜色，仅提示、不自动改色。
折叠分类：按类别展开设置，折叠保留未保存输入。
模型可用：注册 dsh_style_settings 工具，可用 get／set／reset 读写上述设置；该工具会出现在 DSH 的工具列表中。

安装

需要 DSH NEXT。源码构建需要 Node.js 22+ 和 npm。

下载本仓库源码并进入项目目录：

npm ci --ignore-scripts
npm run build

在 DSH 插件管理器中安装本地构建目录，安装来源使用 file:<项目目录的绝对路径>。也可生成安装包：

npm run pack:release

将生成的 local-dsh-style-setting-0.7.0.tgz 作为本地包安装来源。安装或更新后重启 DSH，再打开 设置 → 样式设置。

保持已有本地链接时无需重复安装。新增 Host 配置需要重启加载；仅停用再启用不保证清除缓存。控件提示重启时，请先重启再使用。

包标识保持 @local/dsh-style-setting；不会迁移或重置已有偏好。当前保留 private: true，用于 GitHub 源码发布和本地包安装，不支持直接 npm publish。

使用

分类	设置
配色与主题	预设、背景、主面板与侧边栏、强调色
卡片与圆角	卡片开关、圆角、外间距、阴影
对话与字体	对话密度、字体回退
对比度检查	生效配色检查与重新测量

修改后点击应用；颜色和字体输入支持 Enter 提交。
颜色输入为 #RRGGBB；留空恢复该模式的主题默认色。
字体示例：Arial, Microsoft YaHei, sans-serif。最多 16 项、512 字符；留空恢复默认。
圆角范围 0–32px，外间距 0–24px，阴影 0–30%；默认 18px / 12px / 10%。
恢复此组默认 只重置当前组，不影响其他设置。
命名预设仅修改对应模式的配色并请求切换模式；默认仅恢复当前模式配色，不切换模式。

模型工具

插件注册 dsh_style_settings 工具，支持 get、set、reset：

分组重置：background、surface、accent、font、card、density、all；all 是默认组。
card 只重置圆角、外间距与阴影三项，不改变卡片开关；density 只恢复原生对话密度。
参数在完整校验后通过官方设置服务原子保存，无效输入不产生写入。
兼容旧工具 dsh_background_colors，它只处理背景组。

逐字段说明与开发细节见工具与重置。

内置配色

预设	模式	背景	面板	强调色
浅紫	浅色	`#c4b7d7`	`#f5f5f5`	`#8f00ff`
深灰	深色	`#393836`	`#181616`	`#00bfff`
晨雾	浅色	`#eef5f2`	`#f8fcfa`	`#267568`
墨青	深色	`#20292e`	`#162126`	`#67c7b0`

注意事项

主面板与侧边栏共用颜色；输入框、历史用户消息及文件卡片跟随自定义背景。
共享圆角随卡片开关启用，圆形、胶囊与开关控件保留原生形状；对话密度独立于卡片开关。
正文、代码字体及成功／错误／警告语义颜色保持原样。
对比度参考文字 4.5:1、图标 3:1。未保存输入不参与；不能测量的颜色显示「无法测量」。这不是完整无障碍检查。
配色保存与模式切换是两个步骤；模式切换失败会提示配色已保存，不代表模式已持久化。
使用官方设置与主题接口，但部分样式依赖原生 CSS。布局和对话 UI 适配基于 0.2.0-rc.2，DSH 升级后需重新验证。

项目结构

dsh-style-setting/
├── src/                          # 32 个 TypeScript / TSX 源文件
│   ├── index.ts                  # Host 入口
│   ├── client.tsx                # Client 入口与生命周期
│   ├── background.ts             # 共享公开 API 的兼容入口
│   ├── contracts.ts              # Client、表单与行组件类型契约
│   ├── contrast.ts               # 颜色解析与 WCAG 对比度计算
│   ├── presets.ts                # 配色预设、原子保存与模式切换
│   ├── surfaces.ts               # 面板、背景、共享圆角与密度 CSS
│   ├── host/                     # Host 配置与工具
│   │   ├── config.ts             # Config schema
│   │   ├── contracts.ts          # Host 服务类型契约
│   │   ├── tool-schema.ts        # 工具输入和输出 schema
│   │   ├── tool-validation.ts    # 工具参数校验与写入操作生成
│   │   └── tools.ts              # 工具注册、执行和分组重置
│   ├── shared/                   # 共享模型、校验与主题同步
│   │   ├── model.ts              # 字段、默认值、范围与枚举
│   │   ├── colors.ts             # HEX 颜色校验和规范化
│   │   ├── cards.ts              # 卡片数值校验
│   │   ├── density.ts            # 密度枚举校验
│   │   ├── fonts.ts              # 字体列表解析和安全校验
│   │   ├── persisted.ts          # 已保存配置读取与兼容回退
│   │   ├── font-css.ts           # 字体覆盖 CSS
│   │   └── theme-layer.ts        # 主题令牌层同步、重入防护与清理
│   └── ui/                       # 设置页面与样式贡献
│       ├── StylePage.tsx         # 分类布局与组件组合
│       ├── SurfaceStyles.tsx     # 将生效设置转换为全局样式
│       ├── localization.ts       # 中英文页面文案
│       ├── row-face.ts           # 表单保存接口适配
│       ├── styles.ts             # 设置页自身 CSS
│       └── rows/                 # 独立设置行组件
│           ├── ColorRow.tsx      # 背景、面板与强调色
│           ├── CardRow.tsx       # 卡片效果开关
│           ├── CardParametersRow.tsx # 圆角、间距和阴影
│           ├── DensityRow.tsx    # 对话密度
│           ├── FontRow.tsx       # 字体回退列表
│           ├── PresetRow.tsx     # 配色预设
│           └── ContrastRow.tsx   # 生效颜色测量和对比度提示
├── tests/                        # 17 个测试文件；覆盖校验、UI、模块和发布
├── img/                          # 对外文档插图：设置页、晨雾和深灰预设外观
├── scripts/
│   └── build.mjs                 # Host ESM / Client ModuleLoader 构建
├── locale/                       # 插件元数据翻译，非设置页文案
│   ├── zh.json                   # 中文名称与描述
│   └── en.json                   # 英文名称与描述
├── cordis.patch.yml              # Cordis bundle 插件入口声明
├── icon.svg                      # 插件图标
├── package.json                  # 包身份、依赖、导出、脚本与打包白名单
├── package-lock.json             # npm 依赖锁定
├── tsconfig.json                 # TypeScript 类型检查配置
├── .gitignore                    # Git 忽略规则
├── .gitattributes                # 换行和二进制文件规则
├── .prettierrc.json              # 格式规范
├── .prettierignore               # 格式化排除规则
├── README.md                     # 项目主页与使用说明
├── README.en.md                  # 英文项目主页
├── DEVELOPMENT.md                # 逐文件职责、开发与发布指南
└── LICENSE                       # MIT 许可证

开发与发布

npm run format:check
npm test
npm run pack:check

测试包含单元测试、真实 DSH 工具注册和 Chromium 样式检查；后两项依赖本机环境，缺失时明确跳过。

开发说明、模块边界和发布清单见 DEVELOPMENT.md，问题反馈请使用 Issues。

许可证

本项目采用 MIT License 许可证授权。

CYEzero/dsh-style-setting

dsh-style-setting

功能

安装

使用

模型工具

内置配色

注意事项

项目结构

开发与发布

许可证

Community comments

CYEzero/dsh-style-setting

dsh-style-setting

功能

安装

使用

模型工具

内置配色

注意事项

项目结构

开发与发布

许可证

Community comments