Merge remote-tracking branch 'origin/master' into worktree/web-multimodal-image-input

# Conflicts: # .gitignore # apps/cli/package.json # apps/cli/src/web.ts # docs/architecture.i18n.yaml # docs/config-catalog.md # docs/module-graph.md # packages/client/connection/README.md # packages/client/connection/src/client/api.ts # packages/client/connection/src/client/fixture.ts # packages/client/runtime/README.md # packages/client/runtime/src/client/sessions/service.ts # packages/client/runtime/src/client/sessions/session.ts # packages/client/runtime/src/client/workspaces/service.ts # packages/client/ui-conversation/src/client/apply.ts # packages/client/ui-conversation/src/client/chat/MessageItem.tsx # packages/client/ui-conversation/src/client/contract/slots.ts # packages/client/ui-conversation/src/client/index.ts # packages/client/ui-conversation/src/client/service.ts # packages/client/ui-conversation/src/client/skeleton/ConversationRoot.tsx # packages/client/ui-conversation/src/client/skeleton/EmptyHero.tsx # packages/client/ui-conversation/src/client/skeleton/EmptyState.tsx # packages/client/ui-conversation/src/client/skeleton/InputBar.module.css # packages/client/ui-conversation/src/client/skeleton/InputBar.tsx # packages/client/ui-conversation/tests/apply-inject.spec.tsx # packages/client/ui-conversation/tests/input-bar.spec.tsx # packages/client/ui-conversation/tests/skeleton.spec.tsx # packages/client/ui-trajectory/tests/views.spec.tsx # packages/host/apiproxy/src/api-proxy.ts # pnpm-lock.yaml
2026-07-27 12:27:30 +08:00
parent 1a27c0f779 79eb3a9035
commit b599d1d0af
1799 changed files with 63595 additions and 13464 deletions
--- a/packages/client/ui-trajectory/README.i18n.yaml
+++ b/packages/client/ui-trajectory/README.i18n.yaml
@@ -0,0 +1,6 @@
+# Bilingual-pair consistency record (docs/i18n/README.md): the git blob hash of each
+# side as of the last confirmed-consistent state. Both languages carry equal authority;
+# after editing either side, bring the other along and re-record with:
+#   pnpm run verify-translation-pairing --write
+README.md: 9e7dee8d5572baad13d7598d1fbde7b042dd5ab4
+README.zh.md: da14d5265c16acb4e75d21bc445ef9702c83e697
--- a/packages/client/ui-trajectory/README.md
+++ b/packages/client/ui-trajectory/README.md
@@ -1,5 +1,7 @@
 # @deepseek-ai/dsh-client-ui-trajectory

+English | [中文](README.zh.md)
+
 Trajectory turn-list chrome (sticky Turn / Message·Step groups / step cells) plus Waterfall placeholder; the pure-consumer minimal plugin exemplar (registers two view tabs into the conversation's `'conversation.view'` slot ring, provides no service, declares no Context merge). Contract: api-contracts v3 §8.

 ## Model Experience
--- a/packages/client/ui-trajectory/README.zh.md
+++ b/packages/client/ui-trajectory/README.zh.md
@@ -0,0 +1,17 @@
+# @deepseek-ai/dsh-client-ui-trajectory
+
+[English](README.md) | 中文
+
+轨迹轮次列表 chrome（吸顶 Turn／Message·Step 分组／步骤单元格）及 Waterfall 占位符；这是纯消费方最小插件范例（向会话的 `'conversation.view'` slot 环注册两个视图标签页，不提供服务，也不声明 Context 合并）。契约：api-contracts v3 §8。
+
+## 模型体验
+
+无。轨迹视图在浏览器中渲染会话数据；这里没有任何内容进入模型请求。
+
+#### KV Cache 影响
+
+无；该包既不组装也不发送提供方请求。
+
+## 已知限制与暂缓事项
+
+- **进行中的 Time 保持空白**：`partial`／`runningCalls` 行在实时钟策略落地前渲染为 `—`；选中样式只在本地生效（未连接到聊天详情）；锚点深链接仍暂缓实现。
--- a/packages/client/ui-trajectory/src/client/TrajectoryCell.module.css
+++ b/packages/client/ui-trajectory/src/client/TrajectoryCell.module.css
@@ -61,6 +61,17 @@
  background: var(--dsw-alias-state-warn-tertiary);
 }

+/* run_code sub-dispatch cells: the business tint plus an indent so the
+   nesting under the parent Tool cell reads at a glance. */
+.tagSubtool {
+  color: var(--dsw-alias-state-business-primary);
+  background: var(--dsw-alias-state-business-tertiary);
+}
+
+.root[data-kind='subtool'] {
+  padding-left: 28px;
+}
+
 .text {
  flex: 1 1 auto;
  min-width: 0;
--- a/packages/client/ui-trajectory/src/client/TrajectoryCell.tsx
+++ b/packages/client/ui-trajectory/src/client/TrajectoryCell.tsx
@@ -4,20 +4,23 @@
 import type { HTMLAttributes } from 'react'
 import css from './TrajectoryCell.module.css'

-/** Closed set of trajectory step kinds (call+result fold into Tool; no Think). */
-export type TrajectoryCellKind = 'user' | 'message' | 'tool'
+/** Closed set of trajectory step kinds (call+result fold into Tool; no Think;
+ *  subtool = one run_code sub-dispatch nested under its Tool cell). */
+export type TrajectoryCellKind = 'user' | 'message' | 'tool' | 'subtool'

 /** Display label per kind (matches the design tags). */
 const KIND_LABEL: Record<TrajectoryCellKind, string> = {
  user: 'User',
  message: 'Message',
  tool: 'Tool',
+  subtool: 'Sub',
 }

 const TAG_CLASS: Record<TrajectoryCellKind, string> = {
  user: css.tagUser!,
  message: css.tagMessage!,
  tool: css.tagTool!,
+  subtool: css.tagSubtool!,
 }

 export interface TrajectoryCellProps extends HTMLAttributes<HTMLDivElement> {
--- a/packages/client/ui-trajectory/src/client/TrajectoryView.tsx
+++ b/packages/client/ui-trajectory/src/client/TrajectoryView.tsx
@@ -12,9 +12,10 @@ export function TrajectoryView({ useSession }: ConvViewProps) {
  const nodes = useSession((s) => s.nodes)
  const partial = useSession((s) => s.partial)
  const runningCalls = useSession((s) => s.runningCalls)
+  const codeDispatches = useSession((s) => s.codeDispatches)
  const turns = useMemo(
-    () => deriveTrajectoryLayout({ nodes, partial, runningCalls }),
-    [nodes, partial, runningCalls],
+    () => deriveTrajectoryLayout({ nodes, partial, runningCalls, codeDispatches }),
+    [nodes, partial, runningCalls, codeDispatches],
  )
  if (turns.length === 0) {
    return <div className={css.root}><p className={css.empty}>暂无轨迹数据</p></div>
--- a/packages/client/ui-trajectory/src/client/WaterfallView.tsx
+++ b/packages/client/ui-trajectory/src/client/WaterfallView.tsx
@@ -1,16 +1,20 @@
-// WaterfallView: P-I placeholder body for the waterfall tab — span stats
-// header over node-count bars per turn standing in for duration lanes (no
-// timing data yet; deviation ledger #3 defers real rendering to P-III).
+// WaterfallView: span stats header over per-turn node-count lanes (P-I
+// stand-in for duration lanes; deviation ledger #3). run_code turns
+// additionally draw TRUTHFUL sub-call lanes: the dispatch start/settle pair
+// carries per-sub-call wall time, so each sub-span's width is its real
+// duration against the parent turn's dispatch window.

 import { useMemo } from 'react'
 import type { ConvViewProps } from '@deepseek-ai/dsh-client-ui-conversation/client'
-import { deriveSpans } from './spans.ts'
+import { deriveSpans, deriveSubSpans } from './spans.ts'
 import { TrajectoryStatsHeader } from './TrajectoryStatsHeader.tsx'
 import css from './views.module.css'

 /** Bar width scale: px per node, clamped so tiny windows still show a bar. */
 const PX_PER_NODE = 14
 const MIN_BAR_PX = 8
+/** Sub-span lane width budget (the parent window scales into this). */
+const SUB_LANE_PX = 220

 /** Optional density override (test/standalone knob; the register site passes nothing). */
 export interface WaterfallExtraProps {
@@ -21,27 +25,48 @@ export interface WaterfallExtraProps {
 export function WaterfallView({ useSession, pxPerNode }: ConvViewProps & WaterfallExtraProps) {
  const scale = pxPerNode ?? PX_PER_NODE
  const nodes = useSession((s) => s.nodes)
+  const codeDispatches = useSession((s) => s.codeDispatches)
  const spans = useMemo(() => deriveSpans(nodes), [nodes])
+  const subSpans = useMemo(() => deriveSubSpans(nodes, codeDispatches), [nodes, codeDispatches])
  if (spans.length === 0) return <div className={css.root}><p className={css.empty}>暂无瀑布数据</p></div>
  return (
    <>
      <TrajectoryStatsHeader useSession={useSession} />
      <div className={css.root}>
        {spans.map((span, i) => (
-          <div key={span.turn} className={css.row} style={{ paddingLeft: i * 12 }}>
-            <span className={css.turnTag}>turn {span.turn}</span>
-            <span
-              className={css.bar}
-              style={{ width: Math.max(span.nodes * scale, MIN_BAR_PX) }}
-              title={`${span.nodes} nodes`}
-            />
-            {span.calls > 0 && (
+          <div key={span.turn}>
+            <div className={css.row} style={{ paddingLeft: i * 12 }}>
+              <span className={css.turnTag}>turn {span.turn}</span>
              <span
-                className={`${css.bar} ${css.barCalls}`}
-                style={{ width: Math.max(span.calls * scale, MIN_BAR_PX) }}
-                title={`${span.calls} tool calls`}
+                className={css.bar}
+                style={{ width: Math.max(span.nodes * scale, MIN_BAR_PX) }}
+                title={`${span.nodes} nodes`}
              />
-            )}
+              {span.calls > 0 && (
+                <span
+                  className={`${css.bar} ${css.barCalls}`}
+                  style={{ width: Math.max(span.calls * scale, MIN_BAR_PX) }}
+                  title={`${span.calls} tool calls`}
+                />
+              )}
+            </div>
+            {(subSpans.get(span.turn) ?? []).map((lane) => (
+              <div key={lane.callId} className={css.subRow} data-subspan style={{ paddingLeft: i * 12 + 24 }}>
+                <span className={css.subTag}>{lane.name}</span>
+                <span
+                  className={`${css.bar} ${css.barSub}`}
+                  data-timing={lane.timing}
+                  style={{
+                    marginLeft: Math.round(lane.offsetFraction * SUB_LANE_PX),
+                    width: Math.max(Math.round(lane.widthFraction * SUB_LANE_PX), 4),
+                  }}
+                  title={lane.timing === 'measured'
+                    /* durationMs is non-null exactly when timing is measured. */
+                    ? `${lane.name} · ${((lane.durationMs ?? 0) / 1000).toFixed(2)}s`
+                    : lane.timing === 'running' ? `${lane.name} · running` : `${lane.name} · duration unknown`}
+                />
+              </div>
+            ))}
          </div>
        ))}
      </div>
--- a/packages/client/ui-trajectory/src/client/layout.ts
+++ b/packages/client/ui-trajectory/src/client/layout.ts
@@ -4,6 +4,7 @@
 */
 import type {
  AssistantMessageNode,
+  CodeSubCall,
  ConversationSnapshot,
  ToolResultNode,
 } from '@deepseek-ai/dsh-client-runtime/client'
@@ -27,6 +28,8 @@ export interface TrajectoryLayoutInput {
  nodes: ConversationSnapshot['nodes']
  partial: ConversationSnapshot['partial']
  runningCalls: ConversationSnapshot['runningCalls']
+  /** run_code sub-dispatches by parent callId (sub-cells nest under the parent Tool cell). */
+  codeDispatches: ConversationSnapshot['codeDispatches']
 }

 interface UsageLike {
@@ -49,7 +52,7 @@ interface LaidCell {
 * @returns turns ordered by first appearance.
 */
 export function deriveTrajectoryLayout(input: TrajectoryLayoutInput): readonly TrajectoryTurnModel[] {
-  const { nodes, partial, runningCalls } = input
+  const { nodes, partial, runningCalls, codeDispatches } = input
  const resultByCall = indexResults(nodes)
  const turns = new Map<number, { message: LaidCell[]; steps: Map<number, LaidCell[]> }>()
  let index = 0
@@ -96,7 +99,7 @@ export function deriveTrajectoryLayout(input: TrajectoryLayoutInput): readonly T
      continue
    }
    if (node.kind === 'assistant') {
-      const laidList = expandAssistant(node, index + 1, prevAbsTime, resultByCall)
+      const laidList = withSubCalls(expandAssistant(node, index + 1, prevAbsTime, resultByCall), codeDispatches)
      for (const laid of laidList) {
        if (node.step > 0) pushStep(node.turn, node.step, laid)
        else pushMessage(node.turn, laid)
@@ -128,6 +131,10 @@ export function deriveTrajectoryLayout(input: TrajectoryLayoutInput): readonly T
            timeSeconds: durationSeconds(node.time, node.callTime),
          },
        })
+        for (const laid of expandSubCalls(codeDispatches.get(node.callId), index)) {
+          pushStep(0, 1, laid)
+          index = laid.cell.index
+        }
      }
      prevAbsTime = finiteTime(node.time) ?? prevAbsTime
    }
@@ -161,6 +168,10 @@ export function deriveTrajectoryLayout(input: TrajectoryLayoutInput): readonly T
        timeSeconds: null,
      },
    })
+    for (const laid of expandSubCalls(codeDispatches.get(call.callId), index)) {
+      pushStep(call.turn, call.step > 0 ? call.step : 1, laid)
+      index = laid.cell.index
+    }
  }

  // Orphan turn-0 cells (orphaned tools / steering turn 0) fold into Turn 1.
@@ -387,6 +398,53 @@ function collectCallIds(
  return ids
 }

+
+
+/** Interleave each tool cell's run_code sub-dispatch cells right after it, reindexing followers. */
+function withSubCalls(laidList: LaidCell[], codeDispatches: ConversationSnapshot['codeDispatches']): LaidCell[] {
+  if (codeDispatches.size === 0) return laidList
+  const out: LaidCell[] = []
+  let index = laidList[0] !== undefined ? laidList[0].cell.index - 1 : 0
+  for (const laid of laidList) {
+    out.push({ ...laid, cell: { ...laid.cell, index: ++index } })
+    if (laid.callId === undefined) continue
+    for (const sub of expandSubCalls(codeDispatches.get(laid.callId), index)) {
+      out.push(sub)
+      index = sub.cell.index
+    }
+  }
+  return out
+}
+
+/** Sub-dispatch cells for one run_code parent, in start order (running = null duration). */
+function expandSubCalls(
+  subs: readonly CodeSubCall[] | undefined,
+  startIndex: number,
+): LaidCell[] {
+  if (subs === undefined || subs.length === 0) return []
+  const out: LaidCell[] = []
+  let index = startIndex
+  for (const sub of subs) {
+    const settled = 'kind' in sub
+    out.push({
+      absTime: settled ? finiteTime(sub.callTime ?? sub.time) : finiteTime(sub.time),
+      toolName: settled ? sub.call?.name ?? sub.callId : sub.name,
+      callId: sub.callId,
+      cell: {
+        index: ++index,
+        kind: 'subtool',
+        text: settled
+          ? (sub.call !== null ? summarizeCall(sub.call.name, sub.call.argsRaw) : summarizeResult(sub))
+          : summarizeCall(sub.name, sub.argsRaw),
+        // PR3's start/settle pair carries per-sub-call wall time; a running
+        // (unsettled) or pre-pair log entry shows the em dash.
+        timeSeconds: settled ? durationSeconds(sub.time, sub.callTime) : null,
+      },
+    })
+  }
+  return out
+}
+
 function summarizeCall(name: string, argsRaw: string): string {
  const args = argsRaw.replace(/\s+/g, ' ').trim()
  if (args === '') return name
--- a/packages/client/ui-trajectory/src/client/spans.ts
+++ b/packages/client/ui-trajectory/src/client/spans.ts
@@ -5,6 +5,24 @@
 */
 import type { ConversationNode, ConversationSnapshot } from '@deepseek-ai/dsh-client-runtime/client'

+/** One run_code sub-dispatch lane in the waterfall: real timing off the start/settle pair. */
+export interface SubSpanLane {
+  callId: string
+  name: string
+  /** Wall duration in ms; null unless both endpoints were observed (`timing: 'measured'`). */
+  durationMs: number | null
+  /**
+   * Timing provenance: `measured` = start/settle pair observed; `running` =
+   * start seen, settle pending; `unknown` = settle-only replay window (the
+   * start fell outside), so no duration claim is possible.
+   */
+  timing: 'measured' | 'running' | 'unknown'
+  /** Start offset as a fraction of the parent turn's dispatch window [0, 1). */
+  offsetFraction: number
+  /** Width as a fraction of the window (running lanes extend to the window end). */
+  widthFraction: number
+}
+
 /** One turn's worth of activity, folded from the snapshot node window. */
 export interface TurnSpan {
  turn: number
@@ -69,3 +87,61 @@ export function deriveSpanStats(spans: readonly TurnSpan[]): SpanStats {
 function hasTurn(node: ConversationNode): node is ConversationNode & { turn: number } {
  return node.kind === 'assistant' || node.kind === 'steering'
 }
+
+/**
+ * Fold the dispatch index into per-turn sub-span lanes with REAL timing: each
+ * lane's offset/width scale against its parent turn's dispatch window (first
+ * start → last settle). Running (unsettled) lanes extend to the window end
+ * with a null duration.
+ * @param nodes - snapshot nodes (locates each parent run_code call's turn).
+ * @param codeDispatches - the snapshot's dispatch index.
+ * @returns lanes keyed by turn, in start order.
+ */
+export function deriveSubSpans(
+  nodes: ConversationSnapshot['nodes'],
+  codeDispatches: ConversationSnapshot['codeDispatches'],
+): ReadonlyMap<number, readonly SubSpanLane[]> {
+  const out = new Map<number, SubSpanLane[]>()
+  if (codeDispatches.size === 0) return out
+  const turnByCall = new Map<string, number>()
+  let currentTurn = 0
+  for (const node of nodes) {
+    if (node.kind === 'assistant' || node.kind === 'steering') currentTurn = node.turn
+    if (node.kind === 'tool-result') turnByCall.set(node.callId, currentTurn)
+  }
+  for (const [parent, subs] of codeDispatches) {
+    if (subs.length === 0) continue
+    const turn = turnByCall.get(parent) ?? currentTurn
+    // A settle-only entry (callTime null: its start fell outside the replay
+    // window) anchors the window by its settle time — a real observation —
+    // but must never masquerade as a measured zero-duration span.
+    const starts: number[] = []
+    const ends: number[] = []
+    for (const sub of subs) {
+      const settled = 'kind' in sub
+      const start = settled ? sub.callTime ?? sub.time : sub.time
+      starts.push(start)
+      ends.push(settled ? sub.time : start)
+    }
+    const windowStart = Math.min(...starts)
+    const windowEnd = Math.max(...ends, windowStart + 1)
+    const windowSpan = windowEnd - windowStart
+    const lanes: SubSpanLane[] = subs.map((sub, i) => {
+      const settled = 'kind' in sub
+      const timing = settled ? (sub.callTime === null ? 'unknown' as const : 'measured' as const) : 'running' as const
+      const start = starts[i] ?? windowStart
+      const end = settled ? sub.time : windowEnd
+      return {
+        callId: sub.callId,
+        name: settled ? sub.call?.name ?? sub.callId : sub.name,
+        durationMs: timing === 'measured' ? Math.max(0, end - start) : null,
+        timing,
+        offsetFraction: (start - windowStart) / windowSpan,
+        widthFraction: Math.max((end - start) / windowSpan, 0.02),
+      }
+    })
+    const existing = out.get(turn) ?? []
+    out.set(turn, [...existing, ...lanes])
+  }
+  return out
+}
--- a/packages/client/ui-trajectory/src/client/views.module.css
+++ b/packages/client/ui-trajectory/src/client/views.module.css
@@ -45,3 +45,38 @@
  color: var(--dsw-alias-label-caption);
  font: var(--dsw-font-xs-13);
 }
+
+/* run_code sub-span lanes: one row per sub-dispatch under its turn row,
+   offset/width scaled to the dispatch window (real wall time). A running
+   lane pulses via reduced opacity until its settle arrives. */
+.subRow {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-top: 2px;
+}
+
+.subTag {
+  flex: none;
+  width: 88px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--dsw-alias-label-tertiary);
+  font: var(--dsw-font-xs-13);
+}
+
+.barSub {
+  height: 8px;
+  background: var(--dsw-alias-state-business-primary);
+}
+
+.barSub[data-timing='running'] {
+  opacity: 0.45;
+}
+
+/* Settle-only replay entries: no measured span — hollow, not a solid bar. */
+.barSub[data-timing='unknown'] {
+  background: transparent;
+  border: 1px dashed var(--dsw-alias-state-business-primary);
+}
--- a/packages/client/ui-trajectory/tests/layout.spec.tsx
+++ b/packages/client/ui-trajectory/tests/layout.spec.tsx
@@ -70,7 +70,7 @@ describe('deriveTrajectoryLayout', () => {
        content: [{ type: 'text', text: 'a.txt' }], isError: false, callView: null, resultView: null,
      },
    ] as unknown as ConversationSnapshot['nodes']
-    const turns = deriveTrajectoryLayout({ nodes, partial: null, runningCalls: [] })
+    const turns = deriveTrajectoryLayout({ codeDispatches: new Map(), nodes, partial: null, runningCalls: [] })
    expect(turns).toHaveLength(1)
    expect(turns[0]?.turn).toBe(1)
    const kinds = turns[0]?.groups.flatMap((g) => g.cells.map((c) => c.kind))
@@ -86,6 +86,7 @@ describe('deriveTrajectoryLayout', () => {

  it('adds runningCalls not already present and leaves their time blank', () => {
    const turns = deriveTrajectoryLayout({
+      codeDispatches: new Map(),
      nodes: [] as unknown as ConversationSnapshot['nodes'],
      partial: null,
      runningCalls: [{
@@ -111,7 +112,7 @@ describe('deriveTrajectoryLayout', () => {
        usage: { inputTokens: 1, outputTokens: 2, reasoningTokens: 3 },
      },
    ] as unknown as ConversationSnapshot['nodes']
-    const turns = deriveTrajectoryLayout({ nodes, partial: null, runningCalls: [] })
+    const turns = deriveTrajectoryLayout({ codeDispatches: new Map(), nodes, partial: null, runningCalls: [] })
    const cells = turns[0]?.groups.flatMap((g) => g.cells) ?? []
    expect(cells.find((c) => c.kind === 'message')?.timeSeconds).toBeNull()
    expect(turns[0]?.groups.find((g) => g.title === 'Step 1')?.description).toBeUndefined()
@@ -137,7 +138,7 @@ describe('deriveTrajectoryLayout', () => {
        content: [], isError: false, callView: null, resultView: null,
      },
    ] as unknown as ConversationSnapshot['nodes']
-    const turns = deriveTrajectoryLayout({ nodes, partial: null, runningCalls: [] })
+    const turns = deriveTrajectoryLayout({ codeDispatches: new Map(), nodes, partial: null, runningCalls: [] })
    expect(turns[0]?.groups[0]?.description).toBe('2.9s bash×2')
  })

@@ -154,7 +155,7 @@ describe('deriveTrajectoryLayout', () => {
        blocks: [{ kind: 'text', text: 'ok2' }],
      },
    ] as unknown as ConversationSnapshot['nodes']
-    const turns = deriveTrajectoryLayout({ nodes, partial: null, runningCalls: [] })
+    const turns = deriveTrajectoryLayout({ codeDispatches: new Map(), nodes, partial: null, runningCalls: [] })
    expect(turns.map((t) => t.turn)).toEqual([1, 2])
    expect(turns[0]?.groups.flatMap((g) => g.cells.map((c) => c.text))).toEqual(['first', 'ok1'])
    expect(turns[1]?.groups.flatMap((g) => g.cells.map((c) => c.text))).toEqual(['second', 'ok2'])
@@ -168,7 +169,7 @@ describe('deriveTrajectoryLayout', () => {
        usage: { inputTokens: 11, outputTokens: 22, reasoningTokens: 3 },
      },
    ] as unknown as ConversationSnapshot['nodes']
-    const turns = deriveTrajectoryLayout({ nodes, partial: null, runningCalls: [] })
+    const turns = deriveTrajectoryLayout({ codeDispatches: new Map(), nodes, partial: null, runningCalls: [] })
    const message = turns[0]?.groups.flatMap((g) => g.cells).find((c) => c.kind === 'message')
    expect(message).toMatchObject({
      text: '', input: 11, output: 22, think: 3,
@@ -196,7 +197,7 @@ describe('deriveTrajectoryLayout', () => {
        blocks: [{ kind: 'text', text: 'done' }],
      },
    ] as unknown as ConversationSnapshot['nodes']
-    const turns = deriveTrajectoryLayout({ nodes, partial: null, runningCalls: [] })
+    const turns = deriveTrajectoryLayout({ codeDispatches: new Map(), nodes, partial: null, runningCalls: [] })
    const message = turns[0]?.groups
      .flatMap((g) => g.cells)
      .find((c) => c.kind === 'message' && c.text === 'done')
@@ -204,3 +205,51 @@ describe('deriveTrajectoryLayout', () => {
    expect(message?.timeSeconds).toBe(1)
  })
 })
+
+describe('run_code sub-dispatch cells', () => {
+  const runCodeNodes = [
+    {
+      kind: 'assistant', seq: 2, time: 6_000, turn: 1, step: 1,
+      blocks: [
+        { kind: 'tool-call', callId: 'p1', name: 'run_code', argsRaw: '{"code":"…","description":"批量读取"}' },
+      ],
+    },
+    {
+      kind: 'tool-result', seq: 3, time: 9_000, callId: 'p1',
+      call: { name: 'run_code', argsRaw: '{"code":"…","description":"批量读取"}' }, callTime: 6_200,
+      content: [{ type: 'text', text: 'done' }], isError: false, callView: null, resultView: null,
+    },
+  ] as unknown as ConversationSnapshot['nodes']
+
+  const settledSub = (n: number, name: string, start: number, end: number) => ({
+    kind: 'tool-result' as const, seq: 100 + n, time: end,
+    callId: `p1:code:${n}`,
+    call: { name, argsRaw: '{"x":1}' }, callTime: start,
+    content: [{ type: 'text' as const, text: 'ok' }], isError: false, callView: null, resultView: null,
+  })
+
+  it('nests settled sub-cells after their parent Tool cell with real durations', () => {
+    const codeDispatches = new Map([['p1', [
+      settledSub(1, 'bash', 6_300, 7_300),
+      settledSub(2, 'read', 7_300, 7_800),
+    ]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const turns = deriveTrajectoryLayout({ codeDispatches, nodes: runCodeNodes, partial: null, runningCalls: [] })
+    const cells = turns[0]!.groups.flatMap((g) => g.cells)
+    expect(cells.map((c) => c.kind)).toEqual(['tool', 'subtool', 'subtool'])
+    // Sequential indexes across the interleave; durations from the pair times.
+    expect(cells.map((c) => c.index)).toEqual([1, 2, 3])
+    expect(cells[1]).toMatchObject({ text: 'bash · {"x":1}', timeSeconds: 1 })
+    expect(cells[2]).toMatchObject({ timeSeconds: 0.5 })
+  })
+
+  it('a running (unsettled) sub-call renders a subtool cell with blank time', () => {
+    const running = {
+      callId: 'p1:code:1', name: 'grep', argsRaw: '{"pattern":"x"}',
+      turn: 0, step: 0, time: 6_400, callView: null,
+    }
+    const codeDispatches = new Map([['p1', [running]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const turns = deriveTrajectoryLayout({ codeDispatches, nodes: runCodeNodes, partial: null, runningCalls: [] })
+    const sub = turns[0]!.groups.flatMap((g) => g.cells).find((c) => c.kind === 'subtool')
+    expect(sub).toMatchObject({ text: 'grep · {"pattern":"x"}', timeSeconds: null })
+  })
+})
--- a/packages/client/ui-trajectory/tests/views.spec.tsx
+++ b/packages/client/ui-trajectory/tests/views.spec.tsx
@@ -18,20 +18,16 @@ import { SlotsService } from '@deepseek-ai/dsh-client-runtime/client'
 import type { ConversationSnapshot, SessionId, SessionListState, WorkspaceListState } from '@deepseek-ai/dsh-client-runtime/client'
 import type { ConvViewProps, ViewTab } from '@deepseek-ai/dsh-client-ui-conversation/client'
 // Export discipline: packages/client/AGENTS.md.
-import { ConversationRoot, type ConversationRootProps } from '@deepseek-ai/dsh-client-ui-conversation/src/client/skeleton/ConversationRoot.tsx'
+import { ConversationSession, type ConversationSessionProps } from '@deepseek-ai/dsh-client-ui-conversation/src/client/skeleton/ConversationSession.tsx'
 import { createChatStore } from '@deepseek-ai/dsh-client-ui-conversation/src/client/stores.ts'
 import { apply, inject } from '@deepseek-ai/dsh-client-ui-trajectory/client'
-import { deriveSpans, deriveSpanStats } from '@deepseek-ai/dsh-client-ui-trajectory/src/client/spans.ts'
+import { deriveSpans, deriveSpanStats, deriveSubSpans } from '@deepseek-ai/dsh-client-ui-trajectory/src/client/spans.ts'
 import { TrajectoryStatsHeader } from '@deepseek-ai/dsh-client-ui-trajectory/src/client/TrajectoryStatsHeader.tsx'
 import { TrajectoryView } from '@deepseek-ai/dsh-client-ui-trajectory/src/client/TrajectoryView.tsx'
 import { WaterfallView } from '@deepseek-ai/dsh-client-ui-trajectory/src/client/WaterfallView.tsx'
 import { apply as nodeApply } from '@deepseek-ai/dsh-client-ui-trajectory'

 const SID = 's1' as SessionId
-/** Fallback-only chain stub (no composer takeover in these benches). */
-const fallbackRenderSlotChain: ConversationRootProps['renderSlotChain'] =
-  (_key, _owner, opts) => opts?.fallback ?? null
-
 afterEach(cleanup)
 // The chat store persists under its declared key; clear so one case's active
 // view cannot rehydrate into the next.
@@ -54,7 +50,7 @@ const NODES = [

 function fakeSession(nodes: ConversationSnapshot['nodes']) {
  const store = createSnapshotStore({
-    nodes, partial: null, runningCalls: [] as ConversationSnapshot['runningCalls'],
+    nodes, partial: null, runningCalls: [] as ConversationSnapshot['runningCalls'], codeDispatches: new Map(),
  })
  return { store, useSession: bindSnapshotSelector(store) as unknown as UseSession<ConversationSnapshot> }
 }
@@ -62,21 +58,18 @@ function fakeSession(nodes: ConversationSnapshot['nodes']) {
 /** Empty sessions-list hook; breadcrumbs therefore fall back to the raw id. */
 function emptySessions() {
  const store = createSnapshotStore<SessionListState>(
-    { ids: [], byId: {}, current: undefined, intent: undefined, phase: 'ready' })
+    { ids: [], byId: {}, current: undefined, phase: 'ready' })
  return bindSnapshotSelector(store)
 }

 function emptyWorkspaces() {
  const store = createSnapshotStore<WorkspaceListState>({
-    items: [], intent: undefined, state: 'idle', phase: 'ready', error: null, baselinesReady: true,
+    items: [], state: 'idle', phase: 'ready', error: null, baselinesReady: true,
    recentWorkspaceId: undefined,
  })
  return bindSnapshotSelector(store)
 }

-/** SessionProvider seat stub (render-prop pass-through; ConversationRoot never invokes it). */
-const SessionProviderStub: ConversationRootProps['SessionProvider'] = ({ children }) => <>{children(SID)}</>
-
 /** Standalone view props: the session-scope standard kit the outlet would bake. */
 function standaloneProps(nodes: ConversationSnapshot['nodes']): ConvViewProps {
  return {
@@ -113,11 +106,11 @@ function tabsOf(slots: SlotsService): ViewTab[] {
    .map(e => ({ id: e.options.id!, label: e.options.label ?? e.options.id! }))
 }

-/** Mount ConversationRoot over the ring ledger with an outlet-faithful renderSlot. */
+/** Mount the strict session content over the ring ledger with an outlet-faithful renderSlot. */
 function mount(slots: SlotsService, nodes: ConversationSnapshot['nodes'] = NODES) {
  const sessionSnapshot = createSnapshotStore({
    running: false, removed: false, promptError: null, nodes,
-    partial: null, runningCalls: [] as ConversationSnapshot['runningCalls'],
+    partial: null, runningCalls: [] as ConversationSnapshot['runningCalls'], codeDispatches: new Map(),
  })
  const useSession = bindSnapshotSelector(sessionSnapshot) as unknown as UseSession<ConversationSnapshot>
  const chat = createChatStore().create()
@@ -134,32 +127,31 @@ function mount(slots: SlotsService, nodes: ConversationSnapshot['nodes'] = NODES
        key={key}
      />
    )
-  }) as unknown as ConversationRootProps['renderSlot']
+  }) as unknown as ConversationSessionProps['renderSlot']
  return render(
-    <ConversationRoot
+    <ConversationSession
      sessionId={SID}
+      SessionProvider={({ children }) => children(SID)}
      useSession={useSession}
      useSessions={emptySessions()}
      useWorkspaces={emptyWorkspaces()}
      useStore={bindSnapshotSelector(chat)}
      actions={chat.actions}
      renderSlot={renderSlot}
-      renderSlotChain={fallbackRenderSlotChain}
-      SessionProvider={SessionProviderStub}
      views={{
        list: () => tabsOf(slots),
-        subscribe: (fn) => slots.subscribe('conversation.view', fn),
+        subscribe: (fn: () => void) => slots.subscribe('conversation.view', fn),
        version: () => slots.getVersion('conversation.view'),
      }}
-      addImages={vi.fn()}
-      removeImage={vi.fn()}
-      draftImages={() => []}
      releaseSessionImages={vi.fn()}
-      send={vi.fn()}
-      stop={vi.fn()}
+      useInput={bindSnapshotSelector(createSnapshotStore({
+        draft: '', imageIds: [], draftRev: 0, phase: 'plain', occurrences: [], queue: [],
+      })) as never}
+      inputActions={{
+        setDraft: vi.fn(), addImages: vi.fn(), removeImage: vi.fn(), pruneImages: vi.fn(), submit: vi.fn(),
+      } as never}
+      bindDraftMirror={() => () => {}}
      open={vi.fn()}
-      updateSessionPrompt={vi.fn()}
-      retrySessionPrompt={vi.fn()}
    />,
  )
 }
@@ -264,3 +256,115 @@ describe('node half', () => {
    expect(nodeApply()).toBeUndefined()
  })
 })
+
+describe('deriveSubSpans (waterfall lanes)', () => {
+  const dispatchNodes = [
+    { kind: 'assistant', seq: 2, time: 6_000, turn: 3, step: 1, blocks: [] },
+    {
+      kind: 'tool-result', seq: 3, time: 9_000, callId: 'p1',
+      call: { name: 'run_code', argsRaw: '{}' }, callTime: 6_100,
+      content: [], isError: false, callView: null, resultView: null,
+    },
+  ] as unknown as ConversationSnapshot['nodes']
+
+  it('scales settled lanes into the dispatch window with real durations', () => {
+    const codeDispatches = new Map([['p1', [
+      {
+        kind: 'tool-result', seq: 101, time: 7_000, callId: 'p1:code:1',
+        call: { name: 'bash', argsRaw: '{}' }, callTime: 6_200,
+        content: [], isError: false, callView: null, resultView: null,
+      },
+      {
+        kind: 'tool-result', seq: 102, time: 8_200, callId: 'p1:code:2',
+        call: { name: 'read', argsRaw: '{}' }, callTime: 7_000,
+        content: [], isError: false, callView: null, resultView: null,
+      },
+    ]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const lanes = deriveSubSpans(dispatchNodes, codeDispatches)
+    const turn3 = lanes.get(3)
+    expect(turn3).toHaveLength(2)
+    // Window = 6200..8200 (2000ms). bash: 0..0.4; read: 0.4..1.0.
+    expect(turn3?.[0]).toMatchObject({ name: 'bash', durationMs: 800, timing: 'measured', offsetFraction: 0 })
+    expect(turn3?.[0]?.widthFraction).toBeCloseTo(0.4)
+    expect(turn3?.[1]).toMatchObject({ name: 'read', durationMs: 1200 })
+    expect(turn3?.[1]?.offsetFraction).toBeCloseTo(0.4)
+  })
+
+  it('a running lane extends to the window end with a null duration', () => {
+    const codeDispatches = new Map([['p1', [
+      {
+        kind: 'tool-result', seq: 101, time: 8_000, callId: 'p1:code:1',
+        call: { name: 'bash', argsRaw: '{}' }, callTime: 6_200,
+        content: [], isError: false, callView: null, resultView: null,
+      },
+      { callId: 'p1:code:2', name: 'grep', argsRaw: '{}', turn: 0, step: 0, time: 7_000, callView: null },
+    ]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const lanes = deriveSubSpans(dispatchNodes, codeDispatches)
+    const running = lanes.get(3)?.find((lane) => lane.name === 'grep')
+    expect(running).toMatchObject({ durationMs: null, timing: 'running' })
+    // Extends from its start to the window end.
+    expect(running!.offsetFraction + running!.widthFraction).toBeCloseTo(1)
+  })
+
+  it('a settle-only entry (null callTime) is unknown timing, never a measured 0 ms', () => {
+    const codeDispatches = new Map([['p1', [
+      {
+        kind: 'tool-result', seq: 101, time: 8_000, callId: 'p1:code:1',
+        call: { name: 'bash', argsRaw: '{}' }, callTime: null,
+        content: [], isError: false, callView: null, resultView: null,
+      },
+    ]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const lane = deriveSubSpans(dispatchNodes, codeDispatches).get(3)?.[0]
+    expect(lane).toMatchObject({ durationMs: null, timing: 'unknown' })
+  })
+
+  it('waterfall renders sub-span lanes under the owning turn row', () => {
+    const codeDispatches = new Map([['p1', [
+      {
+        kind: 'tool-result', seq: 101, time: 8_000, callId: 'p1:code:1',
+        call: { name: 'bash', argsRaw: '{}' }, callTime: 6_200,
+        content: [], isError: false, callView: null, resultView: null,
+      },
+    ]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const store = createSnapshotStore({
+      nodes: dispatchNodes, partial: null,
+      runningCalls: [] as ConversationSnapshot['runningCalls'], codeDispatches,
+    })
+    const props = {
+      sessionId: SID,
+      useSession: bindSnapshotSelector(store) as unknown as UseSession<ConversationSnapshot>,
+      useSessions: emptySessions(),
+      useWorkspaces: emptyWorkspaces(),
+    } as unknown as ConvViewProps
+    const view = render(createElement(WaterfallView as FC<ConvViewProps>, props))
+    const lane = view.container.querySelector('[data-subspan]')
+    expect(lane).not.toBeNull()
+    expect(lane!.textContent).toContain('bash')
+    expect(lane!.querySelector('[title*="1.80s"]')).not.toBeNull()
+    expect(lane!.querySelector('[data-timing="measured"]')).not.toBeNull()
+  })
+
+  it('waterfall labels a settle-only lane as duration unknown', () => {
+    const codeDispatches = new Map([['p1', [
+      {
+        kind: 'tool-result', seq: 101, time: 8_000, callId: 'p1:code:1',
+        call: { name: 'read', argsRaw: '{}' }, callTime: null,
+        content: [], isError: false, callView: null, resultView: null,
+      },
+    ]]]) as unknown as ConversationSnapshot['codeDispatches']
+    const store = createSnapshotStore({
+      nodes: dispatchNodes, partial: null,
+      runningCalls: [] as ConversationSnapshot['runningCalls'], codeDispatches,
+    })
+    const props = {
+      sessionId: SID,
+      useSession: bindSnapshotSelector(store) as unknown as UseSession<ConversationSnapshot>,
+      useSessions: emptySessions(),
+      useWorkspaces: emptyWorkspaces(),
+    } as unknown as ConvViewProps
+    const view = render(createElement(WaterfallView as FC<ConvViewProps>, props))
+    const bar = view.container.querySelector('[data-timing="unknown"]')
+    expect(bar).not.toBeNull()
+    expect(bar!.getAttribute('title')).toContain('duration unknown')
+  })
+})