Skip to content

fix(client): 设置页开关改用宿主 Switch 组件(#108) - #109

Merged
Mars-Sea merged 2 commits into
mainfrom
fix/settings-switch-primitive
Oct 30, 2026
Merged

Mars-Sea merged 2 commits into
mainfrom
fix/settings-switch-primitive

Conversation

@Mars-Sea

@Mars-Sea Mars-Sea commented Oct 30, 2026 •

Copy link
Copy Markdown
Owner

Closes #108

改了什么

设置页五个布尔开关(按套餐过滤模型、零数据保留、网页搜索、侧边栏额度、缓存图片卸载)原先是 appearance:none 的 checkbox 加 ::after 伪元素画出来的,现在改用宿主 @deepseek-ai/dsh-client-ui-primitives 的 Switch:一个 <button role="switch" aria-checked>,外观随 aria-checked 变化,与宿主其他设置页开关同源,画面与读屏读到的状态不会不一致。

在原语之上 .cc-switch 只做三处调整:

改前 改后 原因
checkbox + 伪元素 宿主 Switch #108:直接用官方开关组件
滑块 120ms ease,底色瞬切 底色与滑块同为 160ms 强 ease-out 两者同步,读作一个整体,与本页动效体系一致
按下无反馈 按下缩放 0.95,减少动效下取消 与本页其他小型可按元素一致
40×24 仍为 40×24、滑块 20px(原语 36×20,行程同为 16px) 保持设计画布尺寸

行为差异

原语不收 id,开关行标题改为纯文本,开关以 aria-label 取名;点标题文字不再切换开关,需点开关本身。

兼容性

Switch 的签名与 Switch.module.css 在 0.2.1-rc.2、0.2.1-rc.4、0.2.2-alpha.2 三版逐字一致;构建产物经已预置的 primitives require() 取到 Switch,不新增运行时依赖。lib/client.js 已随源码重新构建并提交(CI 要求两者一致)。

验证

  • npm run typecheck、npm test(1141 通过)、npm run build 通过
  • 新增 tests/toggle-field-render.test.ts:渲染为 role="switch" 按钮且无 checkbox;勾选态取自暂存值(空串回落默认);点击暂存 'true'/'false';只读时禁用
  • 用宿主主题包的真实变量 + Switch.module.css + PAGE_CSS 拼独立对照页,在浏览器里核对深浅两色、点击切换、按压缩放与只读半透明
  • 未在真实 DSH 宿主内验证(本机未安装 dsh)

🤖 Generated with Claude Code

Mars-Sea and others added 2 commits October 30, 2026 15:54
五个布尔设置行原先是 appearance:none 的 checkbox 加 ::after 伪元素画出的开关,
改为宿主 primitives 的 Switch(<button role="switch" aria-checked>),外观随
aria-checked 变化,与宿主其他设置页开关同源。

- 尺寸保持设计画布的 40x24、滑块 20px(原语 36x20,行程同为 16px)
- 底色与滑块统一 160ms 强 ease-out 同步过渡;按压缩放 0.95,减少动效下取消
- 原语不收 id:行标题改为纯文本,开关以 aria-label 取名,点标题不再切换
- Switch 签名与样式在 0.2.1-rc.2 / 0.2.1-rc.4 / 0.2.2-alpha.2 逐字一致
- 新增 toggle-field-render 测试,测试替身补 Switch

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
CI 的 build 检查要求 lib/ 与源码构建结果一致。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@Mars-Sea
Mars-Sea merged commit 44c29ff into main Oct 30, 2026
5 checks passed
Mars-Sea added a commit that referenced this pull request Oct 30, 2026
fix(client): 设置页开关尺寸回到宿主原语(#109 收尾)
Mars-Sea added a commit that referenced this pull request Oct 30, 2026
- #108:五个布尔设置改用宿主 primitives 的 Switch(button[role=switch]),
  与宿主其他设置页开关同源,读屏状态与画面不会再不一致。
- #109 收尾:去掉设计画布的 40x24 覆盖,轨道/滑块回到原语 36x20 / 16px,
  与宿主自带开关同尺寸;保留 160ms 同步过渡与按压缩放。
- 点开关行的标题文字不再切换开关,需点开关本身。
- 版本 0.16.1(patch)。
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

toggle实现太难看了

1 participant