@mcp-b/react-components 0.32.0 → 0.34.0

package/dist/AgentToolRunsContext-BCVqCtJ1.d.ts

@@ -0,0 +1,44 @@
+import * as React from "react";
+import { UIMessage } from "ai";
+import { useAgentToolEvents } from "agents/react";
+import { AgentToolRunPart } from "agents/agent-tools";
+
+//#region src/components/agents-sdk/AgentToolRunsContext.d.ts
+/** The complete upstream retained-run hook result for one parent connection. */
+type AgentToolEventsValue<Part extends AgentToolRunPart = UIMessage["parts"][number]> = ReturnType<typeof useAgentToolEvents<Part>>;
+/** The live parent connection members the retained-run subscription reads. */
+type AgentToolEventSource = Parameters<typeof useAgentToolEvents>[0]["agent"] & {
+  path: ReadonlyArray<{
+    agent: string;
+    name: string;
+  }>;
+};
+/**
+ * The one retained-run subscription for a parent connection: upstream
+ * `useAgentToolEvents` scoped to the connection's source identity, so runs
+ * from a previous thread cannot leak across a source swap. Call it beside the
+ * `useAgent` call that owns the connection — the server replays retained runs
+ * once per socket connect, so a later mount misses existing runs — and share
+ * the one value with every surface that reads runs (the chat shell and a
+ * run-detail route read the same projection, never two subscriptions).
+ */
+declare function useSourceScopedAgentToolEvents<Part extends AgentToolRunPart = UIMessage["parts"][number]>(agent: AgentToolEventSource): {
+  runsById: Record<string, import("agents").AgentToolRunState<Part>>;
+  runsByToolCallId: Record<string, import("agents").AgentToolRunState<Part>[]>;
+  unboundRuns: import("agents").AgentToolRunState<Part>[];
+  getRunsForToolCall(toolCallId: string): import("agents").AgentToolRunState<Part>[];
+  resetLocalState(): void;
+};
+interface AgentToolRunsProviderProps<Part extends AgentToolRunPart = UIMessage["parts"][number]> {
+  /** Pass the whole `useAgentToolEvents({ agent })` result directly. */
+  agentTools: AgentToolEventsValue<Part>;
+  children: React.ReactNode;
+}
+/** Provides one parent connection's retained Agent Tool event projection. */
+declare function AgentToolRunsProvider<Part extends AgentToolRunPart = UIMessage["parts"][number]>({
+  agentTools,
+  children
+}: AgentToolRunsProviderProps<Part>): React.JSX.Element;
+declare function useOptionalAgentToolRuns<Part extends AgentToolRunPart = UIMessage["parts"][number]>(): AgentToolEventsValue<Part> | null;
+//#endregion
+export { useOptionalAgentToolRuns as a, AgentToolRunsProviderProps as i, AgentToolEventsValue as n, useSourceScopedAgentToolEvents as o, AgentToolRunsProvider as r, AgentToolEventSource as t };

package/dist/{ThinkChat-BIEryLy0.js → ThinkChat-en0UbkVv.js}

@@ -1,7 +1,7 @@
 import { J as SpinnerIcon } from "./icons-B1Qw05te.js";
 import { TransitionSurface } from "./components/foundations/TransitionSurface.js";
 import { AgentChat } from "./components/agents-sdk/AgentChat.js";
-import { AgentToolRunsProvider, useOptionalAgentToolRuns } from "./components/agents-sdk/AgentToolRunsContext.js";
+import { AgentToolRunsProvider, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents } from "./components/agents-sdk/AgentToolRunsContext.js";
 import { SubagentRunList } from "./components/agents-sdk/SubagentRunList.js";
 import { ThinkChatContext, ThinkChatLiveContext, useOptionalThinkChatContext, useThinkChatContext } from "./components/agents-sdk/ThinkChatContext.js";
 import { ThinkChatActivity, createThinkChatActivityRenderer, renderThinkChatActivityPart } from "./components/agents-sdk/ThinkChatActivity.js";
@@ -11,19 +11,8 @@ import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { isTextUIPart } from "ai";
 import { useAgentChat } from "@cloudflare/think/react";
+import { useAgent } from "agents/react";
 import { queryOptions, useQuery, useQueryClient } from "@tanstack/react-query";
-import { useAgent, useAgentToolEvents } from "agents/react";
-//#region src/components/_internal/use-agent-tool-events.ts
-function useSourceScopedAgentToolEvents(agent) {
-	const agentTools = useAgentToolEvents({ agent });
-	const sourceIdentity = JSON.stringify(agent.path);
-	const resetAgentTools = React.useEffectEvent(() => agentTools.resetLocalState());
-	React.useEffect(() => {
-		resetAgentTools();
-	}, [sourceIdentity]);
-	return agentTools;
-}
-//#endregion
 //#region src/components/_internal/think-approvals.ts
 /**
 * Ambient approvals belong to their stub. An explicit different stub may only
@@ -343,4 +332,4 @@ const ThinkChat = {
 	createActivityRenderer: createThinkChatActivityRenderer
 };
 //#endregion
-export { thinkPendingExecutionApprovalsQueryOptions as a, resolveThinkApprovalProps as c, ThinkChatRoot as i, useSourceScopedAgentToolEvents as l, ThinkChatMessages as n, useThinkChat as o, ThinkChatProvider as r, useThinkPendingExecutionApprovals as s, ThinkChat as t };
+export { thinkPendingExecutionApprovalsQueryOptions as a, resolveThinkApprovalProps as c, ThinkChatRoot as i, ThinkChatMessages as n, useThinkChat as o, ThinkChatProvider as r, useThinkPendingExecutionApprovals as s, ThinkChat as t };

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

@@ -1,2 +1,2 @@
-import { i as useOptionalAgentToolRuns, n as AgentToolRunsProvider, r as AgentToolRunsProviderProps, t as AgentToolEventsValue } from "../../AgentToolRunsContext-Cgve-Upx.js";
-export { AgentToolEventsValue, AgentToolRunsProvider, AgentToolRunsProviderProps, useOptionalAgentToolRuns };
+import { a as useOptionalAgentToolRuns, i as AgentToolRunsProviderProps, n as AgentToolEventsValue, o as useSourceScopedAgentToolEvents, r as AgentToolRunsProvider, t as AgentToolEventSource } from "../../AgentToolRunsContext-BCVqCtJ1.js";
+export { AgentToolEventSource, AgentToolEventsValue, AgentToolRunsProvider, AgentToolRunsProviderProps, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents };

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

@@ -1,6 +1,25 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
+import { useAgentToolEvents } from "agents/react";
 //#region src/components/agents-sdk/AgentToolRunsContext.tsx
+/**
+* The one retained-run subscription for a parent connection: upstream
+* `useAgentToolEvents` scoped to the connection's source identity, so runs
+* from a previous thread cannot leak across a source swap. Call it beside the
+* `useAgent` call that owns the connection — the server replays retained runs
+* once per socket connect, so a later mount misses existing runs — and share
+* the one value with every surface that reads runs (the chat shell and a
+* run-detail route read the same projection, never two subscriptions).
+*/
+function useSourceScopedAgentToolEvents(agent) {
+	const agentTools = useAgentToolEvents({ agent });
+	const sourceIdentity = JSON.stringify(agent.path);
+	const resetAgentTools = React.useEffectEvent(() => agentTools.resetLocalState());
+	React.useEffect(() => {
+		resetAgentTools();
+	}, [sourceIdentity]);
+	return agentTools;
+}
 const AgentToolRunsContext = React.createContext(null);
 /** Provides one parent connection's retained Agent Tool event projection. */
 function AgentToolRunsProvider({ agentTools, children }) {
@@ -13,4 +32,4 @@ function useOptionalAgentToolRuns() {
 	return React.useContext(AgentToolRunsContext);
 }
 //#endregion
-export { AgentToolRunsProvider, useOptionalAgentToolRuns };
+export { AgentToolRunsProvider, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents };

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

@@ -1,7 +1,7 @@
 import { i as AgentMessageRenderPartContext } from "../../AgentMessageParts-C7L-Mv9U.js";
 import { ct as PromptInputMessage } from "../../PromptInput-DOyee1kM.js";
 import { r as AgentChatProps } from "../../AgentChat-CV-GuYA6.js";
-import { i as useOptionalAgentToolRuns, n as AgentToolRunsProvider, r as AgentToolRunsProviderProps, t as AgentToolEventsValue } from "../../AgentToolRunsContext-Cgve-Upx.js";
+import { a as useOptionalAgentToolRuns, i as AgentToolRunsProviderProps, n as AgentToolEventsValue, o as useSourceScopedAgentToolEvents, r as AgentToolRunsProvider, t as AgentToolEventSource } from "../../AgentToolRunsContext-BCVqCtJ1.js";
 import { n as BrowserLiveViewProps, t as BrowserLiveView } from "../../BrowserLiveView-tJTWkoyu.js";
 import { n as BrowserReplayProps, t as BrowserReplay } from "../../BrowserReplay-B0BQZr-N.js";
 import { o as UseSessionCompactionResult } from "../../SessionCompaction-CmTJFpzj.js";
@@ -15,8 +15,8 @@ import { a as WorkspaceSource, c as workspaceBinaryFileQueryOptions, d as worksp
 import { n as WorkspaceExplorerProps, t as WorkspaceExplorer } from "../../WorkspaceExplorer-DygQnEyi.js";
 import * as React from "react";
 import { UIMessage } from "ai";
-import { DataTag, UndefinedInitialDataOptions } from "@tanstack/react-query";
 import { UseAgentOptions } from "agents/react";
+import { DataTag, UndefinedInitialDataOptions } from "@tanstack/react-query";
 import { PendingApproval, Think } from "@cloudflare/think";
 import { AgentStub } from "agents/client";
 import { UseVoiceInputReturn } from "@cloudflare/voice/react";
@@ -253,4 +253,4 @@ declare const ThinkChat: {
   createActivityRenderer: typeof createThinkChatActivityRenderer;
 };
 //#endregion
-export { type AgentToolEventsValue, AgentToolRunsProvider, type AgentToolRunsProviderProps, BrowserLiveView, type BrowserLiveViewProps, BrowserReplay, type BrowserReplayProps, ThinkChat, ThinkChatActivity, type ThinkChatActivityProps, type ThinkChatActivityRendererOptions, ThinkChatDraft, ThinkChatMessages, ThinkChatMessagesProps, ThinkChatProvider, ThinkChatProviderProps, ThinkChatRoot, ThinkChatRootProps, type ThinkChatToolRenderer, type ThinkChatToolRenderers, ThinkPendingExecutionApprovalsQueryKey, ThinkPendingExecutionApprovalsQueryOptions, ThinkRecoveryNotice, type ThinkRecoveryNoticeProps, type UseWorkspaceOptions, WorkspaceExplorer, type WorkspaceExplorerProps, type WorkspaceFileReadTarget, type WorkspaceFileState, type WorkspaceInfo, type WorkspaceQueryKey, type WorkspaceSource, type WorkspaceState, createThinkChatActivityRenderer, describeThinkChatActivityPart, inferWorkspaceLanguage, isThinkChatActivityPart, renderThinkChatActivityPart, thinkPendingExecutionApprovalsQueryOptions, useOptionalAgentToolRuns, useThinkChat, useThinkPendingExecutionApprovals, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };
+export { type AgentToolEventSource, type AgentToolEventsValue, AgentToolRunsProvider, type AgentToolRunsProviderProps, BrowserLiveView, type BrowserLiveViewProps, BrowserReplay, type BrowserReplayProps, ThinkChat, ThinkChatActivity, type ThinkChatActivityProps, type ThinkChatActivityRendererOptions, ThinkChatDraft, ThinkChatMessages, ThinkChatMessagesProps, ThinkChatProvider, ThinkChatProviderProps, ThinkChatRoot, ThinkChatRootProps, type ThinkChatToolRenderer, type ThinkChatToolRenderers, ThinkPendingExecutionApprovalsQueryKey, ThinkPendingExecutionApprovalsQueryOptions, ThinkRecoveryNotice, type ThinkRecoveryNoticeProps, type UseWorkspaceOptions, WorkspaceExplorer, type WorkspaceExplorerProps, type WorkspaceFileReadTarget, type WorkspaceFileState, type WorkspaceInfo, type WorkspaceQueryKey, type WorkspaceSource, type WorkspaceState, createThinkChatActivityRenderer, describeThinkChatActivityPart, inferWorkspaceLanguage, isThinkChatActivityPart, renderThinkChatActivityPart, thinkPendingExecutionApprovalsQueryOptions, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents, useThinkChat, useThinkPendingExecutionApprovals, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };

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

@@ -1,4 +1,4 @@
-import { AgentToolRunsProvider, useOptionalAgentToolRuns } from "./AgentToolRunsContext.js";
+import { AgentToolRunsProvider, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents } from "./AgentToolRunsContext.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";
 import { BrowserReplay } from "./BrowserReplay.js";
 import { inferWorkspaceLanguage } from "./WorkspaceFile.js";
@@ -6,7 +6,7 @@ import { isThinkChatActivityPart } from "./ThinkChatToolParts.js";
 import { describeThinkChatActivityPart } from "./ThinkChatActivitySummary.js";
 import { ThinkChatActivity, createThinkChatActivityRenderer, renderThinkChatActivityPart } from "./ThinkChatActivity.js";
 import { ThinkRecoveryNotice } from "./ThinkRecoveryNotice.js";
-import { a as thinkPendingExecutionApprovalsQueryOptions, i as ThinkChatRoot, n as ThinkChatMessages, o as useThinkChat, r as ThinkChatProvider, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../../ThinkChat-BIEryLy0.js";
+import { a as thinkPendingExecutionApprovalsQueryOptions, i as ThinkChatRoot, n as ThinkChatMessages, o as useThinkChat, r as ThinkChatProvider, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../../ThinkChat-en0UbkVv.js";
 import { useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions } from "./Workspace.js";
 import { WorkspaceExplorer } from "./WorkspaceExplorer.js";
-export { AgentToolRunsProvider, BrowserLiveView, BrowserReplay, ThinkChat, ThinkChatActivity, ThinkChatMessages, ThinkChatProvider, ThinkChatRoot, ThinkRecoveryNotice, WorkspaceExplorer, createThinkChatActivityRenderer, describeThinkChatActivityPart, inferWorkspaceLanguage, isThinkChatActivityPart, renderThinkChatActivityPart, thinkPendingExecutionApprovalsQueryOptions, useOptionalAgentToolRuns, useThinkChat, useThinkPendingExecutionApprovals, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };
+export { AgentToolRunsProvider, BrowserLiveView, BrowserReplay, ThinkChat, ThinkChatActivity, ThinkChatMessages, ThinkChatProvider, ThinkChatRoot, ThinkRecoveryNotice, WorkspaceExplorer, createThinkChatActivityRenderer, describeThinkChatActivityPart, inferWorkspaceLanguage, isThinkChatActivityPart, renderThinkChatActivityPart, thinkPendingExecutionApprovalsQueryOptions, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents, useThinkChat, useThinkPendingExecutionApprovals, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };

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

@@ -1,4 +1,5 @@
 import { l as WorkspaceNavigationAdapter } from "../../WorkspaceLink-DQogVe8E.js";
+import { n as AgentToolEventsValue } from "../../AgentToolRunsContext-BCVqCtJ1.js";
 import { McpPluginCatalogProps } from "./McpPluginCatalog.js";
 import { r as WorkspaceFileAssetResolver } from "../../WorkspaceFile-C8Riev9j.js";
 import { a as WorkspaceSource } from "../../Workspace-EhvvlHOB.js";
@@ -45,6 +46,13 @@ interface ThinkFullAppConversation<AgentT extends ThinkFullAppAgent<State>, Stat
   agent: ReturnType<typeof useAgent<AgentT, State>>;
   /** The `useAgentChat` value from `@cloudflare/think/react` used by the chat surface. */
   chat: ReturnType<typeof useAgentChat<State, MessageT>>;
+  /**
+   * The `useSourceScopedAgentToolEvents(agent)` value for this connection.
+   * The app owns the subscription — mounted beside the `useAgent` call, since
+   * the server replays retained runs once per socket connect — so a run-detail
+   * route can read the same projection. ThinkFullApp never subscribes itself.
+   */
+  agentTools: AgentToolEventsValue<MessageT["parts"][number]>;
 }
 interface ThinkFullAppProps<AgentT extends ThinkFullAppAgent<State>, State = unknown, MessageT extends UIMessage = UIMessage> extends React.HTMLAttributes<HTMLDivElement> {
   /**

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

@@ -4,8 +4,8 @@ import { Button } from "../foundations/Button.js";
 import { n as mergeRefs } from "../../merge-refs-DF_7w2x_.js";
 import { ScrollArea } from "../foundations/ScrollArea.js";
 import { McpPluginCatalog } from "./McpPluginCatalog.js";
-import { c as resolveThinkApprovalProps, l as useSourceScopedAgentToolEvents, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../../ThinkChat-BIEryLy0.js";
 import { a as WorkspaceNavigationRestorationBoundary, i as WorkspaceNavigationFocusRestorer, n as WorkspaceNavigationProvider } from "../../WorkspaceLink-DZeLe_jN.js";
+import { c as resolveThinkApprovalProps, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../../ThinkChat-en0UbkVv.js";
 import { AppTopBar } from "../general-purpose/AppTopBar.js";
 import { useWorkspace } from "./Workspace.js";
 import { WorkspaceExplorer } from "./WorkspaceExplorer.js";
@@ -49,8 +49,7 @@ function PluginsPanel({ config }) {
 * Approval discovery and background-agent events need a live connection, so they
 * live here rather than in the shell, which also renders before there is one.
 */
-function ThinkFullAppThreadChat({ agent, chat, messages, renderAgentToolRunLink, sourceKey }) {
-	const agentTools = useSourceScopedAgentToolEvents(agent);
+function ThinkFullAppThreadChat({ agent, agentTools, chat, messages, renderAgentToolRunLink, sourceKey }) {
 	const approvals = useThinkPendingExecutionApprovals(agent.stub, sourceKey, `${chat.messages.length}:${chat.status}`, messages?.approvalsEnabled !== false);
 	const resolvedMessages = React.useMemo(() => {
 		const approvalProps = resolveThinkApprovalProps({

package/dist/components/nanites/AgentToolDetail.d.ts

@@ -15,6 +15,11 @@ interface AgentToolDetailProps<State = unknown, MessageT extends UIMessage = UIM
   messages?: ThinkChatMessagesProps<MessageT>;
   /** App-authored TanStack Router Link to the parent conversation. */
   backLink?: React.ReactElement;
+  /**
+   * Route-owned run controls (the app's cancel callable, for example),
+   * rendered in a `SubagentRunActions` bar pinned to the bottom edge.
+   */
+  actions?: React.ReactNode;
 }
 /**
  * Live retained-child detail composed from upstream connection and chat values.
@@ -22,6 +27,7 @@ interface AgentToolDetailProps<State = unknown, MessageT extends UIMessage = UIM
  * compact parent-side stream projection and is never promoted to fake history.
  */
 declare function AgentToolDetail<State = unknown, MessageT extends UIMessage = UIMessage>({
+  actions,
   backLink,
   chat,
   className,
@@ -41,17 +47,53 @@ interface SelectedAgentToolChildProps<ParentAgentT extends ThinkAgent<ParentStat
    * configuration as the parent; the selected `run.subAgent` is appended.
    */
   connectionOptions?: UseAgentOptions<ChildState>;
+  /**
+   * Initial child-transcript loader for hosts that do not serve the agent HTTP
+   * routes (upstream's default fetches `/get-messages` over HTTP). Receives the
+   * connected child agent so socket-only hosts can read through its stub;
+   * wired into `useAgentChat({ getInitialMessages })`.
+   */
+  getInitialMessages?: (childAgent: ReturnType<typeof useAgent<ThinkAgent<ChildState>, ChildState>>) => Promise<MessageT[]>;
   messages?: ThinkChatMessagesProps<MessageT>;
   /** App-authored TanStack Router Link to the parent conversation. */
   backLink?: React.ReactElement;
+  /** Rendered while the child transcript loads (the internal Suspense fallback). */
+  fallback?: React.ReactNode;
+  /** Route-owned run controls, forwarded to `AgentToolDetail`'s pinned actions bar. */
+  actions?: React.ReactNode;
 }
-/** Lazily connects one selected retained child and renders its real Think chat. */
+/**
+ * Child connection options for a selected retained run: the parent's
+ * root-first base (or the app-supplied options) with the run's sub-agent step
+ * appended to the sub path.
+ */
+declare function selectedAgentToolChildOptions<ChildState = unknown>(parentAgent: {
+  agent: string;
+  name: string;
+  path: ReadonlyArray<{
+    agent: string;
+    name: string;
+  }>;
+}, run: Pick<AgentToolRunState, "subAgent">, connectionOptions?: UseAgentOptions<ChildState>): UseAgentOptions<ChildState>;
+/**
+ * Lazily connects one selected retained child and renders its real Think chat.
+ *
+ * The Suspense boundary between the connection and the chat is load-bearing:
+ * the child socket opens in an effect, and `useAgentChat` suspends while the
+ * initial transcript loads. Under one suspension the render never commits, the
+ * effect never runs, and the socket the load is waiting on never dials — so
+ * this component holds the connection and always commits, while the chat
+ * suspends behind the internal boundary.
+ */
 declare function SelectedAgentToolChild<ParentAgentT extends ThinkAgent<ParentState>, ParentState = unknown, ChildState = unknown, MessageT extends UIMessage = UIMessage>({
+  actions,
   backLink,
   connectionOptions,
+  fallback,
+  getInitialMessages,
   messages,
   parentAgent,
   run
 }: SelectedAgentToolChildProps<ParentAgentT, ParentState, ChildState, MessageT>): React.JSX.Element;
 //#endregion
-export { AgentToolDetail, AgentToolDetailProps, SelectedAgentToolChild, SelectedAgentToolChildProps };
+export { AgentToolDetail, AgentToolDetailProps, SelectedAgentToolChild, SelectedAgentToolChildProps, selectedAgentToolChildOptions };

package/dist/components/nanites/AgentToolDetail.js

@@ -1,9 +1,9 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
 import { r as ArrowLeftIcon } from "../../icons-B1Qw05te.js";
 import { TransitionSurface } from "../foundations/TransitionSurface.js";
-import { SubagentRunMilestone, SubagentRunMilestones, SubagentRunProgress } from "../agents-sdk/SubagentRunDetails.js";
+import { SubagentRunActions, SubagentRunMilestone, SubagentRunMilestones, SubagentRunProgress } from "../agents-sdk/SubagentRunDetails.js";
 import { SubagentRunIndicator, getSubagentRunName } from "../agents-sdk/SubagentRunIndicator.js";
-import { t as ThinkChat } from "../../ThinkChat-BIEryLy0.js";
+import { t as ThinkChat } from "../../ThinkChat-en0UbkVv.js";
 import { AppTopBar } from "../general-purpose/AppTopBar.js";
 import { NaniteMark } from "./NaniteScene.js";
 import * as React from "react";
@@ -16,7 +16,7 @@ import { useAgent } from "agents/react";
 * The full child transcript comes from `chat.messages`; `run.parts` remains a
 * compact parent-side stream projection and is never promoted to fake history.
 */
-function AgentToolDetail({ backLink, chat, className, messages, ref, run, ...props }) {
+function AgentToolDetail({ actions, backLink, chat, className, messages, ref, run, ...props }) {
 	const backRef = React.useRef(null);
 	const name = getSubagentRunName(run);
 	const progressLabel = run.progress?.message ?? run.progress?.phase;
@@ -76,25 +76,61 @@ function AgentToolDetail({ backLink, chat, className, messages, ref, run, ...pro
 						showComposer: false
 					})
 				})
-			})
+			}),
+			actions ? /* @__PURE__ */ jsx(SubagentRunActions, { children: actions }) : null
 		]
 	});
 }
-/** Lazily connects one selected retained child and renders its real Think chat. */
-function SelectedAgentToolChild({ backLink, connectionOptions, messages, parentAgent, run }) {
+/**
+* Child connection options for a selected retained run: the parent's
+* root-first base (or the app-supplied options) with the run's sub-agent step
+* appended to the sub path.
+*/
+function selectedAgentToolChildOptions(parentAgent, run, connectionOptions) {
 	const [root, ...parentSubPath] = parentAgent.path;
+	return {
+		...connectionOptions ?? {
+			agent: root?.agent ?? parentAgent.agent,
+			name: root?.name ?? parentAgent.name
+		},
+		sub: [...connectionOptions?.sub ?? parentSubPath, run.subAgent]
+	};
+}
+/**
+* Lazily connects one selected retained child and renders its real Think chat.
+*
+* The Suspense boundary between the connection and the chat is load-bearing:
+* the child socket opens in an effect, and `useAgentChat` suspends while the
+* initial transcript loads. Under one suspension the render never commits, the
+* effect never runs, and the socket the load is waiting on never dials — so
+* this component holds the connection and always commits, while the chat
+* suspends behind the internal boundary.
+*/
+function SelectedAgentToolChild({ actions, backLink, connectionOptions, fallback, getInitialMessages, messages, parentAgent, run }) {
+	const childAgent = useAgent(selectedAgentToolChildOptions(parentAgent, run, connectionOptions));
+	return /* @__PURE__ */ jsx(React.Suspense, {
+		fallback: fallback ?? null,
+		children: /* @__PURE__ */ jsx(SelectedAgentToolChildChat, {
+			actions,
+			backLink,
+			childAgent,
+			getInitialMessages,
+			messages,
+			run
+		}, run.runId)
+	});
+}
+function SelectedAgentToolChildChat({ actions, backLink, childAgent, getInitialMessages, messages, run }) {
 	return /* @__PURE__ */ jsx(AgentToolDetail, {
 		run,
-		chat: useAgentChat({ agent: useAgent({
-			...connectionOptions ?? {
-				agent: root?.agent ?? parentAgent.agent,
-				name: root?.name ?? parentAgent.name
-			},
-			sub: [...connectionOptions?.sub ?? parentSubPath, run.subAgent]
-		}) }),
+		chat: useAgentChat({
+			agent: childAgent,
+			...getInitialMessages ? { getInitialMessages: () => getInitialMessages(childAgent) } : {}
+		}),
 		messages,
-		backLink
-	}, run.runId);
+		backLink,
+		actions
+	});
 }
 //#endregion
-export { AgentToolDetail, SelectedAgentToolChild };
+export { AgentToolDetail, SelectedAgentToolChild, selectedAgentToolChildOptions };

package/dist/styles/agent-tool-detail.css

@@ -1,6 +1,6 @@
 .agent-tool-detail {
   display: grid;
-  grid-template-rows: auto auto minmax(0, 1fr);
+  grid-template-rows: auto auto minmax(0, 1fr) auto;
   min-inline-size: 0;
   block-size: 100%;
   background-color: var(--sigvelo-color-surface);
@@ -47,8 +47,18 @@
   block-size: 100%;
 }
 
+.agent-tool-detail > .subagent-run__actions {
+  grid-row: 4;
+  display: flex;
+  justify-content: center;
+  padding: var(--sigvelo-spacing-2) var(--sigvelo-spacing-3);
+  border-block-start: var(--sigvelo-border-width) var(--sigvelo-border-style)
+    var(--sigvelo-color-neutral-border-subtle);
+}
+
 @media (forced-colors: active) {
-  .agent-tool-detail__run-state {
+  .agent-tool-detail__run-state,
+  .agent-tool-detail > .subagent-run__actions {
     border-color: CanvasText;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mcp-b/react-components",
-  "version": "0.32.0",
+  "version": "0.34.0",
   "description": "MCP-B React components built on Base UI and shared design tokens, including Cloudflare Think chat primitives.",
   "homepage": "https://design-system.sigvelo.com",
   "bugs": {
@@ -58,7 +58,7 @@
     "streamdown": "^2.5.0",
     "unist-util-visit": "^5.1.0",
     "yet-another-react-lightbox": "^3.32.1",
-    "@mcp-b/design-tokens": "0.32.0"
+    "@mcp-b/design-tokens": "0.34.0"
   },
   "devDependencies": {
     "@ai-sdk/react": "^3.0.230",

package/dist/AgentToolRunsContext-Cgve-Upx.d.ts

@@ -1,21 +0,0 @@
-import * as React from "react";
-import { UIMessage } from "ai";
-import { useAgentToolEvents } from "agents/react";
-import { AgentToolRunPart } from "agents/agent-tools";
-
-//#region src/components/agents-sdk/AgentToolRunsContext.d.ts
-/** The complete upstream retained-run hook result for one parent connection. */
-type AgentToolEventsValue<Part extends AgentToolRunPart = UIMessage["parts"][number]> = ReturnType<typeof useAgentToolEvents<Part>>;
-interface AgentToolRunsProviderProps<Part extends AgentToolRunPart = UIMessage["parts"][number]> {
-  /** Pass the whole `useAgentToolEvents({ agent })` result directly. */
-  agentTools: AgentToolEventsValue<Part>;
-  children: React.ReactNode;
-}
-/** Provides one parent connection's retained Agent Tool event projection. */
-declare function AgentToolRunsProvider<Part extends AgentToolRunPart = UIMessage["parts"][number]>({
-  agentTools,
-  children
-}: AgentToolRunsProviderProps<Part>): React.JSX.Element;
-declare function useOptionalAgentToolRuns<Part extends AgentToolRunPart = UIMessage["parts"][number]>(): AgentToolEventsValue<Part> | null;
-//#endregion
-export { useOptionalAgentToolRuns as i, AgentToolRunsProvider as n, AgentToolRunsProviderProps as r, AgentToolEventsValue as t };