@orbit-work/ui 0.1.0

package/src/components/domain/chat/AgentLoopSegment/AgentLoopSegmentSource.test.mjs

@@ -0,0 +1,45 @@
+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 stories = await readFile(new URL("./AgentLoopSegment.stories.tsx", import.meta.url), "utf8")
+const barrel = await readFile(new URL("../index.ts", import.meta.url), "utf8")
+/** 剥注释后的源码：架构注释里复述了 padding-bottom / 边框等被排除项，禁写类断言只看真代码 */
+const code = source.replace(/\/\*[\s\S]*?\*\//g, "").replace(/^\s*\/\/.*$/gm, "")
+
+// 裁决 15：段之间不加容器，只靠 10px 节奏 ＋ 每段一张执行摘要卡
+test("只有节奏没有面：纯 flex column ＋ gap 10，无边框/无底色/无内距/无影", () => {
+  assert.match(source, /const segmentStyle: CSSProperties = \{ display: "flex", flexDirection: "column", gap: 10 \}/)
+  assert.doesNotMatch(code, /border|background|padding|boxShadow/)
+})
+
+test("与原型内容列同值（template.dc.html:1170 的 gap:10），不另加段号/左细线", () => {
+  assert.doesNotMatch(code, /::before|counter|borderLeft/)
+})
+
+test("data-slot 出到 DOM，供 B3 接线与回归定位", () => {
+  assert.match(source, /data-slot="agent-loop-segment"/)
+})
+
+test("story 覆盖：已完成段 / 跑动段 / 待授权段 / 多段叠加", () => {
+  for (const s of ["Done", "Running", "AwaitingAuthorization", "MultipleSegments"]) {
+    assert.match(stories, new RegExp(`export const ${s}: Story`))
+  }
+  // 段内零件齐：思考行 / 执行摘要卡 / 工具行 / 授权卡
+  assert.match(stories, /<Thinking variant="inline"/)
+  assert.match(stories, /<ExecutionSummary /)
+  assert.match(stories, /<ToolCallRow /)
+  assert.match(stories, /<AuthorizationCard /)
+})
+
+test("同段状态极只一处：有工具在跑的两段，思考行都带 toolRunning 让极", () => {
+  const running = stories.split("export const Running: Story")[1].split("export const")[0]
+  assert.match(running, /<Thinking variant="inline" toolRunning/)
+  const multi = stories.split("export const MultipleSegments: Story")[1]
+  assert.match(multi, /<Thinking variant="inline" toolRunning/)
+})
+
+test("已进 chat 桶导出", () => {
+  assert.match(barrel, /export \* from "\.\/AgentLoopSegment"/)
+})

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

@@ -0,0 +1,29 @@
+import type { CSSProperties, ReactNode } from "react"
+
+export type AgentLoopSegmentProps = {
+  /** 一段的零件，自上而下：思考行 → 执行摘要卡 / 工具行 / 授权卡 → 段内文本 */
+  children?: ReactNode
+  className?: string
+}
+
+/**
+ * AgentLoopSegment 一段 agent loop 的容器（照原型模板 template.dc.html:1170 的内容列节奏）。
+ *
+ * **只有节奏，没有面**——纯 `flex column` ＋ `gap:10px`，无边框、无底色、无内距。
+ * 段与段的边界靠这 10px 与「每段一张 ExecutionSummary」形成（裁决 15 的推荐口径：
+ * 不给段加容器，不加段号、不加左细线）。轮次之间的 24px 段距仍由轮自己的 padding-bottom 撑，
+ * 不在这一件里。
+ *
+ * 段的切分逻辑在业务侧（`AgentProcessChain`，apps/desktop/.../ChatCard.tsx:1184-1262：
+ * 以 thinking 为段首、相邻 tool 收成一组），本件只负责把切好的一片包起来——
+ * 接线在 A9-B3，本批只出件。
+ */
+export function AgentLoopSegment({ children, className = "" }: AgentLoopSegmentProps) {
+  return (
+    <div className={`ow-agent-loop-segment ${className}`} data-slot="agent-loop-segment" style={segmentStyle}>
+      {children}
+    </div>
+  )
+}
+
+const segmentStyle: CSSProperties = { display: "flex", flexDirection: "column", gap: 10 }

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

@@ -0,0 +1,162 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import { ArtifactCard } from "../ArtifactCard"
+import { MessageActions } from "../MessageActions"
+import { SubAgentThread } from "../SubAgentThread"
+import { Thinking } from "../Thinking"
+import { AgentTurn } from "./index"
+
+const meta = {
+  title: "Chat/AgentTurn",
+  component: AgentTurn,
+  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 AgentTurn>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+const actions = <MessageActions actions={["copy", "regenerate", "like", "dislike", "share"]} time="14:32" />
+
+/** 默认：实心点节点＋署名行（右侧读数 mono＋tabular-nums）＋正文。 */
+export const Default: Story = {
+  args: {
+    name: "Orbitwork",
+    meta: "6 步 · 2m40s",
+    children: "14 份来源里有 3 份的数据停在 2025 年 12 月，我按新口径重算了均值，结论段没变。",
+    actions,
+  },
+}
+
+/**
+ * 思考态接线点：Thinking（锁定叙事件）挂在正文之前，状态极只此一处。
+ *
+ * R4 · 2026-09-04：转录里的思考行一律走 inline 变体（整画布信标，原型模板
+ * template.dc.html:1196-1217），并把推理正文当 `children` 交给它——行尾长出 ChevRight，
+ * **缺省折叠**。这样一条思考行与下面的执行摘要卡、明细行是同一种「可展开的步骤」。
+ */
+export const WithThinking: Story = {
+  args: {
+    name: "Orbitwork",
+    thinking: (
+      <Thinking variant="inline" label="正在核对 14 份来源">
+        <p style={{ margin: "0 0 6px" }}>先按发布时间排一遍，2025H2 之前的单独挑出来。</p>
+        <p style={{ margin: "0 0 6px" }}>第 9 份用的是行业均值，其余 13 份用中位数，口径对不上。</p>
+        <p style={{ margin: 0 }}>先确认第 9 份的原始表还在，再决定重算还是标注。</p>
+      </Thinking>
+    ),
+    children: "先看第 9 份，它的行业均值口径和其余 13 份不一致。",
+  },
+}
+
+/** 执行记号接线点：ExecutionSummary / ArtifactCard 走同一记号，挂 execution 槽。 */
+export const WithExecution: Story = {
+  args: {
+    name: "Orbitwork",
+    meta: "4 步 · 1m12s",
+    execution: <ArtifactCard title="Q3 渠道复盘（终稿）" meta="report_q3_channels.docx · 4,180 字 · 08-28 14:32" />,
+    children: "报告已经更新，对照表附在文末。",
+    actions,
+  },
+}
+
+/** 并行子 agent：SubAgentThread（锁定件）同样走 execution 槽，主会话不另造形。 */
+export const WithSubAgents: Story = {
+  args: {
+    name: "Orbitwork",
+    meta: "3 个子任务",
+    execution: (
+      <SubAgentThread
+        processes={[
+          { name: "渠道数据抓取", status: "running", duration: "01:12" },
+          { name: "竞品定价比对", status: "queued" },
+          { name: "图表重绘", status: "done", duration: "0:38" },
+        ]}
+      />
+    ),
+    children: "三个子任务里两个已经有结果了，我先把已完成的部分写进报告。",
+  },
+}
+
+/** 流式输出：正文尾部呼吸尾点；reduced-motion 下静止。 */
+export const Streaming: Story = {
+  args: {
+    name: "Orbitwork",
+    children: "正在重算行业中位数，先把已经跑完的三段结论贴出来",
+    streaming: true,
+  },
+}
+
+/** 错误态：一句人话＋重试入口（重试链接由宿主提供）。 */
+export const WithError: Story = {
+  args: {
+    name: "Orbitwork",
+    error: "这一步没跑完，数据源连接被拒；换个凭据再试一次。",
+  },
+}
+
+/** 免责声明：只挂在最后一条上。 */
+export const WithDisclaimer: Story = {
+  args: {
+    name: "Orbitwork",
+    children: "结论段我压到了 180 字。",
+    actions,
+    disclaimer: "内容由模型生成，重要数字请自行复核。",
+  },
+}
+
+/** 无署名行、无节点：嵌在已有身份的容器里（旧 ChatMessage 兼容层走的就是这条）。 */
+export const Plain: Story = {
+  args: {
+    byline: false,
+    node: false,
+    children: "这条不挂节点也不带署名行，正文排版不变。",
+  },
+}
+
+/**
+ * 分享挑选（R2 · L3-2-10 补）：`selectable` 四态此前只在 `Screens/Share` 那一张整屏里
+ * 露过脸，件级零覆盖。行首 16 勾选框排在 12 脊柱列之外，正文右移 32、实心点挪到 33.5；
+ * 选中行不加底色。署名行的 mono 读数在右移后仍与正文左沿对齐。
+ */
+export const Selectable: Story = {
+  render: () => (
+    <div style={{ display: "flex", flexDirection: "column", gap: 4 }}>
+      <AgentTurn selectable checked={false} onToggle={() => {}} byline name="Orbitwork" meta="6 步 · 2m40s">
+        14 份来源里有 3 份的数据停在 2025 年 12 月，我按新口径重算了均值，结论段没变。
+      </AgentTurn>
+      <AgentTurn selectable checked onToggle={() => {}} byline name="Orbitwork" meta="3 步 · 41s">
+        图表已按「星野」配色重出，负值改走暖橙；两版并排放在工作台的「档案馆」页签里。
+      </AgentTurn>
+    </div>
+  ),
+}
+
+/**
+ * 挑选态下的长正文与动作行：右移 32 之后正文照常折行、`actions` 的 mono 时间不被挤出行外。
+ */
+export const SelectableLongText: Story = {
+  render: () => (
+    <div style={{ display: "flex", flexDirection: "column", gap: 4 }}>
+      <AgentTurn selectable checked onToggle={() => {}} byline name="Orbitwork" meta="6 步 · 2m40s" actions={actions}>
+        14 份来源里有 3 份的数据停在 2025 年 12
+        月，我按新口径重算了均值，结论段没变；变的是华东区的环比——旧口径把退货记在下单月，新口径记在退货月，所以 7 月从
+        +2.1% 变成 −0.4%。图表已经跟着重出，坐标轴刻度换成了 mono 字体并开了 tabular-nums，数字不再跳动。
+      </AgentTurn>
+    </div>
+  ),
+}

package/src/components/domain/chat/AgentTurn/AgentTurnSource.test.mjs

@@ -0,0 +1,98 @@
+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("../ChatMessage/index.tsx", import.meta.url), "utf8")
+const desktop = await readFile(new URL("../../desktop/DesktopChatTurnView/index.tsx", import.meta.url), "utf8")
+
+// A9-B2：点径 11 → 7（原型 template.dc.html:1158 的 left 1.5 / top 8 / 7×7），点心 y 仍是 11.5 一线。
+test("agent 轮节点＝实心点 7px，与用户轮 8px 空心环成形差（R1）", () => {
+  assert.match(source, /left-\[1\.5px\] top-\[8px\] w-\[7px\] h-\[7px\]/)
+  assert.match(source, /bg-\[var\(--ow-text\)\]/)
+  assert.doesNotMatch(source, /border-\[1\.5px\]/)
+  // 锁定件 TranscriptSpine 的 agent 点同口径（本体未改）
+  assert.match(spine, /const dotAgentStyle: CSSProperties = \{[\s\S]*?background: "var\(--ow-text\)"/)
+})
+
+// A9-B2：原型的 agent 轮不带署名行（身份由会话头承担），byline 缺省翻成 false。
+test("署名行缺省关闭，要署名的语境显式传 byline", () => {
+  assert.match(source, /byline = false,/)
+  assert.doesNotMatch(source, /byline = true,/)
+})
+
+test("署名行：名 500 字重，右侧读数 mono＋tabular-nums（§7）", () => {
+  assert.match(source, /data-ow-part="name"[\s\S]*?font-medium text-\[color:var\(--ow-text\)\]/)
+  assert.match(source, /data-ow-part="byline-meta"[\s\S]*?font-\[family-name:var\(--ow-font-mono\)\] tabular-nums/)
+})
+
+test("接线点齐备：execution（ExecutionSummary / SubAgentThread）与 thinking 各占一槽", () => {
+  assert.match(source, /execution\?: ReactNode/)
+  assert.match(source, /thinking\?: ReactNode/)
+  assert.match(source, /\{execution\}\s*\{thinking\}/)
+})
+
+test("§6 状态：流式呼吸尾点、错误一句人话、免责声明各自成槽", () => {
+  // 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/)
+  assert.match(source, /data-ow-part="error"[\s\S]*?text-\[color:var\(--ow-error\)\]/)
+  assert.match(source, /data-ow-part="disclaimer"[\s\S]*?text-\[color:var\(--ow-text-3\)\]/)
+})
+
+test("脊柱缩进 26px，操作行靠 group/turn 浮现", () => {
+  assert.match(source, /node && "pl-\[26px\]"/)
+  assert.match(source, /group\/turn/)
+})
+
+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("旧件降为配方：ChatMessage 转兼容层，DesktopChatAgentTurnView 改挂 AgentTurn", () => {
+  assert.match(legacy, /@deprecated/)
+  assert.match(legacy, /<AgentTurn node=\{false\} byline=\{false\}/)
+  assert.match(desktop, /import \{ AgentTurn \} from "\.\.\/\.\.\/chat\/AgentTurn"/)
+  assert.match(desktop, /<AgentTurn\s+className=\{`turn \$\{plain \? "turn--plain-agent" : "turn--agent"\}`\}/)
+  // A9-B2：纯文本轮原来 node=false，既没节点也不缩进 26px，脊线到它这儿就断；
+  // 原型每一轮 agent 都占同一条脊柱列，所以纯文本轮同样挂节点。
+  assert.doesNotMatch(desktop, /node=\{!plain\}/)
+})
+
+// ── 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-\[33\.5px\]"\)/) // 1.5 ＋ 32
+  assert.match(source, /data-selectable=\{selectable \? "on" : undefined\}/)
+})
+
+test("选中行不加底色：选中态只由勾选框承担（原型 1159 正文容器无 background）", () => {
+  assert.doesNotMatch(source, /--ow-current-bg/)
+  assert.doesNotMatch(source, /checked && "bg-/)
+})

package/src/components/domain/chat/AgentTurn/beaconContext.ts

@@ -0,0 +1,37 @@
+import { createContext, useContext, useEffect, useId } from "react"
+
+/** 轮内一条思考行上报的活动态：转不转、同段有没有工具在跑（卫星让极）。 */
+export type AgentTurnActivity = { spinning: boolean; toolRunning: boolean }
+
+export type AgentTurnBeaconContextValue = {
+  /** 这一轮的脊柱节点已经是信标（R5 定案 · 2026-09-04：缺省开） */
+  on: boolean
+  /** 轮内思考行把自己的活动态报上来；null ＝ 注销。AgentTurn 据此决定节点信标转不转、让不让极。 */
+  report: (id: string, activity: AgentTurnActivity | null) => void
+}
+
+const noop = () => undefined
+
+/**
+ * 「这一轮的脊柱节点已经是信标」（R5 · 2026-09-04，Terry：logo 与脊线点合体，缺省开）。
+ * AgentTurn 向子孙广播；转录里的 `Thinking` inline 据此不再自带信标——思考行只剩一句话＋chevron，
+ * 与正文同一条起线——并把自己的 spinning / toolRunning 报给轮，节点信标跟着转 / 让极。
+ * 宿主 ChatCard 里的 `<ChatThinking loading>` 因此零改动就能驱动节点信标。
+ */
+export const AgentTurnBeaconContext = createContext<AgentTurnBeaconContextValue>({ on: false, report: noop })
+
+export function useAgentTurnBeacon(): boolean {
+  return useContext(AgentTurnBeaconContext).on
+}
+
+/** 思考行调用：把活动态报给所在轮（不在带信标的轮里则什么都不做）。 */
+export function useReportAgentTurnActivity(activity: AgentTurnActivity): void {
+  const { on, report } = useContext(AgentTurnBeaconContext)
+  const id = useId()
+  const { spinning, toolRunning } = activity
+  useEffect(() => {
+    if (!on) return undefined
+    report(id, { spinning, toolRunning })
+    return () => report(id, null)
+  }, [on, report, id, spinning, toolRunning])
+}

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

@@ -0,0 +1,226 @@
+"use client"
+
+import { type ReactNode, useCallback, useMemo, useState } from "react"
+import { cn } from "../../../../lib/utils"
+import { BeaconSpinner } from "../../../composite/BeaconSpinner"
+import { Checkbox } from "../../../primitives/Checkbox"
+import { type AgentTurnActivity, AgentTurnBeaconContext } from "./beaconContext"
+
+/**
+ * AgentTurn — DS 2.0 助手轮（蓝图批次③ 合并件：ChatMessage /
+ * DesktopChatAgentTurnView / AgentBlockView 归口为同一配方）。
+ *
+ * 形态照锁定件 TranscriptSpine 的轮次语言（domain/chat/TranscriptSpine）：
+ * agent 轮＝**实心点节点**（7px `--ow-text` 实心，原型 template.dc.html:1158 的
+ * left 1.5 / top 8 坐标）＋**可选**署名行（agent 名 500 字重，右侧读数走
+ * mono＋tabular-nums），不设头像；正文左对齐、无气泡底，缩进 26px
+ * ＝脊线到正文的定距。原型的 agent 轮**不带署名行**（身份由会话头承担），
+ * 所以 `byline` 缺省为 false，要署名的语境显式传 `byline`。
+ *
+ * 分享挑选模式（`selectable`）：行首长出一枚 16px 勾选框，排在 12px 脊柱列**之外**，
+ * 正文整列右移 32px、长行重排（原型 template.dc.html:1142-1149）；选中行**不加底色**。
+ *
+ * 槽位自上而下：`execution`（ExecutionSummary / SubAgentThread 等执行记号接线点，
+ * 两者本体是锁定件，本轮只提供挂点）· `thinking`（Thinking 锁定件）· 正文
+ * （`children`）· `error` · `actions`（MessageActions，hover 浮现）· `disclaimer`。
+ * 状态（§6）：默认 / 流式（尾点呼吸，reduced-motion 停）/ 错误（人话一句＋重试槽）。
+ * 动效（§9）：仅呼吸与透明度，唯一缓动 ease-beacon。
+ * R3 中性件：助手轮骨架不含信标/荧黄——荧黄只出现在被挂进来的锁定叙事件里。
+ */
+export type AgentTurnProps = {
+  /** 正文槽 */
+  children?: ReactNode
+  /** 署名（agent 名）；`byline={false}` 关掉整行 */
+  name?: ReactNode
+  /** 署名行右侧读数：步数·耗时·模型名，mono＋tabular-nums */
+  meta?: ReactNode
+  /** 打开署名行（缺省关：原型的 agent 轮无署名，身份由会话头承担） */
+  byline?: boolean
+  /** 是否挂脊柱节点（实心点）。脱离 Transcript 单用时可关 */
+  node?: boolean
+  /** 滚动锚点 */
+  anchor?: string | number
+  /** 执行记号接线点：ExecutionSummary / SubAgentThread / ToolCall 等 */
+  execution?: ReactNode
+  /** 思考态接线点：Thinking（锁定件） */
+  thinking?: ReactNode
+  /** 错误一句话（人话，§6），可带重试链接 */
+  error?: ReactNode
+  /** 操作槽：MessageActions */
+  actions?: ReactNode
+  /** 免责声明，最后一条才显示（宿主决定） */
+  disclaimer?: ReactNode
+  /** 轮次尾部追加槽 */
+  trailing?: ReactNode
+  /** 流式输出中：正文尾部挂呼吸尾点 */
+  streaming?: boolean
+  /** 分享挑选模式：行首长出一枚勾选框（原型 template.dc.html:1142-1149） */
+  selectable?: boolean
+  /** 已选入分享 */
+  checked?: boolean
+  /** 勾选切换；入参是切换后的状态 */
+  onToggle?: (checked: boolean) => void
+  /** 勾选框读屏名，缺省「选入分享」（原型 1145 的 title） */
+  selectLabel?: string
+  /**
+   * R5 定案（2026-09-04，Terry：采用，28）：信标与脊线节点合体——节点就是 logo 的中心点，尾迹四点与
+   * 卫星绕着节点公转（跑）或停在 +24°（静）。**缺省开**（`node` 为真时）；轮内的 `Thinking` inline
+   * 不再自带信标（经 AgentTurnBeaconContext），思考行与正文同一条起线，并把自己的 spinning /
+   * toolRunning 报上来驱动节点信标。`false` 关掉；对象可强制 `spinning` / `toolRunning`
+   * （不给则取轮内思考行上报的值）/ `size`（画布边长，缺省 28）。
+   */
+  beacon?: boolean | { spinning?: boolean; toolRunning?: boolean; size?: number }
+  className?: string
+}
+
+/** 实心点：7px `--ow-text` 实心（left 1.5 / top 8），与用户轮的 8px 空心环成形差（R1） */
+const dotClass = [
+  "absolute left-[1.5px] top-[8px] w-[7px] h-[7px] shrink-0",
+  "[border-radius:var(--ow-radius-pill)] bg-[var(--ow-text)]",
+].join(" ")
+
+/** 行首勾选框（分享挑选模式）：与 UserTurn 同一套写法——16×16 primitives/Checkbox，
+ *  绝对定位在行首、top 3 使方框心落在节点心的 y=11 线上，不占脊柱那 12px 列。 */
+const SELECT_BOX_CLASS = "absolute left-0 top-[3px] shrink-0"
+
+export function AgentTurn({
+  children,
+  name = "Orbitwork",
+  meta,
+  byline = false,
+  node = true,
+  anchor,
+  execution,
+  thinking,
+  error,
+  actions,
+  disclaimer,
+  trailing,
+  streaming,
+  selectable = false,
+  checked = false,
+  onToggle,
+  selectLabel = "选入分享",
+  beacon = true,
+  className = "",
+}: AgentTurnProps) {
+  const beaconOn = node && Boolean(beacon)
+  const beaconOpts = typeof beacon === "object" ? beacon : {}
+  const beaconSize = beaconOpts.size ?? 28
+  // 轮内思考行上报的活动态（宿主 ChatCard 的 <ChatThinking loading> 走的就是这条路）
+  const [activity, setActivity] = useState<Record<string, AgentTurnActivity>>({})
+  const report = useCallback((id: string, next: AgentTurnActivity | null) => {
+    setActivity((prev) => {
+      if (next === null) {
+        if (!(id in prev)) return prev
+        const { [id]: _dropped, ...rest } = prev
+        return rest
+      }
+      const cur = prev[id]
+      if (cur && cur.spinning === next.spinning && cur.toolRunning === next.toolRunning) return prev
+      return { ...prev, [id]: next }
+    })
+  }, [])
+  const reported = Object.values(activity)
+  const beaconSpinning = beaconOpts.spinning ?? reported.some((a) => a.spinning)
+  const beaconToolRunning = beaconOpts.toolRunning ?? reported.some((a) => a.toolRunning)
+  const contextValue = useMemo(() => ({ on: beaconOn, report }), [beaconOn, report])
+  // 节点中心：脊柱列里 left 1.5 + 3.5 / top 8 + 3.5（分享模式整列右移 32）
+  const nodeCenterX = (selectable ? 33.5 : 1.5) + 3.5
+  const nodeCenterY = 8 + 3.5
+  return (
+    <AgentTurnBeaconContext.Provider value={contextValue}>
+      <div
+        data-slot="agent-turn"
+        data-ow-part="turn"
+        data-role="agent"
+        data-chat-anchor={anchor}
+        data-selectable={selectable ? "on" : undefined}
+        className={cn(
+          "group/turn relative flex flex-col items-start gap-2",
+          node && "pl-[26px]",
+          // 分享模式：整列右移 32px 给行首勾选框（16 框 ＋ 16 沟，对原型 1142 的 18＋14）
+          selectable && "pl-[58px]",
+          className,
+        )}
+      >
+        {selectable && (
+          <Checkbox className={SELECT_BOX_CLASS} checked={checked} onChange={onToggle} aria-label={selectLabel} />
+        )}
+        {node && beaconOn && (
+          /* 信标画在节点之下：中心点被 7px 实心节点盖住，静止时只露 text-3 的尾迹与卫星，
+           运转时尾迹 text、卫星 --ow-beacon（状态极）绕着节点转。指针事件不拦。 */
+          <span
+            data-ow-part="node-beacon"
+            aria-hidden="true"
+            className="absolute pointer-events-none"
+            style={{
+              left: nodeCenterX - beaconSize / 2,
+              top: nodeCenterY - beaconSize / 2,
+              width: beaconSize,
+              height: beaconSize,
+            }}
+          >
+            <BeaconSpinner
+              size={beaconSize}
+              spinning={beaconSpinning}
+              trail={beaconSpinning ? "var(--ow-text)" : "var(--ow-text-3)"}
+              /* 卫星色不在本件写死（R3 中性件）：让极时退 text-2，否则交给 BeaconSpinner 自己的状态极缺省 */
+              satellite={beaconToolRunning ? "var(--ow-text-2)" : undefined}
+              aria-label={beaconSpinning ? "正在思考" : "已思考"}
+            />
+          </span>
+        )}
+        {node && <span data-ow-part="dot" aria-hidden="true" className={cn(dotClass, selectable && "left-[33.5px]")} />}
+        {byline && (
+          <div data-ow-part="byline" className="flex w-full min-w-0 items-baseline gap-2">
+            <span data-ow-part="name" className="text-ow-fs-ui font-medium text-[color:var(--ow-text)]">
+              {name}
+            </span>
+            {meta != null && (
+              <span
+                data-ow-part="byline-meta"
+                className="font-[family-name:var(--ow-font-mono)] tabular-nums text-ow-fs-mark-md text-[color:var(--ow-text-2)]"
+              >
+                {meta}
+              </span>
+            )}
+          </div>
+        )}
+        {execution}
+        {thinking}
+        {children != null && (
+          <div
+            data-ow-part="body"
+            className="w-full min-w-0 text-ow-fs-ui leading-[1.7] text-[color:var(--ow-text)] [overflow-wrap:anywhere]"
+          >
+            {children}
+            {streaming && (
+              <span
+                data-ow-part="caret"
+                aria-hidden="true"
+                className={cn(
+                  "ml-[7px] inline-block h-[7px] w-[7px] align-[0.08em]",
+                  "[border-radius:var(--ow-radius-pill)] bg-[var(--ow-text-3)]",
+                  "motion-safe:animate-[ow-skeleton_var(--ow-dur-spin)_var(--ow-ease-beacon)_infinite]",
+                )}
+              />
+            )}
+          </div>
+        )}
+        {error && (
+          <div data-ow-part="error" className="text-ow-fs-ui leading-[1.6] text-[color:var(--ow-error)]">
+            {error}
+          </div>
+        )}
+        {actions}
+        {disclaimer && (
+          <div data-ow-part="disclaimer" className="text-ow-fs-mark-md leading-[1.5] text-[color:var(--ow-text-3)]">
+            {disclaimer}
+          </div>
+        )}
+        {trailing}
+      </div>
+    </AgentTurnBeaconContext.Provider>
+  )
+}