@mcp-b/react-components 0.48.0 → 0.49.1

package/dist/components/agents-sdk/ThinkChat.d.ts

@@ -1,2 +1,102 @@
-import { a as ThinkChatProvider, c as ThinkChatRootProps, d as thinkPendingExecutionApprovalsQueryOptions, f as useThinkChat, i as ThinkChatMessagesProps, l as ThinkPendingExecutionApprovalsQueryKey, n as ThinkChatDraft, o as ThinkChatProviderProps, p as useThinkPendingExecutionApprovals, r as ThinkChatMessages, s as ThinkChatRoot, t as ThinkChat, u as ThinkPendingExecutionApprovalsQueryOptions } from "../../ThinkChat-CwMdEum8.js";
-export { ThinkChat, ThinkChatDraft, ThinkChatMessages, ThinkChatMessagesProps, ThinkChatProvider, ThinkChatProviderProps, ThinkChatRoot, ThinkChatRootProps, ThinkPendingExecutionApprovalsQueryKey, ThinkPendingExecutionApprovalsQueryOptions, thinkPendingExecutionApprovalsQueryOptions, useThinkChat, useThinkPendingExecutionApprovals };
+import { J as PromptInputMessage } from "../../PromptInput-4kCz3T9P.js";
+import { AgentMessageRenderPartContext } from "../ai-sdk/AgentMessageParts.js";
+import { AgentChatMessageContentProps, AgentChatRootProps } from "./AgentChat.js";
+import { UseSessionCompactionResult } from "./SessionCompaction.js";
+import { ThinkChatActivity, ThinkChatActivityRendererOptions, createThinkChatActivityRenderer } from "./ThinkChatActivity.js";
+import { ThinkChatValue } from "./ThinkChatContext.js";
+import { WorkspaceFileRenderer } from "./WorkspaceMessageResponse.js";
+import * as React from "react";
+import { ChatStatus, UIMessage } from "ai";
+import { DataTag, UndefinedInitialDataOptions } from "@tanstack/react-query";
+import { PendingApproval, Think } from "@cloudflare/think";
+import { AgentStub } from "agents/client";
+
+//#region src/components/agents-sdk/ThinkChat.d.ts
+type ThinkPendingExecutionApprovalsQueryKey = readonly ["think", sourceKey: string, "pending-approvals"];
+type ThinkPendingExecutionApprovalsQueryOptions = UndefinedInitialDataOptions<readonly PendingApproval[], Error, readonly PendingApproval[], ThinkPendingExecutionApprovalsQueryKey> & {
+  queryKey: DataTag<ThinkPendingExecutionApprovalsQueryKey, readonly PendingApproval[], Error>;
+};
+/** Shared pending-approval options for components and TanStack Router loaders. */
+declare function thinkPendingExecutionApprovalsQueryOptions(stub: AgentStub<Think>, sourceKey: string): ThinkPendingExecutionApprovalsQueryOptions;
+declare function useThinkPendingExecutionApprovals(stub: AgentStub<Think>, sourceKey: string, refreshSignal?: unknown, enabled?: boolean): {
+  pendingApprovals: readonly PendingApproval[];
+  refreshPendingApprovals: () => Promise<void>;
+};
+/** The chat status shared by transcript, composer, and an external queue owner. */
+declare function getThinkChatStatus<State = unknown, MessageT extends UIMessage = UIMessage>(chat: ThinkChatValue<State, MessageT>): ChatStatus;
+interface ThinkChatRootProps<State = unknown, MessageT extends UIMessage = UIMessage> extends Omit<AgentChatRootProps<MessageT>, "messages" | "status" | "onSubmit" | "onStop" | "onRegenerate" | "onApprovalResponse"> {
+  /** Whole upstream hook value. Connections and subscriptions remain application-owned. */
+  chat: ThinkChatValue<State, MessageT>;
+}
+/** A single live adapter. It renders only explicit children and never opens another connection. */
+declare function ThinkChatRoot<State = unknown, MessageT extends UIMessage = UIMessage>({
+  chat,
+  children,
+  ...props
+}: ThinkChatRootProps<State, MessageT>): React.JSX.Element;
+/** Normalize composer references for the upstream transport, also usable before a conversation exists. */
+declare function normalizeThinkPrompt({
+  text,
+  references
+}: PromptInputMessage): string;
+interface ThinkChatMessageContentProps<MessageT extends UIMessage = UIMessage> extends AgentChatMessageContentProps<MessageT>, ThinkChatActivityRendererOptions<MessageT> {
+  renderWorkspaceFile?: WorkspaceFileRenderer;
+}
+/** Think activity/workspace rendering, independent of transcript layout and message actions. */
+declare function ThinkChatMessageContent<MessageT extends UIMessage = UIMessage>({
+  message,
+  renderPart,
+  excludeTools,
+  renderAgentToolRunLink,
+  toolRenderers,
+  renderWorkspaceFile
+}: ThinkChatMessageContentProps<MessageT>): React.JSX.Element;
+interface ThinkChatApprovalsProps {
+  stub: AgentStub<Think>;
+  sourceKey: string;
+  /** Chat parts that share the pending approvals discovered for this source. */
+  children: React.ReactNode;
+}
+/** Explicit durable discovery; policy and the decision to render a card remain with the caller. */
+declare function ThinkChatApprovals({
+  stub,
+  sourceKey,
+  children
+}: ThinkChatApprovalsProps): React.JSX.Element;
+declare function ThinkChatRecoveryNotice(): React.JSX.Element;
+declare function ThinkChatCompactionNotice({
+  compaction
+}: {
+  compaction: UseSessionCompactionResult;
+}): React.JSX.Element;
+declare function useThinkChat<State = unknown, MessageT extends UIMessage = UIMessage>(): Omit<import("@ai-sdk/react").UseChatHelpers<MessageT>, "addToolOutput"> & {
+  clearHistory: () => void;
+  addToolOutput: (opts: {
+    toolCallId: string;
+    toolName?: string;
+    output?: unknown;
+    state?: "output-available" | "output-error";
+    errorText?: string;
+  }) => void;
+  isServerStreaming: boolean;
+  isStreaming: boolean;
+  isRecovering: boolean;
+  isToolContinuation: boolean;
+  connectionError: (Error & {
+    code: number;
+    reason: string;
+    wasClean: boolean;
+  }) | null;
+};
+declare const ThinkChat: {
+  Root: typeof ThinkChatRoot;
+  MessageContent: typeof ThinkChatMessageContent;
+  Approvals: typeof ThinkChatApprovals;
+  RecoveryNotice: typeof ThinkChatRecoveryNotice;
+  CompactionNotice: typeof ThinkChatCompactionNotice;
+  Activity: typeof ThinkChatActivity;
+  renderActivityPart: (context: AgentMessageRenderPartContext<UIMessage<unknown, import("ai").UIDataTypes, import("ai").UITools>>) => React.ReactNode | undefined;
+  createActivityRenderer: typeof createThinkChatActivityRenderer;
+};
+//#endregion
+export { ThinkChat, ThinkChatApprovals, ThinkChatApprovalsProps, ThinkChatCompactionNotice, ThinkChatMessageContent, ThinkChatMessageContentProps, ThinkChatRecoveryNotice, ThinkChatRoot, ThinkChatRootProps, ThinkPendingExecutionApprovalsQueryKey, ThinkPendingExecutionApprovalsQueryOptions, getThinkChatStatus, normalizeThinkPrompt, thinkPendingExecutionApprovalsQueryOptions, useThinkChat, useThinkPendingExecutionApprovals };

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

@@ -1,2 +1,233 @@
-import { a as thinkPendingExecutionApprovalsQueryOptions, i as ThinkChatRoot, n as ThinkChatMessages, o as useThinkChat, r as ThinkChatProvider, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../../ThinkChat-DiI6hhDP.js";
-export { ThinkChat, ThinkChatMessages, ThinkChatProvider, ThinkChatRoot, thinkPendingExecutionApprovalsQueryOptions, useThinkChat, useThinkPendingExecutionApprovals };
+import { composerDraftToPrompt, parseComposerLinks } from "../../utils/composer-link.js";
+import { AgentChat, compactingNotice, useAgentChatRuntime } from "./AgentChat.js";
+import { ThinkChatContext, ThinkChatLiveContext, useOptionalThinkChatContext, useThinkChatContext } from "./ThinkChatContext.js";
+import { ThinkChatActivity, createThinkChatActivityRenderer, renderThinkChatActivityPart } from "./ThinkChatActivity.js";
+import { ThinkRecoveryNotice } from "./ThinkRecoveryNotice.js";
+import { n as WorkspaceMessageResponse, t as WorkspaceFileRendererProvider } from "../../WorkspaceMessageResponse-CUJk9_P5.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { isTextUIPart } from "ai";
+import { queryOptions, useQuery, useQueryClient } from "@tanstack/react-query";
+//#region src/components/agents-sdk/ThinkChat.tsx
+const EMPTY_PENDING_APPROVALS = [];
+const STREAMED_TEXT_ANIMATION = {
+	animation: "fadeIn",
+	duration: 150,
+	easing: "cubic-bezier(0.37, 0.55, 0.86, 0.88)",
+	sep: "word",
+	stagger: 0
+};
+function thinkPendingExecutionApprovalsQueryKey(sourceKey) {
+	return [
+		"think",
+		sourceKey,
+		"pending-approvals"
+	];
+}
+/** Shared pending-approval options for components and TanStack Router loaders. */
+function thinkPendingExecutionApprovalsQueryOptions(stub, sourceKey) {
+	return queryOptions({
+		queryKey: thinkPendingExecutionApprovalsQueryKey(sourceKey),
+		queryFn: () => stub.pendingApprovals(),
+		staleTime: 5e3
+	});
+}
+function useThinkPendingExecutionApprovals(stub, sourceKey, refreshSignal, enabled = true) {
+	const queryClient = useQueryClient();
+	const approvalsQuery = useQuery({
+		...thinkPendingExecutionApprovalsQueryOptions(stub, sourceKey),
+		enabled
+	});
+	const refreshState = React.useRef({
+		sourceKey,
+		observedSignal: refreshSignal,
+		pending: false
+	});
+	const refetch = React.useEffectEvent(() => approvalsQuery.refetch());
+	const refreshPendingApprovals = React.useCallback(async () => {
+		if (!enabled) return;
+		const filters = {
+			queryKey: thinkPendingExecutionApprovalsQueryKey(sourceKey),
+			exact: true
+		};
+		await queryClient.cancelQueries(filters);
+		await queryClient.invalidateQueries(filters);
+	}, [
+		enabled,
+		queryClient,
+		sourceKey
+	]);
+	React.useEffect(() => {
+		if (!enabled || refreshState.current.sourceKey !== sourceKey) {
+			refreshState.current = {
+				sourceKey,
+				observedSignal: refreshSignal,
+				pending: false
+			};
+			return;
+		}
+		if (!Object.is(refreshState.current.observedSignal, refreshSignal)) {
+			refreshState.current.observedSignal = refreshSignal;
+			refreshState.current.pending = true;
+		}
+		if (approvalsQuery.isFetching || !refreshState.current.pending) return;
+		refreshState.current.pending = false;
+		refetch();
+	}, [
+		approvalsQuery.isFetching,
+		enabled,
+		refreshSignal,
+		sourceKey
+	]);
+	return React.useMemo(() => ({
+		pendingApprovals: approvalsQuery.data ?? EMPTY_PENDING_APPROVALS,
+		refreshPendingApprovals
+	}), [approvalsQuery.data, refreshPendingApprovals]);
+}
+/** The chat status shared by transcript, composer, and an external queue owner. */
+function getThinkChatStatus(chat) {
+	return chat.status === "submitted" ? "submitted" : chat.isStreaming || chat.isRecovering ? "streaming" : chat.status;
+}
+/** A single live adapter. It renders only explicit children and never opens another connection. */
+function ThinkChatRoot({ chat, children, ...props }) {
+	const lastMessageId = chat.messages.at(-1)?.id;
+	const live = React.useMemo(() => ({
+		isStreaming: Boolean(chat.isStreaming),
+		lastMessageId
+	}), [chat.isStreaming, lastMessageId]);
+	const submit = React.useCallback(async ({ text, files, references }) => {
+		const prompt = normalizeThinkPrompt({
+			text,
+			files,
+			references
+		});
+		if (prompt || files.length) await chat.sendMessage({
+			text: prompt,
+			files
+		});
+	}, [chat.sendMessage]);
+	return /* @__PURE__ */ jsx(ThinkChatContext.Provider, {
+		value: chat,
+		children: /* @__PURE__ */ jsx(ThinkChatLiveContext.Provider, {
+			value: live,
+			children: /* @__PURE__ */ jsx(AgentChat.Root, {
+				...props,
+				messages: chat.messages,
+				status: getThinkChatStatus(chat),
+				onSubmit: submit,
+				onStop: chat.stop,
+				onRegenerate: (messageId) => void chat.regenerate({ messageId }),
+				onApprovalResponse: chat.addToolApprovalResponse,
+				children
+			})
+		})
+	});
+}
+/** Normalize composer references for the upstream transport, also usable before a conversation exists. */
+function normalizeThinkPrompt({ text, references }) {
+	return parseComposerLinks(text).length ? composerDraftToPrompt(text) : [...references?.map(({ trigger, value }) => trigger ? `${trigger}${value}` : value) ?? [], text.trim()].filter(Boolean).join(" ");
+}
+/** Think activity/workspace rendering, independent of transcript layout and message actions. */
+function ThinkChatMessageContent({ message, renderPart, excludeTools, renderAgentToolRunLink, toolRenderers, renderWorkspaceFile }) {
+	const { messages, status } = useAgentChatRuntime();
+	const isLiveMessage = message.role === "assistant" && message.id === messages.at(-1)?.id && status === "streaming";
+	const activity = React.useMemo(() => createThinkChatActivityRenderer({
+		excludeTools,
+		renderAgentToolRunLink,
+		toolRenderers
+	}), [
+		excludeTools,
+		renderAgentToolRunLink,
+		toolRenderers
+	]);
+	const resolved = React.useCallback((context) => {
+		const renderBuiltIn = () => {
+			const result = activity(context);
+			if (result !== void 0) return result;
+			return isTextUIPart(context.part) && context.part.text ? /* @__PURE__ */ jsx(WorkspaceMessageResponse, {
+				animated: STREAMED_TEXT_ANIMATION,
+				isAnimating: isLiveMessage && context.part.state === "streaming",
+				promoteWorkspaceFiles: context.message.role === "assistant",
+				children: context.part.text
+			}) : context.defaultRender();
+		};
+		const custom = renderPart?.({
+			...context,
+			defaultRender: renderBuiltIn
+		});
+		return custom === void 0 ? renderBuiltIn() : custom;
+	}, [
+		activity,
+		renderPart,
+		isLiveMessage
+	]);
+	return /* @__PURE__ */ jsx(WorkspaceFileRendererProvider, {
+		renderWorkspaceFile,
+		children: /* @__PURE__ */ jsx(AgentChat.MessageContent, {
+			message,
+			renderPart: resolved
+		})
+	});
+}
+/** Explicit durable discovery; policy and the decision to render a card remain with the caller. */
+function ThinkChatApprovals({ stub, sourceKey, children }) {
+	const chat = useThinkChatContext("ThinkChat.Approvals");
+	const approvals = useThinkPendingExecutionApprovals(stub, sourceKey, `${chat.messages.length}:${chat.status}`);
+	return /* @__PURE__ */ jsx(AgentChat.Approvals, {
+		thinkStub: stub,
+		pendingApprovals: approvals.pendingApprovals,
+		onExecutionSettled: approvals.refreshPendingApprovals,
+		children
+	}, sourceKey);
+}
+function ThinkChatRecoveryNotice() {
+	const chat = useThinkChatContext("ThinkChat.RecoveryNotice");
+	return /* @__PURE__ */ jsx(AgentChat.Notice, { children: /* @__PURE__ */ jsx(ThinkRecoveryNotice, { chat }) });
+}
+/** A submitted turn dismisses the result visible in that same committed update. */
+function useCompactionDismissal(result, revision) {
+	const previousRevision = React.useRef(revision);
+	const dismissed = React.useRef(null);
+	const revisionChanged = previousRevision.current !== revision;
+	React.useLayoutEffect(() => {
+		if (!revisionChanged) return;
+		previousRevision.current = revision;
+		dismissed.current = result;
+	}, [
+		result,
+		revision,
+		revisionChanged
+	]);
+	return revisionChanged || result === dismissed.current;
+}
+function getCompactionNotice(compaction, resultDismissed) {
+	if (compaction.compacting) return compactingNotice;
+	if (compaction.sessionError) return `Compaction failed: ${compaction.sessionError}`;
+	if (compaction.reloadError) return "Transcript may be out of date. The next completed turn will retry the refresh.";
+	const result = compaction.lastCompaction;
+	if (!result || resultDismissed) return null;
+	const freed = Math.round((result.tokensBefore - result.tokensAfter) / 1e3) * 1e3;
+	return `Context compacted${freed > 0 ? ` — about ${freed.toLocaleString()} tokens freed` : ""}. Context usage updates after your next message.`;
+}
+function ThinkChatCompactionNotice({ compaction }) {
+	const chat = useOptionalThinkChatContext();
+	const { submissionVersion } = useAgentChatRuntime();
+	const revision = `${chat?.messages.length}:${submissionVersion}`;
+	const dismissed = useCompactionDismissal(compaction.lastCompaction, revision);
+	return /* @__PURE__ */ jsx(AgentChat.Notice, { children: getCompactionNotice(compaction, dismissed) });
+}
+function useThinkChat() {
+	return useThinkChatContext("useThinkChat");
+}
+const ThinkChat = {
+	Root: ThinkChatRoot,
+	MessageContent: ThinkChatMessageContent,
+	Approvals: ThinkChatApprovals,
+	RecoveryNotice: ThinkChatRecoveryNotice,
+	CompactionNotice: ThinkChatCompactionNotice,
+	Activity: ThinkChatActivity,
+	renderActivityPart: renderThinkChatActivityPart,
+	createActivityRenderer: createThinkChatActivityRenderer
+};
+//#endregion
+export { ThinkChat, ThinkChatApprovals, ThinkChatCompactionNotice, ThinkChatMessageContent, ThinkChatRecoveryNotice, ThinkChatRoot, getThinkChatStatus, normalizeThinkPrompt, thinkPendingExecutionApprovalsQueryOptions, useThinkChat, useThinkPendingExecutionApprovals };

package/dist/components/agents-sdk/ThinkChatActivity.d.ts

@@ -1,2 +1,77 @@
-import { a as ThinkChatToolRenderers, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as renderThinkChatActivityPart, t as ThinkChatActivity } from "../../ThinkChatActivity-B3lGVS-6.js";
+import { AgentMessageRenderPartContext } from "../ai-sdk/AgentMessageParts.js";
+import { AgentChatMessageContentProps } from "./AgentChat.js";
+import { n as AgentToolRunValue } from "../../AgentToolRunsContext-GMe_hSnD.js";
+import { l as ThinkChatPart } from "../../ThinkChatToolParts-D4qcnnxt.js";
+import { t as ThinkChatActivityDescription } from "../../ThinkChatActivitySummary-BtBQgMg6.js";
+import * as React from "react";
+import { DynamicToolUIPart, ToolUIPart, UIMessage } from "ai";
+
+//#region src/components/agents-sdk/ThinkChatActivity.d.ts
+/**
+ * Bespoke rendering for one tool inside the activity log. Both hooks fall
+ * through to the built-in families when they return `undefined`, so an
+ * override can adjust just the action or just the panel.
+ */
+interface ThinkChatToolRenderer {
+  /** One-line step action. `null` hides the step from the log. */
+  describe?: (part: ToolUIPart | DynamicToolUIPart) => ThinkChatActivityDescription | null | undefined;
+  /** Expanded detail under the step. `null` keeps the step a plain row. */
+  panel?: (part: ToolUIPart | DynamicToolUIPart) => React.ReactNode;
+}
+type ThinkChatToolRenderers = Record<string, ThinkChatToolRenderer>;
+interface ThinkChatActivityRendererOptions<MessageT extends UIMessage = UIMessage> {
+  /**
+   * Tool names to keep out of activity folding entirely — the run splits
+   * around them and they fall through to your own renderPart / AgentChat's
+   * generic standalone activity row. For tools that should stay in the log
+   * with custom UI, use `toolRenderers` instead.
+   */
+  excludeTools?: readonly string[];
+  /** Per-tool action/panel overrides inside the activity log, keyed by tool name. */
+  toolRenderers?: ThinkChatToolRenderers;
+  /** App-authored TanStack Router Link for each retained child destination. */
+  renderAgentToolRunLink?: (run: AgentToolRunValue<MessageT["parts"][number]>) => React.ReactElement;
+}
+interface ThinkChatActivityProps {
+  /** Render with the log expanded. */
+  defaultOpen?: boolean;
+  parts: readonly ThinkChatPart[];
+  /** Defaults to deriving from part states (reasoning streaming, tool awaiting output). */
+  isStreaming?: boolean;
+  /** Per-tool action/panel overrides, keyed by tool name. */
+  toolRenderers?: ThinkChatToolRenderers;
+  /** Replaces the summary action after the activity settles. */
+  settledAction?: string;
+  /**
+   * Uniquely identifies this run across the whole transcript for persisted
+   * disclosure state (the activity renderer passes `${message.id}:${runStart}`).
+   * Required because any derivable fallback collides for reasoning-led runs
+   * in different messages, bleeding open/closed state across virtualization
+   * remounts.
+   */
+  stateKey: string;
+}
+declare function ThinkChatActivity({
+  parts,
+  defaultOpen,
+  isStreaming,
+  toolRenderers,
+  settledAction,
+  stateKey
+}: ThinkChatActivityProps): React.JSX.Element | null;
+/**
+ * Builds a renderPart handler that folds every run of consecutive activity
+ * parts (reasoning + tool calls) into one collapsed Activity box. Everything
+ * is derived from the UIMessage stream: part order, tool states, reasoning
+ * state. Excluded tools split the run and return undefined so your own
+ * renderPart (or AgentChat's generic activity row) takes over for them.
+ */
+declare function createThinkChatActivityRenderer<MessageT extends UIMessage = UIMessage>({
+  excludeTools,
+  renderAgentToolRunLink,
+  toolRenderers
+}?: ThinkChatActivityRendererOptions<MessageT>): NonNullable<AgentChatMessageContentProps<MessageT>["renderPart"]>;
+/** Default activity renderer — `createThinkChatActivityRenderer()` with no overrides. */
+declare const renderThinkChatActivityPart: (context: AgentMessageRenderPartContext<UIMessage<unknown, import("ai").UIDataTypes, import("ai").UITools>>) => React.ReactNode | undefined;
+//#endregion
 export { ThinkChatActivity, ThinkChatActivityProps, ThinkChatActivityRendererOptions, ThinkChatToolRenderer, ThinkChatToolRenderers, createThinkChatActivityRenderer, renderThinkChatActivityPart };

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

@@ -1,10 +1,11 @@
+import { AgentActivityFavicon, AgentActivityIcon } from "./AgentActivity.js";
 import { useExpansionState } from "../ai-sdk/ExpansionState.js";
 import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityText, ActivityTrigger } from "../ai-sdk/Activity.js";
 import { Button } from "../foundations/Button.js";
 import { MessageResponse } from "../ai-sdk/Message.js";
 import { useOptionalAgentToolRuns } from "./AgentToolRunsContext.js";
-import { AgentActivityFavicon, AgentActivityIcon } from "./AgentActivity.js";
-import { SubagentRunList } from "./SubagentRunList.js";
+import { getSubagentRunName } from "./SubagentRunIndicator.js";
+import { t as NavigationLink } from "../../navigation-link-kqMa81v5.js";
 import { useOptionalThinkChatLive } from "./ThinkChatContext.js";
 import { isBrowserToolPart, isExecuteToolPart, isFetchToolPart, isPartWorking, isSessionContextToolPart, isSkillToolPart, isThinkChatActivityPart, isWorkspaceToolPart } from "./ThinkChatToolParts.js";
 import { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSessionContextPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel } from "./ThinkChatToolPanels.js";
@@ -21,7 +22,7 @@ function activityPartIcon(part) {
 * One run of agent work as a collapsed Activity block: while streaming the
 * action shimmers with the live step; settled, it becomes a short summary
 * ("Thought, read 2 files and ran a command") over an expandable step log
-* with per-tool panels. Normally reached through `ThinkChat.Messages`;
+* with per-tool panels. Normally reached through `ThinkChat.MessageContent`;
 * exported for apps that lay out messages themselves.
 */
 /**
@@ -64,7 +65,7 @@ function ThinkChatActivity({ parts, defaultOpen, isStreaming, toolRenderers, set
 		}), /* @__PURE__ */ jsxs(ActivityContent, { children: [hiddenStepCount > 0 ? /* @__PURE__ */ jsxs(Button, {
 			size: "sm",
 			variant: "ghost",
-			className: "activity__show-earlier",
+			className: "think-chat-activity__show-earlier",
 			onClick: () => setShowAllSteps(true),
 			children: [
 				"Show ",
@@ -170,7 +171,7 @@ function ThinkChatActivityGroup({ message, parts, renderAgentToolRunLink, isTrai
 	const agentTools = useOptionalAgentToolRuns();
 	const runs = React.useMemo(() => {
 		if (!agentTools || !renderAgentToolRunLink) return [];
-		return parts.flatMap((part) => isToolUIPart(part) ? agentTools.getRunsForToolCall(part.toolCallId) : []);
+		return [...new Map(parts.flatMap((part) => isToolUIPart(part) ? agentTools.getRunsForToolCall(part.toolCallId) : []).map((run) => [run.runId, run])).values()];
 	}, [
 		agentTools,
 		parts,
@@ -182,11 +183,18 @@ function ThinkChatActivityGroup({ message, parts, renderAgentToolRunLink, isTrai
 		settledAction,
 		toolRenderers,
 		stateKey
-	}), runs.length && renderAgentToolRunLink ? /* @__PURE__ */ jsx(SubagentRunList, {
-		className: "subagent-run__list--adjacent",
-		"aria-label": "Delegated agent runs",
-		runs,
-		renderRunLink: renderAgentToolRunLink
+	}), runs.length && renderAgentToolRunLink ? /* @__PURE__ */ jsx("ul", {
+		className: "think-chat-activity__runs",
+		"aria-label": "Delegation history",
+		children: runs.map((run) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(NavigationLink, {
+			render: renderAgentToolRunLink(run),
+			"aria-label": `View ${getSubagentRunName(run)} report`,
+			children: [
+				"Delegated ",
+				getSubagentRunName(run),
+				" · View report"
+			]
+		}) }, run.runId))
 	}) : null] });
 }
 /**

package/dist/components/agents-sdk/ThinkChatContext.d.ts

@@ -1,2 +1,28 @@
-import { a as useOptionalThinkChatContext, i as ThinkChatValue, n as ThinkChatLiveContext, o as useOptionalThinkChatLive, r as ThinkChatLiveValue, s as useThinkChatContext, t as ThinkChatContext } from "../../ThinkChatContext-COIgzkYp.js";
+import * as React from "react";
+import { UIMessage } from "ai";
+import { useAgentChat } from "@cloudflare/think/react";
+
+//#region src/components/agents-sdk/ThinkChatContext.d.ts
+/** The complete upstream Think chat hook value, preserving app state and message extensions. */
+type ThinkChatValue<State = unknown, MessageT extends UIMessage = UIMessage> = ReturnType<typeof useAgentChat<State, MessageT>>;
+/**
+ * React contexts cannot bind provider-specific generics. Keep the stored value
+ * opaque and restore the complete upstream hook type through the typed accessors.
+ */
+declare const ThinkChatContext: React.Context<unknown>;
+declare function useOptionalThinkChatContext<State = unknown, MessageT extends UIMessage = UIMessage>(): ThinkChatValue<State, MessageT> | null;
+declare function useThinkChatContext<State = unknown, MessageT extends UIMessage = UIMessage>(component: string): ThinkChatValue<State, MessageT>;
+/**
+ * The two live-chat facts transcript rows actually need. Kept separate from
+ * the full chat value (whose identity changes every stream delta) so memoized
+ * rows subscribed here only re-render when the run starts, ends, or moves to
+ * a new message.
+ */
+interface ThinkChatLiveValue {
+  isStreaming: boolean;
+  lastMessageId: string | undefined;
+}
+declare const ThinkChatLiveContext: React.Context<ThinkChatLiveValue | null>;
+declare function useOptionalThinkChatLive(): ThinkChatLiveValue | null;
+//#endregion
 export { ThinkChatContext, ThinkChatLiveContext, ThinkChatLiveValue, ThinkChatValue, useOptionalThinkChatContext, useOptionalThinkChatLive, useThinkChatContext };

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

@@ -10,7 +10,7 @@ function useOptionalThinkChatContext() {
 }
 function useThinkChatContext(component) {
 	const context = useOptionalThinkChatContext();
-	if (!context) throw new Error(`${component} must be used inside <ThinkChat.Provider> or <ThinkChat.Root>.`);
+	if (!context) throw new Error(`${component} must be used inside <ThinkChat.Root>.`);
 	return context;
 }
 const ThinkChatLiveContext = React.createContext(null);

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

@@ -1,8 +1,8 @@
 import { ActivityOutput, ActivityPanel } from "../ai-sdk/Activity.js";
-import { Tabs } from "../foundations/Tabs.js";
 import { o as formatUnknownValue } from "../../format-COCyV98Z.js";
-import { t as CodeBlock } from "../../CodeBlock-BSJl682D.js";
+import { Tabs } from "../foundations/Tabs.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";
+import { i as CodeBlockContent, r as CodeBlockContainer, t as CodeBlock } from "../../CodeBlock-g8sADidM.js";
 import { inferWorkspaceLanguage } from "./WorkspaceFile.js";
 import { displayUrl, isSessionContextToolFailure } from "./ThinkChatToolParts.js";
 import * as React from "react";
@@ -62,11 +62,14 @@ function ThinkChatWorkspacePanel({ part }) {
 				label: path,
 				status: output ? `${output.lines} lines written` : void 0,
 				children: content !== void 0 ? /* @__PURE__ */ jsx(CodeBlock, {
-					className: "activity__code-block",
+					surface: "plain",
+					wrap: true,
+					className: "think-chat-tool-panels__code-block",
 					code: content,
 					isStreaming: part.state === "input-streaming",
 					language: inferWorkspaceLanguage(path),
-					showLineNumbers: true
+					showLineNumbers: true,
+					children: /* @__PURE__ */ jsx(CodeBlockContainer, { children: /* @__PURE__ */ jsx(CodeBlockContent, {}) })
 				}) : null
 			});
 		}
@@ -80,12 +83,12 @@ function ThinkChatWorkspacePanel({ part }) {
 				error: Boolean(output?.error),
 				children: input?.old_string !== void 0 && input.new_string !== void 0 ? /* @__PURE__ */ jsxs(ActivityOutput, { children: [
 					/* @__PURE__ */ jsx("span", {
-						className: "activity__diff-del",
+						className: "think-chat-tool-panels__diff-del",
 						children: prefixLines(input.old_string, "- ")
 					}),
 					"\n",
 					/* @__PURE__ */ jsx("span", {
-						className: "activity__diff-add",
+						className: "think-chat-tool-panels__diff-add",
 						children: prefixLines(input.new_string, "+ ")
 					})
 				] }) : null
@@ -270,10 +273,13 @@ function ExecuteCodeView({ code, output, hideResult, isStreaming }) {
 	].filter(Boolean);
 	return /* @__PURE__ */ jsxs(Fragment, { children: [
 		code ? /* @__PURE__ */ jsx(CodeBlock, {
-			className: "activity__code-block",
+			surface: "plain",
+			wrap: true,
+			className: "think-chat-tool-panels__code-block",
 			code,
 			isStreaming,
-			language: "ts"
+			language: "ts",
+			children: /* @__PURE__ */ jsx(CodeBlockContainer, { children: /* @__PURE__ */ jsx(CodeBlockContent, {}) })
 		}) : null,
 		calls?.length ? /* @__PURE__ */ jsx(ToolCallAudit, { calls }) : null,
 		sections.length ? /* @__PURE__ */ jsx(ActivityOutput, { children: sections.join("\n\n") }) : null
@@ -284,26 +290,26 @@ execution order and state available to assistive technology without adding
 another host-side activity protocol. */
 function ToolCallAudit({ calls }) {
 	return /* @__PURE__ */ jsxs("div", {
-		className: "activity__call-audit",
+		className: "think-chat-tool-panels__call-audit",
 		children: [/* @__PURE__ */ jsx("span", {
-			className: "activity__call-audit-label",
+			className: "think-chat-tool-panels__call-audit-label",
 			children: "Calls"
 		}), /* @__PURE__ */ jsx("ol", {
-			className: "activity__call-audit-list",
+			className: "think-chat-tool-panels__call-audit-list",
 			children: calls.map((call) => /* @__PURE__ */ jsxs("li", {
-				className: "activity__call-audit-item",
+				className: "think-chat-tool-panels__call-audit-item",
 				"data-state": call.state,
 				children: [
 					/* @__PURE__ */ jsx("code", {
-						className: "activity__call-audit-code",
+						className: "think-chat-tool-panels__call-audit-code",
 						children: formatToolCall(call)
 					}),
 					/* @__PURE__ */ jsx("span", {
-						className: "activity__call-audit-state",
+						className: "think-chat-tool-panels__call-audit-state",
 						children: toolCallStateLabel(call)
 					}),
 					call.result !== void 0 ? /* @__PURE__ */ jsxs("code", {
-						className: "activity__call-audit-result",
+						className: "think-chat-tool-panels__call-audit-result",
 						children: [
 							" ",
 							"→ ",
@@ -391,7 +397,7 @@ function ThinkChatBrowserPanel({ part }) {
 				height: 10
 			}) : void 0
 		}) : media.screenshot ? /* @__PURE__ */ jsx("img", {
-			className: "activity__browser-screenshot",
+			className: "think-chat-tool-panels__browser-screenshot",
 			src: media.screenshot,
 			alt: "Browser screenshot",
 			width: 16,
@@ -408,7 +414,6 @@ function ThinkChatBrowserPanel({ part }) {
 			status: executeStatusText(output),
 			error: output?.status === "error",
 			children: browserView && code ? /* @__PURE__ */ jsxs(Tabs.Root, {
-				className: "activity__browser-tabs",
 				defaultValue: "browser",
 				children: [
 					/* @__PURE__ */ jsxs(Tabs.List, {
@@ -426,12 +431,12 @@ function ThinkChatBrowserPanel({ part }) {
 						]
 					}),
 					/* @__PURE__ */ jsx(Tabs.Panel, {
-						className: "activity__browser-panel",
+						className: "think-chat-tool-panels__browser-panel",
 						value: "browser",
 						children: browserView
 					}),
 					/* @__PURE__ */ jsx(Tabs.Panel, {
-						className: "activity__browser-panel",
+						className: "think-chat-tool-panels__browser-panel",
 						value: "code",
 						children: codeView
 					})

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

@@ -1,9 +1,9 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { S as FileIcon, T as InfoIcon } from "../../icons-CeGfXO21.js";
+import { S as FileIcon, T as InfoIcon } from "../../icons-cuEtsgj9.js";
 import { Activity, ActivityContent, ActivityItemGroup, ActivityOutput, ActivityTrigger } from "../ai-sdk/Activity.js";
 import { o as formatUnknownValue } from "../../format-COCyV98Z.js";
-import { DescriptionList } from "../foundations/DescriptionList.js";
 import { EmptyState } from "../foundations/EmptyState.js";
+import { DescriptionList } from "../foundations/DescriptionList.js";
 import { formatThinkExecutionTimestamp, getThinkExecutionRunError, getThinkExecutionRunId, getThinkExecutionRunKindLabel, getThinkExecutionRunProgressedAt, getThinkExecutionRunProgressedLabel, getThinkExecutionRunTitle, isThinkSubmissionRun } from "./ThinkExecutionRun.js";
 import { ThinkExecutionStatus } from "./ThinkExecutionStatus.js";
 import "react";