feat(S9-P7): CSS 端接线为样式底座——11 页 H5 内联组件样式并入 CSS 文件并 link 接线（单一样式真源）；PLATFORMS 将 css 列重定义为样式层/交付物；值冲突按 components.css 裁决（令牌/逻辑属性优先），顺带修复 Select 定位与选择列居中两处内联版缺陷

CHANGELOG.md

@@ -4,6 +4,205 @@
 
 ## [Unreleased]
 
+### 变更 · CSS 端接线为样式底座：H5 端单一样式真源 ｜ S9-P7
+
+- 103 个组件中 92 个此前已由演示页 `<link>` 消费组件 CSS；本轮把剩余 **11 页**
+  （Button / Card / Dropdown / EmployeeCard / Input / Modal / Segmented / Select / Table / Tree / TreeTable）
+  的内联组件样式并入 `frameworks/<Prefix>.css`，演示页改为「markup + link CSS（+ 交互 JS）」，
+  内联只保留演示脚手架。CSS 端文件自本轮起是组件样式的**唯一权威**，
+  v1.4.0 遗留的「框架 CSS + 页面内联」双份维护不再需要。
+- 值冲突按 components.css 规范层裁决（令牌优先、逻辑属性优先，裁决表见 ROADMAP S9-P7）；
+  接线顺带修复两处内联版渲染缺陷：Select 触发器缺 `position: relative`（caret 此前锚定错误）、
+  Table / TreeTable 选择列未按契约居中。
+- 移动端 47/47 此前已全部接线，本轮未改动。
+- 全局导入形态随本轮重建刷新：`dist/tokens/tokens.css` + `dist/components/index.css`
+  （103 组件聚合，令牌之后引入即可）；单组件 = `dist/components/<slug>.css`。
+  PLATFORMS.md 已把 `css` 列重定义为「样式层/交付物」。
+
+### 新增 · 代码块 JS↔TS 切换 + 逐端专属内容齐备 + 组合场景 ｜ S10
+
+> 用户反馈三点：① 代码块上方的切换器与顶栏技术栈选择器重复，且切出来的内容**实际一模一样**；
+> ② 不同组件讲的内容雷同；③ 预览「表现得不好」，希望能看到组件**配合**展示（卡片外壳、登录样例）。
+> 本轮把三条都落到可验证产物上。
+
+- **代码块切换器改为 JS ↔ TS**（`site/app.js` 的 `codeForms`）：端由顶栏决定，
+  块内只在该端的 JavaScript / TypeScript 两种写法之间切换。原先的四端 tab 与顶栏功能重复
+  （实测 `button/react` 页面上重复出现 5 组同样的 tab）。
+  H5 / CSS 端交付静态标记与类名，没有可标注的类型面，故只给单一形态、不显示切换器。
+- **597 段 TypeScript 形态**（`site/examples/*.json` 的 `code.tsx` / `code.vue3ts` / `code.vue2ts`，
+  199 示例 × 3 端）：由 `tools/gen-ts-variants.mjs` 生成，原则是**只标注、不重构**——
+  在既有 JS 片段上插入类型标注与泛型参数，不移动、不重排任何结构。
+  首版曾尝试把同构标签提炼成「类型化规格数组 + 遍历渲染」，产出更"TS 味"，
+  但实测生成了大量坏代码（`return (const cities = …)`、缺闭合标签的 Vue 模板、`Vue.extend({ … };` 少括号），
+  且**全部通过了原门禁**——判据只查结构性规则，查不出「代码结构被破坏」。
+  因此新增 `tools/check-ts-quality.mjs`：对 597 段做**真实编译**（esbuild 验 tsx 与 script 段、
+  vue-template-compiler 验 Vue 2 模板），当前 0 失败。
+- **逐端专属内容 515 份齐备**（`site/end-content/<slug>.<end>.json`，103 组件 × 5 端）：
+  此前只有 197 份，缺的时候页面回退显示同一句「本端的专属用法说明尚未提供」——
+  这正是「不同组件内容雷同」的直接来源。缺额由 `tools/gen-end-content.mjs` 从事实包补齐，
+  取料只认该端实现源码解析出的 API（`consumedApi`），不引入契约 `dims`（那是设计词汇层）。
+- **组合场景 103 份**（`site/scenes/<slug>.json` + 预览产物 `site/scenes/<slug>.html`）：
+  组件页新增「组合场景」一节，讲该组件与别的组件**配合**出现的形态（表单卡片里的字段、
+  列表页卡片与工具条、工具条触发的确认流、详情卡片里的内容等）。
+  门禁 `tools/verify-scenes.mjs` 的第一条就是**组件必须是场景主角**：
+  `markup.html` 必须用到该组件自己 CSS 里的类名——直接把「外面做卡片、主要部分仍是该组件」编码成判据。
+  协作者取自组件族的真实耦合关系，外壳类 `ksc-*` 与四端标记由 `tools/gen-scenes.mjs` 生成。
+
+### 修复 · 非 H5 端的示例预览整片 403（路径基准错误）
+
+`site/app.js` 的 `endPreviewSrc` 把逐端预渲染产物的地址写成 `../end-preview/<slug>.<end>.html`，
+在 `/site/` 基址下解析到仓库根 `/end-preview/`，而产物实际在 `site/end-preview/`——
+实测 `button/react` 页 5 个示例 iframe **全部 403**，只拿到错误页（body 长度 93）。
+产物本身没问题：`frameworks/` 部署在站点上一级，而 `end-preview/` 在 `site/` 内部，
+两者基准不同，不能照抄同一个前缀。改为相对站点根的 `end-preview/…`。
+
+### 修复 · 逐端预览渲染的是空组件（预览「表现不好」的根因）
+
+`tools/build-end-preview.mjs` 只给开关型/数据型组件传初始 props，纯展示组件因此渲染成空壳：
+Button 的产物是 `<button class="btn btn-default btn-md"><span class="btn-label"></span></button>`，
+305 份产物里 **68 份文本为空、79 份不足 6 字符**——示例卡片里看到的就是一个没有文字的按钮。
+修法：从 `site/examples/<slug>.json` 的**第一个固化的示例**反推该端的真实初始 props
+（只取字符串字面量 / 裸布尔 / 数字，`{表达式}` 与数组对象型 prop 一律跳过，
+避免把字符串塞进 `data` 导致 `nodes.forEach is not a function`）。
+`button.react` 的产物由空壳变为「主按钮（点击切加载态）」。
+
+### 修复 · 组件页在 h5 端请求了不存在的 end-content 文件
+
+`endKey()` 直接把路由端名拼进文件名，h5 页会去取 `button.h5.json`（磁盘上是 `button.html.json`），
+404 后长期走兜底文案——实测 `verify-site-routes` 抓到 37 条控制台报错。
+改为经 `END_IMPL_KIND` 映射（它本就是「端 → 该端实现文件键」的定义）。
+
+### 修复 · 若干门禁假红与真缺陷（都是本轮实测发现的）
+
+- `tools/verify-component-page.mjs`：示例代码断言原本假定「代码块是四端 tab」，
+  已改为断言**只出现本端的 JS/TS 形态**、切换器不出现别的端名、TS 形态确实含类型标注；
+  另外补了强缓存清理（示例正文用 `force-cache` 取，产物重写后门禁会拿到上一版而假红）。
+- `tools/verify-examples.mjs`：新增两条判据——Vue 2 模板**根元素带 `v-for`** 会编译失败
+  （`Cannot use v-for on stateful component root element`，`alert-ex-2` 实例已修）、
+  TS 专属标记的识别补上 `Record<…>` 与 `JSX.Element`（原判据只认 `: void|string|…`，把合法写法判成「无标记」）。
+- `site/logger.js`：不再把浏览器对 ResizeObserver 的提示（`loop completed with undelivered notifications`）
+  记为页面错误——它没有 error 对象、不影响渲染，而本站示例/场景 iframe 正是靠 ResizeObserver
+  做高度自适应，这条噪声会随帧数线性增长（实测 37 条）并淹没真实报错。
+- `site/style.css`：组合场景代码区补深底浅字（原先继承默认黑字，在深底上对比度 1.04:1）、
+  补 `overflow: auto`（320px 下顶出整页 `overflow=263px`）；端标识胶囊 `.ex-end` 补独立配色。
+- `site/app.js`：end-content 异步渲染后补跑表格包裹（`.kole-doc-table`）——
+  该节走自己的回调、不在既有的两处刷新点上，实测导致「所有 table 都被包裹」这条**间歇失败**。
+- `.dockerignore`：排除 `site/end-content/_facts`（4.7MB 构建期事实包，站点从不 fetch 它，
+  且内嵌 `frameworks/` 源码全文）。内容文件 `site/end-content/*.json` 照常发布。
+
+### 验证
+
+| 门禁 | 结果 |
+|---|---|
+| PC 回归 `tools/run-regression.mjs` | **100%（1464/1464，103 页）· 连跑八次一致** |
+| 移动端回归 | 100%（807/807，47 页） |
+| `verify:examples --require-ts` | 15 项通过（199 示例 / 796 片段） |
+| `verify:scenes` | 9 项通过（103 份场景） |
+| `verify:end-content` | 8 项通过（515 份内容） |
+| `check-ts-quality`（真实编译） | 597 段 · 0 失败 |
+| `verify-component-page` | 110 项通过（连跑 4 次一致） |
+| `verify:i18n` / `verify:theme` / `verify:site-routes` / `smoke:site` / `verify:playground` / `verify:nav` / `verify:templates` / `verify:api-docs` / `verify:isolation` | 全部通过 |
+| 零运行时依赖 | `zero-dep OK` |
+
+### 修复 · 组件页「调用代码」是空壳（生成器兜底 → 真实三端调用代码）｜ROADMAP S9-P6
+
+> 103 个组件页此前展示的 jsx / vue3 / vue2 代码块，大量是生成器兜底的零信息量骨架：
+> 例如 icon 页 7 个使用场景的三种端代码**逐字完全相同**，都只有
+> `import { KoleIcon } from 'kole-ui/react';` 加一句 `<KoleIcon />`。
+> 根因不在文档层：演示页把真实用法写在内联脚本里（`fill('row-size', TIERS.map(...))`），
+> 而构建期生成器只读静态标记，于是走「策略 3」兜底输出最小骨架；门禁只校验「片段非空 + prop 可溯源」——
+> **空话成了唯一永不失败的解**。
+
+- **修复**：新增固化层。`site/examples/<slug>.json` 顶层带 `curated: true` 时，`precompute.mjs`
+  保留其 `code` / `source` / `notes`，预览层（`html` / `preview`）仍以本次生成为准（演示页改结构不会让产物失真）。
+  103 个组件的 199 个示例、597 段三端片段改写为可照抄的真实调用，逐条依据演示页脚本的实参，
+  `notes` 记录「文件:行 + 实参」出处。
+- **新增门禁**：`npm run verify:examples` 由 9 条增至 **13 条** —— 同组件同端片段不得跨示例逐字重复；
+  有 props/slots 的组件不得交零属性无内容骨架；`source` 不得是生成器兜底态 `api-derived`；
+  Vue2 片段必须是可编译形态（模板恰好一个根元素、无 `<template v-for>` / `v-model:arg`）。
+  另支持 `--only=slug1,slug2` 分片校验；失败详情带总数，避免前序组件的条目把后续的挤出显示。
+- **判据修正**：`contract.dims` 不再作为 prop 来源。实测它是设计词汇层 —— `state` 出现在 35 个组件里
+  只有 4 个实现消费、`feature` 10/2、`action` / `scan` / `layout` / `selection` 全 0 消费。
+  当 prop 源会放行实现根本不接收的属性（即「照抄却不生效」的假用法）；prop 现须能指到
+  `api.props` 或组件源码里的标识符。据此修正了 2 个组件：`enhancedtabnav`（去掉 `state`/`feature`）、
+  `pagetransition`（去掉 `effect`/`direction`，并去掉与组件内部工具栏重复的渲染）。
+- **变异验证**：同一份数据在旧门禁下 `exit 0`（9 checks 全过）、新门禁下 `exit 1`，证明新断言确实在抓该缺陷；
+  Vue2 单根断言用「往模板插入兄弟元素」实测变红（报 `vue2 模板根元素 2 个`），随后按 md5 逐字节还原比对。
+- **验收**：`node tools/verify-examples.mjs --verbose` → `13 checks passed（199 个示例 / 796 个片段）`；
+  退化统计由「跨示例重复 150 / 零属性空壳 327 / api-derived 兜底 130」全部归零；
+  重建站点后 `site/data.json` 内嵌新片段 199 处、`api-derived` 残留 0，固化标记 103/103 存活，
+  抽样文件 md5 与构建前逐字节一致。
+- **新增规格文档** `EXAMPLES-CURATION.md`：固化产物的字段边界、事实源、三端写法与硬规则。
+- **遗留待决**：`逐示例片段固化与待决事项.md`（D1–D6）。
+
+### 修复 · 图标预览页尺寸档（`site/icon-preview.html`）｜ROADMAP S9-P4
+
+> 该页自 2026-09-20 上线起，**尺寸档四个按钮全是坏的**：点击只改 SVG 的 `width`/`height` 属性，
+> 而 `.ip-cell .glyph svg { width: 1em; height: 1em }` 是作者样式表规则，按 CSS 层叠压过表现属性 ——
+> 四档一律渲染成 `.glyph` 的 `font-size`（实测恒为 16px）。用户可见症状：点 24 / 32 毫无反应。
+
+- **修复**：`.ip-cell .glyph svg` 去掉写死的 `width`/`height`，只留 `display: block`，
+  尺寸交给 SVG 属性驱动（与组件页图标集合区同一手法）。
+- **新增门禁** `tools/verify-icon-preview.mjs`（`npm run verify:icon-preview`，**26 条断言**）：
+  该页此前**没有任何功能门禁**（仅 `pack-deploy.mjs` 提过它），这正是缺陷存活三天的原因。
+  核心判据是**实测渲染宽度**（`getBoundingClientRect` 与属性值同时校验）——旧判据只断言
+  「按钮有响应 / 属性已改 / 无控制台错误」，按钮确实响应了、属性也确实改了，因此漏过。
+  另含搜索收窄 / 仅线性（1304，与组件页同源）/ 剪贴板复制 / 暗色无白底残留 / 0 个 4xx。
+- **变异验证**（证明门禁有区分力）：把 CSS 还原成修复前形态重跑 → `尺寸档 20/24/32 FAIL
+  —— 属性改了但渲染尺寸没跟随`，退出码 1；16 档仍通过（恰好与 1em 的 16px 重合，正是原缺陷的形态）。
+- **验收**：`npm run verify:icon-preview` → `OK — all checks passed`（四档 attr 与 rendered 均 = 16/20/24/32）。
+
+### 文档站 · icon 组件页补「图标集合」区（对齐 Element 图标页形态）
+
+> 起因：用户点名 `element.eleme.cn/#/zh-CN/component/icon` ——「会显示组件用法和每个组件样式的展示」。
+> 实测该页两节：**使用方法**（用法示例）+ **图标集合**（全部图标网格，每格图形 + 名字）；
+> 本站 icon 组件页此前只有前者（7 段用法示例），图标全集要跳去独立工具页 `site/icon-preview.html` 才看得到。
+
+- **新增「图标集合」区**（仅 icon 组件页，其余 102 页不受影响）：工具条（搜索 / 尺寸 16·20·24·32 /
+  仅线性 / 实时计数）+ 13 个分组折叠网格，**全部 2576 个图标**，每格渲染真实 SVG 并标注图标名。
+- **交互**：点击复制图标名、Shift + 点击复制内联 SVG（判据与独立预览页同源，实测「仅线性」
+  两处计数一致：1304 / 2576）；搜索命中实时收窄并自动展开命中分组；空结果给提示而非空白。
+- **数据链路**：`site/icons.json`（名字/分组，52KB）+ `.design_library/kole-ui/icons/registry.json`
+  （路径数据 708KB，进入视口才取）。实测全量 2576 格建 DOM 约 75ms、布局 90ms、堆 10.7MB，
+  故不做虚拟滚动；折叠组浏览器整块跳过布局（实测 3ms）。非 icon 页实测 **0 次**图标数据请求。
+- **降级**：路径数据取不到时给统一失败态（计数条与区块主体同一说法），页面其余章节完好 ——
+  实测踩到过「计数条说加载失败、主体停在『加载中…』」的自相矛盾，已修并纳入门禁。
+- **门禁扩容**：`verify-component-page.mjs` 新增 28 条图标集合断言（全量渲染数 = icons.json 的
+  names 长度、每格有真实 path、点击复制读**剪贴板**、尺寸档读**实测渲染宽度**、降级路径、其它页零请求），
+  总断言 79 → **107 条**；`verify-theme.mjs` / `verify-dark.mjs` 的对比度路由清单加入
+  `/site/component/icon`（实测该区占探针 600 节点预算里 524 个，是站点文本最密的一块）。
+- **实测发现并登记**：`site/icon-preview.html` 的尺寸档按钮自上线起就是坏的（CSS `width: 1em`
+  压过 SVG 的 width 属性，四档全渲染成 16px）→ 已追加 ROADMAP **S9-P4**（含实测数据与修法）。
+- **回归**：PC 100%（1464 通过 / 0 失败 / N/A 50，共 1514 条）· 移动端 100%（807 通过 / 0 失败 / N/A 10），
+  八次连跑一致，0 超时；移动端与既有端实现零污染（`git status` 空）。
+
+### 计划 · S9 PC「组件 × 端」独立页（批次台账 + 单批门禁）
+
+> 起因：用户判断「PC 端的组件内容层几乎都一样，每端都该有组件自己的页面，批数 = 组件 × 端数，
+> 一批一批独立来」。本节只交付**计划与判据**，页面渲染逻辑未动。
+
+- **实测坐实问题**：Playwright 对 6 个组件的 4 个端详情页做 DOM 比对 —— 9 个章节里
+  **7 个四端逐字相同**；预览 iframe 四端**全部**是 `../frameworks/<Prefix>.html`（H5 演示页）；
+  端切换实际只改「代码 tab 默认选中」与「实现资源表行数」。
+- **根因**：PC 索引 103 个条目**既无 `ends` 也无逐组件 `files`**（移动端索引两者齐备），
+  端清单硬编码在 `site/app.js:39` 的 `FW_FILES` —— 数据层不表达端，渲染层只能退化成 tab 切换器。
+- **可行性的实测**：React（esbuild + react-dom/server）、Vue 2（vue-template-compiler +
+  vue-server-renderer）、Vue 3（@vue/compiler-sfc + vue/server-renderer）三条离线预渲染链路
+  全部跑通，产物类名与 H5 端逐字一致；工具链装在 `.tmp/` 隔离目录，**主仓库零运行时依赖不变**。
+- 新增 **批次台账** `tools/lib/pc-end-batches.mjs` → `tools/pc-end-batches.json`：
+  **618 批 = 103 组件 × 6 端**（可开工 518 / 受阻 100，受阻项全部是 uni-app 端依赖 S7-P26）。
+  波次按端排（W1 H5 → W2 React → W3 Vue 2 → W4 Vue 3 → W5 CSS → W6 uni-app），
+  档位按分类排（通用 → 反馈 → 数据录入 → 数据展示 → 导航 → 系统）。
+- 新增 **单批门禁** `tools/verify-pc-end-batch.mjs`（`npm run verify:end-batch`）：
+  12 项检查分六组（A 路由与端声明 / B 预览真分端 / C 示例代码逐字 / D 资源只列该端 /
+  E API 来源可追溯 / F 无跨端串味）。红灯基线实测：`react/button` 6/12，六组件一致。
+  空集判失败（`--all` 选不到批次时不报假绿）。
+- 新增 **`S9-P1` 数据层补端维度 / `S9-P2` 单端渲染管线 / `S9-P3` 逐端内容层分栏** 三个
+  前置任务包（写入 `ROADMAP.md`），完成后 518 批可按波次逐批推进。
+- 交付说明：`S9-PC端独立页批次计划.md`。
+- **回归**：PC 1464/1464 = 100%（103 页）；`verify:isolation` 31 条全过；`zero-dep OK`。
+  `site/` / `frameworks/` / `tests/` 零改动。
+
 ### 发布脱敏 · 对外产物滤掉基础设施细节（安全）
 
 > 起因：抓一次公网 `/site/m/changelog.html` 就能拿到内网网段、服务器目录布局与部署时序 ——