@xgspz/cli-ui 0.6.14 → 0.6.16

package/src/operator/node/SessionRail.tsx

@@ -2,15 +2,15 @@
 import { subscribeWorkspaceFiles } from "../../board/fileWatch";
 import { retainFileScope } from "../../board/fileScope";
 
-import { useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { createPortal } from "react-dom";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import TaskChanges, { type ResolveResult } from "./TaskChanges";
 import { BrowserPane } from "./BrowserPane";
 import { fmtTokens } from "./format";
 import { clientFeatures } from "./protocol/features";
 import type { ServiceInfo } from "./protocol/types";
-import type { ProjectRow, TaskRow } from "./types";
+import type { Msg, ProjectRow, TaskRow } from "./types";
 
 import { clientId } from "../../core/id";
 import { useBoardState, readBoardState, visitBoardFile, reportBoardState, releaseBoardState, activateBoardState } from "./boardState";
@@ -19,16 +19,17 @@ import { useBoardPanels } from "../../board/panels";
 import { PanelControls, PanelTab, type InlineBoardLayout } from "../../board/PanelControls";
 import { FilesPane } from "../../board/FilesPane";
 import { FileViewer } from "../../board/FileViewer";
+import { pathHints, resolveMissingPath } from "../../board/pathResolve";
 import { useBoardUpload } from "../../board/useBoardUpload";
 import { getOperatorBoardBackend } from "./boardBackend";
 import { useOperatorContextEvents, useOperatorFileWatch } from "./boardEvents";
 import { OperatorBoardContext, registerOperatorBoard, OperatorBoardQuoteContext } from "./boardInteraction";
 import type { Quote } from "./composerDraft";
 import type { OperatorBoardOptions, OperatorBoardRequest } from "./boardInteraction";
-type OpenFile = { name?: string; reloadKey?:number; taskId: string; path: string; version: number; mtime?: number; size?: number };
+type OpenFile = { name?: string; reloadKey?:number; taskId: string; path: string; version: number; mtime?: number; size?: number; /** Completed from this relative path the agent wrote. */ resolvedFrom?: string };
 const fileKey = (file: Pick<OpenFile,"taskId"|"path">) => `file:${file.taskId}:${file.path}`;
 const LABEL:Record<string,string>={files:"工作区",changes:"改动",context:"上下文",preview:"预览",browser:"浏览器"};
-type Session = { n: number; summaryBefore: string | null };
+type Session = { n: number; summaryBefore: string | null; /** SessionView passes buildSessions(messages): path hints for file completion. */ messages?: Msg[] };
 
 // The live URL a project's dev server is reachable at when no registered
 // service reports one — local dev hits the project's stable port directly.
@@ -155,6 +156,19 @@ export function SessionRail({ project, task, sessions, running, onResolveWithAI,
   useOperatorContextEvents(task.id,!parentBoard,callbacks);
 
   const backend=useMemo(()=>getOperatorBoardBackend(),[]);
+  const sessionsRef=useRef(sessions);sessionsRef.current=sessions;
+  // Same completion as the center board: hints from this task's own conversation and visited files.
+  const resolveMissing=useCallback((path:string,signal:AbortSignal)=>{
+    const seen=(readBoardState(task.id)?.history??[]).filter(f=>(f.sourceId??task.id)===task.id).map(f=>f.path);
+    return resolveMissingPath(backend,task.id,path,pathHints(sessionsRef.current.flatMap(s=>s.messages??[]),seen),signal);
+  },[backend,task.id]);
+  const replaceFile=(file:OpenFile,to:string)=>{
+    aliases.current.set(fileKey(file),to);
+    const id=fileKey({taskId:file.taskId,path:to}),resolvedFrom=file.resolvedFrom??file.path;
+    setFiles(previous=>previous.some(f=>fileKey(f)===id)?previous.filter(f=>fileKey(f)!==fileKey(file)):previous.map(f=>fileKey(f)===fileKey(file)?{taskId:file.taskId,path:to,version:0,resolvedFrom}:f));
+    visitBoardFile(task.id,{sourceId:file.taskId,path:to});
+    setTab(id);
+  };
   const [restored,setRestored]=useState(false);
   const storageKey=`cli-ui:operator-files:${task.id}`;
   useEffect(()=>{
@@ -209,9 +223,13 @@ export function SessionRail({ project, task, sessions, running, onResolveWithAI,
     return () => stops.forEach(stop => stop());
   }, [backend, task.id, watchFiles, contentVisible, openedScope, directorySource]);
   const current=useRef(active);current.current=active;
+  // A relative path the agent wrote against a subfolder → the existing file it was
+  // completed to (board/pathResolve). Clicking the same link again opens that one.
+  const aliases=useRef(new Map<string,string>());
   const openFile=(taskId:string,path:string)=>{
     if(!available.includes('files'))return;
-    const clean=path.replace(/^\.\//,'').replace(/\/+$/,'');if(!clean)return;
+    const requested=path.replace(/^\.\//,'').replace(/\/+$/,'');if(!requested)return;
+    const clean=aliases.current.get(fileKey({taskId,path:requested}))??requested;
     const id=fileKey({taskId,path:clean});
     activateBoardState(task.id,owner);
     visitBoardFile(task.id,{sourceId:taskId,path:clean});
@@ -277,7 +295,7 @@ export function SessionRail({ project, task, sessions, running, onResolveWithAI,
       {!active&&<div className="cli-board-empty">看板模块已全部关闭。通过右上角“管理看板模块”重新打开。</div>}
       {active==='changes'&&<>
         {task.fork_commit&&<div className="fork-merge-note">基于「{task.fork_source_title}」派生。合并到 {project.branch} 时，也会包含来源分支尚未合并的改动。</div>}
-        <TaskChanges taskId={task.id} running={running} prUrl={task.pr_url} onMerged={onMerged} onPrCreated={onPrCreated} onResolveWithAI={async id=>{const result=await onResolveWithAI(id);if(result.ok&&!result.merged)onSwitchToChat();return result;}}/>
+        <TaskChanges taskId={task.id} running={running} refreshKey={tick} prUrl={task.pr_url} onMerged={onMerged} onPrCreated={onPrCreated} onResolveWithAI={async id=>{const result=await onResolveWithAI(id);if(result.ok&&!result.merged)onSwitchToChat();return result;}}/>
       </>}
       {contentVisible&&active==='files'&&<>
         {folderTask!==task.id&&<div className="fork-merge-note cli-source-workspace"><span>正在浏览来源任务的工作区。</span><button className="btn btn-ghost btn-sm" onClick={()=>{setFolderTask(task.id);setDir('');}}>返回当前工作区</button></div>}
@@ -289,7 +307,8 @@ export function SessionRail({ project, task, sessions, running, onResolveWithAI,
           onOpenPath={path=>openFile(file.taskId,path)}
           actions={quote?[{label:'引用到对话',onClick:()=>quote({id:`file:${file.taskId}:${file.path}`,sourceTaskId:file.taskId,author:`文件 ${file.path}`,text:`${file.taskId===task.id?'当前工作区':`来源任务 ${file.taskId} 的工作区`}文件 ${file.path}`})}]:[]}
           onQuoteText={quote?(text, context)=>quote({id:`selection:${file.taskId}:${file.path}`,sourceTaskId:file.taskId,author:`${file.taskId===task.id?"当前工作区":`来源任务 ${file.taskId} 的工作区`}文件 ${file.path}`,text:context?`文件修订：${context.revision}\n${text}`:text}):undefined}
-          onBack={()=>{setFolderTask(file.taskId);setDir(file.path.includes('/')?file.path.slice(0,file.path.lastIndexOf('/')):'');panels.show('files');setTab('files');}}/>
+          onBack={()=>{setFolderTask(file.taskId);setDir(file.path.includes('/')?file.path.slice(0,file.path.lastIndexOf('/')):'');panels.show('files');setTab('files');}}
+          resolveMissing={file.taskId===task.id?resolveMissing:undefined} onResolved={to=>replaceFile(file,to)} resolvedFrom={file.resolvedFrom}/>
       </>}
       {active==='preview'&&features.livePreview&&<PreviewPane project={project}/>}
       {active==='context'&&<ContextPane task={task} sessions={sessions} running={running} onClear={onClear}/>}

package/src/operator/node/SessionView.tsx

@@ -5,7 +5,7 @@ import type { Status, Priority, AskQuestion, AskAnswers } from "./protocol/types
 import { OperatorBoardContext, OperatorBoardQuoteContext, type OperatorBoardOptions, type OperatorBoardRequest, type OperatorBoardTarget } from "./boardInteraction";
 import { readDraft, writeDraft, type Quote } from "./composerDraft";
 import { clientFeatures } from "./protocol/features";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { type ResolveResult } from "./TaskChanges";
 import { fmtTokens, fmtCost, fmtJobCost, isAwaiting, buildSessions, usageSplit, costDisplay } from "./format";
 import {

package/src/operator/node/SettingsView.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { DEFAULT_SETTINGS, modelOptions, reasoningOptions, permissionOptions, type Settings, type AgentsBundle } from "./types";
 import { savedCustomModels, validModelId, withCustomModels } from "./protocol/customModels";
 import { capsFor, agentLabel, agentStateHint } from "./agents";

package/src/operator/node/TaskBoard.tsx

@@ -2,7 +2,7 @@
 
 import { useState, type ReactNode } from "react";
 import type { Status } from "./protocol/types";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { isAwaiting, relTime } from "./format";
 import { SEARCH_MIN, type ProjectRow, type TaskRow, type AgentsBundle, type TaskView } from "./types";
 import { agentLabel } from "./agents";

package/src/operator/node/TaskChanges.tsx

@@ -3,6 +3,8 @@
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Skel, ErrNote } from "./shared";
 import { diffLineKinds, hunkLines } from "../../board/diffLines";
+import { useDiffRefreshSignal } from "../../board/diffRefresh";
+import { observeLiveMessages } from "./liveStream";
 
 interface DiffFile {
   path: string;
@@ -133,9 +135,13 @@ const FileDiff = memo(function FileDiff({
   );
 });
 
+/** 几个刷新信号挤在一起时（节点 turn_end + 运行状态变成空闲）合成一次读：diff 在节点上要跑一组 git 命令。 */
+const REFRESH_COALESCE_MS = 250;
+
 export default function TaskChanges({
   taskId,
   running,
+  refreshKey = 0,
   prUrl,
   onMerged,
   onPrCreated,
@@ -143,6 +149,8 @@ export default function TaskChanges({
 }: {
   taskId: string;
   running?: boolean;
+  /** 工作区文件有变化（看板的文件事件）：节流重读。 */
+  refreshKey?: number;
   prUrl?: string; // GitHub PR already opened from this branch ("" / undefined = none)
   onMerged?: () => void;
   onPrCreated?: (url: string) => void;
@@ -193,14 +201,35 @@ export default function TaskChanges({
     load();
   }, [taskId, load]);
 
-  // The diff moves while the agent works — refetch when a turn finishes so a
-  // just-written change appears without a manual Refresh (same trigger the
-  // SyncBanner uses). Only on the running→idle transition; mount already loads.
+  // The diff moves while the agent works. Refresh from events only (no polling), with the
+  // same rules as the center board (useDiffRefreshSignal):
+  //   · every node round end (turn_end on the task's live stream — queued messages can keep
+  //     `running` true across rounds, so running→idle alone misses them) and running→idle;
+  //   · a finished tool (tool_result: it may have written files) or a workspace file event —
+  //     throttled to one read per DIFF_LIVE_GAP_MS, always one more after the last change;
+  //   · signals that arrive while the page is hidden are replayed once when it is shown again.
+  // Mount already loads. The live observer rides the existing task stream; it opens nothing.
+  const [settle, setSettle] = useState(0);
+  const [toolRuns, setToolRuns] = useState(0);
+  useEffect(() => observeLiveMessages(`/api/tasks/${taskId}/messages`, (raw) => {
+    let type: unknown;
+    try { type = (JSON.parse(raw) as { type?: unknown } | null)?.type; } catch { return; }
+    if (type === "turn_end") setSettle((n) => n + 1);
+    else if (type === "tool_result") setToolRuns((n) => n + 1);
+  }), [taskId]);
   const wasRunning = useRef(running);
   useEffect(() => {
-    if (wasRunning.current && !running) load();
+    if (wasRunning.current && !running) setSettle((n) => n + 1);
     wasRunning.current = running;
-  }, [running, load]);
+  }, [running]);
+  const signal = useDiffRefreshSignal(settle, toolRuns + refreshKey);
+  const lastSignal = useRef(signal);
+  useEffect(() => {
+    if (lastSignal.current === signal) return;
+    lastSignal.current = signal;
+    const timer = setTimeout(() => { void load(); }, REFRESH_COALESCE_MS);
+    return () => clearTimeout(timer);
+  }, [signal, load]);
 
   // Track which file is at the top of the scroll area to highlight it in the list.
   useEffect(() => {

package/src/operator/node/TaskHero.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { SLABEL, type TaskRow, type ProjectRow } from "./types";
 import { StatusDot } from "./shared";
 

package/src/operator/node/TasksColumn.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { isAwaiting, relTime } from "./format";
 import { SLABEL, AWAIT_LABEL, SEARCH_MIN, type ProjectRow, type TaskRow, type AgentsBundle, type TaskView } from "./types";
 import { agentLabel } from "./agents";

package/src/operator/node/Transcript.tsx

@@ -5,13 +5,13 @@ import { useContext } from "react";
 import { OperatorBoardContext } from "./boardInteraction";
 import { FileLinkContext } from "./fileLinks";
 
-import { memo, useId, useState } from "react";
-import type { ToolData, ToolPeek, AskQuestion, AskAnswers, InputRequest } from "./protocol/types";
-import { Icon } from "./icons";
+import { memo, useState } from "react";
+import type { AskQuestion, AskAnswers } from "./protocol/types";
+import { Icon } from "../../ui/icons";
 import { Markdown } from "./Markdown";
 import { splitMessage } from "../../core/blocks";
 import { withoutBoardContext } from "../../board/context";
-import { clockTime, diffCls, splitAttachments, type MsgAttachment } from "./format";
+import { clockTime, splitAttachments, type MsgAttachment } from "./format";
 import { CONTEXT_OVERFLOW_NOTICE } from "./protocol/promptLimits";
 import { AUTH_EXPIRED_NOTICE } from "./protocol/authFailure";
 import { USAGE_LIMIT_NOTICE } from "./protocol/usageLimit";
@@ -19,237 +19,22 @@ import { APPROVAL_BLOCKED_NOTICE } from "./protocol/approvalFailure";
 import type { Msg } from "./types";
 import { clientFeatures } from "./protocol/features";
 import { Avatar } from "./shared";
-import { toolDataOf } from "./transcriptModel";
+import { toolDataOf } from "../../ui/transcriptModel";
 import { ReferenceCard } from "../../ui/ReferenceCard";
+// Tool / question / browser-input cards and the /clear break are the shared ones
+// (ui/Transcript); this file only draws the node's message rows around them.
+import { AskView, InputView, ToolView, SessionBreak } from "../../ui/Transcript";
+export { SessionBreak };
 import { splitQuotedMessage } from "../../ui/reference";
 
-// The always-visible "peek" tier — Claude Code's `⎿` line. Counts show no
-// content; diffs/snippets show a capped hunk with a clickable "+N more" that
-// opens the full body. TodoWrite renders its checklist inline.
-function PeekView({ peek, expandable, onExpand }: { peek: ToolPeek; expandable: boolean; onExpand: () => void }) {
-  const corner = <span className="tcorner">⎿</span>;
-  if (peek.kind === "count") {
-    return (
-      <button className="tpeek tpeek-count" style={{ cursor: expandable ? "pointer" : "default" }} onClick={() => expandable && onExpand()}>
-        {corner}<span className="tpeek-txt">{peek.text}</span>
-        {expandable && <span className="tpeek-more">展开</span>}
-      </button>
-    );
-  }
-  if (peek.kind === "todos") {
-    return (
-      <div className="tpeek tpeek-todos">
-        {peek.items.map((t, i) => (
-          <div className={`tdo ${t.status}`} key={i}>
-            <span className="tdo-box">{t.status === "completed" ? "✔" : t.status === "in_progress" ? "▣" : "▢"}</span>
-            <span className="tdo-txt">{t.text}</span>
-          </div>
-        ))}
-      </div>
-    );
-  }
-  if (peek.kind === "diff") {
-    return (
-      <div className="tpeek tpeek-diff">
-        <div className="tpeek-sum">{corner}<span className="dstat add">+{peek.added}</span><span className="dstat del">−{peek.removed}</span>{peek.label && <span className="tpeek-txt">{peek.label}</span>}</div>
-        <pre className="tpeek-pre diff">{peek.lines.map((l, i) => <div className={`dl ${diffCls(l.sign)}`} key={i}>{l.sign} {l.text}</div>)}</pre>
-        {peek.truncated ? <button className="tpeek-more btn-link" onClick={onExpand}>还有 {peek.truncated} 行</button> : null}
-      </div>
-    );
-  }
-  // lines (Bash output)
-  return (
-    <div className="tpeek tpeek-lines">
-      {peek.label && <div className="tpeek-sum">{corner}<span className="tpeek-txt">{peek.label}</span></div>}
-      <pre className="tpeek-pre">{peek.lines.join("\n") || "（无输出）"}</pre>
-      {peek.truncated ? <button className="tpeek-more btn-link" onClick={onExpand}>还有 {peek.truncated} 行</button> : null}
-    </div>
-  );
-}
 
-function ToolView({ data }: { data: ToolData }) {
-  const [open, setOpen] = useState<boolean | null>(null);
-  const bodyId = useId();
-  const hasDiff = !!data.diff?.length;
-  const expandable = !!(data.detail || hasDiff || data.result !== undefined);
-  // Failures surface their output automatically, like Claude Code.
-  const showBody = open ?? (!!data.isError && data.result !== undefined);
-  return (
-    <div className="tool">
-      <button className="tool-h" title={data.title} aria-expanded={expandable ? showBody : undefined} aria-controls={expandable ? bodyId : undefined} style={{ cursor: expandable ? "pointer" : "default" }} onClick={() => expandable && setOpen(!showBody)}>
-        {expandable && <span className={`tchev ${showBody ? "open" : ""}`}>{Icon.chevRight()}</span>}
-        <span className="tg">{data.title}</span>
-        {data.result !== undefined && <span className={data.isError ? "tx" : "tcheck"}>{data.isError ? Icon.x() : Icon.check()}</span>}
-      </button>
-      {data.peek && !showBody && <PeekView peek={data.peek} expandable={expandable} onExpand={() => setOpen(true)} />}
-      {showBody && (
-        <div className="tool-body" id={bodyId}>
-          {data.detail && <pre className="tool-pre">{data.detail}</pre>}
-          {hasDiff && (
-            <pre className="tool-pre diff">{data.diff!.map((l, i) => <div className={`dl ${diffCls(l.sign)}`} key={i}>{l.sign} {l.text}</div>)}</pre>
-          )}
-          {data.result !== undefined && (
-            <>
-              {(data.detail || hasDiff) && <div className="tool-divider">结果</div>}
-              <pre className={`tool-pre ${data.isError ? "err" : ""}`}>{data.result || "（无输出）"}</pre>
-            </>
-          )}
-        </div>
-      )}
-    </div>
-  );
-}
 
-// Interactive AskUserQuestion card: option pickers (+ an "Other" free-text per
-// question) while pending; a read-only summary once answered.
-function AskView({ data, agentLabel, onAnswer }: { data: ToolData; agentLabel: string; onAnswer: (answers: AskAnswers) => void }) {
-  const questions = data.ask?.questions ?? [];
-  const existing = data.ask?.answers;
-  const [state, setState] = useState(() => questions.map(() => ({ picked: [] as string[], other: "" })));
-  const [submitted, setSubmitted] = useState(false);
-
-  if (existing) {
-    return (
-      <div className="ask answered">
-        <div className="ask-head">{Icon.spark()} 你的回答</div>
-        {questions.map((q, i) => (
-          <div className="ask-q" key={i}>
-            <div className="ask-qh"><span className="ask-chip">{q.header}</span>{q.question}</div>
-            <div className="ask-picked">{(existing[i] ?? []).join("、") || "—"}</div>
-          </div>
-        ))}
-      </div>
-    );
-  }
-
-  const toggle = (qi: number, label: string, multi: boolean) =>
-    setState((s) => s.map((st, i) => {
-      if (i !== qi) return st;
-      if (multi) {
-        const has = st.picked.includes(label);
-        return { ...st, picked: has ? st.picked.filter((l) => l !== label) : [...st.picked, label] };
-      }
-      return { picked: [label], other: "" }; // single-select replaces, clears Other
-    }));
-  const setOther = (qi: number, v: string) =>
-    setState((s) => s.map((st, i) => (i === qi ? (questions[i].multiSelect ? { ...st, other: v } : { picked: [], other: v }) : st)));
-
-  const answers: AskAnswers = state.map((st) => [...st.picked, ...(st.other.trim() ? [st.other.trim()] : [])]);
-  const complete = answers.every((a) => a.length > 0);
-  const submit = () => { if (complete && !submitted) { setSubmitted(true); onAnswer(answers); } };
-
-  return (
-    <div className="ask">
-      <div className="ask-head">{Icon.spark()} {agentLabel} 需要你的输入</div>
-      {questions.map((q, i) => (
-        <div className="ask-q" key={i}>
-          <div className="ask-qh"><span className="ask-chip">{q.header}</span>{q.question}{q.multiSelect && <span className="ask-multi">可多选</span>}</div>
-          <div className="ask-opts">
-            {q.options.map((o) => (
-              <button key={o.label} className={`ask-opt ${state[i].picked.includes(o.label) ? "on" : ""}`} onClick={() => toggle(i, o.label, !!q.multiSelect)} disabled={submitted}>
-                <span className="ask-opt-l">{o.label}</span>
-                {o.description && <span className="ask-opt-d">{o.description}</span>}
-              </button>
-            ))}
-            <input className="ask-other" placeholder="其他…" value={state[i].other} disabled={submitted} onChange={(e) => setOther(i, e.target.value)} />
-          </div>
-        </div>
-      ))}
-      <div className="ask-foot">
-        <button className="btn btn-accent btn-sm" onClick={submit} disabled={!complete || submitted}>{submitted ? "发送中…" : "发送回答"}</button>
-      </div>
-    </div>
-  );
-}
 
 /** Ask the session rail to show this task's browser (SessionRail / SessionView listen). */
 export function showTaskBrowser(taskId?: string): void {
   window.dispatchEvent(new CustomEvent("orch:show-browser", {detail:{taskId}}));
 }
 
-// browser_ask_user card (lib/browserInput.ts): what the agent needs to carry on
-// in the browser — codes, accounts, passwords, choices — typed or picked right
-// here while the browser waits on the page. Passwords are masked and never kept.
-function InputView({ input, agentLabel, onSubmit, onShowBrowser }: { onShowBrowser?:()=>void; input: InputRequest; agentLabel: string; onSubmit?: (id: string, values: string[]) => Promise<string | null> }) {
-  const [vals, setVals] = useState<string[]>(() => input.fields.map(() => ""));
-  const [shown, setShown] = useState<boolean[]>(() => input.fields.map(() => false));
-  const [busy, setBusy] = useState(false);
-  const [err, setErr] = useState<string | null>(null);
-  const browser = clientFeatures().browser;
-
-  if (input.status !== "pending") {
-    return (
-      <div className="ask answered">
-        <div className="ask-head">{Icon.lock()} {input.status === "answered" ? "你提供的信息" : "已取消 —— 这一轮被停止了"}</div>
-        <div className="ask-q"><div className="ask-qh">{input.message}</div></div>
-        {input.status === "answered" && input.fields.map((f, i) => (
-          <div className="ask-q" key={i}>
-            <div className="ask-qh"><span className="ask-chip">{f.label}</span></div>
-            <div className="ask-picked">{f.secret ? "••••••（只交给浏览器脚本，没有保存，也没有发给模型）" : input.values?.[i] ?? "—"}</div>
-          </div>
-        ))}
-      </div>
-    );
-  }
-
-  const set = (i: number, v: string) => setVals((a) => a.map((x, j) => (j === i ? v : x)));
-  const complete = vals.every((v) => v.trim());
-  const submit = async () => {
-    if (!complete || busy || !onSubmit) return;
-    setBusy(true);
-    setErr(null);
-    try {
-      const e = await onSubmit(input.id, vals.map((v, i) => input.fields[i].secret ? v : v.trim()));
-      if (e) { setErr(e); setBusy(false); }
-    } catch (error) {
-      setErr(error instanceof Error ? error.message : "提交失败，请重试");
-      setBusy(false);
-    }
-  };
-  return (
-    <div className="ask">
-      <div className="ask-head">{Icon.lock()} {agentLabel} 需要你提供信息 · 浏览器正停在这一页等待</div>
-      <div className="ask-q"><div className="ask-qh" style={{ whiteSpace: "pre-wrap" }}>{input.message}</div></div>
-      {input.fields.map((f, i) => (
-        <div className="ask-q" key={i}>
-          <div className="ask-qh"><span className="ask-chip">{f.label}</span>{f.secret && <span className="ask-multi">保密</span>}</div>
-          <div className="ask-opts">
-            {f.options?.map((o) => (
-              <button key={o} className={`ask-opt ${vals[i] === o ? "on" : ""}`} onClick={() => set(i, o)} disabled={busy}>
-                <span className="ask-opt-l">{o}</span>
-              </button>
-            ))}
-            <div className="input-row">
-              <input
-                className="ask-other"
-                type={f.secret && !shown[i] ? "password" : "text"}
-                autoComplete={f.secret ? "new-password" : "off"}
-                placeholder={f.options?.length ? "其他…" : f.placeholder || `输入${f.label}`}
-                value={f.options?.includes(vals[i]) ? "" : vals[i]}
-                disabled={busy}
-                autoFocus={i === 0 && !f.options?.length}
-                onChange={(e) => set(i, e.target.value)}
-                onKeyDown={(e) => { if (e.key === "Enter" && !e.nativeEvent.isComposing) void submit(); }}
-              />
-              {f.secret && (
-                <button className="btn btn-ghost btn-sm" type="button" onClick={() => setShown((a) => a.map((x, j) => (j === i ? !x : x)))}>
-                  {shown[i] ? "隐藏" : "显示"}
-                </button>
-              )}
-            </div>
-          </div>
-        </div>
-      ))}
-      <div className="ask-foot" style={{ gap: 8, alignItems: "center" }}>
-        {err && <span className="input-err">{err}</span>}
-        {input.fields.some((f) => f.secret) && !err && <span className="input-note">密码只交给浏览器脚本，不保存、不发给模型</span>}
-        <span style={{ flex: 1 }} />
-        {browser && <button className="btn btn-line btn-sm" onClick={onShowBrowser ?? (()=>showTaskBrowser())}>查看浏览器</button>}
-        <button className="btn btn-accent btn-sm" onClick={() => void submit()} disabled={!complete || busy}>{busy ? "发送中…" : "提交"}</button>
-      </div>
-    </div>
-  );
-}
 
 // The transcript lines browser_handoff / a page prompt write (lib/browserHandoff.ts,
 // lib/browser.ts — both start with 🖐): the user has to act in the page itself. Buttons to open the live browser and to hand
@@ -351,7 +136,7 @@ export const MessageView = memo(function MessageView({ m, initial, hideWho, runn
     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>;
+      return <div className="msg msg-tool" inert={readOnly||undefined}><InputView input={data.input} agentLabel={agentLabel} onSubmit={onInput} onBrowser={clientFeatures().browser ? onShowBrowser ?? (() => showTaskBrowser()) : undefined} unavailableNote={null} /></div>;
     }
     if (data.ask) {
       return <div className="msg msg-tool" inert={readOnly||undefined}><AskView data={data} agentLabel={agentLabel} onAnswer={(answers) => onAnswer?.(data.ask?.id || m.toolId || "", data.ask?.questions ?? [], answers)} /></div>;
@@ -471,15 +256,3 @@ export const MessageView = memo(function MessageView({ m, initial, hideWho, runn
   );
 });
 
-export function SessionBreak({ summary }: { summary: string }) {
-  return (
-    <div className="sbreak">
-      <span className="ln" />
-      <div className="card">
-        <div className="cl">{Icon.clear()} 上下文已清空 · 摘要已保存</div>
-        <div className="ct">{summary}</div>
-      </div>
-      <span className="ln" />
-    </div>
-  );
-}

package/src/operator/node/Welcome.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useState } from "react";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { Modal } from "./Modal";
 
 // Coach marks + the post-merge nudge for the built-in "Welcome" tutorial project

package/src/operator/node/WorktreePrune.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { Icon } from "./icons";
+import { Icon } from "../../ui/icons";
 import { jget, jsend } from "./api";
 import { LoadNote, ErrNote } from "./shared";
 import { fmtBytes } from "./format";

package/src/operator/node/boardInteraction.ts

@@ -1,4 +1,5 @@
 import { createContext } from 'react';
+import { createBoardSurfaces } from '../../board/linkage';
 import type { WorkspaceHandlers } from '../../core/provider';
 import type { CliEvent } from '../../core/store';
 import type { Quote } from './composerDraft';
@@ -10,6 +11,8 @@ export const OperatorBoardContext = createContext<((target: OperatorBoardTarget)
 
 export const OperatorBoardQuoteContext = createContext<((quote:Quote)=>void)|null>(null);
 
-const surfaces=new Set<(target:OperatorBoardTarget)=>boolean>();
-export function registerOperatorBoard(surface:(target:OperatorBoardTarget)=>boolean):()=>void {surfaces.add(surface);return()=>{surfaces.delete(surface);};}
-export function openOperatorBoard(target:OperatorBoardTarget):boolean {for(const surface of [...surfaces].reverse())if(surface(target))return true;return false;}
+// The page's board receivers: the same registry the center store uses (board/linkage),
+// one instance for the node workspace. Last registered is asked first.
+const surfaces=createBoardSurfaces<OperatorBoardTarget>();
+export function registerOperatorBoard(surface:(target:OperatorBoardTarget)=>boolean):()=>void {return surfaces.register(surface);}
+export function openOperatorBoard(target:OperatorBoardTarget):boolean {return surfaces.open(target);}

package/src/operator/node/boardState.ts

@@ -1,10 +1,12 @@
 import { useSyncExternalStore } from 'react';
 import type { BoardFile, BoardView } from '../../board/workspace';
-import { rememberBoardFile, cloneBoardView, reportBoardOwner, activateBoardOwner, selectedBoardOwner } from '../../board/context';
+import { rememberBoardFile, cloneBoardView } from '../../board/context';
+import { createBoardOwners } from '../../board/linkage';
 import { notifyCallback } from '../../core/callbacks';
 const cache=new Map<string,{stamp:string;view:BoardView|null}>();
 const listeners=new Map<string,Set<()=>void>>();
-const owners=new Map<string,Map<string,BoardView>>();
+// Which of a task's boards is in effect: the same owner rules as the center store (board/linkage).
+const owners=createBoardOwners();
 // Mounted directory identity is transient; it must not become retained browsing history.
 const directorySources=new Map<string,Map<string,string>>();
 const key=(id:string)=>`cli-ui:operator-board:${id}`;
@@ -24,8 +26,8 @@ export function readBoardState(taskId:string):BoardView|null {
 }
 /** Internal: background refresh covers every visible owner, not just the selected board. */
 export function readVisibleBoardSources(taskId:string):string[] {
- const active=owners.get(taskId);
- const views=active?.size?[...active]:[['',readBoardState(taskId)] as const];
+ const active=owners.entries(taskId);
+ const views=active.length?active:[['',readBoardState(taskId)] as const];
  const sources=new Set<string>();
  for(const [owner,view] of views){
   if(!view||view.visible===false)continue;
@@ -51,24 +53,21 @@ export function visitBoardFile(taskId:string,file:BoardFile):void {
  publishBoardState(taskId,{...current,history:recent([...(current.history??[]),file])});
 }
 export function reportBoardState(taskId:string,owner:string,view:BoardView,directorySource?:string):void {
- const sources=owners.get(taskId)??new Map<string,BoardView>();
  if(directorySource){const directories=directorySources.get(taskId)??new Map<string,string>();directories.set(owner,directorySource);directorySources.set(taskId,directories);}
  else{const directories=directorySources.get(taskId);directories?.delete(owner);if(!directories?.size)directorySources.delete(taskId);}
  const history=readBoardState(taskId)?.history??view.history??[];
- const selected=reportBoardOwner(sources,owner,{...view,history});owners.set(taskId,sources);
- if(selected)publishBoardState(taskId,{...selected[1],history});
+ const selected=owners.report(taskId,owner,{...view,history});
+ if(selected)publishBoardState(taskId,{...selected,history});
 }
 export function activateBoardState(taskId:string,owner:string):void {
- const sources=owners.get(taskId);if(!sources)return;
- const selected=activateBoardOwner(sources,owner);if(!selected)return;
- const previous=readBoardState(taskId),file=selected[1].current;
+ const selected=owners.activate(taskId,owner);if(!selected)return;
+ const previous=readBoardState(taskId),file=selected.current;
  const history=file?rememberBoardFile(previous?.history??[],file):previous?.history??[];
- publishBoardState(taskId,{...selected[1],history});
+ publishBoardState(taskId,{...selected,history});
 }
 export function releaseBoardState(taskId:string,owner:string):void {
- const sources=owners.get(taskId);sources?.delete(owner);if(!sources?.size)owners.delete(taskId);
+ const remaining=owners.report(taskId,owner,null);
  const directories=directorySources.get(taskId);directories?.delete(owner);if(!directories?.size)directorySources.delete(taskId);
  const previous=readBoardState(taskId);if(!previous)return;
- const remaining=sources?.size?selectedBoardOwner(sources)?.[1]:null;
  publishBoardState(taskId,remaining?{...remaining,history:previous.history,visible:remaining.visible!==false}:{...previous,visible:false});
 }