@orbit-work/ui 0.1.1 → 0.1.2

package/src/screens/Chat.stories.tsx

@@ -1,808 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import type { ReactNode } from "react"
-import { Shield } from "../components/composite/Icons"
-import { SubAgentPane } from "../components/domain/browser/SubAgentPane"
-import type { SubAgentPaneTurn } from "../components/domain/browser/SubAgentPane"
-import { TerminalPane } from "../components/domain/browser/TerminalPane"
-import { WebPreviewConsole } from "../components/domain/browser/WebPreviewConsole"
-import { WebPreviewNav } from "../components/domain/browser/WebPreviewNav"
-import type { WebPreviewTab } from "../components/domain/browser/WebPreviewNav"
-import { WebPreviewShell } from "../components/domain/browser/WebPreviewShell"
-import { AgentLoopSegment } from "../components/domain/chat/AgentLoopSegment"
-import { AgentTurn } from "../components/domain/chat/AgentTurn"
-import { ArtifactCard } from "../components/domain/chat/ArtifactCard"
-import { AuthorizationCard } from "../components/domain/chat/AuthorizationCard"
-import { Composer } from "../components/domain/chat/Composer"
-import { ComposerAuthorization } from "../components/domain/chat/Composer/parts/ComposerAuthorization"
-import { ContextUsage } from "../components/domain/chat/ContextUsage"
-import { ExecutionSummary } from "../components/domain/chat/ExecutionSummary"
-import { MessageActions } from "../components/domain/chat/MessageActions"
-import { PlanCard } from "../components/domain/chat/PlanCard"
-import { SubAgentThread } from "../components/domain/chat/SubAgentThread"
-import { Thinking } from "../components/domain/chat/Thinking"
-import { ToolCallRow } from "../components/domain/chat/ToolCallRow"
-import { Transcript } from "../components/domain/chat/Transcript"
-import { UserTurn } from "../components/domain/chat/UserTurn"
-import { DesktopChatHeaderView } from "../components/domain/desktop/DesktopChatHeaderView"
-import type { DesktopChatHeaderViewProps } from "../components/domain/desktop/DesktopChatHeaderView"
-import { DesktopChatAgentTurnView, DesktopChatUserTurnView } from "../components/domain/desktop/DesktopChatTurnView"
-import { DesktopComposerModelButton } from "../components/domain/desktop/DesktopComposer"
-import { DesktopSidebarView } from "../components/domain/desktop/DesktopSidebarView"
-import { DesktopWorkbenchShell } from "../components/domain/desktop/DesktopWorkbenchShell"
-import { SidePanelEmpty } from "../components/domain/desktop/SidePanelEmpty"
-import { WorkbenchSidePanel } from "../components/domain/desktop/WorkbenchSidePanel"
-import { FileBrowser } from "../components/domain/files/FileBrowser"
-import { Button } from "../components/primitives"
-import type { FileTreeNode } from "../types/file-tree"
-import { DesktopScreenFrame, SCREEN_PARAMETERS, noop, screenSidebarProps } from "./_screen"
-
-/**
- * Chat 整屏（蓝图 06 · screens）——**三极同屏配额的组合证明**。
- *
- * 叙事链一屏到底：`DesktopSidebarView`（位置极）→ `Transcript` 脊柱（`spine`
- * 贯穿，用户轮空心环 / agent 轮实心点的形差 R1）→ `Thinking` → `PlanCard`
- * → `ArtifactCard` → `ContextUsage` → `Composer`（状态极位置固定）。
- * 全部为 P1/P3-P5 已落地件，本屏只组合、不新造。
- *
- * ## 荧黄逐处旁注（每半屏每极 ≤1）
- * 左半屏＝侧栏（260px），右半屏＝`.owcenter` 会话面。逐 story 的配额见各自说明。
- * 共同口径：
- * - **位置极**（`--ow-accent-dot`）：只属侧栏当前项。本屏在会话视图，nav 无 current，
- *   所以 `.ownavitem.active svg .dot` 不点亮；位置极由 `.owthread.active` 的
- *   `--ow-current-bg` 填充块＋500 字重承担（SidebarCurrent 主编码），**左半屏零荧黄**。
- * - 侧栏「留存曲线重算」行尾的运行点是 `--ow-progress-fill`＋mono `3/7` 读数——
- *   §4 让形规则：位置极已占图标信标点，状态极在同一列表内改用行尾点，永不荧黄。
- * - **状态极**（`--ow-beacon`）与**行动极**（暗档 `--ow-btn-primary-bg` = `--ow-yellow`）
- *   各限一处，落点见下。
- */
-const meta = {
-  title: "Screens/Chat",
-  parameters: SCREEN_PARAMETERS,
-} satisfies Meta
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const AUTH_OPTIONS = [
-  { value: "ask", label: "每次询问", description: "改动前都要你点头", icon: <Shield /> },
-  { value: "auto", label: "自动执行", description: "只在当前项目内生效", icon: <Shield /> },
-]
-
-function ChatSidebar() {
-  return <DesktopSidebarView {...screenSidebarProps()} />
-}
-
-function transcriptFrame(node: ReactNode) {
-  return (
-    <div
-      style={{
-        flex: "1 1 auto",
-        minHeight: 0,
-        display: "flex",
-        flexDirection: "column",
-        padding: "0 24px 12px",
-      }}
-    >
-      {node}
-    </div>
-  )
-}
-
-/* ── A9-B4（原型 1096–1145）· 会话头 ＋ 转录列 ───────────────────────────────
-   会话头是 `.owcenter` 里通栏的第一行（48 高、底 1px 线、标题 16/500 左对齐、
-   右端三枚 28 钮），转录列坐在它下面吃掉剩余高。以前各屏把标题塞进 `Transcript`
-   的 header 槽（600/13 ＋ mono 读数），那是 B4 之前的会话头，现在统一走
-   `DesktopChatHeaderView`——运行读数也从流内搬到了标题右侧（裸读数，无彩点）。 */
-function chatColumn(head: DesktopChatHeaderViewProps, transcript: ReactNode) {
-  return (
-    <div style={{ height: "100%", minHeight: 0, display: "flex", flexDirection: "column" }}>
-      <DesktopChatHeaderView onShare={noop} onOpenContext={noop} onOpenPanel={noop} {...head} />
-      {transcriptFrame(transcript)}
-    </div>
-  )
-}
-
-const PLAN_DONE = [
-  { label: "拉取 14 份来源并去重", state: "done" as const },
-  { label: "核对行业均值口径", state: "done" as const },
-  { label: "重算中位数并回填", state: "done" as const },
-  { label: "生成对照表", state: "done" as const },
-]
-
-/**
- * **三极同屏**（本屏的主证明）：位置极在左、状态极与行动极在右，各一处，形不同源。
- *
- * 荧黄逐处旁注：
- * 1. 左半屏：**0 处**。位置极走 `--ow-current-bg` 填充块（见 meta 说明）。
- * 2. 右半屏 · `ArtifactCard` 递减短迹的**末颗** = `--ow-beacon` → **状态极 ×1**
- *    （「正在亮着的那件事」＝产物正在生成）。R1 双编码：卡脚 mono 元信息里同时写着
- *    「生成中」，颜色只是第二编码。
- * 3. 右半屏 · `Composer` 发送钮 `Button variant="primary"` → **行动极 ×1**
- *    （暗档 `--ow-btn-primary-bg` = `--ow-yellow`；浅档为墨色 navy，不亮）。
- *
- * 不占极的三处（刻意留作对照）：
- * - `Thinking` 传 `spinning={false}`——转完当前圈停在 +24°，整体落为 text-3 单色，不占状态极；
- * - `PlanCard` 四步全 done、无 running 迹点，进度只由 n/N 与迹点行承载（A9-B3 摘掉完成度弧）；
- * - `ContextUsage` 值 0.48 在 warning 档（0.6）以下，取 `--ow-text-3`；读数 mono＋tabular-nums。
- *
- * R4 · 2026-09-04：思考行带推理正文（缺省折叠，行尾 14px ChevRight）。折叠记号是
- * `--ow-text-3` 的中性件，不占任何一极——本屏荧黄仍是「产物卡末颗 ×1 ＋ 发送钮 ×1」。
- */
-export const ThreePoles: Story = {
-  render: () => (
-    <DesktopScreenFrame>
-      <DesktopWorkbenchShell
-        contained
-        view="chat"
-        sidebar={<ChatSidebar />}
-        chat={chatColumn(
-          { title: "Q3 渠道复盘" },
-          <Transcript
-            className="min-h-0 flex-1"
-            maxWidth={752}
-            sender={
-              <Composer
-                defaultValue="对照表出来后把结论压到三条"
-                onSend={noop}
-                authorization={<ComposerAuthorization value="ask" onChange={noop} options={AUTH_OPTIONS} />}
-                contextUsage={<ContextUsage value={0.48} showReadout readout="48%" />}
-                toolbarEnd={<DesktopComposerModelButton label="Sonnet 4.5 · 标准" onClick={noop} />}
-              />
-            }
-          >
-            <UserTurn text="帮我核对 Q3 渠道复盘引用的 14 份来源，重点看数据有没有过期。" time="14:28" />
-            <AgentTurn
-              name="Orbitwork"
-              meta="6 步 · 2m40s"
-              thinking={
-                // R4 · 2026-09-04：思考行带推理正文＝可折叠（缺省折叠，行尾 ChevRight）。
-                // 静止态整组落 text-3 单色，仍不占状态极——极还在右下的产物卡末颗上。
-                <Thinking variant="inline" spinning={false} label="核对完 14 份来源">
-                  <p style={{ margin: "0 0 6px" }}>14 份里 3 份的行业均值停在 2025H2，先把它们挑出来单列。</p>
-                  <p style={{ margin: 0 }}>第 9 份用的是均值口径，其余 13 份是中位数，得换算过再比。</p>
-                </Thinking>
-              }
-            >
-              <p>14 份里有 3 份的行业均值停在 2025H2，我把口径换成中位数重跑了一遍，差异集中在中小客户那一段。</p>
-              <PlanCard goal="核对并重算 Q3 渠道口径" steps={PLAN_DONE} />
-            </AgentTurn>
-            <UserTurn text="第 9 份的口径换成中位数以后，把结论也一起更新到终稿里。" time="14:31" />
-            <AgentTurn
-              name="Orbitwork"
-              meta="3 步 · 58s"
-              /* R5：这一轮还在跑（没有思考行可上报）——节点信标公转；子任务线程里已有 running 点占状态极，卫星让极 */
-              beacon={{ spinning: true, toolRunning: true }}
-              execution={
-                <SubAgentThread
-                  processes={[
-                    { name: "median_by_segment", status: "done", duration: "38s" },
-                    { name: "render_report", status: "running", duration: "12s" },
-                  ]}
-                />
-              }
-              actions={<MessageActions actions={["copy", "regenerate", "branch", "quote"]} visible time="14:32" />}
-              disclaimer="内容由 AI 生成，请仔细核实回答内容。"
-            >
-              <p>结论已经改完，终稿正在导出。</p>
-              <ArtifactCard title="Q3 渠道复盘（终稿）" meta="report_q3_channels.docx · 4,180 字 · 生成中" generating />
-            </AgentTurn>
-          </Transcript>,
-        )}
-        skills={null}
-        sites={null}
-        scheduledTasks={null}
-        workspace={null}
-      />
-    </DesktopScreenFrame>
-  ),
-}
-
-/**
- * Live 屏第一段（已跑完）的执行摘要明细（原型 1232–1246：mono 11 三段 ＋ pre-wrap 输出）。
- * R4 · 2026-09-04：第一条再展一层「输入 / 输出」（`ExecutionDetail` 的眉标 ＋ 井），
- * 行尾 12px chevron 与头行 14px 分档——转录里「还有一层」只有这一种说法。
- * 第二条只有一行回显（`out`），没有明细，所以不出 chevron、不可点：有多少料出多少形。
- */
-const LIVE_DONE_TOOLS = [
-  {
-    name: "read_sheet",
-    args: "数据源/行业面板_2026H1.xlsx",
-    elapsed: "0.6s",
-    input: <pre style={{ margin: 0 }}>{`{ "file": "数据源/行业面板_2026H1.xlsx",\n  "sheet": "渠道明细" }`}</pre>,
-    output: (
-      <pre style={{ margin: 0 }}>{`渠道        行业均值   口径年   状态
-直营        12.4%      2026H1   最新
-分销        9.8%       2025H2   过期
-KA          15.1%      2025H2   过期
-电商        11.2%      2025H2   过期
-— 14 行 · 3 列过期`}</pre>
-    ),
-  },
-  { name: "grep", args: '"行业均值" 报告/Q3渠道复盘.md', elapsed: "0.2s", out: "9 处引用，第 9 份口径与其余不一致" },
-]
-
-/**
- * **运行中**（原型 template.dc.html:1094–1310 的会话屏在跑的那一刻）：
- * 会话头（`DesktopChatHeaderView`）标题 16/500 左对齐 ＋ 右侧裸读数「运行中 · 58s」
- * （6px `--ow-progress-fill` 无彩点 ＋ mono）＋ 三枚 28 钮；转录列 752；用户轮气泡
- * （`--ow-bubble-user` ＋ 1px 边 ＋ radius 12 ＋ 最宽 78%）右侧挂 mono 时间；agent 轮
- * 按 `AgentLoopSegment` 切段（段间只靠 10px 节奏）：第一段已跑完＝思考行静止 ＋
- * `ExecutionSummary`（递减短迹 6/5/4/3 ＋ mono「6 步 · 2m40s」）＋ 正文（计划卡与产物卡
- * 见「三极同屏」，这一屏要把第二段的授权卡留在 800 高的首屏里）；
- * 第二段正在跑＝思考行让极 ＋ 两条 `ToolCallRow`（done / running）＋
- * `AuthorizationCard`（warning tint 三件套，行内停驻，只「允许一次 / 拒绝」两钮；
- * 待授权那条 pending 工具行见 `chat-agentloopsegment--awaiting-authorization`）。
- *
- * 荧黄逐处旁注：
- * 1. 左半屏：**0 处**（同上）。
- * 2. 右半屏 · 第二段 `ToolCallRow` **running 那条的 6px 点** = `--ow-beacon` → **状态极 ×1**。
- *    同段 `Thinking` 传 `toolRunning`，卫星退成 `--ow-text-2` 让极（§4 每屏限一处；
- *    原型 logic:3850 的记账口径）。R1 双编码：行尾 mono「12s」同时在读。
- * 3. 右半屏 · 行动极：`AuthorizationCard` 的「允许一次」是 primary（暗档 `--ow-yellow`）→
- *    **行动极 ×1**。`Composer` 传 `generating`，发送钮变停止钮（非 primary），
- *    工具条首位的「生成中」点取 `--ow-progress-fill`——同屏行动极仍只一处。
- * 4. 不占极：会话头读数点无彩；`ExecutionSummary` 短迹四颗全 text-3；第一段思考行静止
- *    落 text-3；done 那条工具行的点取 `--ow-success`（语义色，不是极）。
- *
- * R4 · 2026-09-04（Terry：一种「步骤」只留一种说法）：第一段的思考行带推理正文，
- * 摘要卡收起（这一屏要把第二段的授权卡留在 800 高的首屏里），展开后第一条明细
- * `read_sheet` 还能再展「输入 / 输出」——三层折叠同一枚 chevron、同一套 text-3 色阶，
- * 不新增任何一处荧黄（记账仍是上面那三条）。
- */
-export const Live: Story = {
-  render: () => (
-    <DesktopScreenFrame>
-      <DesktopWorkbenchShell
-        contained
-        view="chat"
-        sidebar={<ChatSidebar />}
-        chat={chatColumn(
-          { title: "Q3 渠道复盘", runState: "running", elapsedSeconds: 58 },
-          <Transcript
-            className="min-h-0 flex-1"
-            maxWidth={752}
-            sender={
-              <Composer
-                generating
-                placeholder="今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器"
-                onStop={noop}
-                authorization={<ComposerAuthorization value="auto" onChange={noop} options={AUTH_OPTIONS} />}
-                contextUsage={<ContextUsage value={0.71} showReadout readout="71%" />}
-                toolbarEnd={<DesktopComposerModelButton label="Sonnet 4.5 · 标准" onClick={noop} />}
-              />
-            }
-          >
-            <UserTurn text="帮我核对 Q3 渠道复盘引用的 14 份来源，重点看数据有没有过期。" time="14:28" />
-            <AgentTurn name="Orbitwork" meta="6 步 · 2m40s">
-              <AgentLoopSegment>
-                <Thinking variant="inline" spinning={false} label="先把 14 份来源按发布时间排一遍，过期的单独挑出来。">
-                  {/* R4：思考行的推理正文——缺省折叠，行尾 ChevRight；与下面摘要卡的
-                      头行 chevron、明细行 chevron 是同一枚记号（转录里只有一种「步骤」语言）。
-                      静止态整组 text-3 单色，不占状态极。 */}
-                  <p style={{ margin: "0 0 6px" }}>先按发布时间排：14 份里 3 份停在 2025H2，标出来单列。</p>
-                  <p style={{ margin: "0 0 6px" }}>第 9 份的行业均值口径与其余 13 份不一致，换算前不能直接比。</p>
-                  <p style={{ margin: 0 }}>先确认原始表还在，再决定重算还是只标注。</p>
-                </Thinking>
-                <ExecutionSummary label="核对来源与口径" steps={6} duration="2m40s" tools={LIVE_DONE_TOOLS} />
-                <p>14 份里有 3 份的行业均值停在 2025H2，第 9 份的口径与其余 13 份不一致，已单独标出。</p>
-              </AgentLoopSegment>
-            </AgentTurn>
-            <UserTurn text="第 9 份换成中位数再跑一遍，结果直接写进终稿。" time="14:31" />
-            <AgentTurn
-              name="Orbitwork"
-              disclaimer="内容由 AI 生成，请仔细核实回答内容。"
-              /* R5：思考行传了 toolRunning 且缺省 spinning，轮内自动上报——节点信标公转并让极，不必再传 beacon */
-            >
-              <AgentLoopSegment>
-                <Thinking variant="inline" toolRunning label="按中位数重算第 9 份，算完把结果写回终稿。" />
-                <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-                  <ToolCallRow name="read_sheet" args="数据源/行业面板_2026H1.xlsx" state="done" elapsed="0.6s" />
-                  <ToolCallRow name="run_python" args="median_by_segment.py" statusText="12s" />
-                </div>
-                <AuthorizationCard source="Filesystem 连接器" scope="写入 报告/Q3渠道复盘_终稿.docx，本次会话有效。" />
-              </AgentLoopSegment>
-            </AgentTurn>
-          </Transcript>,
-        )}
-        skills={null}
-        sites={null}
-        scheduledTasks={null}
-        workspace={null}
-      />
-    </DesktopScreenFrame>
-  ),
-}
-
-/* ── A8-B1（裁决 9 · 原型模板 2246–2250）· 会话侧开栏的整屏验收面 ─────────────────
-   两档宽只有 38% / 68%（不上拖拽），百分比取内容区那一行的宽（窗口 1440 减侧栏 240），
-   所以 38% ≈ 455px、68% ≈ 815px，会话列被**内联挤压**到 743 / 383——不是覆盖在会话上。
-   会话列另有 360 最小宽保底（.desktop-workbench-row[data-side-panel="on"] > .owcenter）。
-   A8-B2/B3 起栏内挂的是**两档变体本人**：页签条 `density="panel"`（36 条 / 26 胶囊 /
-   选中换面色）＋ 地址条 `compact`（34 条 / 无前进钮 / 26 pill / 锁形前缀 / 24 查找钮）。
-   B4 起：网页页签那块占位地是 --ow-mat（原型 2303），空栏另有「三行快捷动作」一屏
-   （见下面的「右栏 空栏」）。四类页签体（B5/B6）仍是后面的活，这里给网页页签一块占位体。 */
-const PANEL_TABS: WebPreviewTab[] = [
-  { id: "tab-site", kind: "web", title: "orbitwork.pages.dev", url: "https://orbitwork.pages.dev" },
-  { id: "tab-files", kind: "files", title: "文件" },
-]
-
-/* ── A8-B6（原型模板 2340–2342 / 2344–2368）· 后两类页签体 ────────────────────────
-   原型的种子页签只有「网页 ＋ 文件」两个（3302–3305），终端与子任务是**开出来的**
-   （⌘B / 从会话里点进子任务），所以这两屏各自在种子后追加一个页签，
-   不动前两屏的页签条——那两屏的基线是 B1–B5 已验收过的。 */
-const PANEL_EXTRA_TABS = {
-  terminal: { id: "tab-term", kind: "terminal", title: "终端" },
-  subagent: { id: "tab-sub", kind: "subagent", title: "核对组件库导出" },
-} as const satisfies Record<"terminal" | "subagent", WebPreviewTab>
-
-/** 原型 3277–3287 的终端输出。 */
-const PANEL_TERM_TEXT = [
-  "$ pnpm --filter @orbitwork/desktop dev",
-  "> vite v5.4.2  ready in 412 ms",
-  "",
-  "  ➜  Local:   http://localhost:5173/",
-  "  ➜  Electron: 主进程已启动 (pid 48213)",
-  "",
-  "[preload] 窄接口 IPC 已注册：fs / net / pty / webview",
-  "[renderer] orbitwork-ui 0.1.0 · 382 components",
-  "$ ",
-].join("\n")
-
-/** 原型 3288–3291 的子任务两轮。 */
-const PANEL_SUB_TURNS: SubAgentPaneTurn[] = [
-  { id: "u1", role: "user", text: "把这三家竞品的文档站信息架构整理成一张对照表。" },
-  {
-    id: "a1",
-    role: "agent",
-    text: "已抓取三家文档站的顶层导航，正在按「入门 / 组件 / 设计规范 / 更新日志」四类归并；组件页的层级差异最大，稍后单独列一节。",
-  },
-]
-
-/* ── A8 openQuestion 6 的裁决落地 · 控制台只在 68% 档出，且默认收起 ────────────────
-   原型的侧开栏里**没有**控制台（2273–2311 只有地址条 ＋ 内容体）；我们这边它一直是
-   `Browser.stories.tsx` 里 maxHeight 180 的常驻 footer。38% 档栏宽 455，再切一块 180
-   的日志抽屉，网页只剩不到一半——所以这里按已定的推荐：**38% 档一行不挂、68% 档挂一条
-   默认收起的折叠头**（`WebPreviewConsole` 自带折叠，收起态只占 32 高的一条头，
-   展开才铺日志区）。它坐 `WebPreviewShell` 的 `footer` 槽，收起时不进常暗域。 */
-const PANEL_CONSOLE_LOGS = [
-  { level: "log" as const, message: "页面就绪，用时 412ms", timestamp: new Date("2026-09-02T14:32:01") },
-  {
-    level: "warn" as const,
-    message: "图片缺少 width/height，布局会抖",
-    source: "hero.tsx:42",
-    timestamp: new Date("2026-09-02T14:32:03"),
-  },
-]
-
-/** 网页页签的 webview 占位体（真机是 webview；B4 的品牌信标空态另算）。 */
-function sidePanelBody() {
-  return (
-    <div
-      style={{
-        flex: 1,
-        minHeight: 0,
-        display: "grid",
-        placeItems: "center",
-        padding: 24,
-        textAlign: "center",
-        background: "var(--ow-mat)",
-        color: "var(--ow-text-2)",
-        fontSize: "var(--ow-fs-ui)",
-      }}
-    >
-      网页页签内容（webview 落位）
-    </div>
-  )
-}
-
-/* ── A8-B5（原型模板 2313–2338）· 右栏第二类页签「文件」的**消费面** ────────────────
-   树左 44% / 预览右、面包屑压在预览列头、正文坐 --ow-code-bg 这套形制在 A11-B3 已经
-   进了 `FileBrowser` 本体（`layout="tree-left"` 现在就是默认档，面包屑固定落在预览列头
-   ＝原型的 crumbPlacement="preview"），所以这一批**不再动组件本体**，只把它挂进侧开栏、
-   按原型 2314–2317 的顶行摆「过滤框 ＋ 打开方式」两件，并证明它在 38% / 68% 两档宽里
-   都不塌（树列 44% 随栏宽走、预览列 min-width:0 收字不横滚）。
-
-   唯一的消费方覆盖是 `bg-transparent`：`FileBrowser` 根自带 `bg-ow-bg`（独占内容区那一屏
-   的地），进了侧开栏就该让位给 `--ow-surface`（原型 2250 的 aside 面色，文件页签自己不铺地）。 */
-const PANEL_FILE_TREE: FileTreeNode[] = [
-  {
-    key: "/landing/src",
-    title: "src",
-    isLeaf: false,
-    children: [
-      {
-        key: "/landing/src/components",
-        title: "components",
-        isLeaf: false,
-        children: [
-          { key: "/landing/src/components/hero.tsx", title: "hero.tsx", isLeaf: true },
-          { key: "/landing/src/components/nav.tsx", title: "nav.tsx", isLeaf: true },
-        ],
-      },
-      { key: "/landing/src/styles", title: "styles", isLeaf: false },
-      { key: "/landing/src/index.tsx", title: "index.tsx", isLeaf: true },
-    ],
-  },
-  {
-    key: "/landing/public",
-    title: "public",
-    isLeaf: false,
-    children: [{ key: "/landing/public/og.png", title: "og.png", isLeaf: true }],
-  },
-  { key: "/landing/package.json", title: "package.json", isLeaf: true },
-  { key: "/landing/README.md", title: "README.md", isLeaf: true },
-]
-
-const PANEL_FILE_TEXT = `export function Hero() {
-  return (
-    <section className="hero">
-      <h1>把手上的活交给它</h1>
-      <p>说清楚要什么，剩下的它自己跑完。</p>
-    </section>
-  )
-}
-`
-
-/** 文件页签体：`FileBrowser` 直接当页签体用（它自带顶行 ＋ 两列，不再套壳）。 */
-function sidePanelFilesBody() {
-  return (
-    <FileBrowser
-      className="bg-transparent"
-      breadcrumb={[
-        { key: "/landing", label: "landing" },
-        { key: "/landing/src", label: "src" },
-        { key: "/landing/src/components", label: "components" },
-        { key: "/landing/src/components/hero.tsx", label: "hero.tsx" },
-      ]}
-      onBreadcrumbClick={noop}
-      actions={
-        // 原型 2316：顶行右端就这一枚「打开方式」（宿主挂的是它的下拉）。
-        <Button variant="secondary" size="sm">
-          打开方式
-        </Button>
-      }
-      treeData={PANEL_FILE_TREE}
-      expandedKeys={["/landing/src", "/landing/src/components"]}
-      onExpand={noop}
-      selectedKey="/landing/src/components/hero.tsx"
-      onSelectFile={noop}
-      filterText=""
-      onFilterChange={noop}
-      onToggleTree={noop}
-      preview={
-        /* 原型 2335：预览正文 mono ＋ fs-code ＋ lh-code，内距 12；井底（--ow-code-bg）
-           由 FileBrowser 的预览槽自己铺，这里只出文字。 */
-        <pre
-          style={{
-            margin: 0,
-            padding: 12,
-            overflow: "auto",
-            fontFamily: "var(--ow-font-mono)",
-            fontSize: "var(--ow-fs-code)",
-            lineHeight: "var(--ow-lh-code)",
-            color: "var(--ow-text)",
-            // R2 · L2-3-5：代码不软折行——长标识符不从中间劈开，横滚交给 overflow:auto
-            whiteSpace: "pre",
-          }}
-        >
-          {PANEL_FILE_TEXT}
-        </pre>
-      }
-    />
-  )
-}
-
-function sidePanelScreen(maximized: boolean, tab: "web" | "files" | "terminal" | "subagent" = "web") {
-  const extra = tab === "terminal" || tab === "subagent" ? PANEL_EXTRA_TABS[tab] : null
-  const tabs: WebPreviewTab[] = extra ? [...PANEL_TABS, extra] : PANEL_TABS
-  const activeTabId = extra ? extra.id : tab === "files" ? "tab-files" : "tab-site"
-
-  return (
-    <DesktopScreenFrame>
-      <DesktopWorkbenchShell
-        contained
-        view="chat"
-        sidebar={<ChatSidebar />}
-        sidePanel={
-          <WorkbenchSidePanel maximized={maximized}>
-            <WebPreviewNav
-              density="panel"
-              tabs={tabs}
-              activeTabId={activeTabId}
-              isWide={maximized}
-              onSwitchTab={noop}
-              onCloseTab={noop}
-              onCloseOtherTabs={noop}
-              onAddBrowser={noop}
-              onAddTerminal={noop}
-              onAddFiles={noop}
-              onToggleWide={noop}
-              onToggleCollapsed={noop}
-            />
-            {tab === "files" ? (
-              sidePanelFilesBody()
-            ) : tab === "terminal" ? (
-              /* 原型 2341：终端整块常暗，页签体不再套壳（没有地址条）。 */
-              <TerminalPane text={PANEL_TERM_TEXT} />
-            ) : tab === "subagent" ? (
-              <SubAgentPane title="核对组件库导出" status="梳理思路 · 12s" turns={PANEL_SUB_TURNS} />
-            ) : (
-              <WebPreviewShell
-                compact
-                chrome={false}
-                url="https://orbitwork.pages.dev"
-                canGoBack
-                onFind={noop}
-                className="min-h-0 flex-1 bg-transparent"
-                footer={
-                  maximized ? (
-                    <WebPreviewConsole logs={PANEL_CONSOLE_LOGS} defaultOpen={false} maxHeight={180} onClear={noop} />
-                  ) : undefined
-                }
-              >
-                {sidePanelBody()}
-              </WebPreviewShell>
-            )}
-          </WorkbenchSidePanel>
-        }
-        chat={chatColumn(
-          // 右栏开着 → 会话头那颗「打开右栏 ⌘T」开关按下（R2 · L3-2-6）
-          { title: "落地页改版", panelOpen: true },
-          <Transcript
-            className="min-h-0 flex-1"
-            maxWidth={752}
-            sender={
-              <Composer
-                defaultValue="首屏那句标题再短一点"
-                onSend={noop}
-                contextUsage={<ContextUsage value={0.32} showReadout readout="32%" />}
-                toolbarEnd={<DesktopComposerModelButton label="Sonnet 4.5 · 标准" onClick={noop} />}
-              />
-            }
-          >
-            <UserTurn text="把落地页首屏的标题和副标题改短，然后开着预览让我看。" time="11:18" />
-            <AgentTurn
-              name="Orbitwork"
-              meta="4 步 · 1m08s"
-              thinking={<Thinking variant="inline" spinning={false} label="改完首屏文案" />}
-              disclaimer="内容由 AI 生成，请仔细核实回答内容。"
-            >
-              <p>标题压到 12 个字、副标题压到一行，预览已经开在右边了。</p>
-              <ArtifactCard
-                title="落地页首屏（草稿）"
-                meta="hero.tsx · 改 2 处 · 09-02 11:20"
-                /* R3（Terry 意见 4）：完成态产物卡可点开＋「打开方式」下拉（候选由宿主查系统列出） */
-                onOpen={noop}
-                onOpenWith={noop}
-                openWithApps={[
-                  { id: "vscode", label: "Visual Studio Code", hint: "默认" },
-                  { id: "cursor", label: "Cursor" },
-                  { id: "finder", label: "在访达中显示" },
-                ]}
-              />
-            </AgentTurn>
-          </Transcript>,
-        )}
-        skills={null}
-        sites={null}
-        scheduledTasks={null}
-        workspace={null}
-      />
-    </DesktopScreenFrame>
-  )
-}
-
-/**
- * **右栏 38%（常态档）**：会话列 743px、侧开栏 455px。
- *
- * 荧黄逐处旁注：左半屏 0 处；右半屏 **行动极 ×1**（`Composer` 发送钮 primary），
- * 状态极 0（`ArtifactCard` 不传 `generating`）；侧开栏本身是 R3 中性件，零荧黄。
- */
-export const SidePanel38: Story = {
-  name: "右栏 38%",
-  render: () => sidePanelScreen(false),
-}
-
-/**
- * **右栏 68%（最大化档）**：侧开栏 815px，会话列被挤到 383px——仍在 360 保底之上，
- * 且是内联挤压（会话照常滚、composer 照常在），不是 `position:absolute` 盖在会话上。
- *
- * **A8-B6 新增：栏底那条控制台**（openQuestion 6 的已定推荐）。原型的侧开栏里没有控制台，
- * 我们这边它原是浏览器整屏的常驻 footer；折中口径＝**只在 68% 档挂、且默认收起**：
- * 收起态只占栏底一条 32 高的折叠头（左侧计数 mono ＋ 警告数 ANSI 琥珀，两重编码），
- * 展开才铺 180 高的常暗日志区。38% 档（上一屏）一行都不挂——455 宽再切 180 给日志，
- * 网页就只剩不到一半。
- *
- * 荧黄逐处旁注：同上，左 0、右行动极 ×1；控制台折叠头是 R3 中性件（警告色走 ANSI 琥珀，
- * 刻意远离荧黄），0 处。
- */
-export const SidePanel68: Story = {
-  name: "右栏 68%",
-  render: () => sidePanelScreen(true),
-}
-
-/**
- * **右栏 文件页签 38%**（原型 2313–2338）：页签条切到「文件」，栏体换成 `FileBrowser`——
- * 顶行 40 高（过滤框 ＋「打开方式」）、树列占栏宽 44%（38% 档下约 200px）＋ 右侧 1px
- * `--ow-border` 分隔、预览列头是 mono 面包屑、正文坐 `--ow-code-bg` 的井。
- *
- * 这一档是**消费面**：形制在 A11-B3 已进 `FileBrowser` 本体（`layout="tree-left"` 即默认、
- * 面包屑固定在预览列头），本屏只证明它挂进侧开栏后两档宽都成立，不改组件。
- *
- * 荧黄逐处旁注：左半屏 0 处；右半屏 **行动极 ×1**（`Composer` 发送钮 primary）；
- * 侧开栏与文件页签体都是 R3 中性件，零荧黄、零信标。
- */
-export const SidePanelFiles38: Story = {
-  name: "右栏 文件页签 38%",
-  render: () => sidePanelScreen(false, "files"),
-}
-
-/**
- * **右栏 文件页签 68%**（最大化档）：栏宽 815px，树列随之长到约 359px、预览列 455px——
- * 44% 是**比例**不是定宽，所以两档下树与预览的配比不变，长文件名在窄档收省略号、
- * 宽档展开，预览列 `min-width:0` 保证正文永不把栏撑出横滚。
- *
- * 荧黄逐处旁注：同上，左 0、右行动极 ×1。
- */
-export const SidePanelFiles68: Story = {
-  name: "右栏 文件页签 68%",
-  render: () => sidePanelScreen(true, "files"),
-}
-
-/* ── A8-B6（原型模板 2340–2342 / 2344–2368）· 右栏后两类页签的验收面 ────────────────
-   这两类页签没有地址条也没有顶行：开出来就是整格一块画面，页签条以下全归它。 */
-
-/**
- * **右栏 终端页签 38%**（原型 2340–2342）：整格是常暗域——浅主题下**也是暗的**
- * （`data-theme="dark"` ＋ `--ow-term-bg` / `--ow-term-text`），所以这一屏亮暗两张里
- * 栏体那块应当逐像素一致，只有左半屏会话与页签条随主题翻。
- *
- * 核对点：内距 12/14、mono ＋ `--ow-fs-code`/`--ow-lh-code`、长行 `pre-wrap` 折行不横滚、
- * 尾部 8×15 块状光标。
- *
- * 荧黄逐处旁注：左半屏 0 处；右半屏 **行动极 ×1**（`Composer` 发送钮）＋
- * **状态极 ×1**（终端光标 `--ow-term-cursor`，§4「聚焦终端光标」那一档）——两极语义不同、
- * 各限一处，面积合计远低于 3%。栏里若有第二处状态极（比如另一格终端也亮着光标），
- * 就该把非聚焦那格的 `cursor` 关掉。
- */
-export const SidePanelTerminal38: Story = {
-  name: "右栏 终端页签 38%",
-  render: () => sidePanelScreen(false, "terminal"),
-}
-
-/**
- * **右栏 子任务页签 38%**（原型 2344–2368）：一段小会话的时间轴——头 10/14（标题 ＋
- * mono 读数 ＋ 6px 无彩点），体 16/14，轨道列 12 宽、1.5px `--ow-timeline` 竖线通高，
- * 用户轮 8×8 空心环把线断开、智能体轮 7×7 实心点压在线上，正文 lh 1.7。
- *
- * 与主会话的关系：节点形差**同源**（那边是 11px 一档，窄栏这边降到 8/7），所以两处
- * 「谁在说话」的读法一致；它与 `chat/SubAgentThread`（并行子进程列表）不是一件事。
- *
- * 荧黄逐处旁注：左半屏 0 处；右半屏 **行动极 ×1**（`Composer` 发送钮）；子任务面一律
- * 无彩——读数那颗点取 `--ow-progress-fill`，不占任何一极。
- */
-export const SidePanelSubAgent38: Story = {
-  name: "右栏 子任务页签 38%",
-  render: () => sidePanelScreen(false, "subagent"),
-}
-
-/* ── A8-B4（原型模板 2370–2381 · 文案 4031–4035）· 空栏那一屏 ────────────────────
-   一个页签都没有时，栏里没有页签条内容、也没有地址条，只有栏体中央那三行快捷动作。 */
-
-/**
- * **右栏 空栏**：`SidePanelEmpty` 三行 36 高快捷动作（新建浏览器标签 ⌘T / 打开终端 ⌘B /
- * 打开文件管理 ⌘P），列宽 280 居中，右端 18 高 mono 键帽。这一档不摆信标母题——
- * 母题已经在网页页签那块占位地上出现过一次，同一栏里不重复。
- *
- * 荧黄逐处旁注：左半屏 0 处；右半屏 **行动极 ×1**（`Composer` 发送钮），侧开栏本身 0 处。
- */
-export const SidePanelEmptyScreen: Story = {
-  name: "右栏 空栏",
-  render: () => (
-    <DesktopScreenFrame>
-      <DesktopWorkbenchShell
-        contained
-        view="chat"
-        sidebar={<ChatSidebar />}
-        sidePanel={
-          <WorkbenchSidePanel>
-            <WebPreviewNav
-              density="panel"
-              tabs={[]}
-              activeTabId={null}
-              onSwitchTab={noop}
-              onCloseTab={noop}
-              onCloseOtherTabs={noop}
-              onAddBrowser={noop}
-              onAddTerminal={noop}
-              onAddFiles={noop}
-              onToggleWide={noop}
-              onToggleCollapsed={noop}
-            />
-            <SidePanelEmpty onSelect={noop} />
-          </WorkbenchSidePanel>
-        }
-        chat={chatColumn(
-          // 右栏开着 → 会话头那颗「打开右栏 ⌘T」开关按下（R2 · L3-2-6）
-          { title: "落地页改版", panelOpen: true },
-          <Transcript
-            className="min-h-0 flex-1"
-            maxWidth={752}
-            sender={
-              <Composer
-                defaultValue=""
-                onSend={noop}
-                toolbarEnd={<DesktopComposerModelButton label="Sonnet 4.5 · 标准" onClick={noop} />}
-              />
-            }
-          >
-            <UserTurn text="把落地页首屏的标题和副标题改短。" time="11:18" />
-            <AgentTurn name="Orbitwork" meta="4 步 · 1m08s" disclaimer="内容由 AI 生成，请仔细核实回答内容。">
-              <p>标题压到 12 个字、副标题压到一行。要看预览的话，右边开一个浏览器标签就行。</p>
-            </AgentTurn>
-          </Transcript>,
-        )}
-        skills={null}
-        sites={null}
-        scheduledTasks={null}
-        workspace={null}
-      />
-    </DesktopScreenFrame>
-  ),
-}
-
-/* ── A9-B2（原型 template.dc.html:1148-1216）· 桌面端真实会话 DOM 的脊柱验收面 ──────
-   上面几屏走的是组件库的 `Transcript` 壳（.ow-transcript-turns），脊线段规则挂在
-   components.css 上；而 Electron 里真正渲染的是 `.chat > .chat__scroll > .chat__inner`
-   ＋一串 `.turn`——不带那个类，所以线上一直只有孤立的节点、没有贯穿线（Terry 报的
-   「只有点没有线」）。这一屏照抄那套类名，用来证明 desktop-surfaces.css 补的
-   `.chat__inner .turn::before` 段规则真的把线接上了，同时验收：
-   内容列 752、用户轮 8px 空心环把线断开、agent 轮 7px 实心点压在线上、
-   气泡 10·14 内边＋14/1.7 字＋时间挂右侧同行、agent 轮无署名行。 */
-function desktopChatInner() {
-  return (
-    <div className="chat" style={{ display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }}>
-      <div className="chat__scroll">
-        <div className="chat__inner">
-          <DesktopChatUserTurnView
-            id="u1"
-            text="帮我核对 Q3 渠道复盘引用的 14 份来源，重点看数据有没有过期。"
-            time="14:28"
-          />
-          <DesktopChatAgentTurnView
-            thinking="先把 14 份来源按发布时间排一遍，过期的单独挑出来。"
-            messages={[{ id: "a1", source: "14 份里有 3 份的口径停在 2025H2，已单独标出。" }]}
-          />
-          <DesktopChatUserTurnView id="u2" text="第 9 份的行业均值口径不对，换成中位数再跑一遍。" time="14:31" />
-          <DesktopChatAgentTurnView
-            plain
-            messages={[{ id: "a2", source: "已按中位数重算，渠道 B 的差额从 4.1pp 收到 1.3pp。" }]}
-          />
-        </div>
-      </div>
-    </div>
-  )
-}
-
-/**
- * **桌面端脊柱**：真实 `.chat__inner` DOM 下的贯穿线与节点形差。
- *
- * 荧黄逐处旁注：全屏 **0 处**——轮次骨架是 R3 中性件，本屏不挂 Composer / 产物卡。
- */
-export const DesktopSpine: Story = {
-  name: "桌面端脊柱（.chat__inner）",
-  render: () => (
-    <DesktopScreenFrame>
-      <DesktopWorkbenchShell
-        contained
-        view="chat"
-        sidebar={<ChatSidebar />}
-        chat={desktopChatInner()}
-        skills={null}
-        sites={null}
-        scheduledTasks={null}
-        workspace={null}
-      />
-    </DesktopScreenFrame>
-  ),
-}