feat(Switch): 支持圆角和线性形态

[xy200303]

🤔 这个 PR 的性质是？

• 日常 bug 修复
• 新特性提交
• 文档改进
• 演示代码改进
• 组件样式/交互改进
• CI/CD 改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 其他

🔗 相关 Issue

Closes #2563

💡 需求背景和解决方案

为 Web Switch 的 shape API 提供公共样式实现：

• circle 保持现有默认胶囊样式不变；
• round 采用圆角矩形轨道和 handle；
• line 使用独立细轨道，保持 handle 的三种尺寸、hover、选中、loading、disabled 和按压状态。

样式复用现有 Switch 的语义色和动画 token，不改变既有组件结构、焦点或键盘交互。line 形态下 label 由各框架的 shape API 实现负责不渲染；文档中已明确说明。

🆚 方案对比

对比维度	本方案	取舍与收益
线性形态占位	保持原有 Switch 的宽度和最小交互区域，仅将背景替换为细轨道	不会因为切换 shape 改变表单布局或缩小可点击区域
尺寸适配	handle 尺寸由既有的高度和边框 token 推导，轨道仅按 l/default/s 调整高度	下游自定义已有尺寸 token 后，线性形态可同步适配，不需要维护另一组固定宽度和 handle 尺寸
按压反馈	显式重置默认胶囊形态在按压时的 handle 拉伸	线性轨道下 handle 仍保持圆形，避免压住轨道或产生视觉跳变
状态层级	轨道分别使用既有的 unchecked、checked、loading、disabled 语义色，并让 handle 位于轨道之上	亮色与暗色主题均沿用组件现有状态 token，保持状态可辨识性
语义边界	公共样式只处理视觉；line 的 label 由框架 API 层直接不渲染	避免用 CSS 隐藏业务内容，DOM 和辅助技术语义与 API 约定一致

本方案的重点不是额外引入一套独立控件尺寸，而是在保持现有 Switch 布局和交互边界的前提下完成外观分层，降低各框架接入和后续主题定制的成本。

与现有方案的具体对比

已对照以下候选 PR 的实现 diff：#2604、#2606、#2611。

候选方案	实现特点	本方案的差异
#2604	为 line 单独定义固定宽度（39/32/26px）和一组 handle 尺寸	保留原 Switch 的宽度与最小交互区域；handle 从已有高度和边框 token 推导，避免切换 shape 改变表单布局，也减少独立尺寸 token 的维护
#2611	已处理 round/line 和尺寸轨道，但 line 没有覆盖默认 Switch 的按压 handle 拉伸	额外重置 line 形态的按压拉伸，确保按压过程中 handle 仍为圆形且不会遮挡细轨道
#2606	同时尝试 Web 和移动端实现；Web 线性轨道没有按 l/default/s 单独设置厚度	本 PR 只对接已确认的 Web shape 类名契约，并针对三种 Web 尺寸分别设置轨道厚度和 handle 尺寸；移动端等待对应 API 契约明确后独立接入

共同部分均采用现有 Switch 的 checked、unchecked、loading、disabled 语义色。本方案的重点是保持既有布局边界和按压反馈，同时让下游主题定制继续复用现有尺寸 token。

📝 更新日志

• feat(Switch): 支持 round 和 line 两种 shape 外观

• 本条 PR 不需要纳入 Changelog

☑️ 请求合并前的自查清单

• 文档已补充或无须补充
• 代码演示已提供或无须提供
• TypeScript 定义已补充或无须提供
• Changelog 已提供或无须提供

验证

• pnpm run test（28 个测试文件，548 个测试通过）
• pnpm run typecheck
• pnpm exec stylelint style/web/components/switch/_index.less style/web/components/switch/_var.less --allow-empty-input
• pnpm exec prettier --check docs/web/api/switch.md docs/web/api/switch.en-US.md
• pnpm run lint：仓库基线有 738 个既有文件不符合当前 Prettier 规则；新增文档与 Switch 样式的针对性检查均通过。

[xy200303]

已按要求补充组件侧实现，React 侧 shape API 代码已提交：Tencent/tdesign-react#4341

实现要点：

• Switch 新增 shape 属性，支持 circle（默认）/ round / line，输出 t-switch--shape-{shape} 类名，与本 PR 的样式选择器对齐
• line 形态下不渲染 t-switch__content，遵循本 PR 约定的语义边界（label 由框架 API 层负责不渲染）
• 默认 circle 形态视觉与交互完全不变
• 已补充 shape demo（对应文档中的 {{ shape }} 占位）、4 个单测及 csr/ssr 快照，switch 14 个测试全部通过

[github-actions]

TDesign Component Repositories CI Test Open

Component	Lint	Test	Build	Preview
tdesign-vue	✅	✅	✅	👀
tdesign-vue-next	✅	✅	✅	👀
tdesign-react	✅	✅	✅	👀
tdesign-mobile-vue	✅	✅	✅	👀
tdesign-mobile-react	✅	✅	✅	👀