Dialog 新增 Size=Emphasized 变体(DES-37)
Pre-release · 类型: ✨ 新功能
DES-37:Dialog 新增
Size=Emphasized变体。
改动内容
DES-37: Dialog 支持 Size=Emphasized
状态:已完成
背景:
Figma Modal 组件(COMPONENT_SET 21235:6773)的 Size 轴含 Default / Emphasized 两个值,此前实现仅覆盖 Default。经 Figma 核实,Emphasized 与 Default 唯一差异是内容容器宽度(Default 464px / Emphasized 708px),其余 padding / 圆角 / 字号 / 结构两者一致。
注:原
DialogDesignSpec.md误将Size轴记为Variant,且多列了一个不存在的Onboarding值。Onboarding Modal在 Figma 中是独立组件(节点18609:2556/21248:3849),不在本组件范围。spec 已一并修正。
改动文件:src/components/Dialog/Dialog.tsx、src/components/Dialog/index.ts、src/components/index.ts、src/components/Dialog/Dialog.test.tsx、src/components/Dialog/DialogDesignSpec.md、packages/design-site/docs/components/patterns/dialog.mdx、packages/design-site/i18n/zh-CN/.../dialog.mdx
改动内容:
- 新增对外类型
DialogSize = 'default' | 'emphasized'与DialogProps.size(默认'default')。DialogOpenOptions通过Omit<DialogProps, ...>自动继承size,命令式Dialog.open()同样可用 - 新增尺寸→宽度映射
DIALOG_SIZE_CLASS,仅emphasized覆盖ui/dialog默认宽度(max-w-177= 708px);default沿用 primitive 的max-w-116(464px)。通过mergeClass(tailwind-merge 3.3.0)覆盖,已验证max-w-116/max-w-177同组去重 ui/dialog保持不变(primitive 仍提供 464px 默认),符合「ui 提供默认视觉、design 层接管语义变体」分层原则- 补单测:默认宽度
max-w-116、size="emphasized"应用max-w-177且覆盖默认 - design-site 新增「Size / 尺寸」示例与 Props 表
size行(中英双语)