# Next Session Pickup — Notification §4 Code Sync (FINAL published model)

> 生成: 2026-06-10 session 收尾。Figma §3 构建 + owner 多轮修订 + **publish 已完成**。本 pickup 取代 [`next-session-pickup-2026-06-10-notification-two-axis-build-and-sync.md`](./next-session-pickup-2026-06-10-notification-two-axis-build-and-sync.md)（那份描述的是旧"双轴+布尔"模型，已被 owner 推翻）。
> 起手第一句: `按 docs/internal/_plans/next-session-pickup-2026-06-10-notification-code-sync-section4.md 做 Notification code §4`

---

## 0. 起手必读
6-step onboarding + `git log/status`。**警告：并行 Codex session 在本仓库留了未提交改动**（`figma-sync/extract.mjs` cursor-aware text fill + 3 个 scoped re-extract 数据文件，EXTRACT-007/009）。`git diff --stat` 先看清哪些是 Codex 的、哪些是本任务 sync 产出的——**§4 commit 只带 Notification 重构相关文件 + sync 产出，不要顺手 commit Codex 的 extractor 改动**（除非确认它已稳定，问 owner）。见 [[user_parallel-sessions]]。

## 1. Figma 已 publish 的 FINAL 模型（真源，已 publish）
file `YbsPRUVmNdsbN40NNwh1Gn`,组件集 **`1408:17154`**,**32 变体**,layoutMode=**GRID**(owner 加的,保留)。
- **form 轴**(4): `dialog` / `alert` / `pop confirm` / `slide`(注意 `quick confirm` 已 rename 成 `pop confirm`)
- **type 轴**(6): `warning` / `secondary warning` / `error` / `info` / `success` / `none`
- **theme**: dark / light
- **唯一布尔组件属性**: `closable`(default true,绑所有 close×)。`cancel`/`confirm` 布尔已删——**按钮改为 form 固定**。

各 form 的 type 子集 + 按钮 + 宽度：
| form | type 子集 | 按钮(固定) | 宽度(token) | 结构 |
|---|---|---|---|---|
| dialog | warning/secondary warning/error/info/none | Cancel + Confirm(none→红,其余→绿) | 480 `Module Width/XL` | 分类图标 + title + desc |
| alert | warning/error/info/success/none | **单个 OK**(绿) | 480 `Module Width/XL` | 分类图标 + title + tips |
| pop confirm | none | Cancel + Confirm(红) | 480 `Module Width/XL` | 无图标,"Are you sure" |
| slide | none/warning/success/error/info | **无按钮**(被动) | 320 `Module Width/M` | 分类图标 + title + desc |

**图标(严重度阶梯,全 form 统一,owner 拍板)**：warning→`warning 2`(橙) < secondary warning→`Error 4`(红三角) < error→`Error 2`(红✕);info→`Info 2`(蓝);success→`Success 2`(绿);none→无。颜色 owner 已手动校正绑 token。

## 2. status → form+type+closable 迁移映射(已定,从旧 code 结构推导,无需再问 owner)
| 旧 `status` | 新 |
|---|---|
| `warning` | `form="dialog" type="warning"` |
| `secondary warning` | `form="dialog" type="secondary warning"` |
| `error` | `form="dialog" type="error"` |
| `info` | `form="slide" type="info"`(owner 拍板:info 被动告知归 slide) |
| `pop confirm` | `form="dialog" type="none"`(旧 pop confirm = 带 title 的 delete 确认,2 红钮 → dialog/none) |
| `quick confirm` | `form="pop confirm" type="none"`(旧 quick confirm = 紧凑"are you sure",= 新 pop confirm form) |
| `side pop` | `form="slide" type="none"` |
- `alert` form 是**纯新增**,无旧 status 对应。

## 3. 代码改动清单(breaking,major)
1. **`src/components/Notification/Notification.vue`**(base 核心): 删 `status` 轴 → 加 `form`/`type`/`closable`(已有 closable)。按钮逻辑按 form 固定：dialog/pop-confirm=2 钮(confirm 色:dialog-none+pop-confirm=红,其余绿)、alert=1 OK(绿)、slide=0。图标按 type(新严重度映射,注意 warning 现在是 warning-2 不是 error-4;secondary warning 是 error-4;error 是 error-2)。宽度:dialog/alert/pop-confirm=480、slide=320(对齐 Module Width token)。events: close/cancel/confirm(alert 的 OK 复用 confirm)。
2. **`src/canonical/Notification.vue`**: 同步新 props 透传。
3. **`playground/docs/pages/NotificationPage.vue`**: 现在从 `notificationFigmaMembers.axes` 找 `status` 轴 → sync 后 axes 变成 form/type/theme,**所有 status 引用要重写成 form+type**;§"Side-anchored Overlay" demo 的 `status="side pop"` → `form="slide" type="none"`;interactive/matrix/member 列表逻辑都要改;API 表重写(status 行 → form/type/closable 行)。
4. **`playground/App.vue:464-467`**: 4 个 `<Notification status=>` → form+type。
5. **`tests/Notification.test.ts`**: 全部基于 `status` → 改 form+type(green confirm = dialog/warning;red = dialog/none 或 pop confirm;close emit;alert 单 OK;slide 无按钮)。
6. **`figma-data/normalized/docs-figma-members/notification.ts`**: sync 重生成(axes form/type/theme + closable)。确认 NotificationFigmaProps 类型随之变。
7. **translation**: `divergences.md` / `divergences-decisions.json`(旧 `notification-success-deletion`/`notification-type-deletion` 等 entry 现已不准——旧模型删的 success/type 轴又以新形态回来了,重新登记);`prop-aliases.json`(status→form/type 别名);`icon-aliases.ts`(warning/error 图标映射变了)。
8. **迁移文档**: CHANGELOG / MIGRATION 写 status→form+type+closable breaking 映射(用 §2 表)。
9. **major changeset**: `.changeset/*.md` bump major,含 §2 迁移说明。

## 4. Gates(全过才收口)
`pnpm vitest run` / `pnpm exec vue-tsc --noEmit` / `pnpm test:render-verification` + `pnpm audit:render-drift-gate`(A 不回归) / `pnpm audit:self-audit-phase2` / `pnpm audit:figma-vs-sot`。render-verification manifest 可能引用旧 status 变体节点 → 需更新到新 form/type 变体 nodeId。

## 5. 本 session sync 状态
- 已 kick off `pnpm sync:figma-library --with-extract`(收尾时仍在跑 export-icons 640 图标)。**起手先确认它完成 + SUMMARY 无 blocking fail**;若没跑完或失败,重跑。注意它会用 Codex 改过的 extract.mjs(cursor-aware text)——确认全量 re-extract 后 figma-data 一致、`audit:figma-vs-sot` 绿。

## 6. 纪律
- owner 直 commit master + push;`src/**` breaking → major changeset + 迁移文档。
- 视觉 commit 需 `VISUAL_COMMIT_APPROVED=1`。
- 教训(本 session):①Figma 布尔属性默认值全变体统一,做不到 per-variant default(实测);②owner 会并发编辑 Figma 库(本 session 改过 quick-confirm 宽度 + 给 set 加 GRID 布局,GRID 会把子级变 FILL 丢宽度/closable 绑定)——每个写阶段前重读 live;③clone dialog 变 alert 会丢 width binding,要重设 FIXED+绑 token。

---

## §4 执行状态（2026-06-10 续 session 实做记录）
**✅ 已完成 + 验证正确（code 改动全部落地，未 commit）**：
- §4.1 `sync:figma-library --with-extract` 全绿（figma=644/sot=644, A=0）。
- §4.3 `src/components/Notification/Notification.vue`(base) + `src/canonical/Notification.vue` 全重写为 form+type+closable+alert（form-intrinsic 按钮：dialog/pop confirm=Cancel+Confirm、alert=单 OK 绿、slide=无；confirm 色 pop confirm+dialog/none=红其余绿；图标严重度 warning=message/warning-2 / secondary warning=message/error-4 / error=message/error-2 / info=message/info-2 / success=message/success-2 baked catalog 名；宽度 dialog/alert/pop-confirm=`--notification-width-default`480、slide=`--notification-width-side-pop`320）。
- §4.4 `playground/App.vue`(4 callers) + `playground/docs/pages/NotificationPage.vue`(全重写 form/type) + `tests/Notification.test.ts`(重写) + `tests/Canonical.test.ts`(Notification 用例改 form/type) + `tests/RemainingCanonicalPages.test.ts`(variant count 7→16 + alert) + `figma-data/normalized/docs-figma-members/notification.ts`(重生成 form/type 32 变体) + `scripts/generate-render-verification-manifest.mjs`(Notification config status→form/type、textTargetSelector `.notif__quick-copy`→`.notif__desc`)。
- §4.5 `src/design-system/translation/icon-aliases.ts`(COMPONENT_ICON_OVERRIDES.Notification 改新严重度映射 + success) + `divergences.md`(success/type section 加 2026-06-10 superseded 非回归注) + `prop-aliases.json`(component-prop-004 status→form,新增 012 type/013 closable exact-match) + `.changeset/notification-two-axis-form-type-closable.md`(major + 迁移表)。
- Gates 5/6 绿：vue-tsc ✅ / vitest 244 ✅ / test:render-verification ✅ / audit:self-audit-phase2 ✅(含 icon-canonical-names/figma-library-vs-canonical/render-coverage) / audit:figma-vs-sot ✅。

**🔧 REMAINING 1 — drift-gate FALSE positive（先修这个再 commit）**：
`pnpm audit:render-drift-gate` 报 7 条 alert `.notif__desc` textFillHex drift：expected `#f8f8f8`(dark)/`#141414`(light) vs actual `#9e9e9e`/`#595959`。**实测 live Figma alert/info dark desc = `#9e9e9e`(Color Type/Text/Tips) = code 正确**（use_figma 实证 5840:7089）。expected `#f8f8f8` 是 **title(Text_1) 色**——`scripts/generate-render-verification-manifest.mjs` 给 cloned alert 变体抽 expected textFillHex 时**取错了 text 节点（取了 title 不是 description）**。dialog 同结构却正确（dialog desc expected=#9e9e9e）→ 差异在 alert 变体（我 clone dialog/info 来的）的 text 节点结构/顺序。**修 generator 的 text-node 抽取（让它对 alert 也定位到 description 节点），不要改 code（code 已对）**。修完 `pnpm test:render-verification && pnpm audit:render-drift-gate` 应回 A=0。

**🆕 REMAINING 2 — owner 新需求（docs 呈现，2026-06-10）**：NotificationPage（+ PromptMessagePage）的 demo 应**按 form 真实定位呈现**，参考 PopupBox / Element 组件站：`slide`→右侧（top-right）锚定；`dialog`/`alert`/`pop confirm`→正中间 modal + 遮罩层（Teleport body + fixed center + backdrop，类 PopupBox）；PromptMessage→顶部（top）。当前 NotificationPage 的 Interactive Scenario 只是 inline 渲染在 stage 盒里——要改成触发后按 form teleport 到对应位置。

**commit 纪律**：owner 直 commit master + push;major changeset 已就位。⚠️ 工作区只 stage 本任务 + sync 产出，**别带** `.claude/settings.json`/`vocabulary.md`(并行 session)。