@spzxg/cli-ui 0.6.11 → 0.6.12

package/dist/cli-ui.js

@@ -1,4 +1,4 @@
-import { C as a, b as i, d as r, e as t, f as o, h as C, i as l, j as n, k as m, m as d, l as u, n as w, o as B, p as f } from "./cli-ui-embed-CbxWozLO.js";
+import { C as a, b as i, d as r, e as t, f as o, h as C, i as l, j as n, k as m, m as d, l as u, n as w, o as B, p as f } from "./cli-ui-embed-B0HDalUb.js";
 export {
   a as CliBoard,
   i as CliBrowserView,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spzxg/cli-ui",
-  "version": "0.6.11",
+  "version": "0.6.12",
   "type": "module",
   "description": "相互联动的 CliMsgList、CliChat、CliBoard，支持任务中枢和完整 Operator 工作区。",
   "main": "src/index.ts",

package/src/chat/CliChat.tsx

@@ -1,6 +1,8 @@
 // cli-chat：对话。界面取自 Operator 的会话视图（SessionView 的对话部分 + Composer），
 // 数据来自 center 的对话任务（mode=conversation）：实时流里的节点转录按 Operator 的规则渲染，
 // 每条消息是中枢的一轮，排队 / 执行 / 结束都跟 center 保持一致。
+import { SubagentChatScope } from "../ui/SubagentChat";
+import { parentMessages } from "../core/subagents";
 import { useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, type ReactNode, type CSSProperties } from "react";
 import { CliErrorBoundary } from "../ui/ErrorBoundary";
 import type { CliEvent, CliStore, CliStoreOptions } from "../core/store";
@@ -198,11 +200,18 @@ function ChatInner({ slots, passiveContext = true, configurationBusy, onClear, j
 
   const allMessages = useMemo(() => (conv ? viewMessages(conv) : []), [conv]);
   // config.transcript.tools=false：去掉工具卡片，只留文字往来（提问 / 输入卡片要用户操作，照常显示）。
-  const messages = useMemo(() => (cfg.transcript.tools ? allMessages : allMessages.filter((m) => {
+  const parent = useMemo(() => parentMessages(allMessages), [allMessages]);
+  const messages = useMemo(() => (cfg.transcript.tools ? parent : parent.filter((m) => {
     if (m.role !== "tool") return true;
     const data = toolDataOf(m);
     return !!(data.ask || data.input);
-  })), [allMessages, cfg.transcript.tools]);
+  })), [parent, cfg.transcript.tools]);
+  const remoteTaskId = conv?.remoteTaskId ?? conv?.task?.remote_task_id ?? null;
+  const loadSubagent = useCallback(async (id: string, generation: number, before?: string) => {
+    if (!key || !remoteTaskId || !store.client.subagent) throw new Error("当前接入未提供子代理历史接口");
+    return store.client.subagent(key, remoteTaskId, id, generation, before);
+  }, [store, key, remoteTaskId]);
+  const renderSubagentMessage = useCallback((message: Msg, name: string) => <MessageView m={message} initial={false} hideWho={false} handlers={{}} agentLabel={name} view={{ timestamps: true, initialBadge: false, userLabel: "收到的任务", agentName: name }} />, []);
   const running = conv ? isRunning(conv) : false;
   const job = entry?.job;
   // 一次性任务没有轮次：补充消息通过 continueTask 接在当前子任务的对话后面。
@@ -691,6 +700,7 @@ function ChatInner({ slots, passiveContext = true, configurationBusy, onClear, j
     <FileLinkContext.Provider value={resolveFile}>
     <FileOpenContext.Provider value={openFile}>
     <div ref={chatRef} className={`cli-ui cli-chat ${className ?? ""}`} data-theme={theme} style={style}>
+      <SubagentChatScope scopeKey={`${key ?? "new"}:${remoteTaskId ?? ""}`} messages={allMessages} load={store.client.subagent ? loadSubagent : undefined} renderMessage={renderSubagentMessage}>
       <div className="session">
         {h.show && (workspaceAvailable || externalBoardVisible || h.crumb || h.export || h.title || h.agent || h.usage || h.model || h.status || h.close) && <div className="sess-head">
           {workspaceTabs ? <WorkspaceTabs title={convTitle} subtitle={h.crumb ? title : undefined} chatActive={!workspaceActive} onChat={showChat} onTabsHost={setTabsHost} /> : (h.crumb || showCurrentTitle) && <div className="sh-main">
@@ -883,6 +893,7 @@ function ChatInner({ slots, passiveContext = true, configurationBusy, onClear, j
           inlineLayout={mobileWorkspace ? undefined : { tabsHost, active: workspaceActive, onActivate: showWorkspace, onChat: showChat }} />}
         </WorkspaceDrawer>
       </div>
+      </SubagentChatScope>
       {popup && key && board && (
         <div className="scrim" onClick={(e) => { if (e.target === e.currentTarget) setPopup(null); }}>
           <div className={`modal cli-popup ${popup.kind}`} role="dialog" aria-modal="true" aria-label={popup.kind === "file" ? popup.path : "任务浏览器"}>

package/src/core/client.ts

@@ -1,3 +1,4 @@
+import type { SubagentTranscript } from "./subagents";
 import { createSseParser } from "./sse";
 import { NEW_TASK, parseConvKey } from "./conversation";
 import type {
@@ -107,6 +108,8 @@ export interface ConversationBackend {
   /** taskId：只要对话任务里这一个对话的轮次。 */
   listTurns(jobId: string, query?: { afterSeq?: number; limit?: number; taskId?: string }): Promise<{ job_id: string; turns: CenterTurn[] }>;
   listTasks(): Promise<{ tasks: CenterTask[] }>;
+  /** 原生子代理的公开运行记录；before 用于读取更早的一页。 */
+  subagent?(jobId: string, remote: string, childId: string, generation: number, before?: string): Promise<SubagentTranscript>;
   /**
    * 更早的节点转录（往上翻）：remote 是流里给的节点会话，before 是手里最早那条消息的 id。
    * 返回这一页（旧的在前）和再往前还剩几条。旧版中枢没有这个接口（实时流也就给的是全量，用不到）。
@@ -344,6 +347,7 @@ export function createCenterClient(options: CenterClientOptions = {}): Conversat
         return error instanceof Error ? error.message : String(error);
       }
     },
+    subagent: (jobId, remote, childId, generation, before) => request<SubagentTranscript>(`/api/jobs/${id(parseConvKey(jobId).jobId)}/subagents/${id(childId)}?remote=${id(remote)}&generation=${generation}&limit=200${before ? `&before=${id(before)}` : ""}`),
     history: (jobId: string, remote: string, before: string, limit = 200) =>
       request<{ messages: Message[]; older: number }>(`/api/jobs/${id(parseConvKey(jobId).jobId)}/history?remote=${id(remote)}&before=${id(before)}&limit=${limit}`),
     createConversation: (firstMessage: string, opts: NewConversationOptions & { businessId?: string } = {}) => {

package/src/core/conversation.ts

@@ -229,19 +229,25 @@ export function applyNodeEvent(conv: ConvState, ev: NodeEvent): ConvState {
     case "assistant":
       return set(upsertMsg(conv.msgs, { id: e.msgId ?? localId("a"), role: "assistant", content: e.content, generation: gen, ts: e.ts }));
     case "tool": {
-      const data: ToolData = { title: e.title, detail: e.detail, peek: e.peek, diff: e.diff };
-      return set(upsertMsg(conv.msgs, { id: e.msgId ?? localId("t"), role: "tool", content: JSON.stringify(data), generation: gen, toolId: e.id }));
+      const data: ToolData = { title: e.title, detail: e.detail, peek: e.peek, diff: e.diff, subagent: e.subagent, subagentMessage: e.subagentMessage };
+      return set(upsertMsg(conv.msgs, { id: e.msgId ?? localId("t"), role: "tool", content: JSON.stringify(data), generation: gen, toolId: e.id, ts: e.ts }));
     }
     case "tool_result": {
       // 先按消息 id 找（快照加载的消息也能对上），找不到再按 tool_use id。结果多在末尾，从后往前找。
       const arr = conv.msgs;
       let i = arr.length - 1;
       while (i >= 0 && (arr[i].role !== "tool" || (arr[i].id !== e.msgId && arr[i].toolId !== e.id))) i--;
-      if (i < 0) return conv;
+      if (i < 0) {
+        if (!e.msgId || (!e.subagent && !e.subagentMessage)) return conv;
+        const data: ToolData = { title: e.subagent?.title ?? e.subagentMessage?.tool?.title ?? "子代理消息", subagent: e.subagent, subagentMessage: e.subagentMessage };
+        return set(upsertMsg(arr, { id: e.msgId, role: "tool", content: JSON.stringify(data), generation: gen, toolId: e.id, ts: e.ts }));
+      }
       try {
         const d = JSON.parse(arr[i].content) as ToolData;
         d.result = e.content;
         d.isError = e.isError;
+        if (e.subagent) d.subagent = e.subagent;
+        if (e.subagentMessage) d.subagentMessage = e.subagentMessage;
         if (e.peek) d.peek = e.peek;
         const next = arr.slice();
         next[i] = { ...arr[i], content: JSON.stringify(d) };
@@ -535,6 +541,7 @@ export function turnCallback(conv: ConvState, turn: CenterTurn, continuedFrom: s
     context_reset: turn.context_reset,
     merged: !!turn.merged,
     merge_error: turn.merge_error ?? null,
+    ...(turn.saved !== undefined ? { saved: turn.saved, saved_at: turn.saved_at ?? null, save_error: turn.save_error ?? null } : {}),
     agent: turn.agent,
     resolved_model: turn.resolved_model,
     total_tokens: turn.total_tokens, input_tokens: turn.input_tokens, output_tokens: turn.output_tokens,

package/src/core/subagents.ts

@@ -0,0 +1,78 @@
+/** Shared wire format for native CLI subagents. These are not Center tasks. */
+export interface SubagentInfo {
+  id: string;
+  parentId?: string;
+  title: string;
+  task?: string;
+  status: "running" | "completed" | "failed" | "cancelled" | "unknown";
+  detailAvailability: "full" | "partial" | "unavailable";
+  detailReason?: string;
+  updatedAt?: number;
+}
+
+export interface SubagentMessage {
+  subagentId: string;
+  role: "user" | "assistant" | "tool" | "system";
+  content: string;
+  tool?: { id: string; title: string; detail?: string; result?: string; isError?: boolean };
+  eventId: string;
+  updatedAt?: number;
+}
+
+export interface SubagentFields {
+  subagent?: SubagentInfo;
+  subagentMessage?: SubagentMessage;
+}
+
+type Row = { id: string; role: string; content: string; generation: number; ts?: number; created_at?: number };
+export interface SubagentTranscript { subagent: SubagentInfo; messages: Row[]; refreshable?: boolean; older?: number }
+export type LoadSubagent = (id: string, generation: number, before?: string) => Promise<SubagentTranscript>;
+
+const cache = new WeakMap<Row, SubagentFields>();
+export function subagentFields(row: Row): SubagentFields {
+  const known = cache.get(row);
+  if (known) return known;
+  const fields: SubagentFields = {};
+  if (row.role === "tool") {
+    try {
+      const value = JSON.parse(row.content);
+      const info = value?.subagent;
+      if (info && typeof info.id === "string" && typeof info.title === "string") fields.subagent = {
+        id: info.id, title: info.title,
+        parentId: typeof info.parentId === "string" ? info.parentId : undefined,
+        task: typeof info.task === "string" ? info.task : undefined,
+        status: ["running", "completed", "failed", "cancelled", "unknown"].includes(info.status) ? info.status : "unknown",
+        detailAvailability: ["full", "partial", "unavailable"].includes(info.detailAvailability) ? info.detailAvailability : "partial",
+        detailReason: typeof info.detailReason === "string" ? info.detailReason : undefined,
+        updatedAt: typeof info.updatedAt === "number" && Number.isFinite(info.updatedAt) ? info.updatedAt : undefined,
+      };
+      if (value?.subagentMessage && typeof value.subagentMessage.subagentId === "string" && typeof value.subagentMessage.content === "string"
+        && ["user", "assistant", "tool", "system"].includes(value.subagentMessage.role)) fields.subagentMessage = value.subagentMessage;
+    } catch { /* Ordinary or malformed tool output is handled by the existing renderer. */ }
+  }
+  cache.set(row, fields);
+  return fields;
+}
+
+/** Keep child activity out of the parent timeline, but retain an entry if its card is outside the loaded tail. */
+export function parentMessages<T extends Row>(rows: T[]): T[] {
+  const cardKeys = new Set(rows.flatMap(row => {
+    const info = subagentFields(row).subagent;
+    return info ? [`${row.generation}:${info.id}`] : [];
+  }));
+  const emitted = new Set<string>();
+  return rows.flatMap(row => {
+    const { subagent, subagentMessage } = subagentFields(row);
+    if (subagent?.parentId && cardKeys.has(`${row.generation}:${subagent.parentId}`)) return [];
+    if (!subagentMessage) return [row];
+    const key = `${row.generation}:${subagentMessage.subagentId}`;
+    if (cardKeys.has(key) || emitted.has(key)) return [];
+    emitted.add(key);
+    const info: SubagentInfo = { id: subagentMessage.subagentId, title: "子代理", status: "unknown", detailAvailability: "partial", detailReason: "正在读取子代理详情" };
+    return [{ ...row, id: `subagent-entry:${key}`, role: "tool", content: JSON.stringify({ title: info.title, subagent: info }) }];
+  });
+}
+
+export function childMessages(rows: Row[], id: string, generation: number) {
+  return rows.filter(row => row.generation === generation && (subagentFields(row).subagentMessage?.subagentId === id || subagentFields(row).subagent?.parentId === id));
+}

package/src/core/types.ts

@@ -1,3 +1,4 @@
+import type { SubagentInfo, SubagentMessage } from "./subagents";
 /**
  * 两套数据形状：
  *   · center 服务（cli-task-center）对话任务接口的返回（snake_case，原样保留，便于对照 API 文档）；
@@ -37,6 +38,10 @@ export interface CenterTurn {
   /** 这一轮的改动是否已合并回项目基线。 */
   merged?: boolean;
   merge_error?: string | null;
+  /** 保存本任务分支与合并项目主分支分别记录；旧版中枢不返回。 */
+  saved?: boolean;
+  saved_at?: string | null;
+  save_error?: string | null;
   created_at: string;
   started_at: string | null;
   ended_at: string | null;
@@ -203,6 +208,8 @@ export type ToolPeek =
   | { kind: "todos"; items: { text: string; status: string }[] };
 
 export interface ToolData {
+  subagent?: SubagentInfo;
+  subagentMessage?: SubagentMessage;
   title: string;
   detail?: string;
   result?: string;
@@ -228,8 +235,8 @@ export type NodeEvent =
   | { type: "dequeued"; msgId: string }
   | { type: "model"; model: string }
   | { type: "assistant"; content: string; msgId?: string; generation?: number; ts?: number }
-  | { type: "tool"; id: string; title: string; detail: string; peek?: ToolPeek; diff?: DiffLine[]; msgId?: string; generation?: number }
-  | { type: "tool_result"; id: string; content: string; isError: boolean; peek?: ToolPeek; msgId?: string }
+  | { type: "tool"; id: string; title: string; detail: string; peek?: ToolPeek; diff?: DiffLine[]; subagent?: SubagentInfo; subagentMessage?: SubagentMessage; msgId?: string; generation?: number; ts?: number }
+  | { type: "tool_result"; id: string; content: string; isError: boolean; peek?: ToolPeek; subagent?: SubagentInfo; subagentMessage?: SubagentMessage; msgId?: string; generation?: number; ts?: number }
   | { type: "ask"; id: string; questions: AskQuestion[]; msgId?: string; generation?: number }
   | { type: "ask_answered"; id: string; answers: AskAnswers; msgId?: string; awaiting_input?: 0 | 1 }
   | { type: "input"; input: InputRequest; msgId?: string; generation?: number; awaiting_input?: 0 | 1 }
@@ -338,6 +345,9 @@ export interface ConversationTurnCallback {
   context_reset: boolean;
   merged: boolean;
   merge_error: string | null;
+  saved?: boolean;
+  saved_at?: string | null;
+  save_error?: string | null;
   agent: string | null;
   resolved_model: string | null;
   total_tokens: number;

package/src/operator/node/Chat.tsx

@@ -1,4 +1,7 @@
 "use client";
+import { SubagentChatScope, SubagentHistoryBoundary } from "../../ui/SubagentChat";
+import { parentMessages, type SubagentTranscript } from "../../core/subagents";
+import { jget } from "./api";
 import { useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import type { AskQuestion, AskAnswers } from "./protocol/types";
 import { Icon } from "./icons";
@@ -79,6 +82,9 @@ export type ChatProps = {
 export function Chat(props: ChatProps) { return <ChatSession key={props.task.id} {...props} />; }
 function ChatSession({ project, task, tasks, agents, messages, running, transcriptLoading, older=0, onLoadOlder,
   controls, configBusy, composer, active=true, onSelectTask, onFork, onSend, onStop, onClear, onReconnect, onAnswer, onCancelQueued }: ChatProps) {
+  const parent = useMemo(() => parentMessages(messages), [messages]);
+  const loadSubagent = useCallback((id: string, generation: number, before?: string) => jget<SubagentTranscript>(`/api/tasks/${encodeURIComponent(task.id)}/subagents/${encodeURIComponent(id)}?generation=${generation}&limit=200${before ? `&before=${encodeURIComponent(before)}` : ""}`), [task.id]);
+  const renderSubagentMessage = useCallback((message: Msg, name: string) => <MessageView m={message} initial={false} hideWho={false} agent={task.agent} agentLabel={name} userLabel="收到的任务" speakerLabel={name} readOnly />, [task.agent]);
   const scrollRef = useRef<HTMLDivElement>(null);
   useChatScrollbar(scrollRef, task.id);
   const [quoteRequest, setQuoteRequest] = useState<Quote|null>(null);
@@ -182,7 +188,7 @@ function ChatSession({ project, task, tasks, agents, messages, running, transcri
   // reveals RENDER_STEP more above at a time (paging older messages in from the
   // server once the loaded ones run out) and drops rows far below; scrolling down
   // brings those back. "Jump to latest" returns to following.
-  const items = useMemo(() => buildTranscriptItems(messages, older > 0), [messages, older]);
+  const items = useMemo(() => buildTranscriptItems(parent, older > 0), [parent, older]);
   // First / last rendered row by key; null = derived (newest rows).
   const [win, setWin] = useState<{ start: string | null; end: string | null }>({ start: null, end: null });
   const { startIdx, endIdx } = useMemo(() => {
@@ -443,11 +449,11 @@ function ChatSession({ project, task, tasks, agents, messages, running, transcri
   useEffect(()=>{if(!task.parent_task_id && active) scrollToBottom("auto");},[active,task.id]);
   const queued = <QueuedMessages scopeKey={task.id} messages={messages.filter(message => message.role === "queued")} onCancel={message => stableCancelQueued(message.id)} attachmentUrl={attachment => `/api/tasks/${encodeURIComponent(attachment.taskId)}/uploads/${encodeURIComponent(attachment.name)}`} renderMessage={message => <MessageView m={message} initial={false} hideWho readOnly />} />;
   return (<FileLinkContext.Provider value={fileScope}>
-    <>
+    <SubagentChatScope scopeKey={task.id} messages={messages} load={loadSubagent} renderMessage={renderSubagentMessage}>
       <div className="transcript-wrap">
       <div className="transcript" ref={scrollRef} onScroll={onScroll}>
         <div className="tw">
-          <BranchHistory entries={flow.entries} tasks={tasks} agents={agents} onSelect={onSelectTask} onRetry={flow.retry} onQuote={(m,source,selected)=>quote(m,source,selected)} />
+          <SubagentHistoryBoundary><BranchHistory entries={flow.entries} tasks={tasks} agents={agents} onSelect={onSelectTask} onRetry={flow.retry} onQuote={(m,source,selected)=>quote(m,source,selected)} /></SubagentHistoryBoundary>
           {task.parent_task_id && <div className="flow-task-heading current"><span>沿此分支继续</span><strong>{task.title}</strong></div>}
           {transcriptLoading && messages.length === 0 && (
             // Snapshot hasn't streamed in yet — sketch a user turn and an agent
@@ -513,7 +519,7 @@ function ChatSession({ project, task, tasks, agents, messages, running, transcri
       </div>
       {composer?.show !== false ? <Composer tasks={tasks} onFork={onFork} task={task} agentLabel={agentLabel(agents, task.agent)} disabled={task.started!==1} configBusy={configBusy} running={running} onSend={async text => { const sent = await onSend(text); if (sent && !running) scrollToBottom("auto"); return sent; }} onStop={onStop} onClear={onClear} quoteRequest={quoteRequest} onQuoteHandled={()=>setQuoteRequest(null)} controls={controls}
         fileUpload={composer?.fileUpload} queued={queued} /> : queued}
-    </></FileLinkContext.Provider>
+    </SubagentChatScope></FileLinkContext.Provider>
   );
 
 }

package/src/operator/node/Transcript.tsx

@@ -1,4 +1,6 @@
 "use client";
+import { subagentFields } from "../../core/subagents";
+import { SubagentEntry } from "../../ui/SubagentChat";
 import { useContext } from "react";
 import { OperatorBoardContext } from "./boardInteraction";
 import { FileLinkContext } from "./fileLinks";
@@ -322,7 +324,7 @@ function QuotedUserText({ text }: { text: string }) {
   return quoted ? <><ReferenceCard title={quoted.quote.author} text={quoted.quote.text} renderContent={value => <Markdown>{value}</Markdown>} />{quoted.text && <Markdown>{quoted.text}</Markdown>}</> : <Markdown>{text}</Markdown>;
 }
 
-export const MessageView = memo(function MessageView({ m, initial, hideWho, running, agent, agentLabel = "智能体", onAnswer, onInput, onBrowser, onCancelQueued, onClear, onReconnect, onRetry, onQuote, readOnly }: { readOnly?: boolean; onQuote?: (m: Msg, selected?: string) => void; m: Msg; initial: boolean; hideWho: boolean; running?: boolean; agent?: string | null; agentLabel?: string; onAnswer?: (askId: string, questions: AskQuestion[], answers: AskAnswers) => void; onInput?: (inputId: string, values: string[]) => Promise<string | null>; onBrowser?: (action: "handback") => Promise<string | null>; onCancelQueued?: (pendingId: string) => void; onClear?: () => void; onReconnect?: () => void; onRetry?: (msgId: string) => void }) {
+export const MessageView = memo(function MessageView({ m, initial, hideWho, running, agent, agentLabel = "智能体", userLabel = "你", speakerLabel = "智能体", onAnswer, onInput, onBrowser, onCancelQueued, onClear, onReconnect, onRetry, onQuote, readOnly }: { readOnly?: boolean; userLabel?: string; speakerLabel?: string; onQuote?: (m: Msg, selected?: string) => void; m: Msg; initial: boolean; hideWho: boolean; running?: boolean; agent?: string | null; agentLabel?: string; onAnswer?: (askId: string, questions: AskQuestion[], answers: AskAnswers) => void; onInput?: (inputId: string, values: string[]) => Promise<string | null>; onBrowser?: (action: "handback") => Promise<string | null>; onCancelQueued?: (pendingId: string) => void; onClear?: () => void; onReconnect?: () => void; onRetry?: (msgId: string) => void }) {
   const openBoard=useContext(OperatorBoardContext);
   const fileScope=useContext(FileLinkContext);
   const onShowBrowser=()=>{if(fileScope&&openBoard)openBoard({kind:'browser',taskId:fileScope.taskId});else showTaskBrowser(fileScope?.taskId);};
@@ -345,6 +347,9 @@ export const MessageView = memo(function MessageView({ m, initial, hideWho, runn
   }
   if (m.role === "tool") {
     const data = toolDataOf(m);
+    const child = subagentFields(m);
+    if (child.subagentMessage) return null;
+    if (child.subagent) return <SubagentEntry info={child.subagent} generation={m.generation} />;
     if (data.input) {
       return <div className="msg msg-tool" inert={readOnly||undefined}><InputView input={data.input} agentLabel={agentLabel} onSubmit={onInput} onShowBrowser={onShowBrowser} /></div>;
     }
@@ -445,7 +450,7 @@ export const MessageView = memo(function MessageView({ m, initial, hideWho, runn
       {!hideWho && (
         <div className="who">
           <Avatar who={isUser ? "user" : "cc"} agent={agent} />
-          {isUser ? "你" : "智能体"}
+          {isUser ? userLabel : speakerLabel}
           {initial && <span className="badge">初始提示</span>}
           {m.ts != null && <span className="msg-time">{clockTime(m.ts)}</span>}
         </div>

package/src/operator/node/modals.tsx

@@ -200,6 +200,9 @@ export function NewTaskModal({ project, agents, tasks, onClose, onCreate, onOpen
   const [sendContext, setSendContext] = useState(project.send_context !== 0);
   const [deps, setDeps] = useState<string[]>([]);
   const [autoStart, setAutoStart] = useState(false);
+  const submitting = useRef(false);
+  const [creating, setCreating] = useState(false);
+  const [createError, setCreateError] = useState<string | null>(null);
   // The task's real browser (docs/BROWSER.md): offered only while the feature is on.
   const showBrowser = clientFeatures().browser;
   const [browser, setBrowser] = useState(false);
@@ -219,7 +222,14 @@ export function NewTaskModal({ project, agents, tasks, onClose, onCreate, onOpen
   // launch otherwise, so offering "start now" here would just produce a 400).
   const agentReady = selAgent ? !agentStateHint(selAgent) : true;
   const canStart = !blocked && agentReady;
-  const create = () => can && onCreate({ title: title.trim(), desc: desc.trim(), priority, agent, startNow: startNow && canStart, sendContext, depends_on: deps, auto_start: autoStart && deps.length > 0, browser: showBrowser && browser });
+  const create = async () => {
+    if (!can || submitting.current) return;
+    submitting.current = true; setCreating(true); setCreateError(null);
+    try {
+      await onCreate({ title: title.trim(), desc: desc.trim(), priority, agent, startNow: startNow && canStart, sendContext, depends_on: deps, auto_start: autoStart && deps.length > 0, browser: showBrowser && browser });
+    } catch (error) { setCreateError(error instanceof Error ? error.message : String(error)); }
+    finally { submitting.current = false; setCreating(false); }
+  };
   return (
     <Modal title="新建任务" sub={`${project.name} · 标题与描述构成 ${agentLabel(agents, agent)} 的任务上下文`} onClose={onClose}
       footer={<>
@@ -227,9 +237,10 @@ export function NewTaskModal({ project, agents, tasks, onClose, onCreate, onOpen
           title={blocked ? "暂时无法开始 —— 该任务被尚未完成的任务阻塞" : !agentReady ? `${selAgent?.label} ${agentStateHint(selAgent) === "未安装" ? "的命令行工具未安装在服务器上" : "尚未连接"}，无法启动会话` : undefined}>
           <input type="checkbox" checked={startNow && canStart} disabled={!canStart} onChange={(e) => setStartNow(e.target.checked)} /> 立即开始会话
         </label>
+        {createError && <span className="hlp" role="alert" style={{ color: "var(--red)", margin: 0 }}>创建未完成：{createError}</span>}
         <span className="spacer" />
         <button className="btn btn-ghost" onClick={onClose}>取消</button>
-        <button className="btn btn-accent" disabled={!can} onClick={create}>{Icon.plus()} 创建任务</button>
+        <button className="btn btn-accent" disabled={!can || creating} onClick={create}>{Icon.plus()} {creating ? "创建任务中…" : "创建任务"}</button>
       </>}>
       <div className="field">
         <div className="lab">标题</div>

package/src/operator/node/protocol/types.ts

@@ -1,3 +1,4 @@
+import type { SubagentInfo, SubagentMessage } from "../../../core/subagents";
 interface AgentProfile { base_url: string; token: string; model: string; wire_api?: string | null; api?: string | null; reasoning?: string | null }
 
 export type Priority = "hi" | "med" | "lo";
@@ -236,8 +237,8 @@ export type StreamEvent =
   | { type: "session"; sessionId: string }
   | { type: "model"; model: string }
   | { type: "assistant"; content: string }
-  | { type: "tool"; id: string; title: string; detail: string; peek?: ToolPeek; diff?: DiffLine[] }
-  | { type: "tool_result"; id: string; content: string; isError: boolean; peek?: ToolPeek }
+  | { type: "tool"; id: string; title: string; detail: string; peek?: ToolPeek; diff?: DiffLine[]; subagent?: SubagentInfo; subagentMessage?: SubagentMessage }
+  | { type: "tool_result"; id: string; content: string; isError: boolean; peek?: ToolPeek; subagent?: SubagentInfo; subagentMessage?: SubagentMessage }
   | { type: "ask"; id: string; questions: AskQuestion[] }
   | { type: "ask_answered"; id: string; answers: AskAnswers; awaiting_input?: 0 | 1 }
   // An input card was raised or settled (the whole card each time; upsert by msgId).
@@ -311,6 +312,8 @@ export type GlobalEvent = GlobalTaskEvent | AgentAuthEvent;
 
 // How a tool call is stored (JSON) in a "tool" message's content.
 export interface ToolData {
+  subagent?: SubagentInfo;
+  subagentMessage?: SubagentMessage;
   title: string;
   detail?: string;
   result?: string;

package/src/operator/node/useTaskStream.ts

@@ -119,8 +119,8 @@ export function useTaskStream({ selTask, selProjRef, agentsRef, setTaskRunning,
     else if (ev.type === "model") setTasks((prev) => prev.map((x) => (x.id === taskId ? { ...x, resolved_model: ev.model } : x)));
     else if (ev.type === "assistant") upsertMsg(taskId, { id: ev.msgId ?? `a-${Date.now()}-${Math.random()}`, role: "assistant", content: ev.content, generation: gen, ts: ev.ts });
     else if (ev.type === "tool") {
-      const data: ToolData = { title: ev.title, detail: ev.detail, peek: ev.peek, diff: ev.diff };
-      upsertMsg(taskId, { id: ev.msgId ?? `t-${Date.now()}-${Math.random()}`, role: "tool", content: JSON.stringify(data), generation: gen, toolId: ev.id });
+      const data: ToolData = { title: ev.title, detail: ev.detail, peek: ev.peek, diff: ev.diff, subagent: ev.subagent, subagentMessage: ev.subagentMessage };
+      upsertMsg(taskId, { id: ev.msgId ?? `t-${Date.now()}-${Math.random()}`, role: "tool", content: JSON.stringify(data), generation: gen, toolId: ev.id, ts: ev.ts });
     } else if (ev.type === "tool_result") {
       // Match by DB message id (works on snapshot-loaded messages too), falling
       // back to the in-memory tool_use id. Newest first: results land near the end.
@@ -128,10 +128,14 @@ export function useTaskStream({ selTask, selProjRef, agentsRef, setTaskRunning,
         const arr = prev[taskId] ?? [];
         let i = arr.length - 1;
         while (i >= 0 && (arr[i].role !== "tool" || (arr[i].id !== ev.msgId && arr[i].toolId !== ev.id))) i--;
-        if (i < 0) return prev;
+        if (i < 0) {
+          if (!ev.msgId || (!ev.subagent && !ev.subagentMessage)) return prev;
+          const data: ToolData = { title: ev.subagent?.title ?? ev.subagentMessage?.tool?.title ?? "子代理消息", subagent: ev.subagent, subagentMessage: ev.subagentMessage };
+          return { ...prev, [taskId]: [...arr, { id: ev.msgId, role: "tool", content: JSON.stringify(data), generation: gen, toolId: ev.id, ts: ev.ts }] };
+        }
         const m = arr[i];
         let content: string;
-        try { const d = JSON.parse(m.content) as ToolData; d.result = ev.content; d.isError = ev.isError; if (ev.peek) d.peek = ev.peek; content = JSON.stringify(d); } catch { return prev; }
+        try { const d = JSON.parse(m.content) as ToolData; d.result = ev.content; d.isError = ev.isError; if (ev.subagent) d.subagent = ev.subagent; if (ev.subagentMessage) d.subagentMessage = ev.subagentMessage; if (ev.peek) d.peek = ev.peek; content = JSON.stringify(d); } catch { return prev; }
         const next = arr.slice();
         next[i] = { ...m, content };
         return { ...prev, [taskId]: next };

package/src/operator.base.css

@@ -4,6 +4,35 @@
    (ported from the Claude Design hi-fi prototype)
    ========================================================================== */
 
+/* Native CLI subagents share the transcript renderer and keep their own viewer. */
+.subagent-chat-scope{display:flex;position:relative;flex:1;min-height:0;min-width:0;overflow:hidden;}
+.subagent-chat-main{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;}
+.subagent-chat-main>.session{flex:1;min-height:0;}
+.subagent-entry{display:flex;align-items:center;gap:9px;width:100%;padding:11px 13px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--surface);color:var(--ink);text-align:left;}
+.subagent-entry:not(:disabled):hover{border-color:var(--accent);background:var(--accent-soft);}
+.subagent-entry:disabled{cursor:default;}
+.subagent-entry-icon{display:flex;color:var(--accent);}
+.subagent-entry-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;}
+.subagent-entry svg{flex:none;width:16px;height:16px;}
+.subagent-status{font-size:11px;color:var(--ink-3);white-space:nowrap;}
+.subagent-status.running{color:var(--accent);}
+.subagent-status.completed{color:var(--green);}
+.subagent-status.failed{color:var(--red);}
+.subagent-chat-panel{display:flex;flex-direction:column;position:relative;flex:0 0 46%;width:46%;min-width:0;max-width:560px;min-height:0;border-left:1px solid var(--line-strong);background:var(--panel);z-index:30;}
+.subagent-chat-header{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);}
+.subagent-chat-header>div{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px;}
+.subagent-chat-header strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.subagent-chat-caption{font-size:10px;color:var(--ink-3);}
+.subagent-chat-header .icon-btn{flex:none;}
+.subagent-chat-transcript{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;}
+.subagent-chat-transcript .tw{width:100%;max-width:none;padding:16px;}
+.subagent-chat-transcript .msg{max-width:100%;}
+.subagent-chat-note{font-size:12px;color:var(--ink-3);line-height:1.6;margin-bottom:14px;overflow-wrap:anywhere;}
+.subagent-chat-note.error{color:var(--red);}
+.subagent-chat-latest{align-self:center;margin:6px 0;}
+.subagent-chat-scrim{position:absolute;inset:0;background:rgba(0,0,0,.25);z-index:29;}
+.subagent-chat-scope.narrow>.subagent-chat-panel{position:absolute;inset:0 0 0 auto;width:min(100%,560px);max-width:100%;box-shadow:-8px 0 24px rgba(0,0,0,.16);}
+
 :root{
   /* ---- cool near-black "mission control" palette (dark = default) ---- */
   --bg:#080a0e;

package/src/operator.css

@@ -6,6 +6,35 @@
    (ported from the Claude Design hi-fi prototype)
    ========================================================================== */
 
+/* Native CLI subagents share the transcript renderer and keep their own viewer. */
+.cli-ui .subagent-chat-scope{display:flex;position:relative;flex:1;min-height:0;min-width:0;overflow:hidden;}
+.cli-ui .subagent-chat-main{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;}
+.cli-ui .subagent-chat-main>.session{flex:1;min-height:0;}
+.cli-ui .subagent-entry{display:flex;align-items:center;gap:9px;width:100%;padding:11px 13px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--surface);color:var(--ink);text-align:left;}
+.cli-ui .subagent-entry:not(:disabled):hover{border-color:var(--accent);background:var(--accent-soft);}
+.cli-ui .subagent-entry:disabled{cursor:default;}
+.cli-ui .subagent-entry-icon{display:flex;color:var(--accent);}
+.cli-ui .subagent-entry-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;}
+.cli-ui .subagent-entry svg{flex:none;width:16px;height:16px;}
+.cli-ui .subagent-status{font-size:11px;color:var(--ink-3);white-space:nowrap;}
+.cli-ui .subagent-status.running{color:var(--accent);}
+.cli-ui .subagent-status.completed{color:var(--green);}
+.cli-ui .subagent-status.failed{color:var(--red);}
+.cli-ui .subagent-chat-panel{display:flex;flex-direction:column;position:relative;flex:0 0 46%;width:46%;min-width:0;max-width:560px;min-height:0;border-left:1px solid var(--line-strong);background:var(--panel);z-index:30;}
+.cli-ui .subagent-chat-header{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);}
+.cli-ui .subagent-chat-header>div{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px;}
+.cli-ui .subagent-chat-header strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.cli-ui .subagent-chat-caption{font-size:10px;color:var(--ink-3);}
+.cli-ui .subagent-chat-header .icon-btn{flex:none;}
+.cli-ui .subagent-chat-transcript{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;}
+.cli-ui .subagent-chat-transcript .tw{width:100%;max-width:none;padding:16px;}
+.cli-ui .subagent-chat-transcript .msg{max-width:100%;}
+.cli-ui .subagent-chat-note{font-size:12px;color:var(--ink-3);line-height:1.6;margin-bottom:14px;overflow-wrap:anywhere;}
+.cli-ui .subagent-chat-note.error{color:var(--red);}
+.cli-ui .subagent-chat-latest{align-self:center;margin:6px 0;}
+.cli-ui .subagent-chat-scrim{position:absolute;inset:0;background:rgba(0,0,0,.25);z-index:29;}
+.cli-ui .subagent-chat-scope.narrow>.subagent-chat-panel{position:absolute;inset:0 0 0 auto;width:min(100%,560px);max-width:100%;box-shadow:-8px 0 24px rgba(0,0,0,.16);}
+
 .cli-ui{
   /* ---- cool near-black "mission control" palette (dark = default) ---- */
   --bg:#080a0e;