@orbit-work/ui 0.1.0

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

@@ -0,0 +1,245 @@
+"use client"
+
+import { type CSSProperties, useState } from "react"
+import { Button } from "../../../primitives"
+
+/** 展开态工具调用明细行（规格卡演示形态；对 ow 契约 .d.ts 的实现侧扩展字段）。 */
+export type TranscriptToolCall = {
+  /** 工具名，mono 500 字重，如 "read_sheet" / "subagent" */
+  name: string
+  /** 参数/对象，text-3，如 "median_by_segment.py" */
+  target?: string
+  /** 右对齐读数：耗时或状态，如 "0.6s"、"运行中 · 3m12s" */
+  duration?: string
+}
+
+export type TranscriptTurn = {
+  role: "user" | "agent"
+  /** 用户轮=原话短句；agent 轮=loop 摘要动宾短语（如「核对 14 份来源」） */
+  summary: string
+  /** agent 轮步数（mono 渲染） */
+  steps?: number
+  /** agent 轮耗时，如 "2m40s" */
+  duration?: string
+  /** 默认 true（折叠 ▸）；false=展开 ▾ 显示工具调用明细 */
+  collapsed?: boolean
+  /** 展开时显示的工具调用明细行；少于 steps 时自动补「… 其余 N 步已折叠」 */
+  tools?: TranscriptToolCall[]
+}
+
+export type TranscriptSpineProps = {
+  turns: TranscriptTurn[]
+  className?: string
+}
+
+/**
+ * 会话脊柱：transcript 左侧贯穿工作线（--ow-timeline 1.5px），agent 轮=实心点、
+ * 用户轮=空心环（底填面板色断开脊线），不设头像。agent 轮默认折叠为一行 loop 摘要
+ * （动词＋对象＋步数·耗时 mono tabular-nums，末尾 ▸），展开 ▾ 才见工具调用明细。
+ * 中性件，永不含荧黄。本件只画脊线与节点，用户原话在这里平铺不带底：井色气泡
+ * （--ow-bubble-user 底＋1px --ow-border 边＋圆角 12＋最宽 78%）是 UserTurn 的配方，
+ * 气泡与消息列表布局都属宿主，脊柱不复刻。
+ */
+export function TranscriptSpine({ turns, className = "" }: TranscriptSpineProps) {
+  const [openMap, setOpenMap] = useState<Record<number, boolean>>({})
+
+  return (
+    <div data-slot="transcript-spine" className={className} style={spineStyle}>
+      <span data-ow-part="line" aria-hidden="true" style={lineStyle} />
+      {turns.map((turn, i) => {
+        if (turn.role === "user") {
+          return (
+            <div key={i} data-ow-part="turn" data-role="user" style={turnStyle}>
+              <span data-ow-part="dot" aria-hidden="true" style={dotUserStyle} />
+              <div data-ow-part="user-text" style={userTextStyle}>
+                {turn.summary}
+              </div>
+            </div>
+          )
+        }
+
+        const expanded = openMap[i] ?? !(turn.collapsed ?? true)
+        const tools = turn.tools ?? []
+        const hiddenSteps = turn.steps != null ? turn.steps - tools.length : 0
+        const meta =
+          turn.steps != null && turn.duration
+            ? `${turn.steps} 步 · ${turn.duration}`
+            : turn.steps != null
+              ? `${turn.steps} 步`
+              : (turn.duration ?? "")
+
+        return (
+          <div key={i} data-ow-part="turn" data-role="agent" style={turnStyle}>
+            <span data-ow-part="dot" aria-hidden="true" style={dotAgentStyle} />
+            <Button
+              type="button"
+              variant="unstyled"
+              data-ow-part="loop"
+              className="ow-focus-ring"
+              aria-expanded={expanded}
+              onClick={() => setOpenMap((m) => ({ ...m, [i]: !expanded }))}
+              style={loopStyle}
+            >
+              <span data-ow-part="loop-verb" style={loopVerbStyle}>
+                {turn.summary}
+              </span>
+              {meta && (
+                <span data-ow-part="loop-meta" style={loopMetaStyle}>
+                  {meta}
+                </span>
+              )}
+              <span data-ow-part="chevron" aria-hidden="true" style={chevronStyle}>
+                {expanded ? "▾" : "▸"}
+              </span>
+            </Button>
+            {expanded && tools.length > 0 && (
+              <div data-ow-part="tools" style={toolsStyle}>
+                {tools.map((tool, j) => (
+                  <div key={j} data-ow-part="tool" style={toolStyle}>
+                    <span data-ow-part="tool-name" style={toolNameStyle}>
+                      {tool.name}
+                    </span>
+                    {tool.target && (
+                      <span data-ow-part="tool-target" style={toolTargetStyle}>
+                        {tool.target}
+                      </span>
+                    )}
+                    {tool.duration && (
+                      <span data-ow-part="tool-duration" style={toolDurationStyle}>
+                        {tool.duration}
+                      </span>
+                    )}
+                  </div>
+                ))}
+                {hiddenSteps > 0 && (
+                  <div data-ow-part="tool-more" style={toolMoreStyle}>
+                    … 其余 {hiddenSteps} 步已折叠
+                  </div>
+                )}
+              </div>
+            )}
+          </div>
+        )
+      })}
+    </div>
+  )
+}
+
+const spineStyle: CSSProperties = {
+  position: "relative",
+  display: "flex",
+  flexDirection: "column",
+  gap: 14,
+  fontFamily: "var(--ow-font-body)",
+}
+
+const lineStyle: CSSProperties = {
+  position: "absolute",
+  left: 5,
+  top: 8,
+  bottom: 9,
+  width: 1.5,
+  background: "var(--ow-timeline)",
+}
+
+const turnStyle: CSSProperties = {
+  position: "relative",
+  paddingLeft: 26,
+}
+
+const dotBase: CSSProperties = {
+  position: "absolute",
+  left: 0,
+  top: 5,
+  width: 11,
+  height: 11,
+  borderRadius: "50%",
+}
+
+/** 空心环：环心填**所在地色**才能把脊线断开。R2 复审修：原来写死 --ow-surface，
+ *  脊柱落在 --ow-bg 地上时环心反而是一枚更亮的盘。改与 UserTurn/index.tsx 同源——
+ *  读壳注入的 --ow-turn-ground（Transcript 按 surface 属性注入），缺省回落 --ow-surface。 */
+const dotUserStyle: CSSProperties = {
+  ...dotBase,
+  border: "1.5px solid var(--ow-text-3)",
+  background: "var(--ow-turn-ground, var(--ow-surface))",
+}
+
+const dotAgentStyle: CSSProperties = {
+  ...dotBase,
+  background: "var(--ow-text)",
+}
+
+const userTextStyle: CSSProperties = {
+  fontSize: 13,
+  lineHeight: 1.6,
+  color: "var(--ow-text)",
+}
+
+const loopStyle: CSSProperties = {
+  display: "flex",
+  alignItems: "baseline",
+  gap: 8,
+  padding: 0,
+  border: "none",
+  background: "transparent",
+  fontFamily: "inherit",
+  fontSize: 13,
+  lineHeight: 1.55,
+  textAlign: "left",
+  cursor: "pointer",
+}
+
+const loopVerbStyle: CSSProperties = {
+  fontWeight: 500,
+  color: "var(--ow-text)",
+}
+
+const loopMetaStyle: CSSProperties = {
+  fontFamily: "var(--ow-font-mono)",
+  fontSize: 11,
+  color: "var(--ow-text-2)",
+  fontVariantNumeric: "tabular-nums",
+}
+
+const chevronStyle: CSSProperties = {
+  color: "var(--ow-text-3)",
+  fontSize: 10,
+}
+
+const toolsStyle: CSSProperties = {
+  marginTop: 8,
+  display: "flex",
+  flexDirection: "column",
+  gap: 5,
+}
+
+const toolStyle: CSSProperties = {
+  display: "flex",
+  alignItems: "baseline",
+  gap: 8,
+  fontFamily: "var(--ow-font-mono)",
+  fontSize: 10.5,
+  color: "var(--ow-text-2)",
+  fontVariantNumeric: "tabular-nums",
+}
+
+const toolNameStyle: CSSProperties = {
+  fontWeight: 500,
+}
+
+const toolTargetStyle: CSSProperties = {
+  color: "var(--ow-text-3)",
+}
+
+const toolDurationStyle: CSSProperties = {
+  marginLeft: "auto",
+  color: "var(--ow-text-3)",
+}
+
+const toolMoreStyle: CSSProperties = {
+  fontFamily: "var(--ow-font-mono)",
+  fontSize: 10,
+  color: "var(--ow-text-3)",
+  fontVariantNumeric: "tabular-nums",
+}

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

@@ -0,0 +1,176 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import type { CSSProperties } from "react"
+import { Copy, Server, Skill } from "../../../composite/Icons"
+import { MessageActions } from "../MessageActions"
+import { UserTurn } from "./index"
+
+const meta = {
+  title: "Chat/UserTurn",
+  component: UserTurn,
+  parameters: { layout: "padded" },
+  tags: ["autodocs"],
+  decorators: [
+    (Story) => (
+      <div
+        style={{
+          maxWidth: 560,
+          padding: "16px 16px 15px",
+          background: "var(--ow-surface)",
+          border: "1px solid var(--ow-border)",
+          borderRadius: "var(--ow-radius-lg)",
+        }}
+      >
+        <Story />
+      </div>
+    ),
+  ],
+} satisfies Meta<typeof UserTurn>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+/**
+ * 上下文 chip 的演示配方（判断表「挂载芯片」条）：V1 的 skill 蓝 / mcp 绿双色分类退役——
+ * 分类不是状态，不该各占一个功能色极。两类同落 info tint（--ow-mention-bg /
+ * --ow-mention-text），类别改由**类别图标**区分（skill=火花，MCP=连接器机架）。
+ * 形状按 §7：纯分类 chip 不带状态点/计数，走 6 直角（--ow-radius-tag），999 只留给
+ * 带点/计数的胶囊。
+ */
+const contextChipStyle: CSSProperties = {
+  height: 24,
+  display: "inline-flex",
+  alignItems: "center",
+  gap: 5,
+  padding: "0 9px 0 7px",
+  borderRadius: "var(--ow-radius-tag)",
+  background: "var(--ow-mention-bg)",
+  border: "1px solid var(--ow-info-tint-border)",
+  color: "var(--ow-mention-text)",
+  font: "500 var(--ow-fs-ui)/1 var(--ow-font-sans)",
+}
+
+// A9-B2：时间读数搬到气泡右侧同一行（UserTurn 的 `time` 槽），操作行只留复制钮。
+const copyAction = <MessageActions items={[{ key: "copy", label: "复制", icon: <Copy />, onSelect: () => {} }]} />
+
+/**
+ * 默认：8px 空心环节点＋井色气泡（--ow-bubble-user 底、1px 边、圆角 12、最宽 78%、
+ * 内边 10·14、字 14/1.7），时间读数 mono＋tabular-nums 挂在气泡**右侧同一行**、底对齐后抬 3px
+ * （原型 template.dc.html:1173-1178）。
+ */
+export const Default: Story = {
+  args: {
+    text: "帮我核对 Q3 渠道复盘引用的 14 份来源，重点看数据有没有过期。",
+    time: "14:28",
+    actions: copyAction,
+  },
+}
+
+/** 多行原话：整段保留换行，长串按字符断行。 */
+export const Multiline: Story = {
+  args: {
+    text: "三件事：\n1. 第 9 份的行业均值口径不对，换成中位数；\n2. 图 3 的时间轴补到 Q3 末；\n3. 结论段别超过 200 字。",
+    time: "14:31",
+    actions: copyAction,
+  },
+}
+
+/** 带来源与上下文：来源 chip 在前，技能/MCP chip 跟上（统一 info tint ＋ 类别图标 ＋ 6 直角），都挂在同一节点下。 */
+export const WithContext: Story = {
+  args: {
+    text: "把这封邮件里的排期整理成任务清单。",
+    leading: (
+      // R2 复审修：来源 chip 原写 999 胶囊 ＋ 高 22，与同屏 contextChipStyle 的
+      // 6 直角 ＋ 高 24 两种形两种尺寸并列，也和本文件上面那段注释「999 只留给带点/计数
+      // 的胶囊」自相矛盾。它无点无计数，收到 --ow-radius-tag(6)，高度与 contextChipStyle 同为 24。
+      <span
+        style={{
+          height: 24,
+          display: "inline-flex",
+          alignItems: "center",
+          padding: "0 8px",
+          border: "1px solid var(--ow-border-strong)",
+          borderRadius: "var(--ow-radius-tag)",
+          font: "500 var(--ow-fs-ui)/1 var(--ow-font-sans)",
+          color: "var(--ow-text-3)",
+        }}
+      >
+        来自邮件 · 项目周报
+      </span>
+    ),
+    contexts: (
+      <div style={{ display: "flex", gap: 6 }}>
+        <span style={contextChipStyle}>
+          <Skill aria-hidden="true" width={13} height={13} style={{ flexShrink: 0 }} />
+          排期整理
+        </span>
+        <span style={contextChipStyle}>
+          <Server aria-hidden="true" width={13} height={13} style={{ flexShrink: 0 }} />
+          飞书日历
+        </span>
+      </div>
+    ),
+    actions: copyAction,
+  },
+}
+
+/** 错误态：正文前挂错误记号，下面跟一句人话（§6）。 */
+export const WithError: Story = {
+  args: {
+    text: "把这份 PDF 里的表格导出成 csv。",
+    error: "附件超过 25MB，没能上传；压缩后再试一次。",
+  },
+}
+
+/** 流式：正文尾部挂呼吸尾点，reduced-motion 下静止。 */
+export const Streaming: Story = {
+  args: {
+    text: "再补一句：结论段先给结果",
+    streaming: true,
+  },
+}
+
+/** 无脊柱节点：脱离 Transcript 单用（旧 ChatBubble 兼容层走的就是这条），气泡形态不变。 */
+export const WithoutNode: Story = {
+  args: {
+    node: false,
+    text: "这条不挂脊柱节点，正文形态不变。",
+  },
+}
+
+/**
+ * 分享挑选（R2 · L3-2-10 补）：`selectable` 四态此前只在 `Screens/Share` 那一张整屏里
+ * 露过脸，件级零覆盖。行首长出 16 勾选框（排在 12 脊柱列之外），正文整列右移 32、
+ * 脊柱环跟着挪到 33；**选中行不加底色**——选中态只由勾选框自己承担。
+ */
+export const Selectable: Story = {
+  render: () => (
+    <div style={{ display: "flex", flexDirection: "column", gap: 4 }}>
+      <UserTurn selectable checked={false} onToggle={() => {}} text="帮我把上个季度的渠道数据整理成图表。" />
+      <UserTurn selectable checked onToggle={() => {}} text="用「星野」那套配色，负值走暖橙不要红色。" />
+    </div>
+  ),
+}
+
+/**
+ * 挑选态下的长正文：右移 32 之后气泡不该被挤破——折行照常，行末不出横向溢出。
+ * 与 `Multiline` 那张对照看同一段话在两种缩进下的重排。
+ */
+export const SelectableLongText: Story = {
+  render: () => (
+    <div style={{ display: "flex", flexDirection: "column", gap: 4 }}>
+      <UserTurn
+        selectable
+        checked
+        onToggle={() => {}}
+        text="帮我把上个季度所有渠道的数据整理成一份可以直接汇报的图表：主色取品牌藏蓝，辅色按数据序列从深到浅排，负值一律走暖橙而不是红色（客户内部红色是「停线」的意思，会误读）。图例放右侧竖排，坐标轴刻度用 mono 字体并开 tabular-nums。"
+      />
+      <UserTurn
+        selectable
+        checked={false}
+        onToggle={() => {}}
+        actions={<MessageActions actions={["copy", "edit"]} time="14:32" />}
+        text="再顺手把「档案馆」那一版也换成同一套配色，两版并排给我看一眼。"
+      />
+    </div>
+  ),
+}

package/src/components/domain/chat/UserTurn/UserTurnSource.test.mjs

@@ -0,0 +1,150 @@
+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 spine = await readFile(new URL("../TranscriptSpine/index.tsx", import.meta.url), "utf8")
+const legacy = await readFile(new URL("../ChatBubble/index.tsx", import.meta.url), "utf8")
+
+// A9-B2：环径 11 → 8（原型 template.dc.html:1155 的 left 1 / top 7 / 8×8），环心 y 仍是 11.5 一线。
+test("用户轮节点＝空心环：8px、1.5px --ow-text-3 描边，环心填壳地色断开脊线", () => {
+  assert.match(source, /left-\[1px\] top-\[7px\] w-\[8px\] h-\[8px\]/)
+  assert.match(source, /border-\[1\.5px\] border-\[color:var\(--ow-text-3\)\]/)
+  assert.match(source, /bg-\[color:var\(--ow-turn-ground,var\(--ow-surface\)\)\]/)
+  // 与锁定件 TranscriptSpine 的用户轮同口径（空心环＋断线）
+  assert.match(spine, /border: "1\.5px solid var\(--ow-text-3\)"/)
+  // R2 复审：环心由写死 --ow-surface 改读壳注入的地色，脊柱落在 --ow-bg 上时也能断线
+  assert.match(spine, /background: "var\(--ow-turn-ground, var\(--ow-surface\)\)"/)
+})
+
+test("脊柱缩进 26px，与 TranscriptSpine 的 turn paddingLeft 同值", () => {
+  assert.match(source, /node && "pl-\[26px\]"/)
+  assert.match(spine, /paddingLeft: 26/)
+})
+
+// R3（2026-09-04，Terry 意见 2）：A9-B2 的井色气泡整枚撤——原型 1176 的 --ow-bubble-user 底
+// ＋ 1px --ow-border 边 ＋ 圆角 12 ＋ 10·14 内边全部不画，正文直接排在面上，与 AI 轮同一档字
+// （--ow-fs-ui 13/1.7 ＋ --ow-text）。角色只由脊柱节点的形状区分（空心环 vs 实心点）。
+// 撤泡的原因：agent 正文里常有代码框/产物卡/执行卡，气泡套框是框套框。
+// 最宽 78% 保留——原话读作引用，需要一个短量度。
+test("用户消息＝纯文字原话（R3 撤泡）：无底无边无圆角无内距，13/1.7 同档字＋最宽 78%", () => {
+  const code = source.replace(/\/\*[\s\S]*?\*\//g, "").replace(/^[ \t]*\/\/.*$/gm, "")
+  assert.match(
+    code,
+    /"min-w-0 shrink max-w-\[78%\] whitespace-pre-wrap \[overflow-wrap:anywhere\] \[text-wrap:pretty\]"/,
+  )
+  assert.match(code, /"text-ow-fs-ui leading-\[1\.7\] text-\[color:var\(--ow-text\)\]"/)
+  // 正文那一段里没有底/边/圆角/内距任何一件（气泡三件 ＋ 内边一并撤）
+  const quote = code.slice(code.indexOf('data-ow-part="quote"'), code.indexOf('data-ow-part="caret"'))
+  assert.ok(quote.length > 0, "找不到 quote 段")
+  assert.doesNotMatch(quote, /\bbg-\[|\bborder\b|border-radius|\bpx-\[|\bpy-\[/)
+  // 井色底与皮肤的 userBubble* 三件钩子在代码里都不许再出现（件头注释存档不算）
+  assert.doesNotMatch(code, /--ow-bubble-user|--ow-chat-user-bubble-/)
+  assert.doesNotMatch(code, /--ow-surface-2/)
+})
+
+// R3 撤泡后 --ow-bubble-user 在 React 层零消费；token 本身留在浅/暗两档里等皮肤（D1）重启再定去留，
+// 半边（只有浅档有值）比整枚删掉更难查，所以两档同在这条守着。
+test("--ow-bubble-user 浅/暗两档都还有值（R3 撤泡后留给皮肤，不许只剩半边）", async () => {
+  const light = await readFile(new URL("../../../../tokens/light.ts", import.meta.url), "utf8")
+  const dark = await readFile(new URL("../../../../tokens/dark.ts", import.meta.url), "utf8")
+  assert.match(light, /bubbleUser: "[^"]+"/)
+  assert.match(dark, /bubbleUser: "[^"]+"/)
+})
+
+// A9-B2：时间读数从下方操作行搬到正文右侧同一行（原型 1177：flex-end ＋ gap 8）。
+// R3 撤泡后没有 10px 内边可借，两条基线靠 pb-4px ＋ leading-none 对齐（原来是 pb-3px）。
+test("时间读数挂正文右侧同行：mono＋tabular-nums＋--ow-text-3，底对齐后抬 4px（R3 撤泡）", () => {
+  assert.match(source, /time\?: ReactNode/)
+  assert.match(source, /data-ow-part="quote-row" className="flex w-full min-w-0 items-end gap-2"/)
+  assert.match(
+    source,
+    /data-ow-part="time"[\s\S]*?shrink-0 pb-\[4px\] leading-none font-\[family-name:var\(--ow-font-mono\)\] tabular-nums[\s\S]*?text-ow-fs-caption text-\[color:var\(--ow-text-3\)\]/,
+  )
+  // 错误记号原来靠气泡的 10px 内边落在首行，撤泡后改 self-start ＋ mt-3px 钉回首行
+  assert.match(source, /data-ow-part="error-mark"[\s\S]*?self-start mt-\[3px\]/)
+})
+
+test("槽位齐全：来源/附件/上下文/操作/尾部，正文可纯文本或富节点", () => {
+  for (const slot of ["leading", "attachments", "contexts", "actions", "trailing"]) {
+    assert.match(source, new RegExp(`${slot}\\?: ReactNode`))
+  }
+  assert.match(source, /const body = children \?\? \(text \|\| null\)/)
+})
+
+test("§6 状态：错误＝记号＋人话一句；流式＝呼吸尾点（reduced-motion 停）", () => {
+  assert.match(source, /data-ow-part="error-mark"[\s\S]*?bg-\[var\(--ow-error\)\]/)
+  assert.match(source, /data-ow-part="error"[\s\S]*?text-\[color:var\(--ow-error\)\]/)
+  // R2 复审：呼吸的周期/缓动改走 token（--ow-dur-spin ＝ 1.6s，--ow-ease-beacon ＝ §9 唯一缓动），
+  // 与 components.css 的 .ow-artifact-trail__dot--gen、desktop-surfaces.css 的同款尾点同一写法。
+  assert.match(
+    source,
+    /data-ow-part="caret"[\s\S]*?motion-safe:animate-\[ow-skeleton_var\(--ow-dur-spin\)_var\(--ow-ease-beacon\)_infinite\]/,
+  )
+  assert.doesNotMatch(source, /ease-in-out/)
+})
+
+test("R3 中性件：用户轮不含信标/荧黄", () => {
+  assert.doesNotMatch(source, /var\(--ow-beacon|var\(--ow-accent-dot|var\(--ow-yellow/)
+})
+
+test("任意值 var() 全部带类型标注（防 tailwind-merge 吞类）", () => {
+  assert.doesNotMatch(source, /(?:text|border)-\[var\(--ow-/)
+  assert.doesNotMatch(source, /font-\[var\(--ow-font-/)
+})
+
+test("旧件 ChatBubble 降为薄兼容层，转 UserTurn 且不再自造气泡", () => {
+  assert.match(legacy, /@deprecated/)
+  assert.match(legacy, /import \{ UserTurn \} from "\.\.\/UserTurn"/)
+  assert.match(legacy, /<UserTurn node=\{false\}/)
+  assert.doesNotMatch(legacy, /borderRadius|justifyContent: "flex-end"/)
+})
+
+// ── W5 终扫：故事里的上下文 chip ─────────────────────────────────────────
+test("上下文 chip 收敛成统一 info tint ＋ 类别图标，V1 蓝/绿双色分类退役", async () => {
+  const stories = await readFile(new URL("./UserTurn.stories.tsx", import.meta.url), "utf8")
+  assert.match(stories, /background: "var\(--ow-mention-bg\)"/)
+  assert.match(stories, /color: "var\(--ow-mention-text\)"/)
+  assert.match(stories, /border: "1px solid var\(--ow-info-tint-border\)"/)
+  // 类别只由图标区分（skill＝火花 / MCP＝连接器机架）
+  assert.match(stories, /import \{ Copy, Server, Skill \} from "\.\.\/\.\.\/\.\.\/composite\/Icons"/)
+  assert.match(stories, /<Skill aria-hidden="true"/)
+  assert.match(stories, /<Server aria-hidden="true"/)
+  // 旧四色分类不得回流
+  assert.doesNotMatch(stories, /--ow-(?:primary|success|warning|error)-(?:bg|border)\)/)
+})
+
+test("§7 形状：纯分类 chip 走 6 直角（--ow-radius-tag），999 只留给带点/计数的胶囊", async () => {
+  const stories = await readFile(new URL("./UserTurn.stories.tsx", import.meta.url), "utf8")
+  assert.match(stories, /borderRadius: "var\(--ow-radius-tag\)"/)
+  // 来源 chip 另有身份含义，仍是胶囊；只断言上下文 chip 那一处不再是 pill
+  assert.doesNotMatch(stories, /contextChipStyle[\s\S]{0,400}?--ow-radius-pill/)
+})
+
+// ── A7-B2 分享挑选模式（Terry 裁决 8） ─────────────────────────────────────
+test("行首勾选框走 primitives/Checkbox（16×16 / 1px / radius-2xs），不再有第二种勾选语法", () => {
+  assert.match(source, /import \{ Checkbox \} from "\.\.\/\.\.\/\.\.\/primitives\/Checkbox"/)
+  assert.match(source, /selectable\?: boolean/)
+  assert.match(source, /checked\?: boolean/)
+  assert.match(source, /onToggle\?: \(checked: boolean\) => void/)
+  assert.match(source, /selectLabel\?: string/)
+  assert.match(source, /selectLabel = "选入分享"/)
+  assert.match(
+    source,
+    /<Checkbox[\s\S]*?checked=\{checked\}[\s\S]*?onChange=\{onToggle\}[\s\S]*?aria-label=\{selectLabel\}/,
+  )
+  // 原生 <input type=checkbox> 不许回流
+  assert.doesNotMatch(source, /type="checkbox"/)
+})
+
+test("勾选框排在脊柱列之外：行首 32px（16 框 ＋ 16 沟），正文与节点同步右移", () => {
+  assert.match(source, /const SELECT_BOX_CLASS = "absolute left-0 top-\[3px\] shrink-0"/)
+  assert.match(source, /selectable && "pl-\[58px\]"/) // 26 ＋ 32
+  assert.match(source, /cn\(dotClass, selectable && "left-\[33px\]"\)/) // 1 ＋ 32
+  assert.match(source, /data-selectable=\{selectable \? "on" : undefined\}/)
+})
+
+test("选中行不加底色：选中态只由勾选框承担（原型 1159 正文容器无 background）", () => {
+  assert.doesNotMatch(source, /--ow-current-bg/)
+  assert.doesNotMatch(source, /checked && "bg-/)
+})