@orbit-work/ui 0.1.0

package/src/components/domain/chat/MessageActions/index.tsx

@@ -0,0 +1,186 @@
+"use client"
+
+import { type ReactNode, useCallback } from "react"
+import { cn } from "../../../../lib/utils"
+import { Branch, Check, Copy, Dislike, Doc, Like, Quote, Refresh, Share, Volume } from "../../../composite/Icons"
+import { Button } from "../../../primitives"
+
+/**
+ * MessageActions — DS 2.0 会话操作行（蓝图批次③ 合并件：ActionBar /
+ * ChatActionbar / ChatActionRowView 归口为同一配方）。
+ *
+ * 形态：贴在轮次正文下方的一行图标钮，**hover / focus-within 才浮现**（父级轮次
+ * 挂 `group/turn`，本行随之淡入；`visible` 打开＝最新一条常显）。
+ * 度量（§7）：图标钮走 Button ghost·sm＝28×28，命中区 ≥24，图标 16 网格；
+ * 行间距 2px；时间等读数一律 mono＋tabular-nums。
+ * 立面（§5）：贴地件——hover/press 取 ghost 族的 `--ow-hover`/`--ow-press` 档，
+ * **不适用 -pop 档**（-pop 只属坐在 `--ow-popover-bg` 上的行）。
+ * 状态（§6）：default / hover / press / focus-visible（Button 自带 2px 环＋2px 缝）/
+ * disabled（逐 token，禁统一透明度）/ 选中（`active` → `aria-pressed`，色只作
+ * 第二编码）/ 完成回执（`done` → 换勾图标＋success 色，形色双编码 R1）。
+ * 动效（§9）：只做 120ms 透明度淡入，唯一缓动 ease-beacon，禁位移缩放。
+ * R3 中性件：聊天操作行不含信标/荧黄。
+ */
+export type MessageActionKind =
+  | "copy"
+  | "regenerate"
+  | "speak"
+  | "like"
+  | "dislike"
+  | "share"
+  | "branch"
+  | "preview"
+  | "quote"
+
+export type MessageActionItem = {
+  /** React key 与回调标识 */
+  key: string
+  /** 无障碍名，同时作 title 悬停提示 */
+  label: string
+  icon: ReactNode
+  onSelect?: () => void
+  /** 选中态（赞/踩已投）：写 aria-pressed，形与色双编码 */
+  active?: boolean
+  /** 一次性完成回执（复制成功）：换图标＋success 色 */
+  done?: boolean
+  /** 完成态图标，缺省用勾 */
+  doneIcon?: ReactNode
+  /** 完成态无障碍名，缺省沿用 label */
+  doneLabel?: string
+  disabled?: boolean
+}
+
+export type MessageActionsProps = {
+  /** 预设动作集；`items` 给出时忽略本项 */
+  actions?: MessageActionKind[]
+  /** 自定义动作集，覆盖 `actions` 预设 */
+  items?: MessageActionItem[]
+  onAction?: (kind: MessageActionKind) => void
+  /** 常显（最新一条 agent 轮）；缺省＝仅 hover/focus 浮现 */
+  visible?: boolean
+  /** 行尾读数（时间），mono＋tabular-nums；由 spacer 推到行尾，显隐随 `visible`（原型 template.dc.html:1393-1394） */
+  time?: ReactNode
+  /** 行尾追加槽（免责声明链接等） */
+  trailing?: ReactNode
+  className?: string
+}
+
+const PRESET_ICONS: Record<MessageActionKind, ReactNode> = {
+  copy: <Copy />,
+  regenerate: <Refresh />,
+  speak: <Volume />,
+  like: <Like />,
+  dislike: <Dislike />,
+  share: <Share />,
+  branch: <Branch />,
+  preview: <Doc />,
+  quote: <Quote />,
+}
+
+const PRESET_LABELS: Record<MessageActionKind, string> = {
+  copy: "复制",
+  regenerate: "重新生成",
+  speak: "朗读",
+  like: "赞",
+  dislike: "踩",
+  share: "分享",
+  branch: "新建分支",
+  preview: "查看 Markdown",
+  quote: "引用到输入框",
+}
+
+const DEFAULT_ACTIONS: MessageActionKind[] = ["copy", "regenerate", "speak", "like", "dislike", "share"]
+
+export function MessageActions({
+  actions = DEFAULT_ACTIONS,
+  items,
+  onAction,
+  visible = false,
+  time,
+  trailing,
+  className = "",
+}: MessageActionsProps) {
+  const resolved: MessageActionItem[] =
+    items ??
+    actions.map((kind) => ({
+      key: kind,
+      label: PRESET_LABELS[kind],
+      icon: PRESET_ICONS[kind],
+      onSelect: () => onAction?.(kind),
+    }))
+
+  return (
+    <div
+      data-slot="message-actions"
+      data-visible={visible ? "true" : "false"}
+      className={cn(
+        "flex items-center gap-[var(--ow-space-05,2px)]",
+        // 有时间读数时整行占满正文列（原型 template.dc.html:1377 的 bar 是块级 div），
+        // spacer 才推得动读数；无读数时保持内容宽，不改既有消费方的行宽。
+        time != null && "w-full",
+        "transition-opacity duration-[var(--ow-dur-1)] ease-[var(--ow-ease-beacon)]",
+        visible
+          ? "opacity-100"
+          : [
+              "opacity-0 pointer-events-none",
+              "group-hover/turn:opacity-100 group-hover/turn:pointer-events-auto",
+              "group-focus-within/turn:opacity-100 group-focus-within/turn:pointer-events-auto",
+              "focus-within:opacity-100 focus-within:pointer-events-auto",
+            ].join(" "),
+        className,
+      )}
+    >
+      {resolved.map((item) => (
+        <MessageActionButton key={item.key} item={item} />
+      ))}
+      {time != null && (
+        <>
+          <span data-ow-part="time-spacer" aria-hidden="true" className="flex-1" />
+          <span
+            data-ow-part="time"
+            className={cn(
+              "mr-[var(--ow-space-1,4px)] shrink-0 whitespace-nowrap",
+              "font-[family-name:var(--ow-font-mono)] tabular-nums text-ow-fs-mark-md text-[color:var(--ow-text-3)]",
+              "transition-opacity duration-[var(--ow-dur-1)] ease-[var(--ow-ease-beacon)]",
+              visible
+                ? "opacity-100"
+                : "opacity-0 group-hover/turn:opacity-100 group-focus-within/turn:opacity-100 focus-within:opacity-100",
+            )}
+          >
+            {time}
+          </span>
+        </>
+      )}
+      {trailing}
+    </div>
+  )
+}
+
+function MessageActionButton({ item }: { item: MessageActionItem }) {
+  const handleClick = useCallback(() => item.onSelect?.(), [item])
+  const label = item.done ? (item.doneLabel ?? item.label) : item.label
+
+  return (
+    <Button
+      variant="ghost"
+      size="sm"
+      type="button"
+      data-ow-part="action"
+      data-state={item.done ? "done" : item.active ? "active" : "rest"}
+      aria-label={label}
+      title={label}
+      aria-pressed={item.active}
+      disabled={item.disabled}
+      onClick={handleClick}
+      className={cn(
+        "[&_svg]:w-4 [&_svg]:h-4",
+        item.done
+          ? "text-[color:var(--ow-success)]"
+          : item.active
+            ? "text-[color:var(--ow-text)]"
+            : "text-[color:var(--ow-text-3)]",
+      )}
+      icon={item.done ? (item.doneIcon ?? <Check />) : item.icon}
+    />
+  )
+}

package/src/components/domain/chat/PlanCard/PlanCard.stories.tsx

@@ -0,0 +1,87 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import { PlanCard } from "./index"
+
+const meta = {
+  title: "Chat/PlanCard",
+  component: PlanCard,
+  parameters: {
+    layout: "padded",
+  },
+  tags: ["autodocs"],
+  decorators: [
+    (Story) => (
+      <div style={{ maxWidth: 440 }}>
+        <Story />
+      </div>
+    ),
+  ],
+} satisfies Meta<typeof PlanCard>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+const goalSteps = [
+  { label: "梳理报错堆栈", state: "done" },
+  { label: "修复金额四舍五入", state: "done" },
+  { label: "修复重复提交", state: "done" },
+  { label: "结算回归用例", state: "running" },
+  { label: "补充边界用例", state: "todo" },
+  { label: "整理修复说明", state: "todo" },
+] satisfies { label: string; state: "done" | "running" | "todo" }[]
+
+/** 目标式：目标句＋n/N mono＋迹点行＋「正在跑」文字行（R1 状态双编码；A9-B3 起头行不再带完成度弧） */
+export const GoalRunning: Story = {
+  args: {
+    goal: "把结算页的三个报错修完，并通过一轮回归",
+    steps: goalSteps,
+    elapsed: "1m24s",
+  },
+}
+
+/** 目标式无 running：全部完成，弧闭合、卫星珠回到起点侧，无「正在跑」行 */
+export const GoalAllDone: Story = {
+  args: {
+    goal: "把结算页的三个报错修完，并通过一轮回归",
+    steps: goalSteps.map((s) => ({ ...s, state: "done" as const })),
+  },
+}
+
+/** 目标式刚起步：0 完成，弧只剩底轨，全部待办 */
+export const GoalNotStarted: Story = {
+  args: {
+    goal: "把结算页的三个报错修完，并通过一轮回归",
+    steps: goalSteps.map((s) => ({ ...s, state: "todo" as const })),
+  },
+}
+
+/** 目标式无耗时：running 存在但未传 elapsed，仅显示「正在跑」文字 */
+export const GoalRunningNoElapsed: Story = {
+  args: {
+    goal: "把结算页的三个报错修完，并通过一轮回归",
+    steps: goalSteps,
+  },
+}
+
+/** 清单式降级：无 goal → 眉题「计划清单」＋n/N＋步骤列表（done 行 label 转 text-3） */
+export const ListForm: Story = {
+  args: {
+    steps: [
+      { label: "备份现网配置", state: "done" },
+      { label: "切换新域名解析", state: "done" },
+      { label: "验证邮件回执", state: "todo" },
+      { label: "通知渠道同步", state: "todo" },
+    ],
+  },
+}
+
+/** 清单式带 running：running 迹点同样=beacon 点＋外环（占状态极·每屏限一处） */
+export const ListFormRunning: Story = {
+  args: {
+    steps: [
+      { label: "备份现网配置", state: "done" },
+      { label: "切换新域名解析", state: "running" },
+      { label: "验证邮件回执", state: "todo" },
+      { label: "通知渠道同步", state: "todo" },
+    ],
+  },
+}

package/src/components/domain/chat/PlanCard/index.tsx

@@ -0,0 +1,170 @@
+import type { CSSProperties } from "react"
+
+/** 计划卡步骤：done=success 实心 · running=beacon 点＋外环（占状态极，须配文字行承义）· todo=空心 text-3 */
+export type PlanCardStep = {
+  label: string
+  state: "done" | "running" | "todo"
+}
+
+export type PlanCardProps = {
+  /** 目标句（动词＋对象），缺省时降级为清单式 */
+  goal?: string
+  steps: PlanCardStep[]
+  /** 「正在跑」行右侧 mono 耗时（仅目标式、且存在 running 步骤时显示），如 "1m24s" */
+  elapsed?: string
+  className?: string
+}
+
+/**
+ * PlanCard 计划卡（品牌锁定件，照 ow/components/chat/PlanCard 规格卡逐像素）。
+ * 有 goal=目标式：目标句＋右上 n/N mono＋步骤迹点行＋「正在跑」文字行；
+ * 无 goal 降级为清单式（眉题「计划清单」＋n/N＋步骤列表）。
+ *
+ * A9-B3（2026-09-02 裁决）：**完成度弧摘掉**。原型模板 template.dc.html:1249-1269 的
+ * 计划卡头行只有「目标句 ＋ 右上 n/N」——一段里同时出现弧、迹点行和 n/N 是三处同义读数，
+ * 弧还是唯一带几何动效的一处，跟贴地零影的卡面打架。进度由 n/N（准）＋迹点行（形）
+ * 双编码，够用且更静。规格卡 ow/components/chat/PlanCard/PlanCard.html 同步改。
+ * - 迹点三态：done=var(--ow-success) 实心 · running=var(--ow-beacon) 点＋外环（占状态极·每屏限一处）· todo=空心 1.5px text-3。
+ * - n/N 与耗时 mono+tabular-nums。
+ * - running 必须同时有「正在跑：…」文字行承义（R1 状态双编码）；荧黄由 running 状态注入（R2）。
+ */
+export function PlanCard({ goal, steps, elapsed, className = "" }: PlanCardProps) {
+  const total = steps.length
+  const done = steps.filter((s) => s.state === "done").length
+  const running = steps.find((s) => s.state === "running")
+  const nn = (
+    <span style={nnStyle}>
+      {done}/{total}
+    </span>
+  )
+
+  if (!goal) {
+    // 清单式降级：眉题＋n/N＋步骤列表（done 行 label 转 text-3）
+    return (
+      <div className={`ow-plan-card ow-plan-card--list ${className}`} style={cardStyle}>
+        <div style={listHeadStyle}>
+          <span style={eyebrowStyle}>计划清单</span>
+          {nn}
+        </div>
+        <div style={stepsStyle}>
+          {steps.map((step, i) => (
+            <div key={i} style={stepRowStyle}>
+              <TraceDot state={step.state} />
+              <span style={step.state === "done" ? { color: "var(--ow-text-3)" } : undefined}>{step.label}</span>
+            </div>
+          ))}
+        </div>
+      </div>
+    )
+  }
+
+  // 目标式：目标句＋n/N＋迹点行＋「正在跑」行
+  return (
+    <div className={`ow-plan-card ow-plan-card--goal ${className}`} style={cardStyle}>
+      <div style={headStyle}>
+        <div style={goalStyle}>{goal}</div>
+        {nn}
+      </div>
+      <div style={traceStyle}>
+        {steps.map((step, i) => (
+          <TraceDot key={i} state={step.state} />
+        ))}
+      </div>
+      {running && (
+        <div style={curStyle}>
+          <span>正在跑：{running.label}</span>
+          {elapsed && <span style={curTimeStyle}>{elapsed}</span>}
+        </div>
+      )}
+    </div>
+  )
+}
+
+/** 迹点：done=success 实心 8px · running=beacon 5px 点＋13px 外环 · todo=空心 1.5px text-3（R1 形差三态） */
+export function TraceDot({ state }: { state: PlanCardStep["state"] }) {
+  if (state === "running") {
+    return (
+      <span style={runRingStyle}>
+        <i style={runDotStyle} />
+      </span>
+    )
+  }
+  return <span style={state === "done" ? doneDotStyle : todoDotStyle} />
+}
+
+/* R2 复审：字号/圆角已归阶到 --ow-fs-* / --ow-radius-*（同值，无视觉变化）。
+   容器 padding:12 与 gap:10/9 仍是规格卡 ow/components/chat/PlanCard 的 .pcard 定值，
+   与既定态「卡骨架容器 14 / 字段 8」冲突——待品牌侧与规格卡一起裁，代码此处不单方改。 */
+const cardStyle: CSSProperties = {
+  background: "var(--ow-surface)",
+  border: "1px solid var(--ow-border)",
+  borderRadius: "var(--ow-radius-card)",
+  padding: 12,
+  display: "flex",
+  flexDirection: "column",
+  gap: 10,
+  fontFamily: "var(--ow-font-body)",
+}
+
+const headStyle: CSSProperties = { display: "flex", alignItems: "flex-start", gap: 8 }
+const goalStyle: CSSProperties = { flex: 1, fontSize: "var(--ow-fs-ui)", fontWeight: 500, lineHeight: 1.4 }
+
+const nnStyle: CSSProperties = {
+  fontSize: "var(--ow-fs-mark-md)",
+  color: "var(--ow-text-2)",
+  fontFamily: "var(--ow-font-mono)",
+  fontVariantNumeric: "tabular-nums",
+}
+
+const traceStyle: CSSProperties = { display: "flex", alignItems: "center", gap: 8, height: 14 }
+
+const dotBase: CSSProperties = { display: "block", width: 8, height: 8, borderRadius: "50%", flex: "none" }
+const doneDotStyle: CSSProperties = { ...dotBase, background: "var(--ow-success)" }
+const todoDotStyle: CSSProperties = { ...dotBase, border: "1.5px solid var(--ow-text-3)" }
+
+const runRingStyle: CSSProperties = {
+  width: 13,
+  height: 13,
+  flex: "none",
+  border: "1.5px solid var(--ow-beacon)",
+  borderRadius: "50%",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+}
+const runDotStyle: CSSProperties = {
+  display: "block",
+  width: 5,
+  height: 5,
+  borderRadius: "50%",
+  background: "var(--ow-beacon)",
+}
+
+const curStyle: CSSProperties = {
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "baseline",
+  fontSize: "var(--ow-fs-mark-md)",
+  color: "var(--ow-text-2)",
+}
+const curTimeStyle: CSSProperties = {
+  fontSize: "var(--ow-fs-mark-sm)",
+  fontFamily: "var(--ow-font-mono)",
+  fontVariantNumeric: "tabular-nums",
+}
+
+const listHeadStyle: CSSProperties = { display: "flex", justifyContent: "space-between", alignItems: "baseline" }
+const eyebrowStyle: CSSProperties = {
+  fontSize: "var(--ow-fs-eyebrow-cjk)",
+  fontWeight: 500,
+  letterSpacing: "var(--ow-ls-eyebrow-cjk)",
+  color: "var(--ow-text-2)",
+}
+const stepsStyle: CSSProperties = { display: "flex", flexDirection: "column", gap: 9 }
+const stepRowStyle: CSSProperties = {
+  display: "flex",
+  alignItems: "center",
+  gap: 8,
+  fontSize: "var(--ow-fs-caption)",
+  lineHeight: 1.4,
+}

package/src/components/domain/chat/RichContent/RichContent.stories.tsx

@@ -0,0 +1,102 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import { RichCard, RichLink, RichList } from "./index"
+
+const meta = {
+  title: "Chat/RichContent",
+  component: RichCard,
+  parameters: { layout: "padded" },
+  tags: ["autodocs"],
+} satisfies Meta<typeof RichCard>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+const Stream = ({ children }: { children: React.ReactNode }) => (
+  <div style={{ width: 560, maxWidth: "100%", background: "var(--ow-bg)", padding: 16 }}>{children}</div>
+)
+
+export const Note: Story = {
+  name: "RichCard · note",
+  render: () => (
+    <Stream>
+      <RichCard
+        title="发布节奏改成两周一次"
+        meta="来自 2026-08-24 的例会纪要，负责人是你。"
+        href="#"
+        linkLabel="打开纪要"
+      />
+    </Stream>
+  ),
+}
+
+export const Detail: Story = {
+  name: "RichCard · detail（可折叠）",
+  render: () => (
+    <Stream>
+      <RichCard variant="detail" title="展开看这次改了哪些文件">
+        <p style={{ margin: 0 }}>packages/ui/src/components/domain/chat/RichContent/index.tsx</p>
+        <p style={{ margin: 0 }}>packages/ui/styles/desktop-surfaces.css</p>
+      </RichCard>
+      <RichCard variant="detail" title="默认展开的一段" defaultOpen>
+        <p style={{ margin: 0 }}>折叠件用原生 details，键盘与读屏行为交给浏览器。</p>
+      </RichCard>
+    </Stream>
+  ),
+}
+
+export const Task: Story = {
+  name: "RichCard · task（任务引用）",
+  render: () => (
+    <Stream>
+      <RichCard
+        variant="task"
+        glyph="TSK"
+        title="把设计规范同步到组件库"
+        progress={57}
+        footnote="4/7 步"
+        readout="12m 30s"
+        onClick={() => {}}
+      />
+      <RichCard variant="task" glyph="TSK" title="等待你确认的任务" progress={0} footnote="0/5 步" readout="00m 00s" />
+    </Stream>
+  ),
+}
+
+export const Link: Story = {
+  name: "RichLink",
+  render: () => (
+    <Stream>
+      <p style={{ margin: "0 0 4px", fontSize: "var(--ow-fs-ui, 13px)", color: "var(--ow-text-2)" }}>
+        规范原文在这里：
+      </p>
+      <RichLink href="https://example.com/ds2">Orbitwork DS 2.0 组件生成规则手册</RichLink>
+    </Stream>
+  ),
+}
+
+export const TextList: Story = {
+  name: "RichList · text",
+  render: () => (
+    <Stream>
+      <RichList items={["先看 token 契约", "再看形状与度量", "最后跑一遍验收清单"]} ordered />
+      <RichList items={["不写死荧黄", "读数一律 mono", "禁位移式 hover"]} />
+    </Stream>
+  ),
+}
+
+export const ResourceList: Story = {
+  name: "RichList · resource（旧 ProductList）",
+  render: () => (
+    <Stream>
+      <RichList
+        variant="resource"
+        aria-label="本次产出的文件"
+        items={[
+          { title: "COMPONENT-RULES.md", meta: "18.4 KB · 今天 14:02", href: "#" },
+          { title: "RichContent.tsx", meta: "9.1 KB · 今天 15:20", onClick: () => {} },
+          { title: "desktop-surfaces.css", meta: "212 KB · 今天 15:31" },
+        ]}
+      />
+    </Stream>
+  ),
+}

package/src/components/domain/chat/RichContent/RichContentSource.test.mjs

@@ -0,0 +1,82 @@
+import assert from "node:assert/strict"
+import { readFile } from "node:fs/promises"
+import test from "node:test"
+
+const source = await readFile(new URL("./index.tsx", import.meta.url), "utf8")
+const chatIndex = await readFile(new URL("../index.ts", import.meta.url), "utf8")
+
+test("六件收敛为三件：RichCard / RichLink / RichList", () => {
+  assert.match(source, /export function RichCard/)
+  assert.match(source, /export function RichLink/)
+  assert.match(source, /export function RichList/)
+  assert.match(source, /export type RichCardVariant = "note" \| "detail" \| "task"/)
+  assert.match(chatIndex, /export \* from "\.\/RichContent"/)
+})
+
+test("旧件保留薄兼容导出并标 @deprecated", () => {
+  for (const name of ["RichDetail", "NoteCard", "TaskRef", "ProductList"]) {
+    assert.match(source, new RegExp(`@deprecated[\\s\\S]{0,160}export function ${name}\\b`))
+  }
+})
+
+test("RichLink 走 .ow-link 工具类（info 蓝），不复写颜色、不沿用 --ow-fg-link", () => {
+  assert.match(source, /data-slot="rich-link"[\s\S]*?"ow-link inline-flex/)
+  assert.doesNotMatch(source, /var\(--ow-fg-link\)/)
+})
+
+test("资源行（旧 ProductList）用 FileIcon 单色字形，禁多彩文件图标", () => {
+  assert.match(source, /import \{ FileIcon \} from "\.\.\/\.\.\/files\/FileIcon"/)
+  assert.match(source, /<FileIcon name=\{item\.name \?\? label \?\? ""\} kind=\{item\.kind\}/)
+})
+
+test("§7 读数 mono + tabular-nums，§6 状态全集与焦点环三件套", () => {
+  assert.match(source, /const richReadoutClass = "font-\[family-name:var\(--ow-font-mono\)\] tabular-nums"/)
+  assert.match(source, /hover:bg-\[var\(--ow-hover\)\] active:bg-\[var\(--ow-press\)\]/)
+  // R2 复审：环宽/缝原写死 2px，改走 .ow-focus-ring 工具类——它消费
+  // --ow-focus-ring-w / --ow-focus-ring / --ow-focus-ring-offset 三 token（既定态唯一出口）。
+  assert.match(source, /"ow-focus-ring"/)
+  assert.doesNotMatch(source, /focus-visible:\[outline:/)
+  assert.doesNotMatch(source, /focus-visible:\[outline-offset:/)
+  assert.match(source, /disabled:bg-\[var\(--ow-disabled-bg\)\]/)
+  // task 档脚注左槽（「n/N 步」）与右侧耗时同为 mono＋tabular-nums
+  assert.match(source, /footnote != null && richReadoutClass/)
+})
+
+test("§5 立面：贴地卡＝1px --ow-border ＋ surface 底，0 影", () => {
+  assert.match(source, /border border-\[color:var\(--ow-border\)\] bg-\[var\(--ow-surface\)\]/)
+  assert.doesNotMatch(source, /shadow-|box-shadow/)
+})
+
+test("task 档进度走 ProgressBar（--ow-progress-fill），R3 中性件无信标荧黄", () => {
+  assert.match(source, /import \{ ProgressBar \} from "\.\.\/\.\.\/\.\.\/primitives\/ProgressBar"/)
+  assert.doesNotMatch(source, /var\(--ow-beacon|var\(--ow-accent-dot|var\(--ow-yellow/)
+})
+
+test("动效 §9：只过渡底色/边框，走 ease-beacon，禁位移缩放", () => {
+  assert.match(source, /ease-\[var\(--ow-ease-beacon\)\]/)
+  assert.doesNotMatch(source, /hover:(?:scale|translate)/)
+})
+
+test("任意值 var() 全部带类型标注（防 tailwind-merge 吞类）", () => {
+  assert.doesNotMatch(source, /(?:text|border)-\[var\(--ow-/)
+  assert.doesNotMatch(source, /font-\[var\(--ow-font-/)
+})
+
+// ── W5 终扫 ──────────────────────────────────────────────────────────────
+test("§8 字族：字形块是 UI 文本，不许再声明品牌展示字 --ow-font-display", () => {
+  assert.doesNotMatch(source, /--ow-font-display/)
+  assert.match(source, /data-ow-part="glyph"[\s\S]*?font-\[family-name:var\(--ow-font-sans\)\]/)
+})
+
+test("§7 形状：28×28 字形块从 4（键帽档）提到 6 直角标记档", () => {
+  assert.match(source, /data-ow-part="glyph"[\s\S]*?\[border-radius:var\(--ow-radius-tag\)\]/)
+  assert.doesNotMatch(source, /--ow-radius-2xs/)
+})
+
+test("卡骨架统一：task / note / resource 三档同走 14px 容器内距", () => {
+  // 原来是 task px-4 py-3.5(16/14)、note px-3 py-3(12/12)、resource px-3.5 py-3(14/12)
+  assert.match(source, /richSurfaceClass, "my-2 block max-w-\[460px\] p-3\.5"/)
+  assert.match(source, /richSurfaceClass, "my-2 max-w-\[460px\] p-3\.5"/)
+  assert.match(source, /"flex w-full items-center gap-3 p-3\.5 no-underline"/)
+  assert.doesNotMatch(source, /px-4 py-3\.5|px-3 py-3\b|px-3\.5 py-3\b/)
+})