4.0 KiB
4.0 KiB
| phase | slug | status | shadcn_initialized | preset | created | reviewed_at |
|---|---|---|---|---|---|---|
| 06 | at-file-reference | approved | true | new-york | 2026-04-15 | 2026-04-15T10:08:50+08:00 |
Phase 06 — UI Design Contract
Visual and interaction contract for frontend phases. Generated by gsd-ui-researcher, verified by gsd-ui-checker.
Design System
| Property | Value |
|---|---|
| Tool | shadcn（来源：frontend/components.json） |
| Preset | style=new-york, baseColor=neutral, cssVariables=true（来源：frontend/components.json + npx shadcn info） |
| Component library | radix（来源：npx shadcn info） |
| Icon library | lucide（来源：frontend/components.json） |
| Font | "Microsoft YaHei","微软雅黑","PingFang SC",ui-sans-serif,system-ui,sans-serif（来源：frontend/src/styles/globals.css） |
Spacing Scale
Declared values (must be multiples of 4):
| Token | Value | Usage |
|---|---|---|
| xs | 4px | chip 内图标与文字间距、微小内边距 |
| sm | 8px | dropdown 条目内间距、chip 间距 |
| md | 16px | 输入框内部默认间距、候选区分组间距 |
| lg | 24px | 输入框 footer 区块分隔 |
| xl | 32px | 面板与上下内容的视觉留白 |
| 2xl | 48px | 大段落分区留白（不用于本 phase 细粒度组件） |
| 3xl | 64px | 页面级留白（沿用全局，不在本 phase 新增） |
Exceptions: none（来源：默认值；未与 D-08 上限/交互约束冲突）
Typography
| Role | Size | Weight | Line Height |
|---|---|---|---|
| Body | 14px | 400 | 1.5 |
| Label | 16px | 600 | 1.4 |
| Heading | 20px | 600 | 1.2 |
| Display | 28px | 600 | 1.2 |
说明：仅使用 2 个字重（400/600）；字号集合为 14/16/20/28（来源：globals.css 现有 14/16/20 + 本 phase 默认扩展 28）。
Color
| Role | Value | Usage |
|---|---|---|
| Dominant (60%) | #F9F8FA (--background) |
主背景、输入区域底面 |
| Secondary (30%) | #FFFFFF (--card/--popover) |
dropdown 容器、卡片、浮层底色 |
| Accent (10%) | #1500331A (--accent/--secondary) |
候选高亮底、chip 轻量背景、@ 触发态提示 |
| Destructive | oklch(0.577 0.245 27.325) (--destructive) |
删除引用 chip 图标 hover/危险提示 |
Accent reserved for: @ 触发后候选高亮行、已选引用 chip 背景、引用上限提示中的非危险强调文本（不用于全部按钮）。
Visual Anchors & Hierarchy
- 主焦点：
@候选 dropdown 的高亮首项（默认聚焦项，承担“下一步可执行动作”视觉引导）。 - 次焦点：输入框内已选 chip 列表（持续反馈当前引用上下文）。
- 第三层：辅助提示（引用上限提示、软失败 toast）。
- 交互可达性补充：chip
×必须提供文字 fallback（tooltip或aria-label="移除引用"）。
Copywriting Contract
| Element | Copy |
|---|---|
| Primary CTA | 添加引用 |
| Empty state heading | 无可引用文件 |
| Empty state body | 当前线程暂无 artifacts 或 uploads。请先上传文件或先生成文件后再输入 @。 |
| Error state | 部分引用文件已失效，已自动移除并继续发送。 |
| Destructive confirmation | 移除引用文件：点击 chip 的 × 立即移除，无二次确认（低风险可逆交互）。 |
补充约束（来源：06-CONTEXT.md）：
- 软失败必须 toast 提示且不阻断发送（D-07）。
- 超过 10 个引用必须阻止继续添加并提示（D-08）。
- 同名文件候选展示必须为“文件名 + 类型 + 路径尾段”（D-04）。
Registry Safety
| Registry | Blocks Used | Safety Gate |
|---|---|---|
| shadcn official | dropdown-menu, badge, button, tooltip（沿用已安装） |
not required |
Checker Sign-Off
- Dimension 1 Copywriting: PASS
- Dimension 2 Visuals: PASS
- Dimension 3 Color: PASS
- Dimension 4 Typography: PASS
- Dimension 5 Spacing: PASS
- Dimension 6 Registry Safety: PASS
Approval: pending