@robota-sdk/agent-ui-web 3.1.2 → 3.2.1

package/dist/index.js

@@ -1,4 +1,4 @@
-import React, { createContext, forwardRef, useCallback, useContext, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
+import React, { createContext, createElement, forwardRef, useCallback, useContext, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { decodeFrame, decodeServerMessage } from "@robota-sdk/agent-transport/client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import ReactMarkdown from "react-markdown";
@@ -514,13 +514,6 @@ function useAppViewRequests(send, isConnected) {
 }
 //#endregion
 //#region src/hooks/use-execution-detail.ts
-/**
-* #3288 §1: the detail sheet's own correlated request/response state — which entry is open, its
-* accumulated transcript records, and whether more can be loaded. Owned independently from chat
-* state, the same way `use-personal-usage.ts` owns the usage-report protocol: one `requestId` per
-* outstanding read, so a stale reply for an entry the operator already closed (or a page they moved
-* past) is dropped rather than clobbering what is now on screen.
-*/
 let requestCounter$5 = 0;
 function nextRequestId$5() {
 	requestCounter$5 += 1;
@@ -532,14 +525,27 @@ function useExecutionDetailState(send) {
 	const [records, setRecords] = useState([]);
 	const [error, setError] = useState(null);
 	const [complete, setComplete] = useState(false);
+	const [mode, setMode] = useState("live");
+	const [unreadable, setUnreadable] = useState();
 	const requestIdRef = useRef(null);
 	const entryIdRef = useRef(null);
+	const modeRef = useRef("live");
 	const nextCursorRef = useRef(void 0);
-	const readPage = useCallback((entryId, cursor) => {
+	const queuedRef = useRef(null);
+	const timerRef = useRef(null);
+	const lastReadAtRef = useRef(0);
+	const readPage = useCallback((entryId, cursor, refresh = false) => {
+		if (requestIdRef.current !== null) {
+			if (!refresh || queuedRef.current === null || queuedRef.current.refresh) queuedRef.current = {
+				cursor,
+				refresh
+			};
+			return;
+		}
 		const requestId = nextRequestId$5();
 		requestIdRef.current = requestId;
-		entryIdRef.current = entryId;
-		setStatus("loading");
+		lastReadAtRef.current = Date.now();
+		if (!refresh) setStatus("loading");
 		setError(null);
 		send({
 			type: "read-execution-detail",
@@ -548,51 +554,118 @@ function useExecutionDetailState(send) {
 			cursor
 		});
 	}, [send]);
+	const clearPending = useCallback(() => {
+		if (timerRef.current !== null) clearTimeout(timerRef.current);
+		timerRef.current = null;
+		queuedRef.current = null;
+	}, []);
+	useEffect(() => clearPending, [clearPending]);
+	const openExecutionDetail = useCallback((entryId) => {
+		clearPending();
+		requestIdRef.current = null;
+		entryIdRef.current = entryId;
+		modeRef.current = "live";
+		setMode("live");
+		setOpenEntryId(entryId);
+		setRecords([]);
+		setUnreadable(void 0);
+		setComplete(false);
+		nextCursorRef.current = void 0;
+		readPage(entryId);
+	}, [clearPending, readPage]);
+	const loadMoreExecutionDetail = useCallback(() => {
+		if (!openEntryId || status === "loading" || complete) return;
+		readPage(openEntryId, nextCursorRef.current);
+	}, [
+		openEntryId,
+		status,
+		complete,
+		readPage
+	]);
+	const changeMode = useCallback((next) => {
+		const entryId = entryIdRef.current;
+		if (!entryId) return;
+		clearPending();
+		modeRef.current = next;
+		setMode(next);
+		setRecords([]);
+		setUnreadable(void 0);
+		setComplete(false);
+		setStatus("loading");
+		nextCursorRef.current = void 0;
+		readPage(entryId, next === "transcript" ? { offset: 0 } : void 0);
+	}, [clearPending, readPage]);
+	const showEarlierExecutionDetail = useCallback(() => changeMode("transcript"), [changeMode]);
+	const showLiveExecutionDetail = useCallback(() => changeMode("live"), [changeMode]);
+	const closeExecutionDetail = useCallback(() => {
+		clearPending();
+		setOpenEntryId(null);
+		requestIdRef.current = null;
+		entryIdRef.current = null;
+		setRecords([]);
+		setUnreadable(void 0);
+		setStatus("idle");
+		setError(null);
+		setComplete(false);
+	}, [clearPending]);
+	const scheduleRefresh = useCallback((entryId) => {
+		if (timerRef.current !== null) return;
+		const delay = Math.max(0, 250 - (Date.now() - lastReadAtRef.current));
+		timerRef.current = setTimeout(() => {
+			timerRef.current = null;
+			if (entryIdRef.current === entryId && modeRef.current === "live") readPage(entryId, void 0, true);
+		}, delay);
+	}, [readPage]);
+	const handleExecutionWorkspace = useCallback((snapshot) => {
+		const entryId = entryIdRef.current;
+		if (!entryId || modeRef.current !== "live") return;
+		const entry = snapshot.entries.find((item) => item.id === entryId);
+		if (entry?.resumeSessionId && entry.controls.includes("attach")) scheduleRefresh(entryId);
+	}, [scheduleRefresh]);
 	return {
 		openEntryId,
 		executionDetailStatus: status,
 		executionDetailRecords: records,
 		executionDetailError: error,
 		executionDetailComplete: complete,
-		openExecutionDetail: useCallback((entryId) => {
-			setOpenEntryId(entryId);
-			setRecords([]);
-			setComplete(false);
-			nextCursorRef.current = void 0;
-			readPage(entryId);
-		}, [readPage]),
-		loadMoreExecutionDetail: useCallback(() => {
-			if (!openEntryId || status === "loading" || complete) return;
-			readPage(openEntryId, nextCursorRef.current);
-		}, [
-			openEntryId,
-			status,
-			complete,
-			readPage
-		]),
-		closeExecutionDetail: useCallback(() => {
-			setOpenEntryId(null);
-			requestIdRef.current = null;
-			entryIdRef.current = null;
-			setRecords([]);
-			setStatus("idle");
-			setError(null);
-			setComplete(false);
-		}, []),
+		executionDetailMode: mode,
+		executionDetailUnreadable: unreadable,
+		openExecutionDetail,
+		loadMoreExecutionDetail,
+		showEarlierExecutionDetail,
+		showLiveExecutionDetail,
+		closeExecutionDetail,
 		handleExecutionDetailMessage: useCallback((msg) => {
 			if (msg.type !== "execution_detail" && msg.type !== "execution_detail_error") return false;
 			if (requestIdRef.current !== msg.requestId) return true;
-			if (msg.type === "execution_detail_error") {
+			requestIdRef.current = null;
+			const queued = queuedRef.current;
+			queuedRef.current = null;
+			if (!queued || queued.refresh) if (msg.type === "execution_detail_error") {
 				setStatus("error");
 				setError(msg.message);
-				return true;
+			} else {
+				setRecords((previous) => msg.page.cursor === void 0 || msg.page.cursor.offset === 0 ? msg.page.records : [...previous, ...msg.page.records]);
+				setUnreadable((previous) => {
+					const current = msg.page.unreadable;
+					if (msg.page.cursor === void 0 || msg.page.cursor.offset === 0) return current;
+					if (!previous) return current;
+					if (!current) return previous;
+					return {
+						locked: previous.locked + current.locked,
+						noKeys: previous.noKeys + current.noKeys,
+						doesNotOpen: previous.doesNotOpen + current.doesNotOpen
+					};
+				});
+				nextCursorRef.current = msg.page.nextCursor;
+				setComplete(msg.page.nextCursor === void 0);
+				setStatus("ready");
 			}
-			setRecords((previous) => msg.page.cursor === void 0 ? msg.page.records : [...previous, ...msg.page.records]);
-			nextCursorRef.current = msg.page.nextCursor;
-			setComplete(msg.page.nextCursor === void 0);
-			setStatus("ready");
+			if (queued && entryIdRef.current) if (queued.refresh) scheduleRefresh(entryIdRef.current);
+			else readPage(entryIdRef.current, queued.cursor);
 			return true;
-		}, [])
+		}, [readPage, scheduleRefresh]),
+		handleExecutionWorkspace
 	};
 }
 //#endregion
@@ -1361,7 +1434,17 @@ function useSessionClient(makeClient) {
 	const silentCommandRequestIdsRef = useRef(/* @__PURE__ */ new Set());
 	const sessionChangesInFlightRef = useRef(0);
 	const sessionChangeRequestIdsRef = useRef(/* @__PURE__ */ new Set());
+	const [executionDetailInput, setExecutionDetailInput] = useState();
+	const executionDetailInputRef = useRef(null);
 	const send = useCallback((msg) => {
+		if (msg.type === "send-background-task") {
+			if (executionDetailInputRef.current !== null) return;
+			executionDetailInputRef.current = msg.taskId;
+			setExecutionDetailInput({
+				taskId: msg.taskId,
+				status: "pending"
+			});
+		}
 		if (msg.type === "command") {
 			if (msg.name === "help") {
 				setHelpOpen(true);
@@ -1418,7 +1501,7 @@ function useSessionClient(makeClient) {
 		});
 	}, [send]);
 	const { handleUsageMessage, ...personalUsageState } = usePersonalUsageState(send);
-	const { handleExecutionDetailMessage, closeExecutionDetail, ...executionDetailState } = useExecutionDetailState(send);
+	const { handleExecutionDetailMessage, handleExecutionWorkspace, closeExecutionDetail, ...executionDetailState } = useExecutionDetailState(send);
 	const { handleModelListMessage, ...modelListState } = useModelListState(send);
 	const { handleProjectMessage, ...projectPanelState } = useProjectPanelState(send);
 	const { handleAppViewMessage, rejectPendingAppRequests, readAppView, callAppTool } = useAppViewRequests(send, useCallback(() => statusRef.current === "connected", []));
@@ -1502,13 +1585,21 @@ function useSessionClient(makeClient) {
 				break;
 			}
 			case "execution_workspace_event":
+				handleExecutionWorkspace(msg.snapshot);
 				setExecutionWorkspace(msg.snapshot);
 				break;
 			case "background_task_control_result":
+				if (msg.action === "send" && executionDetailInputRef.current === msg.taskId) {
+					executionDetailInputRef.current = null;
+					setExecutionDetailInput({
+						taskId: msg.taskId,
+						status: msg.success ? "sent" : "failed"
+					});
+				}
 				if (!msg.success) setSessionNotices((previous) => [...previous, {
 					id: nextId(),
 					kind: "background-task-control-failed",
-					message: msg.message ?? `Could not stop ${msg.taskId}.`
+					message: msg.message ?? `Could not ${msg.action === "send" ? "send to" : "stop"} ${msg.taskId}.`
 				}]);
 				break;
 			case "pending":
@@ -1653,6 +1744,13 @@ function useSessionClient(makeClient) {
 				}]);
 				break;
 			case "protocol_error": {
+				if (executionDetailInputRef.current !== null && msg.message === "Not permitted for an observer: send-background-task") {
+					setExecutionDetailInput({
+						taskId: executionDetailInputRef.current,
+						status: "failed"
+					});
+					executionDetailInputRef.current = null;
+				}
 				if (sessionChangesInFlightRef.current > 0) {
 					settleSessionChange();
 					setSessionNotices((previous) => [...previous, {
@@ -1765,6 +1863,7 @@ function useSessionClient(makeClient) {
 		handleAgentDefinitionsMessage,
 		handleAppViewMessage,
 		handleExecutionDetailMessage,
+		handleExecutionWorkspace,
 		handleModelListMessage,
 		handleProjectMessage,
 		handleSchedulesMessage,
@@ -1802,6 +1901,14 @@ function useSessionClient(makeClient) {
 			if (next !== "connected") {
 				rejectPendingAppRequests();
 				clearCompactionNotices();
+				closeExecutionDetail();
+				if (executionDetailInputRef.current !== null) {
+					setExecutionDetailInput({
+						taskId: executionDetailInputRef.current,
+						status: "failed"
+					});
+					executionDetailInputRef.current = null;
+				}
 			}
 			if (next === "connected") {
 				commandsInFlightRef.current = 0;
@@ -1832,6 +1939,7 @@ function useSessionClient(makeClient) {
 		makeClient,
 		handleMessage,
 		clearCompactionNotices,
+		closeExecutionDetail,
 		requestSessions,
 		requestSchedules,
 		armRestore,
@@ -1856,6 +1964,7 @@ function useSessionClient(makeClient) {
 		answerAsk,
 		...personalUsageState,
 		...executionDetailState,
+		executionDetailInput,
 		closeExecutionDetail,
 		...modelListState,
 		...projectPanelState,
@@ -1890,6 +1999,63 @@ function useWsSession(url) {
 	};
 }
 //#endregion
+//#region src/client/desktop-session-client.ts
+function createDesktopSessionClient(bridge, callbacks) {
+	let connected = false;
+	let subscribed = false;
+	let release;
+	let failed = false;
+	let revoked = false;
+	const close = () => {
+		revoked = true;
+		connected = false;
+		if (!failed && subscribed) callbacks.onStatusChange("disconnected");
+	};
+	return {
+		connect() {
+			if (revoked || failed) return;
+			if (subscribed) return;
+			subscribed = true;
+			callbacks.onStatusChange("connecting");
+			try {
+				release = bridge.subscribe((frame) => {
+					if (!subscribed || failed || revoked) return;
+					const decoded = decodeFrame(frame, decodeServerMessage);
+					if (!decoded.ok) {
+						failed = true;
+						connected = false;
+						bridge.close();
+						callbacks.onStatusChange("error");
+						return;
+					}
+					callbacks.onMessage(decoded.message);
+				}, close, () => {
+					if (!subscribed || failed || revoked) return;
+					connected = true;
+					callbacks.onStatusChange("connected");
+					bridge.send(JSON.stringify({ type: "get-messages" }));
+				});
+			} catch {
+				close();
+			}
+		},
+		disconnect() {
+			subscribed = false;
+			connected = false;
+			release?.();
+			release = void 0;
+			callbacks.onStatusChange("disconnected");
+		},
+		send(message) {
+			if (!connected || failed) return;
+			if (!bridge.send(JSON.stringify(message))) {
+				bridge.close();
+				close();
+			}
+		}
+	};
+}
+//#endregion
 //#region src/client/runtime-host.ts
 /** Resolve host capabilities without importing Electron or a Node CLI into the browser graph. */
 function resolveClientRuntimeHost(environment) {
@@ -5855,16 +6021,32 @@ function writeDraft(namespace, sessionId, value) {
 * context). The row's controls run the session's own commands (`/provider`, `/mode`, `/effort`), so a
 * setting changes through the one path every client shares.
 */
-const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, status, connected = true, running, onStop, queued, onCancelQueue, pickFiles, getPathForFile, modelList = null, onRequestModelList = () => {}, onSilentCommand = onCommand, onManageProviders = () => onCommand("provider") }, ref) {
+const ComposerInstance = forwardRef(function Composer({ draftMode = "persistent", onSubmit, onCommand, catalog, status, connected = true, running, onStop, queued, onCancelQueue, pickFiles, getPathForFile, modelList = null, onRequestModelList = () => {}, onSilentCommand = onCommand, onManageProviders = () => onCommand("provider") }, ref) {
 	const { identity, storage: { browserNamespace } } = useProductIdentity();
 	const textareaRef = useRef(null);
 	useImperativeHandle(ref, () => ({ focus: () => textareaRef.current?.focus() }), []);
 	const sessionId = status?.sessionId;
+	const workspacePath = status?.workspace?.path;
+	const pickerGeneration = useRef(0);
+	const [fileInputEpoch, setFileInputEpoch] = useState(0);
+	const browserPickerOpen = useRef(false);
+	useLayoutEffect(() => {
+		pickerGeneration.current += 1;
+		browserPickerOpen.current = false;
+		return () => {
+			pickerGeneration.current += 1;
+		};
+	}, [sessionId, workspacePath]);
+	const invalidatePickers = () => {
+		pickerGeneration.current += 1;
+		browserPickerOpen.current = false;
+		setFileInputEpoch((epoch) => epoch + 1);
+	};
 	const sessionIdRef = useRef(sessionId);
 	const hasKnownSessionRef = useRef(sessionId !== void 0);
 	const stateRef = useRef(EMPTY_DRAFT);
 	const [draft, setDraftState] = useState(() => {
-		const initial = readDraft(browserNamespace, sessionId);
+		const initial = draftMode === "volatile" ? EMPTY_DRAFT : readDraft(browserNamespace, sessionId);
 		stateRef.current = initial;
 		return initial.text;
 	});
@@ -5888,7 +6070,7 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 			text: value
 		};
 		setDraftState(value);
-		writeDraft(browserNamespace, sessionIdRef.current, stateRef.current);
+		if (draftMode === "persistent") writeDraft(browserNamespace, sessionIdRef.current, stateRef.current);
 	};
 	/** #3282 §4d: attachment chips persist alongside the text, under the same per-session draft key. */
 	const setAttachments = (updater) => {
@@ -5898,9 +6080,10 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 			attachments: next
 		};
 		setAttachmentsState(next);
-		writeDraft(browserNamespace, sessionIdRef.current, stateRef.current);
+		if (draftMode === "persistent") writeDraft(browserNamespace, sessionIdRef.current, stateRef.current);
 	};
 	useEffect(() => {
+		if (draftMode === "volatile") return;
 		if (sessionId === void 0 && hasKnownSessionRef.current) return;
 		if (sessionIdRef.current === sessionId) return;
 		const firstArrival = !hasKnownSessionRef.current;
@@ -5919,23 +6102,26 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 		setDraftState(stored.text);
 		setAttachmentsState(stored.attachments);
 		setAttachmentNotice(null);
-	}, [browserNamespace, sessionId]);
+	}, [
+		browserNamespace,
+		draftMode,
+		sessionId
+	]);
 	const submit = () => {
 		if (!connected) return;
 		const text = draft.trim();
 		if (!text && attachments.length === 0) return;
+		invalidatePickers();
 		onSubmit(buildPromptWithAttachments(text, attachments));
 		setDraft("");
 		setAttachments([]);
 		setAttachmentNotice(null);
 	};
-	const workspacePath = status?.workspace?.path;
-	const totalAttachedBytes = attachments.reduce((sum, a) => sum + a.size, 0);
 	/** Evaluate every dropped/picked file in order, so a mixed batch attaches what it can. */
 	const addCandidates = (candidates) => {
 		if (candidates.length === 0) return;
-		let total = totalAttachedBytes;
-		let count = attachments.length;
+		let total = stateRef.current.attachments.reduce((sum, attachment) => sum + attachment.size, 0);
+		let count = stateRef.current.attachments.length;
 		const added = [];
 		let notice = null;
 		for (const candidate of candidates) {
@@ -5959,19 +6145,44 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 		absolutePath: getPathForFile ? getPathForFile(file) || void 0 : void 0
 	});
 	const fileInputRef = useRef(null);
+	useEffect(() => {
+		const input = fileInputRef.current;
+		if (!input) return;
+		const cancel = () => {
+			browserPickerOpen.current = false;
+		};
+		input.addEventListener("cancel", cancel);
+		return () => {
+			input.removeEventListener("cancel", cancel);
+		};
+	}, [
+		sessionId,
+		workspacePath,
+		fileInputEpoch
+	]);
 	const handleAttachClick = () => {
 		if (!connected) return;
 		if (pickFiles) {
-			pickFiles().then((picked) => addCandidates(picked.map((f) => ({
-				name: f.name,
-				size: f.size,
-				absolutePath: f.path
-			})))).catch(() => setAttachmentNotice("Could not open the file picker. Try again."));
+			const generation = pickerGeneration.current;
+			pickFiles().then((picked) => {
+				if (generation !== pickerGeneration.current) return;
+				addCandidates(picked.map((f) => ({
+					name: f.name,
+					size: f.size,
+					absolutePath: f.path
+				})));
+			}).catch(() => {
+				if (generation !== pickerGeneration.current) return;
+				setAttachmentNotice("Could not open the file picker. Try again.");
+			});
 			return;
 		}
+		if (browserPickerOpen.current) return;
+		browserPickerOpen.current = true;
 		fileInputRef.current?.click();
 	};
 	const handleFileInputChange = (event) => {
+		browserPickerOpen.current = false;
 		const files = Array.from(event.target.files ?? []);
 		event.target.value = "";
 		addCandidates(files.map(toCandidateFromFile));
@@ -6003,6 +6214,7 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 	/** Choosing a command from the menu, by mouse or by keyboard (`acceptMenu` below). */
 	const chooseMenuItem = (item) => {
 		if (isImmediateScreenCommand(item)) {
+			invalidatePickers();
 			setDraft("");
 			onCommand(item.name);
 			return;
@@ -6165,7 +6377,11 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 						className: "sr-only",
 						tabIndex: -1,
 						"aria-hidden": "true"
-					}),
+					}, JSON.stringify([
+						sessionId ?? null,
+						workspacePath ?? null,
+						fileInputEpoch
+					])),
 					/* @__PURE__ */ jsx("textarea", {
 						ref: textareaRef,
 						"aria-label": "message",
@@ -6257,6 +6473,15 @@ const Composer = forwardRef(function Composer({ onSubmit, onCommand, catalog, st
 		]
 	});
 });
+/** Volatile state belongs to one session and never crosses a mode or session boundary. */
+const Composer = forwardRef(function Composer(props, ref) {
+	const key = props.draftMode === "volatile" ? JSON.stringify(["volatile", props.status?.sessionId ?? null]) : "persistent";
+	return /* @__PURE__ */ createElement(ComposerInstance, {
+		...props,
+		key,
+		ref
+	});
+});
 /**
 * The goal being pursued (`/goal`), above the composer while it is active — the objective, how far
 * the turn budget has gone, and a way to stop it (`/goal cancel`).
@@ -6317,6 +6542,7 @@ const STATUS_TAG_TONE = {
 	destructive: "bg-destructive/12 text-destructive",
 	muted: "bg-subtle/15 text-subtle"
 };
+const FOLLOW_BOTTOM_MARGIN_PX = 32;
 const RECORD_KIND_LABEL = {
 	message: "",
 	tool_activity: "Tool",
@@ -6331,10 +6557,40 @@ const RECORD_KIND_LABEL = {
 * headline), its transcript so far (paginated via `onLoadMore`) and, once it has one, its result.
 * `entry === null` renders nothing; the caller owns showing/hiding this over the panel.
 */
-function ExecutionDetailSheet({ entry, status, records, error, complete, onClose, onLoadMore, onStop }) {
+function ExecutionDetailSheet({ entry, status, records, error, complete, onClose, onLoadMore, onStop, onSend, inputState, onContinue, mode = "live", unreadable, onShowEarlier, onShowLive }) {
+	const [prompt, setPrompt] = React.useState("");
+	const submitted = React.useRef(null);
+	const outputRef = React.useRef(null);
+	const followingRef = React.useRef(true);
+	const isFork = Boolean(entry?.resumeSessionId && entry.controls.includes("attach"));
+	React.useLayoutEffect(() => {
+		followingRef.current = true;
+	}, [entry?.id, mode]);
+	React.useLayoutEffect(() => {
+		const output = outputRef.current;
+		if (output && isFork && mode === "live" && followingRef.current) output.scrollTop = output.scrollHeight;
+	}, [
+		entry?.id,
+		isFork,
+		mode,
+		records
+	]);
+	React.useEffect(() => {
+		setPrompt("");
+		submitted.current = null;
+	}, [entry?.id]);
+	React.useEffect(() => {
+		if (!entry || inputState?.taskId !== entry.sourceId || inputState.status === "pending") return;
+		if (inputState.status === "sent" && submitted.current !== null) {
+			const sent = submitted.current;
+			setPrompt((current) => current.trim() === sent ? "" : current);
+		}
+		submitted.current = null;
+	}, [entry, inputState]);
 	if (!entry) return null;
 	const described = describeExecutionEntryStatus(entry);
 	const canStop = onStop !== void 0 && entry.controls.includes("cancel");
+	const ended = entry.status === "completed" || entry.status === "failed" || entry.status === "cancelled";
 	const askedLine = entry.headline?.text ?? entry.preview;
 	return /* @__PURE__ */ jsxs("div", {
 		role: "dialog",
@@ -6389,10 +6645,37 @@ function ExecutionDetailSheet({ entry, status, records, error, complete, onClose
 					entry.deniedToolCalls,
 					" tool ",
 					entry.deniedToolCalls === 1 ? "call was" : "calls were",
-					" refused."
+					" ",
+					"refused."
 				]
 			}),
+			isFork && onShowEarlier && onShowLive && /* @__PURE__ */ jsxs("div", {
+				className: "flex gap-3 border-b border-subtle/15 px-4 py-2 text-[12px]",
+				children: [/* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: onShowLive,
+					disabled: mode === "live",
+					children: "Live output"
+				}), /* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: onShowEarlier,
+					disabled: mode === "transcript",
+					children: "Earlier output"
+				})]
+			}),
 			/* @__PURE__ */ jsxs("div", {
+				ref: outputRef,
+				role: isFork ? mode === "live" ? "log" : "region" : void 0,
+				"aria-label": isFork ? mode === "live" ? "Live fork output" : "Earlier fork output" : void 0,
+				"aria-live": isFork && mode === "live" ? "polite" : void 0,
+				"aria-relevant": isFork && mode === "live" ? "additions text" : void 0,
+				"aria-atomic": isFork && mode === "live" ? false : void 0,
+				tabIndex: isFork ? 0 : void 0,
+				onScroll: (event) => {
+					if (!isFork || mode !== "live") return;
+					const output = event.currentTarget;
+					followingRef.current = output.scrollHeight - output.scrollTop - output.clientHeight <= FOLLOW_BOTTOM_MARGIN_PX;
+				},
 				className: "flex-1 space-y-2 overflow-y-auto px-4 py-3",
 				children: [
 					records.map((record) => /* @__PURE__ */ jsxs("div", {
@@ -6413,17 +6696,54 @@ function ExecutionDetailSheet({ entry, status, records, error, complete, onClose
 						className: "text-[13px] text-destructive",
 						children: error
 					}),
-					!complete && status !== "loading" && /* @__PURE__ */ jsx("button", {
+					unreadable && /* @__PURE__ */ jsxs("p", {
+						className: "text-[12px] text-warning",
+						children: [
+							"Some records could not be read: ",
+							unreadable.locked,
+							" locked, ",
+							unreadable.noKeys,
+							" without keys, ",
+							unreadable.doesNotOpen,
+							" unavailable."
+						]
+					}),
+					(!isFork || mode === "transcript") && !complete && status !== "loading" && /* @__PURE__ */ jsx("button", {
 						type: "button",
 						onClick: onLoadMore,
 						className: "text-[12px] text-subtle underline hover:text-foreground",
 						children: "Load more"
 					}),
-					!complete && status === "loading" && records.length > 0 && /* @__PURE__ */ jsx("p", {
+					(!isFork || mode === "transcript") && !complete && status === "loading" && records.length > 0 && /* @__PURE__ */ jsx("p", {
 						className: "text-[12px] text-subtle",
 						children: "Loading more…"
 					})
 				]
+			}),
+			isFork && !ended && entry.controls.includes("send") && onSend && /* @__PURE__ */ jsxs("form", {
+				className: "border-t border-subtle/15 p-3",
+				onSubmit: (event) => {
+					event.preventDefault();
+					if (!prompt.trim() || submitted.current !== null || inputState?.status === "pending") return;
+					submitted.current = prompt.trim();
+					onSend(submitted.current);
+				},
+				children: [/* @__PURE__ */ jsx("textarea", {
+					"aria-label": "Message the fork",
+					value: prompt,
+					onChange: (event) => setPrompt(event.target.value),
+					className: "w-full rounded border border-subtle/20 bg-background p-2 text-foreground"
+				}), /* @__PURE__ */ jsx("button", {
+					type: "submit",
+					disabled: !prompt.trim() || inputState?.status === "pending",
+					children: "Send to fork"
+				})]
+			}),
+			isFork && ended && onContinue && /* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: onContinue,
+				className: "border-t border-subtle/15 p-3 text-foreground",
+				children: "Continue as session"
 			})
 		]
 	});
@@ -8101,7 +8421,7 @@ function SetupPanel({ onSetUp, disabled }) {
 * The full desktop layout over an `IWsSessionState`. `surface` is an optional label shown next to the
 * mark (e.g. "app").
 */
-function SessionSurface({ state, surface, personalUsageEnabled = false, onReconnect, pickFiles, getPathForFile, onOpenMemoryInEditor, appViewSandboxUrl }) {
+function SessionSurface({ state, surface, personalUsageEnabled = false, draftMode = "persistent", onReconnect, pickFiles, getPathForFile, onOpenMemoryInEditor, appViewSandboxUrl }) {
 	const [view, setView] = useState("chat");
 	const { identity } = useProductIdentity();
 	const appViewHost = useMemo(() => ({
@@ -8280,6 +8600,7 @@ function SessionSurface({ state, surface, personalUsageEnabled = false, onReconn
 										}),
 										setupRequired ? null : /* @__PURE__ */ jsx(Composer, {
 											ref: composerRef,
+											draftMode,
 											catalog: state.commandCatalog ?? null,
 											status: state.sessionStatus ?? null,
 											connected: state.status === "connected",
@@ -8353,7 +8674,20 @@ function SessionSurface({ state, surface, personalUsageEnabled = false, onReconn
 							complete: state.executionDetailComplete,
 							onClose: () => state.closeExecutionDetail(),
 							onLoadMore: () => state.loadMoreExecutionDetail(),
-							onStop: openEntry ? () => stopExecutionEntry(openEntry) : void 0
+							onStop: openEntry ? () => stopExecutionEntry(openEntry) : void 0,
+							inputState: state.executionDetailInput,
+							mode: state.executionDetailMode,
+							unreadable: state.executionDetailUnreadable,
+							onShowEarlier: state.showEarlierExecutionDetail,
+							onShowLive: state.showLiveExecutionDetail,
+							onSend: openEntry ? (prompt) => state.send({
+								type: "send-background-task",
+								taskId: openEntry.sourceId,
+								input: { prompt }
+							}) : void 0,
+							onContinue: openEntry?.resumeSessionId ? () => {
+								if (openEntry.resumeSessionId) state.switchSession(openEntry.resumeSessionId);
+							} : void 0
 						})
 					]
 				})]
@@ -8538,6 +8872,6 @@ function SessionInput({ enabled, onSubmit }) {
 	});
 }
 //#endregion
-export { AgentActivityPanel, AgentSwitcherSheet, CenteredChrome, ConfirmDialog, ConversationView, Dialog, HelpSheet, PermissionPrompt, PersonalUsageDashboard, ProductIdentityProvider, ProductMark, ProductWordmark, SessionMonitor, SessionSidebar, SessionSurface, SettingsScreen, applyPromptEvent, askResponse, createWsSessionClient, describeUiIntentForGui, guiScreenForUiIntent, permissionResponse, rememberSessionForRestore, resolveClientRuntimeHost, useProductIdentity, useSessionClient, useWsSession };
+export { AgentActivityPanel, AgentSwitcherSheet, CenteredChrome, ConfirmDialog, ConversationView, Dialog, HelpSheet, PermissionPrompt, PersonalUsageDashboard, ProductIdentityProvider, ProductMark, ProductWordmark, SessionMonitor, SessionSidebar, SessionSurface, SettingsScreen, applyPromptEvent, askResponse, createDesktopSessionClient, createWsSessionClient, describeUiIntentForGui, guiScreenForUiIntent, permissionResponse, rememberSessionForRestore, resolveClientRuntimeHost, useProductIdentity, useSessionClient, useWsSession };
 
 //# sourceMappingURL=index.js.map