@mcp-b/react-components 0.48.0 → 0.49.0

package/dist/components/agents-sdk/AgentChat.js

@@ -1,67 +1,28 @@
-import { replaceComposerTrigger } from "../../utils/composer-link.js";
 import { t as cx } from "../../class-names-BiMDVpUo.js";
+import { H as RefreshIcon, K as SpinnerIcon, Q as TrashIcon, R as PencilIcon, t as ArchiveIcon } from "../../icons-cuEtsgj9.js";
 import { ExpansionStateProvider } from "../ai-sdk/ExpansionState.js";
-import { B as PlusIcon, H as RefreshIcon, K as SpinnerIcon, Q as TrashIcon, R as PencilIcon, V as QueueIcon, t as ArchiveIcon } from "../../icons-CeGfXO21.js";
-import { Button } from "../foundations/Button.js";
-import { AgentChatMessageEditor } from "../ai-sdk/AgentChatMessageEditor.js";
-import { IconButton } from "../foundations/IconButton.js";
-import { Menu } from "../foundations/Menu.js";
-import { PromptInput, PromptInputActionAddAttachments, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuTrigger, PromptInputAttachments, PromptInputBody, PromptInputButton, PromptInputCommandComposer, PromptInputContextSelector, PromptInputDictation, PromptInputFooter, PromptInputHeader, PromptInputPermissionSelector, PromptInputSubmit, PromptInputTextarea, PromptInputTools, PromptInputTray, composerLinksToReferences, usePromptInputAttachments } from "../ai-sdk/PromptInput.js";
-import { AgentChatStartScreen } from "../ai-sdk/AgentChatStartScreen.js";
-import { Message, MessageAction, MessageActions, MessageMeta, MessageTimestamp } from "../ai-sdk/Message.js";
+import { Message, MessageAction, MessageActions, MessageCopyAction, MessageMeta, MessageTimestamp } from "../ai-sdk/Message.js";
+import { AgentEventRow, getAgentEvent } from "./AgentEvent.js";
+import { AgentChatQueueProvider, useOptionalAgentChatQueue } from "./AgentChatQueue.js";
 import { AgentMessageParts } from "../ai-sdk/AgentMessageParts.js";
-import { Marker, MarkerContent } from "../foundations/Marker.js";
-import { t as CopyButton } from "../../copy-button-Dk2vRe9j.js";
-import { Context, ContextContent, ContextContentBody, ContextContentHeader, ContextTrigger, getContextUsage, getContextUsedTokens } from "../ai-sdk/Context.js";
+import { AgentChatMessageEditor } from "../ai-sdk/AgentChatMessageEditor.js";
 import { VirtualMessageScroller } from "../ai-sdk/MessageScrollerVirtual.js";
-import { QueueItem, QueueItemActions, QueueItemContent } from "../ai-sdk/Queue.js";
+import { PromptInput, PromptInputSubmit, PromptInputTray, composerLinksToReferences, usePromptInputController } from "../ai-sdk/PromptInput.js";
+import { Queue, QueueItem, QueueItemAction, QueueItemActions, QueueItemContent, QueueItemIndicator, QueueList } from "../ai-sdk/Queue.js";
+import { PromptInputApproval, getApprovalStateKey, getPendingToolApprovals } from "./PromptInputApproval.js";
 import { EmptyState } from "../foundations/EmptyState.js";
+import { Marker, MarkerContent } from "../foundations/Marker.js";
 import { TransitionSurface } from "../foundations/TransitionSurface.js";
-import { AgentEventRow, getAgentEvent } from "./AgentEvent.js";
-import { PromptInputApproval, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals } from "./PromptInputApproval.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { isTextUIPart } from "ai";
+import { useRender } from "@base-ui/react/use-render";
+import { mergeProps } from "@base-ui/react/merge-props";
 import { isCompactionMessage } from "agents/experimental/memory/utils";
+import { isTextUIPart } from "ai";
 //#region src/components/agents-sdk/AgentChat.tsx
-/**
-* Agents exports this helper from `agents/sessions` after cloudflare/agents#1896;
-* the current 0.19.0 release still publishes it from the experimental path.
-* It checks the canonical `compaction_` id prefix used when Session history
-* materializes a summary overlay. `UIMessage` is structurally compatible with
-* the `SessionMessage` fields it reads, so use the upstream helper directly
-* instead of duplicating the prefix contract locally.
-*/
-/**
-* Built-in `/compact` entry, present whenever `onCompact` is provided and the
-* agent is not mid-turn. Selection is intercepted in `selectComposerCommand`
-* before any reference chip or host `onSelect` runs.
-*/
-const COMPACT_SLASH_COMMAND = {
-	id: "agent-chat:compact",
-	value: "compact",
-	label: "compact",
-	description: "Summarize earlier messages to free up context",
-	icon: /* @__PURE__ */ jsx(ArchiveIcon, {}),
-	group: "Conversation",
-	meta: "Built in"
-};
-/**
-* The affordance for a compaction that is running right now, for the `notice`
-* slot. Exported because Think's session frames report the same state from
-* outside this component's own `/compact` lifecycle, and one running
-* compaction must not read two ways.
-*/
-const compactingNotice = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerIcon, {}), "Compacting context…"] });
-const COMPACTION_NOTICES = {
-	compacted: "Context compacted. Context usage updates after your next message.",
-	failed: "Compaction failed — run /compact to try again.",
-	pending: compactingNotice,
-	unchanged: "No context was compacted. Recent context is already protected."
-};
-function observeAgentChatComposer(element) {
+function observeAgentChatDock(element) {
 	if (!element || typeof ResizeObserver === "undefined") return;
-	const root = element.parentElement;
+	const root = element.closest(".agent-chat");
 	let written;
 	let frame = 0;
 	const observer = new ResizeObserver(() => {
@@ -71,7 +32,7 @@ function observeAgentChatComposer(element) {
 			const size = `${element.offsetHeight}px`;
 			if (size === written) return;
 			written = size;
-			root?.style.setProperty("--agent-chat-composer-size", size);
+			root?.style.setProperty("--agent-chat-dock-size", size);
 		});
 	});
 	observer.observe(element);
@@ -80,655 +41,549 @@ function observeAgentChatComposer(element) {
 		observer.disconnect();
 	};
 }
-function getAgentChatMessageTime(message) {
-	const metadata = message.metadata;
-	if (!metadata || typeof metadata !== "object" || !("createdAt" in metadata)) return void 0;
-	const value = metadata.createdAt;
-	if (!(value instanceof Date) && typeof value !== "number" && typeof value !== "string") return;
-	const date = value instanceof Date ? value : new Date(value);
-	return Number.isNaN(date.getTime()) ? void 0 : date;
+const AgentChatContext = React.createContext(null);
+function useAgentChatRuntime() {
+	const value = React.useContext(AgentChatContext);
+	if (!value) throw new Error("Chat parts must be used inside AgentChat.Root or ThinkChat.Root.");
+	return value;
 }
-const EMPTY_PENDING_APPROVALS = [];
-const EMPTY_SKIPPED_APPROVAL_IDS = [];
-function createApprovalSessionState(thinkStub) {
-	return {
-		thinkStub,
-		skippedApprovalIds: EMPTY_SKIPPED_APPROVAL_IDS,
-		permissionMode: "bypass"
-	};
+/** Layout and runtime adapter over the nearest queue owner; connections remain host-owned. */
+function AgentChatRoot({ onSubmit, onStop, onPromptQueued, ...props }) {
+	const queue = useOptionalAgentChatQueue();
+	const root = /* @__PURE__ */ jsx(AgentChatRuntimeRoot, { ...props });
+	return queue ? root : /* @__PURE__ */ jsx(AgentChatQueueProvider, {
+		status: props.status ?? "ready",
+		onSubmit,
+		onStop,
+		onPromptQueued,
+		children: root
+	});
 }
-function AgentChatAttachButton() {
-	const attachments = usePromptInputAttachments();
-	return /* @__PURE__ */ jsx(PromptInputButton, {
-		tooltip: "Add photos or files",
-		onClick: () => attachments.openFileDialog(),
-		children: /* @__PURE__ */ jsx(PlusIcon, {})
+function AgentChatRuntimeRoot({ messages, status = "ready", onRegenerate, onEditAndResend, onApprovalResponse, children, className, ref, ...props }) {
+	const queue = useOptionalAgentChatQueue();
+	if (!queue) throw new Error("AgentChat requires its queue owner.");
+	const [announcement, setAnnouncement] = React.useState("");
+	const announcementTimer = React.useRef(void 0);
+	React.useEffect(() => () => clearTimeout(announcementTimer.current), []);
+	const announce = React.useCallback((text) => {
+		setAnnouncement("");
+		clearTimeout(announcementTimer.current);
+		announcementTimer.current = setTimeout(() => setAnnouncement(text), 50);
+	}, []);
+	const { items: queued, submit, captureSubmit, remove: removeQueued, steer, error: queueError, submissionVersion } = queue;
+	const busy = status === "submitted" || status === "streaming";
+	const dockRef = React.useRef(null);
+	const stop = React.useMemo(() => queue.canStop ? () => {
+		queue.stop().catch(() => void 0);
+	} : void 0, [queue]);
+	const value = React.useMemo(() => ({
+		messages,
+		status,
+		busy,
+		submit,
+		captureSubmit,
+		stop,
+		canSubmit: queue.canSubmit,
+		onRegenerate,
+		onEditAndResend,
+		onApprovalResponse,
+		queued,
+		removeQueued,
+		steer,
+		queueError,
+		submissionVersion,
+		dockRef,
+		announce
+	}), [
+		messages,
+		status,
+		busy,
+		submit,
+		captureSubmit,
+		stop,
+		queue.canSubmit,
+		onRegenerate,
+		onEditAndResend,
+		onApprovalResponse,
+		queued,
+		removeQueued,
+		steer,
+		queueError,
+		submissionVersion,
+		announce
+	]);
+	return /* @__PURE__ */ jsx(AgentChatContext.Provider, {
+		value,
+		children: /* @__PURE__ */ jsxs(TransitionSurface, {
+			ref,
+			variant: "fade",
+			className: cx("agent-chat", className),
+			"data-recipe": "fill-host",
+			...props,
+			children: [children, /* @__PURE__ */ jsx("span", {
+				className: "sigvelo-visually-hidden",
+				role: "status",
+				"aria-live": "polite",
+				"aria-atomic": "true",
+				children: announcement
+			})]
+		})
 	});
 }
-function AgentChatAddMenu({ children }) {
-	if (!children) return /* @__PURE__ */ jsx(AgentChatAttachButton, {});
-	return /* @__PURE__ */ jsxs(PromptInputActionMenu, { children: [/* @__PURE__ */ jsx(PromptInputActionMenuTrigger, { "aria-label": "Add context" }), /* @__PURE__ */ jsxs(PromptInputActionMenuContent, {
-		side: "top",
-		align: "start",
-		sideOffset: 12,
-		collisionPadding: 8,
-		className: "agent-chat__add-menu",
-		"data-recipe": "composer-command-surface wide-scroll-picker",
-		children: [/* @__PURE__ */ jsxs(Menu.Group, { children: [/* @__PURE__ */ jsx(Menu.GroupLabel, { children: "Add" }), /* @__PURE__ */ jsx(PromptInputActionAddAttachments, {})] }), children]
-	})] });
+/** Windowed transcript. Historical rows are never a live region; their disclosure state survives windowing. */
+function AgentChatTranscript({ children, emptyState, className, scrollAnchor }) {
+	const { messages, busy } = useAgentChatRuntime();
+	return /* @__PURE__ */ jsx(ExpansionStateProvider, { children: /* @__PURE__ */ jsx(VirtualMessageScroller, {
+		className: cx("agent-chat__conversation", className),
+		items: messages,
+		scrollAnchor,
+		getItemKey: (message) => message.id,
+		emptyState,
+		contentProps: {
+			role: "log",
+			"aria-live": "off",
+			"aria-busy": busy,
+			className: "agent-chat__transcript-content"
+		},
+		scrollButtonLabel: "Scroll to latest",
+		scrollButtonProps: { className: "agent-chat__scroll-button" },
+		renderItem: (message, messageIndex) => children({
+			message,
+			messageIndex
+		})
+	}) });
 }
-function AgentChatSubmitAction({ status, onStop, disabled, hasDraft }) {
-	const attachments = usePromptInputAttachments();
-	return /* @__PURE__ */ jsx(PromptInputSubmit, {
-		status,
-		onStop,
-		hasContent: hasDraft || attachments.files.length > 0,
-		disabled
+function AgentChatLoading() {
+	return /* @__PURE__ */ jsx("div", {
+		className: "agent-chat__transcript-loading",
+		role: "status",
+		children: /* @__PURE__ */ jsx(EmptyState, {
+			icon: /* @__PURE__ */ jsx(SpinnerIcon, {}),
+			description: "Loading conversation"
+		})
 	});
 }
-function getCopyableResponseText(message) {
-	return message.parts.filter(isTextUIPart).map((part) => part.text).join("\n\n").trim() || void 0;
+const ChatMessageContext = React.createContext(null);
+function useChatMessage() {
+	const value = React.useContext(ChatMessageContext);
+	if (!value) throw new Error("Message actions must be used inside AgentChat.Message.");
+	return value;
 }
-function AgentChatAssistantActions({ message, responseNumber, showCopy, showRetry, onRegenerate, onCopyStatus }) {
-	const copyText = getCopyableResponseText(message);
-	const hasCopy = showCopy && copyText !== void 0;
-	const hasRetry = showRetry && onRegenerate !== void 0;
-	const hasActions = hasCopy || hasRetry;
-	return /* @__PURE__ */ jsxs(MessageActions, {
-		"aria-label": `Actions for response ${responseNumber}`,
-		"aria-hidden": hasActions ? void 0 : true,
-		className: "message__actions--reserved",
-		children: [hasCopy ? /* @__PURE__ */ jsx(CopyButton, {
-			className: "message__action",
-			label: `Copy response ${responseNumber}`,
-			tooltip: "Copy response",
-			text: copyText,
-			size: "xs",
-			onCopy: () => onCopyStatus(`Response ${responseNumber} copied.`),
-			onError: () => onCopyStatus(`Could not copy response ${responseNumber}. Try again.`)
-		}) : null, hasRetry ? /* @__PURE__ */ jsx(MessageAction, {
-			label: "Retry",
-			tooltip: "Regenerate response",
-			size: "xs",
-			onClick: () => onRegenerate(message.id),
-			children: /* @__PURE__ */ jsx(RefreshIcon, { size: 14 })
-		}) : null]
+/** Preserves runtime-authored event/compaction provenance and owns only the local edit lifecycle. */
+function AgentChatMessage({ message, messageIndex, children }) {
+	const { onEditAndResend } = useAgentChatRuntime();
+	const [editing, setEditing] = React.useState(false);
+	const editRef = React.useRef(null);
+	const restoreFocus = React.useRef(false);
+	React.useLayoutEffect(() => {
+		if (!editing && restoreFocus.current) {
+			editRef.current?.focus();
+			restoreFocus.current = false;
+		}
+	}, [editing]);
+	const value = React.useMemo(() => ({
+		message,
+		messageIndex,
+		editRef,
+		startEdit: () => setEditing(true)
+	}), [message, messageIndex]);
+	if (isCompactionMessage(message)) return /* @__PURE__ */ jsx(Marker, {
+		variant: "separator",
+		children: /* @__PURE__ */ jsx(MarkerContent, { children: "Context compacted" })
+	});
+	const event = getAgentEvent(message);
+	if (event) return /* @__PURE__ */ jsx(AgentEventRow, {
+		message,
+		event
+	});
+	return /* @__PURE__ */ jsx(ChatMessageContext.Provider, {
+		value,
+		children: /* @__PURE__ */ jsx(Message, {
+			from: message.role,
+			children: editing && onEditAndResend ? /* @__PURE__ */ jsx(AgentChatMessageEditor, {
+				message,
+				originalText: editableText(message) ?? "",
+				onSubmit: onEditAndResend,
+				onCancel: () => {
+					restoreFocus.current = true;
+					setEditing(false);
+				},
+				onSuccess: () => setEditing(false)
+			}) : children
+		})
 	});
 }
-function getEditableUserText(message) {
-	if (message.role !== "user" || message.parts.length !== 1) return void 0;
+function editableText(message) {
 	const part = message.parts[0];
-	return isTextUIPart(part) && part.text.trim() ? part.text : void 0;
+	return message.role === "user" && message.parts.length === 1 && isTextUIPart(part) && part.text.trim() ? part.text : void 0;
 }
-/** Agents row-size compaction metadata is intentionally handled at the Agents seam. */
 function isCompactedPart(message, partIndex) {
 	const part = message.parts[partIndex];
 	const metadata = message.metadata;
-	if (isTextUIPart(part)) return Array.isArray(metadata?.compactedTextParts) && metadata.compactedTextParts.includes(partIndex);
-	return part !== void 0 && "toolCallId" in part && typeof part.toolCallId === "string" && Array.isArray(metadata?.compactedToolOutputs) && metadata.compactedToolOutputs.includes(part.toolCallId);
+	return isTextUIPart(part) ? Array.isArray(metadata?.compactedTextParts) && metadata.compactedTextParts.includes(partIndex) : part !== void 0 && "toolCallId" in part && Array.isArray(metadata?.compactedToolOutputs) && metadata.compactedToolOutputs.includes(part.toolCallId);
 }
-/**
-* One transcript row's content, memoized so a streaming delta re-renders only
-* the rows whose props changed — in practice the live message. This only
-* holds up if the host keeps unchanged message objects and render callbacks
-* referentially stable across updates (AI SDK chat state does); see
-* "Transcript rendering performance" in docs/think-chat.md.
-*/
-function AgentChatTranscriptRowBodyImpl({ message, messageIndex, status, renderPart, renderMessageAfter, editing, canEdit, editDisabled, onEditAndResend, onStartEdit, onCancelEdit, onFinishEdit, editButtonRef, responseNumber, showAssistantActions, showCopy, showRetry, onRegenerate, onCopyStatus }) {
-	const messageTime = getAgentChatMessageTime(message);
-	const userText = getEditableUserText(message);
-	const agentEvent = getAgentEvent(message);
-	return /* @__PURE__ */ jsx(Fragment, { children: isCompactionMessage(message) ? /* @__PURE__ */ jsx(Marker, {
-		variant: "separator",
-		children: /* @__PURE__ */ jsx(MarkerContent, { children: "Context compacted" })
-	}) : agentEvent ? /* @__PURE__ */ jsx(AgentEventRow, {
+function AgentChatMessageContent({ message, renderPart }) {
+	const { messages, status } = useAgentChatRuntime();
+	return /* @__PURE__ */ jsx(MemoizedMessageParts, {
 		message,
-		event: agentEvent
-	}) : /* @__PURE__ */ jsx(Message, {
-		from: message.role,
-		children: editing && onEditAndResend ? /* @__PURE__ */ jsx(AgentChatMessageEditor, {
-			message,
-			originalText: getEditableUserText(message) ?? "",
-			onSubmit: onEditAndResend,
-			onCancel: onCancelEdit,
-			onSuccess: onFinishEdit
-		}) : /* @__PURE__ */ jsxs(Fragment, { children: [
-			/* @__PURE__ */ jsx(AgentMessageParts, {
-				message,
-				status,
-				renderPart: (context) => {
-					const custom = renderPart?.(context);
-					if (!isCompactedPart(message, context.partIndex)) return custom;
-					const rendered = custom === void 0 ? context.defaultRender() : custom;
-					return rendered ? /* @__PURE__ */ jsxs(Fragment, { children: [rendered, /* @__PURE__ */ jsx("div", {
-						className: "message__compacted",
-						children: "Output truncated for storage"
-					})] }) : null;
-				}
-			}),
-			renderMessageAfter?.({
-				message,
-				messageIndex
-			}),
-			message.role === "user" && (messageTime !== void 0 || userText !== void 0) ? /* @__PURE__ */ jsxs(MessageMeta, { children: [
-				messageTime ? /* @__PURE__ */ jsx(MessageTimestamp, { date: messageTime }) : null,
-				userText ? /* @__PURE__ */ jsx(CopyButton, {
-					className: "message__action",
-					label: `Copy message ${messageIndex + 1}`,
-					tooltip: "Copy message",
-					text: userText,
-					size: "xs",
-					onCopy: () => onCopyStatus(`Message ${messageIndex + 1} copied.`),
-					onError: () => onCopyStatus(`Could not copy message ${messageIndex + 1}. Try again.`)
-				}) : null,
-				canEdit && userText ? /* @__PURE__ */ jsx(MessageActions, {
-					"aria-label": "Message actions",
-					"aria-hidden": editDisabled || void 0,
-					"data-unavailable": editDisabled || void 0,
-					children: /* @__PURE__ */ jsx(MessageAction, {
-						ref: editButtonRef,
-						disabled: editDisabled,
-						label: "Edit message",
-						tooltip: "Edit and resend",
-						size: "xs",
-						onClick: () => onStartEdit(message.id),
-						children: /* @__PURE__ */ jsx(PencilIcon, {})
-					})
-				}) : null
-			] }) : null,
-			showAssistantActions ? /* @__PURE__ */ jsx(AgentChatAssistantActions, {
-				message,
-				responseNumber,
-				showCopy,
-				showRetry,
-				onRegenerate,
-				onCopyStatus
-			}) : null
-		] })
+		renderPart,
+		status: message.id === messages.at(-1)?.id ? status : "ready"
+	});
+}
+function MessageParts({ message, renderPart, status }) {
+	return /* @__PURE__ */ jsx(AgentMessageParts, {
+		message,
+		status,
+		renderPart: (context) => {
+			const custom = renderPart?.(context);
+			if (!isCompactedPart(message, context.partIndex)) return custom;
+			const rendered = custom === void 0 ? context.defaultRender() : custom;
+			return rendered ? /* @__PURE__ */ jsxs(Fragment, { children: [rendered, /* @__PURE__ */ jsx("div", {
+				className: "agent-chat__compacted",
+				children: "Output truncated for storage"
+			})] }) : null;
+		}
+	});
+}
+const MemoizedMessageParts = React.memo(MessageParts);
+/** Stable action space for a message; callers choose every action inside it. */
+function AgentChatActions({ children, ...props }) {
+	const { message, messageIndex } = useChatMessage();
+	const { messages, busy } = useAgentChatRuntime();
+	const number = messages.slice(0, messageIndex + 1).filter((m) => m.role === message.role && !isCompactionMessage(m) && !getAgentEvent(m)).length;
+	const unavailable = busy && (message.role === "user" ? message.id === messages.findLast((item) => item.role === "user" && !getAgentEvent(item))?.id : message.id === messages.at(-1)?.id);
+	const actions = /* @__PURE__ */ jsx(MessageActions, {
+		reserveSpace: message.role === "assistant",
+		"aria-label": `Actions for ${message.role === "assistant" ? "response" : "message"} ${number}`,
+		"data-unavailable": unavailable ? true : void 0,
+		"aria-hidden": unavailable ? true : void 0,
+		inert: unavailable ? true : void 0,
+		...props,
+		children
+	});
+	return message.role === "user" ? /* @__PURE__ */ jsx(MessageMeta, { children: actions }) : actions;
+}
+function AgentChatCopyAction() {
+	const { message, messageIndex } = useChatMessage();
+	const { messages, busy, announce } = useAgentChatRuntime();
+	const text = message.parts.filter(isTextUIPart).map((part) => part.text).join("\n\n").trim();
+	if (!text) return null;
+	const label = message.role === "assistant" ? `Copy response ${messages.slice(0, messageIndex + 1).filter((m) => m.role === "assistant" && !isCompactionMessage(m) && !getAgentEvent(m)).length}` : `Copy message ${messageIndex + 1}`;
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(MessageCopyAction, {
+		label,
+		disabled: busy && message.id === messages.at(-1)?.id,
+		tooltip: message.role === "assistant" ? "Copy response" : "Copy message",
+		text,
+		size: "xs",
+		onCopy: () => announce(`${label.replace("Copy response", "Response").replace("Copy message", "Message")} copied.`),
+		onError: () => announce("Could not copy. Try again.")
 	}) });
 }
-const AgentChatTranscriptRowBody = React.memo(AgentChatTranscriptRowBodyImpl);
-/**
-* Low-level transcript/composer surface used by `ThinkChat`: props in, no
-* transport. Product code that talks to a Cloudflare Think agent should render
-* `ThinkChat`; use this directly only for plain AI SDK or read-only messages.
-*
-* The transcript is always windowed with TanStack Virtual (end-anchored,
-* follow-on-append): only the visible rows exist in the DOM, so hours-long
-* runs stay cheap. Consequences and the host-side contract:
-* - Every message needs a stable `id`; keys must survive prepends and stream
-*   growth.
-* - Keep unchanged message objects referentially stable across updates.
-*   Structured-cloning the array per delta over a worker/extension boundary
-*   rebuilds every identity and defeats row memoization — clone once per
-*   throttled batch instead.
-* - Throttle stream deltas before React state (AI SDK
-*   `experimental_throttle: 50` or equivalent).
-* - Bound the data itself: windowing caps DOM size, not JS memory. Truncate
-*   stored tool output at the buffer (~20k chars) and keep history
-*   compaction on.
-* - Unmount the transcript to hide it; don't `display: none` it — hidden
-*   rows measure 0 and corrupt the virtualizer's cached heights.
-* - Rows unmount off-screen: find-in-page only searches the window;
-*   disclosure state persists via the built-in `ExpansionStateProvider`
-*   (pass your own store via a wrapper to survive route remounts), but the
-*   default `Reasoning` disclosure resets.
-* - The transcript is not a screen-reader live region (windowing would
-*   announce re-inserted old rows as new); announce new messages from a
-*   host-owned live region if that matters.
-*/
-function AgentChat({ className, messages, status = "ready", onSubmit, showComposer = onSubmit !== void 0, onStop, onPromptQueued, placeholder = "Ask anything...", disabled: composerDisabled, emptyState, loading, startScreen, composerHeader, composerTray, composerTools, slashCommands, onCompact, mentionCommands, contextSelector, composerEndTools, voiceInput, beforeVoiceStart, composerAddMenuItems, notice, onRegenerate, onEditAndResend, onApprovalResponse, thinkStub, approvalsEnabled = true, permissionModeControl, onExecutionSettled, pendingApprovals: durableApprovals = EMPTY_PENDING_APPROVALS, contextWindow, renderPart, renderMessageAfter, showAssistantActions, ref }) {
-	const disabled = composerDisabled || loading;
-	const [copyAnnouncement, setCopyAnnouncement] = React.useState("");
-	const [composerDraft, setComposerDraft] = React.useState("");
-	const composerInputRef = React.useRef(null);
-	const restoreComposerFocusAfterApproval = React.useRef(false);
-	const respondToPendingApproval = React.useCallback((response) => {
-		restoreComposerFocusAfterApproval.current = true;
-		return onApprovalResponse?.(response);
-	}, [onApprovalResponse]);
-	const handlePendingExecutionSettled = React.useCallback(async () => {
-		restoreComposerFocusAfterApproval.current = true;
-		await onExecutionSettled?.();
-	}, [onExecutionSettled]);
-	const [pendingPrompts, setPendingPrompts] = React.useState([]);
-	const [queueHeld, setQueueHeld] = React.useState(false);
-	const busy = status === "submitted" || status === "streaming";
-	const wasBusy = React.useRef(busy);
-	const [compactionState, setCompactionState] = React.useState(null);
-	const compactionInFlight = React.useRef(false);
-	const addComposerReference = React.useCallback((reference) => {
-		setComposerDraft((current) => {
-			if (composerLinksToReferences(current).some((item) => item.id === reference.id && item.trigger === reference.trigger)) return current;
-			return replaceComposerTrigger(current, {
-				id: reference.id,
-				value: reference.value,
-				label: reference.label,
-				href: reference.href,
-				iconSrc: reference.iconSrc
-			}, reference.trigger ?? "/");
-		});
-	}, []);
-	const removeComposerReference = React.useCallback((reference) => {
-		if (!reference.href) return;
-		setComposerDraft((current) => current.replace(`[${reference.label}](${reference.href})`, "").replace(/\s{2,}/g, " "));
-	}, []);
-	const copyAnnouncementTimer = React.useRef(null);
-	const announceCopyStatus = React.useCallback((message) => {
-		if (copyAnnouncementTimer.current !== null) window.clearTimeout(copyAnnouncementTimer.current);
-		setCopyAnnouncement("");
-		copyAnnouncementTimer.current = window.setTimeout(() => {
-			setCopyAnnouncement(message);
-			copyAnnouncementTimer.current = null;
-		}, 50);
-	}, []);
-	React.useEffect(() => () => {
-		if (copyAnnouncementTimer.current !== null) window.clearTimeout(copyAnnouncementTimer.current);
-	}, []);
-	const handleSubmit = React.useCallback((message) => {
-		const text = message.text || composerDraft;
-		const references = composerLinksToReferences(text);
-		const prompt = {
-			...message,
-			text,
-			...references.length ? { references } : {}
+function AgentChatRetryAction() {
+	const { message } = useChatMessage();
+	const { messages, busy, onRegenerate } = useAgentChatRuntime();
+	if (!onRegenerate || message.id !== messages.findLast((m) => m.role === "assistant" && !isCompactionMessage(m) && !getAgentEvent(m))?.id) return null;
+	return /* @__PURE__ */ jsx(MessageAction, {
+		disabled: busy,
+		label: "Retry",
+		tooltip: "Regenerate response",
+		size: "xs",
+		onClick: () => onRegenerate(message.id),
+		children: /* @__PURE__ */ jsx(RefreshIcon, { size: 14 })
+	});
+}
+function AgentChatEditAction() {
+	const { message, startEdit, editRef } = useChatMessage();
+	const { messages, busy, onEditAndResend } = useAgentChatRuntime();
+	if (!onEditAndResend || !editableText(message) || message.id !== messages.findLast((m) => m.role === "user" && !getAgentEvent(m))?.id) return null;
+	return /* @__PURE__ */ jsx(MessageAction, {
+		ref: editRef,
+		disabled: busy,
+		label: "Edit message",
+		tooltip: "Edit and resend",
+		size: "xs",
+		onClick: startEdit,
+		children: /* @__PURE__ */ jsx(PencilIcon, {})
+	});
+}
+function AgentChatTimestamp() {
+	const { message } = useChatMessage();
+	const metadata = message.metadata;
+	if (!metadata || typeof metadata !== "object" || !("createdAt" in metadata)) return null;
+	const value = metadata.createdAt;
+	if (!(value instanceof Date) && typeof value !== "number" && typeof value !== "string") return null;
+	const date = new Date(value);
+	return Number.isNaN(date.getTime()) ? null : /* @__PURE__ */ jsx(MessageTimestamp, { date });
+}
+/** Measured bottom surface for notices, queued prompts, approvals and the form. */
+function AgentChatDock({ children, render, ref, ...props }) {
+	const { dockRef } = useAgentChatRuntime();
+	const observe = React.useCallback((element) => {
+		dockRef.current = element;
+		return observeAgentChatDock(element);
+	}, [dockRef]);
+	return useRender({
+		defaultTagName: "div",
+		render,
+		ref: [ref ?? null, observe],
+		props: mergeProps({
+			className: "agent-chat__dock",
+			children: /* @__PURE__ */ jsx("div", {
+				className: "agent-chat__dock-content",
+				children
+			})
+		}, props)
+	});
+}
+/** Submission adapter only. Compose it inside Dock; the caller owns its inputs and controls. */
+function AgentChatComposer({ children, disabled = false, className, onSubmitCapture, ...props }) {
+	const { submit, captureSubmit, canSubmit } = useAgentChatRuntime();
+	const submissions = React.useRef(/* @__PURE__ */ new WeakMap());
+	return /* @__PURE__ */ jsx(PromptInput, {
+		...props,
+		className: cx("agent-chat__composer", className),
+		onSubmitCapture: (event) => {
+			onSubmitCapture?.(event);
+			submissions.current.set(event.nativeEvent, captureSubmit());
+		},
+		onSubmit: (message, event) => {
+			const references = composerLinksToReferences(message.text);
+			return (submissions.current.get(event.nativeEvent) ?? submit)(references.length ? {
+				...message,
+				references
+			} : message);
+		},
+		inert: disabled || !canSubmit ? true : void 0,
+		children
+	});
+}
+function AgentChatSubmit({ disabled = false }) {
+	const { status, stop, canSubmit } = useAgentChatRuntime();
+	const { textInput, attachments } = usePromptInputController();
+	return /* @__PURE__ */ jsx(PromptInputSubmit, {
+		status,
+		onStop: stop,
+		disabled: disabled || !canSubmit,
+		hasContent: Boolean(textInput.value.trim()) || attachments.files.length > 0
+	});
+}
+/** A queue tray aligned with the chat composer. */
+function AgentChatPromptTray({ className, ...props }) {
+	return /* @__PURE__ */ jsx(PromptInputTray, {
+		...props,
+		side: "top",
+		className: cx("agent-chat__prompt-tray", className)
+	});
+}
+function AgentChatQueue() {
+	const { queued, busy, stop, steer, removeQueued, queueError } = useAgentChatRuntime();
+	if (!queued.length && !queueError) return null;
+	return /* @__PURE__ */ jsx(AgentChatPromptTray, {
+		"data-agent-chat-queue": "",
+		children: /* @__PURE__ */ jsxs(Queue, {
+			density: "compact",
+			children: [queueError ? /* @__PURE__ */ jsx(AgentChatNotice, {
+				"data-tone": "danger",
+				role: "alert",
+				children: queueError
+			}) : null, /* @__PURE__ */ jsx(QueueList, {
+				"aria-label": "Queued messages",
+				children: queued.map((pending) => {
+					const label = pending.message.text || "Queued message";
+					return /* @__PURE__ */ jsxs(QueueItem, {
+						"data-slot": "agent-chat-queued-message",
+						children: [
+							/* @__PURE__ */ jsx(QueueItemIndicator, {}),
+							/* @__PURE__ */ jsx(QueueItemContent, { children: /* @__PURE__ */ jsx("span", {
+								"data-slot": "agent-chat-queued-text",
+								className: "sigvelo-truncate sigvelo-truncate-grow",
+								children: label
+							}) }),
+							/* @__PURE__ */ jsxs(QueueItemActions, {
+								persistent: true,
+								children: [!busy || stop ? /* @__PURE__ */ jsx(QueueItemAction, {
+									"aria-label": `${busy ? "Steer" : "Send"} queued message: ${label}`,
+									onClick: () => {
+										steer(pending.id).catch(() => void 0);
+									},
+									children: busy ? "Steer" : "Send now"
+								}) : null, /* @__PURE__ */ jsx(QueueItemAction, {
+									"aria-label": `Remove queued message: ${label}`,
+									onClick: () => removeQueued(pending.id),
+									children: /* @__PURE__ */ jsx(TrashIcon, {})
+								})]
+							})
+						]
+					}, pending.id);
+				})
+			})]
+		})
+	});
+}
+function AgentChatNotice({ children, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "agent-chat__notice",
+		role: "status",
+		"aria-atomic": "true",
+		...props,
+		children
+	});
+}
+const EMPTY_APPROVAL_ITEMS = [];
+const EMPTY_SKIPPED_IDS = [];
+const ApprovalsContext = React.createContext(null);
+function useAgentChatApprovals() {
+	const value = React.useContext(ApprovalsContext);
+	if (!value) throw new Error("Approval parts require AgentChat.Approvals or ThinkChat.Approvals.");
+	return value;
+}
+function AgentChatApprovals({ thinkStub, pendingApprovals = [], onExecutionSettled, children }) {
+	const { messages, onApprovalResponse, dockRef } = useAgentChatRuntime();
+	const [skipped, setSkipped] = React.useState({
+		source: thinkStub,
+		ids: []
+	});
+	const ids = skipped.source === thinkStub ? skipped.ids : EMPTY_SKIPPED_IDS;
+	const items = [...getPendingToolApprovals(messages, { pausedExecutions: Boolean(thinkStub) }).filter((part) => (part.state !== "approval-requested" || onApprovalResponse) && !ids.includes(getApprovalStateKey(part) ?? "")).map((part) => ({ part })), ...pendingApprovals.filter((a) => a.source === "action" && !ids.includes(a.executionId)).map((approval) => ({ approval }))];
+	const pending = items.length ? items : EMPTY_APPROVAL_ITEMS;
+	const restore = React.useRef(false);
+	const active = React.useRef(false);
+	React.useLayoutEffect(() => {
+		active.current = true;
+		return () => {
+			active.current = false;
+			restore.current = false;
 		};
-		setQueueHeld(false);
-		setComposerDraft("");
-		setCompactionState(null);
-		if (busy || pendingPrompts.length && !queueHeld) {
-			setPendingPrompts((current) => [...current, {
-				id: crypto.randomUUID(),
-				message: prompt
-			}]);
-			onPromptQueued?.();
-			return;
-		}
-		return onSubmit?.(prompt);
-	}, [
-		busy,
-		composerDraft,
-		onPromptQueued,
-		onSubmit,
-		pendingPrompts.length,
-		queueHeld
-	]);
-	const handleStop = onStop ? () => {
-		setQueueHeld(true);
-		onStop();
-	} : void 0;
-	React.useEffect(() => {
-		const becameReady = wasBusy.current && !busy;
-		wasBusy.current = busy;
-		const next = pendingPrompts[0];
-		if (!becameReady || queueHeld || !next || !onSubmit) return;
-		setPendingPrompts((current) => current.slice(1));
-		onSubmit(next.message);
-	}, [
-		busy,
-		onSubmit,
-		pendingPrompts,
-		queueHeld
-	]);
-	const selectComposerCommand = React.useCallback((command, trigger) => {
-		if (trigger === "/" && onCompact && command.id === COMPACT_SLASH_COMMAND.id) {
-			if (compactionInFlight.current || busy) return;
-			compactionInFlight.current = true;
-			setCompactionState("pending");
-			setComposerDraft("");
-			Promise.resolve().then(onCompact).then((result) => {
-				compactionInFlight.current = false;
-				setCompactionState(result?.compacted ? "compacted" : "unchanged");
-			}, (error) => {
-				compactionInFlight.current = false;
-				console.error("Manual compaction failed", error);
-				setCompactionState("failed");
-			});
-			return;
+	}, []);
+	const pendingCount = React.useRef(pending.length);
+	const restoreFocus = React.useCallback(() => {
+		if (active.current && !pendingCount.current && restore.current) {
+			restore.current = false;
+			dockRef.current?.querySelector("textarea,[contenteditable=\"true\"]")?.focus();
 		}
-		const nextDraft = replaceComposerTrigger(composerDraft, command, trigger);
-		const nextReferences = composerLinksToReferences(nextDraft);
-		(trigger === "@" ? mentionCommands : slashCommands)?.onSelect?.(command, {
-			value: nextDraft,
-			references: nextReferences,
-			setValue: setComposerDraft,
-			clear: () => setComposerDraft(""),
-			addReference: addComposerReference,
-			removeReference: removeComposerReference
+	}, [dockRef]);
+	React.useLayoutEffect(() => {
+		pendingCount.current = pending.length;
+		restoreFocus();
+	}, [pending.length, restoreFocus]);
+	const skip = React.useCallback(() => {
+		const item = pending[0];
+		if (!item) return;
+		restore.current = true;
+		const id = "part" in item ? getApprovalStateKey(item.part) : item.approval.executionId;
+		if (id) setSkipped({
+			source: thinkStub,
+			ids: [...ids, id]
 		});
 	}, [
-		addComposerReference,
-		busy,
-		composerDraft,
-		mentionCommands,
-		onCompact,
-		removeComposerReference,
-		slashCommands
+		pending,
+		thinkStub,
+		ids
 	]);
-	const [approvalSession, setApprovalSession] = React.useState(() => createApprovalSessionState(thinkStub));
-	const approvalSessionIsCurrent = approvalSession.thinkStub === thinkStub;
-	const skippedApprovalIds = approvalSessionIsCurrent ? approvalSession.skippedApprovalIds : EMPTY_SKIPPED_APPROVAL_IDS;
-	const localPermissionMode = approvalSessionIsCurrent ? approvalSession.permissionMode : "bypass";
-	const permissionMode = permissionModeControl?.value ?? localPermissionMode;
-	const updateApprovalSession = React.useCallback((update) => {
-		setApprovalSession((previous) => update(previous.thinkStub === thinkStub ? previous : createApprovalSessionState(thinkStub)));
-	}, [thinkStub]);
-	const setPermissionMode = React.useCallback((next) => {
-		if (permissionModeControl) {
-			permissionModeControl.onChange(next);
-			return;
+	const settled = React.useCallback(async () => {
+		if (active.current) {
+			restore.current = true;
+			restoreFocus();
 		}
-		updateApprovalSession((current) => ({
-			...current,
-			permissionMode: next
-		}));
-	}, [permissionModeControl, updateApprovalSession]);
-	React.useLayoutEffect(() => {
-		setApprovalSession((previous) => previous.thinkStub === thinkStub ? previous : createApprovalSessionState(thinkStub));
-	}, [thinkStub]);
-	const skippedApprovalIdSet = React.useMemo(() => new Set(skippedApprovalIds), [skippedApprovalIds]);
-	const pendingApprovalItems = React.useMemo(() => {
-		if (!approvalsEnabled) return [];
-		return [...getPendingToolApprovals(messages, { pausedExecutions: Boolean(thinkStub) }).filter((part) => {
-			if (part.state === "approval-requested" && !onApprovalResponse) return false;
-			const id = getApprovalStateKey(part);
-			return Boolean(id) && !skippedApprovalIdSet.has(id);
-		}).map((part) => ({ part })), ...thinkStub ? durableApprovals.filter((approval) => approval.source === "action" && !skippedApprovalIdSet.has(approval.executionId)).map((approval) => ({ approval })) : []];
-	}, [
-		approvalsEnabled,
-		durableApprovals,
-		messages,
-		onApprovalResponse,
-		skippedApprovalIdSet,
+		await onExecutionSettled?.();
+	}, [onExecutionSettled, restoreFocus]);
+	const value = React.useMemo(() => ({
+		pending,
+		skip,
+		settled,
+		thinkStub
+	}), [
+		pending,
+		skip,
+		settled,
 		thinkStub
 	]);
-	const approvalsWired = approvalsEnabled && Boolean(onApprovalResponse || thinkStub);
-	const autoApprovedIds = React.useRef({
-		thinkStub,
-		ids: /* @__PURE__ */ new Set()
+	return /* @__PURE__ */ jsx(ApprovalsContext.Provider, {
+		value,
+		children
 	});
-	const respondToApproval = React.useEffectEvent((id) => {
-		onApprovalResponse?.({
-			id,
-			approved: true
-		});
-	});
-	const notifyExecutionSettled = React.useEffectEvent(() => {
-		onExecutionSettled?.();
+}
+function AgentChatApproval() {
+	const { onApprovalResponse } = useAgentChatRuntime();
+	const { pending, skip, settled, thinkStub } = useAgentChatApprovals();
+	const first = pending[0];
+	if (!first) return null;
+	return /* @__PURE__ */ jsx(PromptInputApproval, {
+		part: "part" in first ? first.part : void 0,
+		approval: "approval" in first ? first.approval : void 0,
+		count: pending.length,
+		thinkStub,
+		onRespond: onApprovalResponse ? async (response) => {
+			await onApprovalResponse(response);
+			await settled();
+		} : void 0,
+		onExecutionSettled: settled,
+		onSkip: skip
 	});
-	React.useLayoutEffect(() => {
-		if (autoApprovedIds.current.thinkStub === thinkStub) return;
-		autoApprovedIds.current = {
-			thinkStub,
-			ids: /* @__PURE__ */ new Set()
-		};
-	}, [thinkStub]);
+}
+const compactingNotice = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerIcon, {}), "Compacting context…"] });
+const COMPACTION_NOTICES = {
+	pending: compactingNotice,
+	compacted: "Context compacted. Context usage updates after your next message.",
+	unchanged: "No context was compacted. Recent context is already protected.",
+	failed: "Compaction failed — run /compact to try again."
+};
+const COMPACTION_COMMAND = {
+	id: "agent-chat:compact",
+	value: "compact",
+	label: "compact",
+	description: "Summarize earlier messages to free up context",
+	icon: /* @__PURE__ */ jsx(ArchiveIcon, {}),
+	group: "Conversation",
+	meta: "Built in"
+};
+/** Explicit command action controller; callers put its command in the catalog and its notice where appropriate. */
+function useAgentChatCompaction(onCompact) {
+	const { busy, submissionVersion } = useAgentChatRuntime();
+	const { textInput } = usePromptInputController();
+	const [state, setState] = React.useState(null);
 	React.useEffect(() => {
-		if (permissionModeControl || permissionMode !== "bypass") return;
-		for (const item of pendingApprovalItems) {
-			const id = "part" in item ? getApprovalRequestId(item.part) : item.approval.executionId;
-			const key = "part" in item ? getApprovalStateKey(item.part) : item.approval.executionId;
-			if (!id || !key || autoApprovedIds.current.ids.has(key)) continue;
-			autoApprovedIds.current.ids.add(key);
-			if ("part" in item && item.part.state === "approval-requested") respondToApproval(id);
-			else if (thinkStub) thinkStub.approveExecution(id).finally(() => {
-				notifyExecutionSettled();
-			});
-		}
+		setState(null);
+	}, [submissionVersion]);
+	const inFlight = React.useRef(false);
+	const run = React.useCallback(() => {
+		if (busy || inFlight.current) return;
+		inFlight.current = true;
+		setState("pending");
+		textInput.clear();
+		Promise.resolve().then(onCompact).then((result) => setState(result.compacted ? "compacted" : "unchanged"), () => setState("failed")).finally(() => {
+			inFlight.current = false;
+		});
 	}, [
-		pendingApprovalItems,
-		permissionMode,
-		permissionModeControl,
-		thinkStub
+		busy,
+		onCompact,
+		textInput
 	]);
-	const pendingApproval = !permissionModeControl && permissionMode === "bypass" ? void 0 : pendingApprovalItems[0];
-	const pendingApprovalKey = pendingApproval ? "part" in pendingApproval ? getApprovalStateKey(pendingApproval.part) : pendingApproval.approval.executionId : void 0;
-	React.useLayoutEffect(() => {
-		if (pendingApprovalKey || !restoreComposerFocusAfterApproval.current) return;
-		restoreComposerFocusAfterApproval.current = false;
-		composerInputRef.current?.focus();
-	}, [pendingApprovalKey]);
-	const contextUsage = contextWindow ? getContextUsage(messages) : void 0;
-	const newestAssistantIndex = messages.findLastIndex((message) => message.role === "assistant" && !isCompactionMessage(message) && !getAgentEvent(message));
-	const lastAssistantIndex = onRegenerate && status !== "streaming" && status !== "submitted" ? newestAssistantIndex : -1;
-	const lastUserIndex = onEditAndResend ? messages.findLastIndex((message) => message.role === "user" && !getAgentEvent(message)) : -1;
-	const [editingMessageId, setEditingMessageId] = React.useState();
-	const restoreEditFocus = React.useRef(false);
-	const editButtonRef = React.useRef(null);
-	const handleStartEdit = React.useCallback((messageId) => {
-		restoreEditFocus.current = false;
-		setEditingMessageId(messageId);
-	}, []);
-	const handleCancelEdit = React.useCallback(() => {
-		restoreEditFocus.current = true;
-		setEditingMessageId(void 0);
-	}, []);
-	const handleFinishEdit = React.useCallback(() => {
-		restoreEditFocus.current = false;
-		setEditingMessageId(void 0);
-	}, []);
-	let assistantResponseCount = 0;
-	const assistantResponseNumbers = messages.map((message) => {
-		if (message.role !== "assistant" || isCompactionMessage(message) || getAgentEvent(message)) return 0;
-		assistantResponseCount += 1;
-		return assistantResponseCount;
-	});
-	React.useLayoutEffect(() => {
-		if (editingMessageId || !restoreEditFocus.current) return;
-		editButtonRef.current?.focus();
-		restoreEditFocus.current = false;
-	}, [editingMessageId]);
-	const transcriptRowProps = (message, messageIndex) => ({
-		message,
-		messageIndex,
-		status: messageIndex === messages.length - 1 ? status : "ready",
-		renderPart,
-		renderMessageAfter,
-		editing: editingMessageId === message.id,
-		canEdit: messageIndex === lastUserIndex,
-		editDisabled: disabled || busy,
-		onEditAndResend,
-		onStartEdit: handleStartEdit,
-		onCancelEdit: handleCancelEdit,
-		onFinishEdit: handleFinishEdit,
-		editButtonRef,
-		responseNumber: assistantResponseNumbers[messageIndex] ?? 0,
-		showAssistantActions: message.role === "assistant" && (showAssistantActions?.({
-			message,
-			messageIndex
-		}) ?? true),
-		showCopy: messageIndex !== newestAssistantIndex || status !== "streaming" && status !== "submitted",
-		showRetry: messageIndex === lastAssistantIndex,
-		onRegenerate,
-		onCopyStatus: announceCopyStatus
-	});
-	const composer = showComposer ? /* @__PURE__ */ jsxs("div", {
-		ref: observeAgentChatComposer,
-		className: "agent-chat__composer",
-		children: [
-			/* @__PURE__ */ jsx("div", {
-				className: "agent-chat__notice",
-				role: "status",
-				"aria-atomic": "true",
-				children: notice ?? (compactionState ? COMPACTION_NOTICES[compactionState] : null)
-			}),
-			composerTray || pendingPrompts.length ? /* @__PURE__ */ jsxs(PromptInputTray, {
-				side: "top",
-				className: "agent-chat__queued",
-				children: [composerTray, pendingPrompts.length ? /* @__PURE__ */ jsx("ul", {
-					className: "agent-chat__queued-list",
-					"aria-label": "Queued messages",
-					children: pendingPrompts.map((pending) => {
-						const messageText = pending.message.text || "Queued message";
-						return /* @__PURE__ */ jsxs(QueueItem, {
-							className: "agent-chat__queued-message",
-							children: [
-								/* @__PURE__ */ jsx("span", {
-									className: "agent-chat__queued-indicator",
-									"aria-hidden": "true",
-									children: /* @__PURE__ */ jsx(QueueIcon, {})
-								}),
-								/* @__PURE__ */ jsx(QueueItemContent, {
-									className: "agent-chat__queued-content",
-									children: /* @__PURE__ */ jsx("span", {
-										className: "agent-chat__queued-text sigvelo-truncate sigvelo-truncate-grow",
-										children: messageText
-									})
-								}),
-								/* @__PURE__ */ jsxs(QueueItemActions, {
-									className: "agent-chat__queued-actions",
-									children: [busy && onStop ? /* @__PURE__ */ jsx(Button, {
-										className: "agent-chat__queued-action",
-										"aria-label": `Steer queued message: ${messageText}`,
-										color: "neutral",
-										size: "xs",
-										variant: "ghost",
-										onClick: () => {
-											setPendingPrompts((current) => [pending, ...current.filter((item) => item.id !== pending.id)]);
-											setQueueHeld(false);
-											onStop();
-										},
-										children: "Steer"
-									}) : null, /* @__PURE__ */ jsx(IconButton, {
-										className: "agent-chat__queued-action agent-chat__queued-remove",
-										color: "neutral",
-										label: `Remove queued message: ${messageText}`,
-										size: "xs",
-										variant: "ghost",
-										onClick: () => setPendingPrompts((current) => current.filter((item) => item.id !== pending.id)),
-										children: /* @__PURE__ */ jsx(TrashIcon, {})
-									})]
-								})
-							]
-						}, pending.id);
-					})
-				}) : null]
-			}) : null,
-			/* @__PURE__ */ jsx(PromptInput, {
-				multiple: true,
-				onSubmit: handleSubmit,
-				children: pendingApproval ? /* @__PURE__ */ jsx(PromptInputApproval, {
-					part: "part" in pendingApproval ? pendingApproval.part : void 0,
-					approval: "approval" in pendingApproval ? pendingApproval.approval : void 0,
-					count: pendingApprovalItems.length,
-					onRespond: onApprovalResponse ? respondToPendingApproval : void 0,
-					thinkStub,
-					onExecutionSettled: handlePendingExecutionSettled,
-					onSkip: () => {
-						restoreComposerFocusAfterApproval.current = true;
-						const id = "part" in pendingApproval ? getApprovalStateKey(pendingApproval.part) : pendingApproval.approval.executionId;
-						if (id) updateApprovalSession((current) => ({
-							...current,
-							skippedApprovalIds: [...current.skippedApprovalIds, id]
-						}));
-					}
-				}) : /* @__PURE__ */ jsxs(Fragment, { children: [
-					composerHeader ? /* @__PURE__ */ jsx(PromptInputHeader, { children: composerHeader }) : null,
-					/* @__PURE__ */ jsx(PromptInputAttachments, {}),
-					/* @__PURE__ */ jsx(PromptInputBody, { children: slashCommands || mentionCommands || onCompact ? /* @__PURE__ */ jsx(PromptInputCommandComposer, {
-						ref: composerInputRef,
-						"aria-label": "Message",
-						placeholder,
-						disabled,
-						commands: onCompact && !busy ? [COMPACT_SLASH_COMMAND, ...slashCommands?.items ?? []] : slashCommands?.items ?? [],
-						mentionCommands: mentionCommands?.items,
-						value: composerDraft,
-						onValueChange: setComposerDraft,
-						onCommandSelect: selectComposerCommand
-					}) : /* @__PURE__ */ jsx(PromptInputTextarea, {
-						ref: composerInputRef,
-						"aria-label": "Message",
-						placeholder,
-						disabled,
-						value: composerDraft,
-						onChange: (event) => setComposerDraft(event.currentTarget.value)
-					}) }),
-					/* @__PURE__ */ jsxs(PromptInputFooter, { children: [/* @__PURE__ */ jsxs(PromptInputTools, { children: [
-						/* @__PURE__ */ jsx(AgentChatAddMenu, { children: composerAddMenuItems }),
-						contextSelector ? /* @__PURE__ */ jsx(PromptInputContextSelector, { ...contextSelector }) : null,
-						approvalsWired ? /* @__PURE__ */ jsx(PromptInputPermissionSelector, {
-							value: permissionMode,
-							onValueChange: setPermissionMode
-						}) : null,
-						composerTools
-					] }), /* @__PURE__ */ jsxs("div", {
-						className: "prompt-input__footer-end",
-						children: [
-							composerEndTools,
-							voiceInput ? /* @__PURE__ */ jsx(PromptInputDictation, {
-								voice: voiceInput,
-								beforeStart: beforeVoiceStart,
-								disabled
-							}) : null,
-							contextWindow ? /* @__PURE__ */ jsxs(Context, {
-								usedTokens: getContextUsedTokens(contextUsage),
-								maxTokens: contextWindow.maxTokens,
-								usage: contextUsage,
-								modelId: contextWindow.modelId,
-								children: [/* @__PURE__ */ jsx(ContextTrigger, {}), /* @__PURE__ */ jsxs(ContextContent, { children: [/* @__PURE__ */ jsx(ContextContentHeader, {}), /* @__PURE__ */ jsx(ContextContentBody, {})] })]
-							}) : null,
-							/* @__PURE__ */ jsx(AgentChatSubmitAction, {
-								status,
-								onStop: handleStop,
-								disabled,
-								hasDraft: Boolean(composerDraft.trim())
-							})
-						]
-					})] })
-				] })
-			})
-		]
-	}) : null;
-	const emptyRow = emptyState ?? /* @__PURE__ */ jsx(EmptyState, {
-		title: "Start a conversation",
-		description: "Ask the agent to inspect, plan, or build."
-	});
-	const showsStartScreen = !loading && messages.length === 0 && showComposer && startScreen !== false && (startScreen !== void 0 || emptyState === void 0);
-	const startScreenProps = startScreen && typeof startScreen === "object" ? startScreen : void 0;
-	return /* @__PURE__ */ jsxs(TransitionSurface, {
-		ref,
-		variant: "fade",
-		className: cx("agent-chat", className),
-		"data-recipe": "fill-host",
-		"data-composer-hidden": showComposer ? void 0 : "",
-		children: [
-			/* @__PURE__ */ jsx("span", {
-				className: "message__copy-status sigvelo-visually-hidden",
-				role: "status",
-				"aria-atomic": "true",
-				children: copyAnnouncement
-			}),
-			loading ? /* @__PURE__ */ jsx("div", {
-				className: "agent-chat__transcript-loading",
-				role: "status",
-				children: /* @__PURE__ */ jsx(EmptyState, {
-					icon: /* @__PURE__ */ jsx(SpinnerIcon, {}),
-					description: "Loading conversation"
-				})
-			}) : showsStartScreen ? /* @__PURE__ */ jsx(AgentChatStartScreen, {
-				...startScreenProps,
-				composer
-			}) : /* @__PURE__ */ jsx(ExpansionStateProvider, { children: /* @__PURE__ */ jsx(VirtualMessageScroller, {
-				className: "agent-chat__conversation",
-				items: messages,
-				getItemKey: (message) => message.id,
-				emptyState: /* @__PURE__ */ jsx("div", {
-					className: "conversation__empty-row",
-					children: emptyRow
-				}),
-				contentProps: {
-					role: "log",
-					"aria-live": "off",
-					"aria-busy": status === "streaming" || status === "submitted",
-					className: "agent-chat__transcript-content"
-				},
-				scrollButtonLabel: "Scroll to latest",
-				scrollButtonProps: { className: "agent-chat__scroll-button" },
-				renderItem: (message, messageIndex) => /* @__PURE__ */ jsx(AgentChatTranscriptRowBody, { ...transcriptRowProps(message, messageIndex) })
-			}) }),
-			showsStartScreen ? null : composer
-		]
-	});
+	return {
+		command: busy ? void 0 : COMPACTION_COMMAND,
+		run,
+		notice: state ? COMPACTION_NOTICES[state] : null
+	};
 }
+const AgentChat = {
+	Root: AgentChatRoot,
+	Transcript: AgentChatTranscript,
+	Message: AgentChatMessage,
+	MessageContent: AgentChatMessageContent,
+	Actions: AgentChatActions,
+	CopyAction: AgentChatCopyAction,
+	RetryAction: AgentChatRetryAction,
+	EditAction: AgentChatEditAction,
+	Timestamp: AgentChatTimestamp,
+	Dock: AgentChatDock,
+	Composer: AgentChatComposer,
+	Submit: AgentChatSubmit,
+	PromptTray: AgentChatPromptTray,
+	Queue: AgentChatQueue,
+	Notice: AgentChatNotice,
+	Loading: AgentChatLoading,
+	Approvals: AgentChatApprovals,
+	Approval: AgentChatApproval
+};
 //#endregion
-export { AgentChat, compactingNotice };
+export { AgentChat, AgentChatActions, AgentChatApproval, AgentChatApprovals, AgentChatComposer, AgentChatCopyAction, AgentChatDock, AgentChatEditAction, AgentChatLoading, AgentChatMessage, AgentChatMessageContent, AgentChatNotice, AgentChatPromptTray, AgentChatQueue, AgentChatRetryAction, AgentChatRoot, AgentChatSubmit, AgentChatTimestamp, AgentChatTranscript, compactingNotice, useAgentChatApprovals, useAgentChatCompaction, useAgentChatRuntime };