---
name: tvu-design-code
description: 在 sibling consumer 产品里写代码消费 TVU UX Design System library。唤醒词：@TVU code / 用 TVU 设计系统写代码 / 用 TVU 库写代码 / consume TVU library。真源 conventions 在 tvu-design-system repo 内。
---

# 在 TVU 设计系统消费侧写代码

本 skill 只做 **trigger + 指路**。真源在仓库内：

- 项目入口 — `/Users/nancy/Documents/AICoding/VS_Code/tvu-design-system/AGENTS.md`
- 团队导览 — `/Users/nancy/Documents/AICoding/VS_Code/tvu-design-system/docs/internal/CONVENTIONS-OVERVIEW.md`（推荐**先读这个**了解整体）
- 硬规则 — `/Users/nancy/Documents/AICoding/VS_Code/tvu-design-system/docs/internal/code-conventions.md`（含 R0/R2/R3/R4/R5/R6/R7/R8/R9/R10/R12/R13/R14/R15/R16 + legacy R1 anchor stub；具体编号见 OVERVIEW Quick Reference）

任何细节冲突以上述真源为准；本 skill 不复述规则内容。

## 适用场景

写**前端代码消费 TVU library** 的任何场景：HTML / Vue / React / PoC / 下游产品 demo（如 MicroApps Console）。

**不**适用：
- Figma mockup 任务 → 真源 `mockup-conventions.md`，由 mockup skill 触发
- 在 `tvu-design-system/` 仓库本体内改设计系统 → 那是 maintainer scope，不是 consumer

## 起手协议（按序，不可省略）

0. **Disambiguate deliverable**（条件触发）— 若用户表达只说 "设计 / 做 X 产品" 而未指明 deliverable type → **先 ask**：
   - (a) Figma mockup → 切到 `tvu-design-mockup` skill
   - (b) 网站代码 / HTML demo / 可点击 prototype → 继续本 skill
   - (c) 先 mockup 后 code → 先走 mockup skill，再回本 skill
   - (d) 仅 UX 思路讨论 → 切到 `role-ux`

   用户已明确说 "@TVU code" / "写代码" / "HTML demo" / "网站代码" 时跳过此步。

1. **cwd 检查 + 路径策略**：
   - 若 cwd 在 `tvu-design-system/` 内 → 告警停下（污染源）
   - 若 cwd 已有项目文件（`package.json` / `src/` / `docs/` / `.git/` / `index.html` 等任一）→ 视为 **Existing product**，**在当前 cwd 工作**
   - 若 cwd 是空 / 临时 (`/tmp/*`) / 不在 `~/Documents/AICoding/VS_Code/` 下 → 视为 **Greenfield**，**强制建议** 建到 `~/Documents/AICoding/VS_Code/<product-name>/`（与 tvu-design-system sibling），问用户确认产品名后 cd 过去
   - 用户显式说 "在 X 路径下做" → 按用户说的路径，跳过上述判断
1.5. **环境健康检查** — 任一 fail 时告警停下：
   - `test -d /Users/nancy/Documents/AICoding/VS_Code/tvu-design-system` → TVU repo 路径在
   - `test -d /Users/nancy/Documents/AICoding/VS_Code/tvu-design-system/dist/icons/svg` → sync 产物在
2. **Read 真源** — `AGENTS.md` + `code-conventions.md` 全文
3. **icon namespace 轻索引**

   ```sh
   ls /Users/nancy/Documents/AICoding/VS_Code/tvu-design-system/dist/icons/svg/
   ```

   返回 28 个分类目录（已是轻索引，per Lazy Reference Discipline）；Phase 0 时按 element 进具体 namespace `ls + grep`，不预加载 647 个具体 svg 路径
4. **找 handoff** — `<cwd>/docs/*-handoff.md` 存在则 Read（按 R5），否则询问用户当前任务上下文
5. **扫 ledger** — Read `tvu-design-system/docs/internal/_metrics/phase0-ledger.md` 末 5 行；按 ledger 文件内"异常启发式"表检查，命中时**主动提醒一句**
6. **Task classify**（双维度，缺一不可）：
   - **US 维度**（任务类型）— 按 conventions Task Entry Modes 表归到 US-1..6（US-4 已按 R7 拆 4a/4b）
     - **US-1/2/3** → Pre-Phase 0（2 gate）→ Phase 0 (R0) → build
     - **US-4a** Figma visual-fidelity mirror → 跳 Pre-Phase 0 → R0 with visual-fidelity priority → build
     - **US-4b** Figma TVU-normalize translation → 跳 Pre-Phase 0 → R0 → build
     - **US-5** 小调整 → 跳 Pre-Phase 0 + R0 → 直接 build
     - **US-6** Review/Audit → 跳 Pre-Phase 0 + R0 → 对照所有 active R-rules + Convention Priority 审 → 产 audit report
   - **R7 维度**（视觉真源 / 意图）— 按 conventions R7 disambiguation 表归到 4 大场景之一（场景 1 非 TVU 视觉还原 / 场景 2 已有产品增量 / 场景 3 全新产品 TVU 构建 / 场景 4 TVU 规范校正）；任务开始前**显式声明** "intent classified as 场景 X.Y（子场景）" 一行
   - 关键词不明确 / 关键词冲突 / 命中 Hybrid 边界 case 时**主动问用户**，不要默认（特别：**US-4 必须 ask 是 4a 还是 4b**；R7 disambiguation 是高频翻车点）
   - **默认偏向不 TVU 化**——歧义时优先归场景 1/2（保留原貌），不默认场景 3/4（避免过度规范化）
7. **wrap up**:
   - 写 handoff (R5) + append ledger (R5 §7)
   - **更新 `tvu-design-system/docs/STATUS.md`**（必：Last updated 改今天 / 按段移动完成项 / 刷新 Active 余量）
   - 触发 retrospect 条件检查（阶段性 release / 反模式 / 新工程经验 → 写 `docs/internal/retrospection/<YYYY-MM-DD>-<topic>.md`）

## 回流入口（生成翻车 → 新规则）

发现新失败模式时**不写进 skill、不写进 memory**，全部追加到 `code-conventions.md`：

1. 用户拍板"这是规则级问题，不是一次性失误"
2. 优先尝试**并入既有规则**作为 sub-clause（R15 涵盖所有 UI library-first；R13 涵盖 affordance search；R8/R12 涵盖 audit script enforcement）；只在没有合适归宿时才续 R17+ 新编号
3. 段落结构对齐既有规则（含 Why / 反模式记录 / Acceptance / 实证 必要时）
4. commit 到 tvu-design-system repo

**skill 自身改动同步**：仅当回流后的新规则改变了起手协议（如新增起手步骤）才回头改 skill；否则 skill 不动。