@mcp-b/react-components 0.23.0 → 0.25.0

package/dist/components/ThinkChatActivity.js

@@ -1,10 +1,12 @@
+import { Button } from "./Button.js";
+import { useExpansionState } from "./ExpansionState.js";
 import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityText, ActivityTrigger } from "./Activity.js";
 import { AgentActivityFavicon, AgentActivityIcon } from "./AgentActivity.js";
-import { f as MessageResponse } from "../Message-_-bEYLAO.js";
+import { f as MessageResponse } from "../Message-KlK8tlBZ.js";
 import { isBrowserToolPart, isExecuteToolPart, isFetchToolPart, isPartWorking, isSessionContextToolPart, isSkillToolPart, isThinkChatActivityPart, isWorkspaceToolPart } from "./ThinkChatToolParts.js";
 import { useOptionalAgentToolRuns } from "./AgentToolRunsContext.js";
 import { SubagentRunList } from "./SubagentRunList.js";
-import { useOptionalThinkChatContext } from "./ThinkChatContext.js";
+import { useOptionalThinkChatLive } from "./ThinkChatContext.js";
 import { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSessionContextPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel } from "./ThinkChatToolPanels.js";
 import { activityPartIconKind, activityPartUrl, deriveThinkChatActivityHeader, describeThinkChatActivityPart } from "./ThinkChatActivitySummary.js";
 import * as React from "react";
@@ -22,7 +24,15 @@ function activityPartIcon(part) {
 * with per-tool panels. Normally reached through `ThinkChat.Messages`;
 * exported for apps that lay out messages themselves.
 */
-function ThinkChatActivity({ parts, defaultOpen, isStreaming, toolRenderers }) {
+/**
+* An expanded run shows at most this many trailing steps before a "show
+* earlier" reveal. Steps inside the live message get new identities on every
+* streamed delta (the AI SDK clones the streaming message), so memoization
+* can't bound an open log — capping the mounted rows is what keeps a
+* thousands-of-tools run expandable.
+*/
+const VISIBLE_STEP_LIMIT = 100;
+function ThinkChatActivity({ parts, defaultOpen, isStreaming, toolRenderers, stateKey }) {
 	const steps = parts.flatMap((part, index) => {
 		const description = describeThinkChatActivityPart(part, toolRenderers);
 		if (!description) return [];
@@ -32,7 +42,11 @@ function ThinkChatActivity({ parts, defaultOpen, isStreaming, toolRenderers }) {
 			part
 		}];
 	});
+	const scope = `run:${stateKey ?? steps[0]?.key}`;
+	const [showAllSteps, setShowAllSteps] = useExpansionState(steps.length ? `${scope}:all-steps` : void 0, false);
 	if (steps.length === 0) return null;
+	const hiddenStepCount = showAllSteps ? 0 : Math.max(0, steps.length - VISIBLE_STEP_LIMIT);
+	const visibleSteps = hiddenStepCount ? steps.slice(hiddenStepCount) : steps;
 	const streaming = isStreaming ?? parts.some(isPartWorking);
 	const header = deriveThinkChatActivityHeader(parts, {
 		isStreaming: streaming,
@@ -42,18 +56,31 @@ function ThinkChatActivity({ parts, defaultOpen, isStreaming, toolRenderers }) {
 	return /* @__PURE__ */ jsxs(Activity, {
 		isStreaming: streaming,
 		defaultOpen,
+		stateKey: scope,
 		children: [/* @__PURE__ */ jsx(ActivityTrigger, {
 			icon: header.url ? /* @__PURE__ */ jsx(AgentActivityFavicon, { url: header.url }) : /* @__PURE__ */ jsx(AgentActivityIcon, { kind: header.iconKind }),
 			action: header.action,
 			detail: header.detail
-		}), /* @__PURE__ */ jsx(ActivityContent, { children: steps.map((step) => /* @__PURE__ */ jsx(ThinkChatActivityStep, {
+		}), /* @__PURE__ */ jsxs(ActivityContent, { children: [hiddenStepCount > 0 ? /* @__PURE__ */ jsxs(Button, {
+			size: "sm",
+			variant: "ghost",
+			className: "activity__show-earlier",
+			onClick: () => setShowAllSteps(true),
+			children: [
+				"Show ",
+				hiddenStepCount,
+				" earlier ",
+				hiddenStepCount === 1 ? "step" : "steps"
+			]
+		}) : null, visibleSteps.map((step) => /* @__PURE__ */ jsx(ThinkChatActivityStep, {
+			stateKey: `${scope}:${step.key}`,
 			description: step.description,
 			part: step.part,
 			toolRenderers
-		}, step.key)) })]
+		}, step.key))] })]
 	});
 }
-function ThinkChatActivityStep({ description, part, toolRenderers }) {
+function ThinkChatActivityStep({ description, part, stateKey, toolRenderers }) {
 	const icon = activityPartIcon(part);
 	const { action: text, detail } = description;
 	if (isToolUIPart(part)) {
@@ -67,6 +94,7 @@ function ThinkChatActivityStep({ description, part, toolRenderers }) {
 			action: text,
 			detail,
 			icon,
+			stateKey,
 			children: customPanel
 		});
 	}
@@ -74,42 +102,49 @@ function ThinkChatActivityStep({ description, part, toolRenderers }) {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ActivityText, { children: /* @__PURE__ */ jsx(MessageResponse, { children: part.text }) })
 	});
 	if (isWorkspaceToolPart(part) && part.type !== "tool-delete") return /* @__PURE__ */ jsx(ActivityItemGroup, {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ThinkChatWorkspacePanel, { part })
 	});
 	if (isSkillToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ThinkChatSkillPanel, { part })
 	});
 	if (isSessionContextToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ThinkChatSessionContextPanel, { part })
 	});
 	if (isFetchToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ThinkChatFetchPanel, { part })
 	});
 	if (isBrowserToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ThinkChatBrowserPanel, { part })
 	});
 	if (isExecuteToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
 		action: text,
 		detail,
 		icon,
+		stateKey,
 		children: /* @__PURE__ */ jsx(ThinkChatExecutePanel, { part })
 	});
 	return /* @__PURE__ */ jsx(ActivityItem, {
@@ -118,9 +153,9 @@ function ThinkChatActivityStep({ description, part, toolRenderers }) {
 		children: text
 	});
 }
-function ThinkChatActivityGroup({ message, parts, renderAgentToolRunLink, isTrailing, toolRenderers }) {
-	const chat = useOptionalThinkChatContext();
-	const chatStillWorking = isTrailing && Boolean(chat?.isStreaming) && chat?.messages.at(-1)?.id === message.id;
+function ThinkChatActivityGroup({ message, parts, renderAgentToolRunLink, isTrailing, toolRenderers, stateKey }) {
+	const live = useOptionalThinkChatLive();
+	const streaming = isTrailing && (live ? live.isStreaming && live.lastMessageId === message.id : parts.some(isPartWorking));
 	const agentTools = useOptionalAgentToolRuns();
 	const runs = React.useMemo(() => {
 		if (!agentTools || !renderAgentToolRunLink) return [];
@@ -132,8 +167,9 @@ function ThinkChatActivityGroup({ message, parts, renderAgentToolRunLink, isTrai
 	]);
 	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ThinkChatActivity, {
 		parts,
-		isStreaming: parts.some(isPartWorking) || chatStillWorking,
-		toolRenderers
+		isStreaming: streaming,
+		toolRenderers,
+		stateKey
 	}), runs.length && renderAgentToolRunLink ? /* @__PURE__ */ jsx(SubagentRunList, {
 		className: "subagent-run__list--adjacent",
 		"aria-label": "Delegated agent runs",
@@ -151,17 +187,35 @@ function ThinkChatActivityGroup({ message, parts, renderAgentToolRunLink, isTrai
 function createThinkChatActivityRenderer({ excludeTools, renderAgentToolRunLink, toolRenderers } = {}) {
 	const excluded = excludeTools?.length ? new Set(excludeTools) : void 0;
 	const isActivity = (part) => isThinkChatActivityPart(part, excluded);
+	const runStartsCache = /* @__PURE__ */ new WeakMap();
+	const runStartsFor = (parts) => {
+		let starts = runStartsCache.get(parts);
+		if (!starts) {
+			starts = Array.from({ length: parts.length }, () => -1);
+			let runStart = -1;
+			for (let index = 0; index < parts.length; index++) if (isActivity(parts[index])) {
+				if (runStart === -1) runStart = index;
+				starts[index] = runStart;
+			} else {
+				starts[index] = -1;
+				runStart = -1;
+			}
+			runStartsCache.set(parts, starts);
+		}
+		return starts;
+	};
 	return (context) => {
 		const { message, part, partIndex } = context;
 		if (!isActivity(part)) return void 0;
-		let start = partIndex;
-		while (start > 0 && isActivity(message.parts[start - 1])) start--;
+		const runStarts = runStartsFor(message.parts);
+		const start = runStarts[partIndex] ?? partIndex;
 		if (partIndex !== start) return null;
 		let end = partIndex;
-		while (end + 1 < message.parts.length && isActivity(message.parts[end + 1])) end++;
+		while (end + 1 < message.parts.length && runStarts[end + 1] === start) end++;
 		return /* @__PURE__ */ jsx(ThinkChatActivityGroup, {
 			message,
 			parts: message.parts.slice(start, end + 1),
+			stateKey: `${message.id}:${start}`,
 			isTrailing: end === message.parts.length - 1,
 			toolRenderers,
 			renderAgentToolRunLink

package/dist/components/ThinkChatContext.d.ts

@@ -1,2 +1,2 @@
-import { i as useThinkChatContext, n as ThinkChatValue, r as useOptionalThinkChatContext, t as ThinkChatContext } from "../ThinkChatContext-DrsZqdaO.js";
-export { ThinkChatContext, ThinkChatValue, useOptionalThinkChatContext, useThinkChatContext };
+import { a as useOptionalThinkChatContext, i as ThinkChatValue, n as ThinkChatLiveContext, o as useOptionalThinkChatLive, r as ThinkChatLiveValue, s as useThinkChatContext, t as ThinkChatContext } from "../ThinkChatContext-B-Nk84Wi.js";
+export { ThinkChatContext, ThinkChatLiveContext, ThinkChatLiveValue, ThinkChatValue, useOptionalThinkChatContext, useOptionalThinkChatLive, useThinkChatContext };

package/dist/components/ThinkChatContext.js

@@ -13,5 +13,9 @@ function useThinkChatContext(component) {
 	if (!context) throw new Error(`${component} must be used inside <ThinkChat.Provider> or <ThinkChat.Root>.`);
 	return context;
 }
+const ThinkChatLiveContext = React.createContext(null);
+function useOptionalThinkChatLive() {
+	return React.useContext(ThinkChatLiveContext);
+}
 //#endregion
-export { ThinkChatContext, useOptionalThinkChatContext, useThinkChatContext };
+export { ThinkChatContext, ThinkChatLiveContext, useOptionalThinkChatContext, useOptionalThinkChatLive, useThinkChatContext };

package/dist/components/ThinkChatToolPanels.js

@@ -1,7 +1,7 @@
 import { ActivityOutput, ActivityPanel } from "./Activity.js";
 import { displayUrl, isSessionContextToolFailure } from "./ThinkChatToolParts.js";
 import { Tabs } from "./Tabs.js";
-import { t as CodeBlock } from "../CodeBlock-Cp67Njo3.js";
+import { t as CodeBlock } from "../CodeBlock-B3RLU3ez.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";
 import { inferWorkspaceLanguage } from "./WorkspaceFile.js";
 import * as React from "react";

package/dist/components/ThinkExecutionDetail.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { C as FileIcon, O as InfoIcon, W as RefreshIcon, Z as TerminalIcon, d as CheckIcon, n as ArrowDownIcon, tt as XIcon } from "../icons-ua6f_GH3.js";
+import { C as FileIcon, O as InfoIcon, Q as TerminalIcon, W as RefreshIcon, d as CheckIcon, n as ArrowDownIcon, nt as XIcon } from "../icons-w5PpKGRz.js";
 import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityOutput, ActivityPanel, ActivityTrigger } from "./Activity.js";
 import { formatThinkExecutionRunProgress, formatThinkExecutionStatus, formatThinkExecutionTimestamp, getThinkExecutionRunError, getThinkExecutionRunId, getThinkExecutionRunProgressedAt, getThinkExecutionRunProgressedLabel, getThinkExecutionRunStatus, getThinkExecutionRunTitle, isThinkSubmissionRun } from "./ThinkExecutionRun.js";
 import { ThinkExecutionStatus } from "./ThinkExecutionStatus.js";

package/dist/components/ThinkExecutionStatus.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { O as InfoIcon, d as CheckIcon, q as SpinnerIcon, tt as XIcon, z as PauseIcon } from "../icons-ua6f_GH3.js";
+import { O as InfoIcon, d as CheckIcon, nt as XIcon, q as SpinnerIcon, z as PauseIcon } from "../icons-w5PpKGRz.js";
 import { Tooltip } from "./Tooltip.js";
 import { formatThinkExecutionStatus, getThinkExecutionRunStatus, getThinkExecutionRunStatusTone } from "./ThinkExecutionRun.js";
 import "react";

package/dist/components/ThinkExecutionWorkbench.d.ts

@@ -1,6 +1,6 @@
 import { t as ThinkExecutionRun } from "../ThinkExecutionRun-ChhWhOoU.js";
 import * as React from "react";
-import { DataTag, UndefinedInitialDataOptions } from "@tanstack/react-query";
+import { DataTag, UnusedSkipTokenOptions } from "@tanstack/react-query";
 import { Think, ThinkSubmissionInspection } from "@cloudflare/think";
 import { AgentStub } from "agents/client";
 import { WorkflowPage } from "agents/workflows";
@@ -29,7 +29,7 @@ interface ThinkExecutionRunsData {
 type ThinkExecutionRunsQueryKey = readonly ["think", sourceKey: string, "execution-runs", {
   readonly limit: number;
 }];
-type ThinkExecutionRunsQueryOptions = UndefinedInitialDataOptions<ThinkExecutionRunsData, Error, ThinkExecutionRunsData, ThinkExecutionRunsQueryKey> & {
+type ThinkExecutionRunsQueryOptions = UnusedSkipTokenOptions<ThinkExecutionRunsData, Error, ThinkExecutionRunsData, ThinkExecutionRunsQueryKey> & {
   queryKey: DataTag<ThinkExecutionRunsQueryKey, ThinkExecutionRunsData, Error>;
 };
 /**
@@ -39,7 +39,8 @@ declare function thinkExecutionRunsQueryOptions(source: AgentStub<Think>, source
 /**
  * Unified execution history for native Think submissions and Agents workflows.
  * The workbench reads and acts through the whole upstream agent stub; it does
- * not normalize execution records or own workflow authoring.
+ * not normalize execution records or own workflow authoring. Its first
+ * uncached list read suspends to the consuming route's Suspense boundary.
  */
 declare function ThinkExecutionWorkbench({
   backButton,

package/dist/components/ThinkExecutionWorkbench.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { buttonVariants } from "./Button.js";
-import { W as RefreshIcon, b as EllipsisIcon } from "../icons-ua6f_GH3.js";
+import { W as RefreshIcon, b as EllipsisIcon } from "../icons-w5PpKGRz.js";
 import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";
 import { IconButton } from "./IconButton.js";
 import { EmptyState } from "./EmptyState.js";
@@ -11,7 +11,7 @@ import { ThinkExecutionStatus } from "./ThinkExecutionStatus.js";
 import { ThinkExecutionDetail } from "./ThinkExecutionDetail.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { queryOptions, useMutation, useQuery } from "@tanstack/react-query";
+import { queryOptions, useMutation, useSuspenseQuery } from "@tanstack/react-query";
 //#region src/components/ThinkExecutionWorkbench.tsx
 const executionPanelPageSize = 20;
 function getErrorMessage(error) {
@@ -116,13 +116,14 @@ function thinkExecutionRunsQueryOptions(source, sourceKey, pageSize = executionP
 /**
 * Unified execution history for native Think submissions and Agents workflows.
 * The workbench reads and acts through the whole upstream agent stub; it does
-* not normalize execution records or own workflow authoring.
+* not normalize execution records or own workflow authoring. Its first
+* uncached list read suspends to the consuming route's Suspense boundary.
 */
 function ThinkExecutionWorkbench({ backButton, className, pageSize = executionPanelPageSize, ref, renderRunLink, selectedRun, source, sourceKey, title = "Execution", ...props }) {
 	const runsId = React.useId();
 	const runsOptions = thinkExecutionRunsQueryOptions(source, sourceKey, pageSize);
 	const runsQueryKey = thinkExecutionRunsScopeQueryKey(sourceKey);
-	const runsQuery = useQuery(runsOptions);
+	const runsQuery = useSuspenseQuery(runsOptions);
 	const actionMutation = useMutation({
 		mutationFn: ({ action }) => action(),
 		onSuccess: (_result, action, _onMutateResult, context) => context.client.invalidateQueries({ queryKey: action.runsQueryKey })
@@ -131,7 +132,7 @@ function ThinkExecutionWorkbench({ backButton, className, pageSize = executionPa
 	const actionIsPending = currentAction !== null && actionMutation.isPending;
 	const busyAction = actionIsPending ? currentAction.key : runsQuery.isFetching ? "refresh" : null;
 	const error = currentAction && actionMutation.isError ? actionMutation.error : runsQuery.error;
-	const runs = React.useMemo(() => [...runsQuery.data?.submissions ?? [], ...runsQuery.data?.workflows.workflows ?? []].sort((first, second) => Number(second.createdAt) - Number(first.createdAt)), [runsQuery.data]);
+	const runs = React.useMemo(() => [...runsQuery.data.submissions, ...runsQuery.data.workflows.workflows].sort((first, second) => Number(second.createdAt) - Number(first.createdAt)), [runsQuery.data]);
 	const runAction = (key, action) => {
 		actionMutation.mutate({
 			action,
@@ -182,11 +183,7 @@ function ThinkExecutionWorkbench({ backButton, className, pageSize = executionPa
 							id: runsId,
 							children: "Runs"
 						})
-					}), runsQuery.isPending && runs.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
-						className: "think-execution-workbench__empty",
-						role: "status",
-						description: "Loading runs..."
-					}) : runs.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
+					}), runs.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
 						className: "think-execution-workbench__empty",
 						description: "No runs yet."
 					}) : /* @__PURE__ */ jsx("ul", {

package/dist/components/ThinkFullApp.js

@@ -1,15 +1,14 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Button } from "./Button.js";
-import { C as FileIcon, Z as TerminalIcon, c as BoxIcon, f as ChevronDownIcon } from "../icons-ua6f_GH3.js";
+import { C as FileIcon, Q as TerminalIcon, c as BoxIcon, f as ChevronDownIcon, q as SpinnerIcon } from "../icons-w5PpKGRz.js";
 import { a as WorkspaceNavigationRestorationBoundary, i as WorkspaceNavigationFocusRestorer, n as WorkspaceNavigationProvider } from "../WorkspaceLink-BYYeTQLf.js";
 import { n as mergeRefs } from "../merge-refs-DF_7w2x_.js";
 import { AppTopBar } from "./AppTopBar.js";
-import { c as resolveThinkApprovalProps, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../ThinkChat-E_HrfH76.js";
+import { c as resolveThinkApprovalProps, s as useThinkPendingExecutionApprovals, t as ThinkChat } from "../ThinkChat-DVhCEjq-.js";
 import { useWorkspace } from "./Workspace.js";
 import { WorkspaceExplorer } from "./WorkspaceExplorer.js";
 import { ScrollArea } from "./ScrollArea.js";
 import { McpPluginCatalog } from "./McpPluginCatalog.js";
-import { n as runViewTransition } from "../view-transitions-DyUP0lSg.js";
 import { ResizableSidePanel } from "./ResizableSidePanel.js";
 import { ThinkExecutionWorkbench } from "./ThinkExecutionWorkbench.js";
 import { ThinkFullAppViewSwitch } from "./ThinkFullAppViewSwitch.js";
@@ -49,8 +48,8 @@ function PluginsPanel({ config }) {
 /** Combines ThinkChat with an optional resizable workbench shell. */
 function ThinkFullApp({ agent, appBarActions, appBarLeading, appBarTitle, chat, className, defaultMobileView, defaultWorkbenchView, defaultThreadSidebarOpen, hideAppBarInWorkbench = false, messages, mobileView, onMobileViewChange, onThreadSidebarOpenChange, onWorkbenchViewChange, plugins, ref, renderAgentToolRunLink, renderExecutionRunLink, selectedExecutionRun, showAgentTools = true, showExecutionWorkbench = true, showMobileViewSwitch = true, sourceKey, style, threadSidebar, threadSidebarOpen, threadStatusSummary, workbenchPanels, workbenchView, workspace, ...props }) {
 	const appRef = React.useRef(null);
-	const viewScopeRef = React.useRef(null);
 	const workbenchPanelRef = React.useRef(null);
+	const pendingPanelFocusRef = React.useRef(null);
 	const approvals = useThinkPendingExecutionApprovals(agent.stub, sourceKey, `${chat.messages.length}:${chat.status}`, messages?.approvalsEnabled !== false);
 	const resolvedMessages = React.useMemo(() => {
 		const approvalProps = resolveThinkApprovalProps({
@@ -91,10 +90,7 @@ function ThinkFullApp({ agent, appBarActions, appBarLeading, appBarTitle, chat,
 		onMobileViewChange?.(next);
 	}, [mobileView, onMobileViewChange]);
 	const updateAppView = React.useCallback((update) => {
-		return runViewTransition({
-			scope: viewScopeRef.current,
-			update
-		});
+		React.startTransition(update);
 	}, []);
 	const panelContext = React.useMemo(() => ({
 		agent,
@@ -116,12 +112,20 @@ function ThinkFullApp({ agent, appBarActions, appBarLeading, appBarTitle, chat,
 		id: "execution",
 		label: "Execution",
 		icon: /* @__PURE__ */ jsx(TerminalIcon, {}),
-		render: ({ agent }) => /* @__PURE__ */ jsx(ThinkExecutionWorkbench, {
-			source: agent.stub,
-			sourceKey,
-			title: "Execution",
-			selectedRun: selectedExecutionRun,
-			renderRunLink: renderExecutionRunLink
+		render: ({ agent }) => /* @__PURE__ */ jsx(React.Suspense, {
+			fallback: /* @__PURE__ */ jsx("div", {
+				className: "think-full-app__workbench",
+				role: "status",
+				"aria-label": "Loading execution",
+				children: /* @__PURE__ */ jsx(SpinnerIcon, {})
+			}),
+			children: /* @__PURE__ */ jsx(ThinkExecutionWorkbench, {
+				source: agent.stub,
+				sourceKey,
+				title: "Execution",
+				selectedRun: selectedExecutionRun,
+				renderRunLink: renderExecutionRunLink
+			})
 		})
 	});
 	if (plugins) availableWorkbenchPanels.push({
@@ -139,20 +143,21 @@ function ThinkFullApp({ agent, appBarActions, appBarLeading, appBarTitle, chat,
 	const workbenchViews = availableWorkbenchPanels;
 	const shouldRenderInlineAppBar = !threadSidebar && (Boolean(appBarActions || appBarLeading || appBarTitle || threadSidebar) || hasWorkbench);
 	const hasAppBarRow = shouldRenderInlineAppBar;
+	React.useLayoutEffect(() => {
+		const pendingFocus = pendingPanelFocusRef.current;
+		if (!pendingFocus || pendingFocus.id !== activeWorkbenchView) return;
+		pendingPanelFocusRef.current = null;
+		Array.from(workbenchPanelRef.current?.querySelectorAll("button") ?? []).find((button) => button.getAttribute("aria-label") === pendingFocus.label)?.focus({ preventScroll: true });
+	}, [activeWorkbenchView]);
 	const updateWorkbenchPanel = (next) => {
 		const activeElement = document.activeElement;
 		const restorePanelSwitchFocus = activeElement instanceof HTMLElement && workbenchPanelRef.current?.contains(activeElement);
 		const nextLabel = availableWorkbenchPanels.find((panel) => panel.id === next)?.label;
-		const restoreFocus = () => {
-			if (!restorePanelSwitchFocus || !nextLabel) return;
-			Array.from(workbenchPanelRef.current?.querySelectorAll("button") ?? []).find((button) => button.getAttribute("aria-label") === nextLabel)?.focus({ preventScroll: true });
-		};
-		const transition = runViewTransition({
-			scope: workbenchPanelRef.current,
-			update: () => setWorkbenchView(next)
-		});
-		if (transition) transition.updateCallbackDone.then(restoreFocus, restoreFocus);
-		else requestAnimationFrame(restoreFocus);
+		pendingPanelFocusRef.current = restorePanelSwitchFocus && nextLabel ? {
+			id: next,
+			label: nextLabel
+		} : null;
+		React.startTransition(() => setWorkbenchView(next));
 	};
 	const renderAppTopBar = (sidebarControls) => /* @__PURE__ */ jsxs(AppTopBar.Root, {
 		className: "think-full-app__app-bar",
@@ -230,42 +235,48 @@ function ThinkFullApp({ agent, appBarActions, appBarLeading, appBarTitle, chat,
 		...props,
 		children: [
 			shouldRenderInlineAppBar ? renderAppTopBar() : null,
-			/* @__PURE__ */ jsxs("div", {
-				ref: viewScopeRef,
-				className: "think-full-app__view-scope",
-				"data-recipe": "application-plane",
-				children: [/* @__PURE__ */ jsx("section", {
-					className: "think-full-app__chat-surface",
-					"data-workspace-restoration-scope": "chat",
-					"aria-label": "Chat",
-					children: /* @__PURE__ */ jsx("div", {
-						className: "think-full-app__chat",
+			/* @__PURE__ */ jsx(React.ViewTransition, {
+				default: "sigvelo-layout-transition",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "think-full-app__view-scope",
+					"data-recipe": "application-plane",
+					"data-mobile-view": activeMobileView,
+					children: [/* @__PURE__ */ jsx("section", {
+						className: "think-full-app__chat-surface",
+						"data-workspace-restoration-scope": "chat",
+						"aria-label": "Chat",
 						children: /* @__PURE__ */ jsx("div", {
-							className: "think-full-app__chat-inner",
-							children: /* @__PURE__ */ jsx(ThinkChat.Provider, {
-								chat,
-								agentTools,
-								children: /* @__PURE__ */ jsx(ThinkChat.Messages, {
-									...resolvedMessages,
-									renderAgentToolRunLink: showAgentTools ? renderAgentToolRunLink : void 0
+							className: "think-full-app__chat",
+							children: /* @__PURE__ */ jsx("div", {
+								className: "think-full-app__chat-inner",
+								children: /* @__PURE__ */ jsx(ThinkChat.Provider, {
+									chat,
+									agentTools,
+									children: /* @__PURE__ */ jsx(ThinkChat.Messages, {
+										...resolvedMessages,
+										renderAgentToolRunLink: showAgentTools ? renderAgentToolRunLink : void 0
+									})
 								})
 							})
 						})
-					})
-				}), activePanel ? /* @__PURE__ */ jsx("aside", {
-					className: "think-full-app__aside",
-					"aria-label": "Workbench",
-					children: /* @__PURE__ */ jsx("div", {
-						className: "think-full-app__workbench-slot",
+					}), activePanel ? /* @__PURE__ */ jsx("aside", {
+						className: "think-full-app__aside",
+						"aria-label": "Workbench",
 						children: /* @__PURE__ */ jsx("div", {
-							ref: workbenchPanelRef,
-							className: "think-full-app__workbench-panel",
-							"data-view": activeWorkbenchView,
-							tabIndex: -1,
-							children: activePanel.render(panelContext)
+							className: "think-full-app__workbench-slot",
+							children: /* @__PURE__ */ jsx(React.ViewTransition, {
+								default: "sigvelo-layout-transition",
+								children: /* @__PURE__ */ jsx("div", {
+									ref: workbenchPanelRef,
+									className: "think-full-app__workbench-panel",
+									"data-view": activeWorkbenchView,
+									tabIndex: -1,
+									children: activePanel.render(panelContext)
+								})
+							})
 						})
-					})
-				}) : null]
+					}) : null]
+				})
 			}),
 			activePanel ? /* @__PURE__ */ jsx(ResizableSidePanel.Handle, { className: "think-full-app__resizer" }) : null
 		]

package/dist/components/ThinkRecoveryNotice.d.ts

@@ -1,2 +1,2 @@
-import { n as ThinkRecoveryNoticeProps, t as ThinkRecoveryNotice } from "../ThinkRecoveryNotice-DFIcG9UX.js";
+import { n as ThinkRecoveryNoticeProps, t as ThinkRecoveryNotice } from "../ThinkRecoveryNotice-D6gYcBbr.js";
 export { ThinkRecoveryNotice, ThinkRecoveryNoticeProps };

package/dist/components/ThinkRoutineBrowser.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { buttonVariants } from "./Button.js";
-import { H as PlusIcon } from "../icons-ua6f_GH3.js";
+import { H as PlusIcon } from "../icons-w5PpKGRz.js";
 import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";
 import { Tooltip } from "./Tooltip.js";
 import { t as capitalize } from "../format-S6uWyoSb.js";

package/dist/components/ThinkRoutineForm.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Button, buttonVariants } from "./Button.js";
-import { q as SpinnerIcon } from "../icons-ua6f_GH3.js";
+import { q as SpinnerIcon } from "../icons-w5PpKGRz.js";
 import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";
 import { Select } from "./Select.js";
 import { Field } from "./Field.js";

package/dist/components/ThinkRoutineLibrary.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Button, buttonVariants } from "./Button.js";
-import { $ as WarningIcon, V as PlayIcon, b as EllipsisIcon, f as ChevronDownIcon, q as SpinnerIcon } from "../icons-ua6f_GH3.js";
+import { V as PlayIcon, b as EllipsisIcon, et as WarningIcon, f as ChevronDownIcon, q as SpinnerIcon } from "../icons-w5PpKGRz.js";
 import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";
 import { Menu } from "./Menu.js";
 import { AppTopBar } from "./AppTopBar.js";

package/dist/components/ThinkThreadPicker.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Button, buttonVariants } from "./Button.js";
-import { $ as WarningIcon, H as PlusIcon, q as SpinnerIcon, t as ArchiveIcon, v as DotIcon } from "../icons-ua6f_GH3.js";
+import { H as PlusIcon, et as WarningIcon, q as SpinnerIcon, t as ArchiveIcon, v as DotIcon } from "../icons-w5PpKGRz.js";
 import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";
 import { EmptyState } from "./EmptyState.js";
 import { SearchField } from "./SearchField.js";

package/dist/components/Toast.js

@@ -1,6 +1,6 @@
 import { n as mergeBaseClassName } from "../class-names-BiMDVpUo.js";
 import { buttonVariants } from "./Button.js";
-import { tt as XIcon } from "../icons-ua6f_GH3.js";
+import { nt as XIcon } from "../icons-w5PpKGRz.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { Toast as Toast$1 } from "@base-ui/react/toast";

package/dist/components/ToolInvocation.d.ts

@@ -8,6 +8,12 @@ interface ToolInvocationProps {
   part: ToolInvocationPart;
   /** Render the existing Activity disclosure expanded initially. */
   defaultOpen?: boolean;
+  /**
+   * Overrides the part-derived shimmer. Callers that know the run has settled
+   * pass false so a part stuck in a working state (denied approval, aborted
+   * stream) doesn't shimmer forever.
+   */
+  isStreaming?: boolean;
 }
 /**
  * Read-only generic disclosure for one upstream AI SDK tool invocation.
@@ -20,7 +26,8 @@ interface ToolInvocationProps {
  */
 declare function ToolInvocation({
   part,
-  defaultOpen
+  defaultOpen,
+  isStreaming
 }: ToolInvocationProps): import("react").JSX.Element;
 //#endregion
 export { ToolInvocation, ToolInvocationPart, ToolInvocationProps };

package/dist/components/ToolInvocation.js

@@ -45,7 +45,7 @@ function describeToolPart(part) {
 * transcript renderer. ThinkChat may replace this fallback with richer panels
 * for known workspace, browser, fetch, session, skill, and execute tools.
 */
-function ToolInvocation({ part, defaultOpen }) {
+function ToolInvocation({ part, defaultOpen, isStreaming }) {
 	const state = getToolPartState(part);
 	const failed = isToolPartFailed(part);
 	const deniedReason = part.state === "output-denied" ? part.approval.reason : void 0;
@@ -53,8 +53,9 @@ function ToolInvocation({ part, defaultOpen }) {
 	const inputStatus = part.state === "approval-requested" ? "awaiting approval" : part.state === "approval-responded" ? part.approval.approved ? "approved" : "denied" : void 0;
 	const outputStatus = state === "denied" ? "denied" : failed ? "error" : part.state === "output-available" && part.preliminary ? "preliminary" : void 0;
 	return /* @__PURE__ */ jsxs(Activity, {
-		isStreaming: isToolPartWorking(part),
+		isStreaming: isStreaming ?? isToolPartWorking(part),
 		defaultOpen,
+		stateKey: part.toolCallId,
 		children: [/* @__PURE__ */ jsx(ActivityTrigger, { action: describeToolPart(part) }), /* @__PURE__ */ jsxs(ActivityContent, { children: [/* @__PURE__ */ jsx(ActivityPanel, {
 			label: part.title ?? getToolName(part),
 			text: formatToolValue(getToolInput(part)),

package/dist/components/WebPreview.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { W as RefreshIcon, f as ChevronDownIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "../icons-ua6f_GH3.js";
+import { W as RefreshIcon, f as ChevronDownIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "../icons-w5PpKGRz.js";
 import { IconButton } from "./IconButton.js";
 import { Badge } from "./Badge.js";
 import { Input } from "./Input.js";

package/dist/components/WorkspaceBrowser.js

@@ -1,4 +1,4 @@
-import { i as FileTreeFolder, r as FileTreeFile, t as FileTree } from "../FileTree-DW60q1w7.js";
+import { i as FileTreeFolder, r as FileTreeFile, t as FileTree } from "../FileTree-CYr5og0q.js";
 import { SearchField } from "./SearchField.js";
 import { WorkspaceHeader } from "./WorkspaceHeader.js";
 import * as React from "react";

package/dist/components/WorkspaceExplorer.js

@@ -3,7 +3,7 @@ import { a as WorkspaceNavigationRestorationBoundary, n as WorkspaceNavigationPr
 import { n as mergeRefs } from "../merge-refs-DF_7w2x_.js";
 import { inferWorkspaceLanguage, inferWorkspaceMedia, isWorkspaceMarkdownPath, isWorkspaceMediaPath, isWorkspaceSkillPath, parseWorkspaceSkill } from "./WorkspaceFile.js";
 import { WorkspaceBrowser } from "./WorkspaceBrowser.js";
-import { t as WorkspaceFileView } from "../WorkspaceFileView-rUEN2iox.js";
+import { t as WorkspaceFileView } from "../WorkspaceFileView-CuMjXYQn.js";
 import { useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryOptions, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions } from "./Workspace.js";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/WorkspaceFileView.js

@@ -1,2 +1,2 @@
-import { t as WorkspaceFileView } from "../WorkspaceFileView-rUEN2iox.js";
+import { t as WorkspaceFileView } from "../WorkspaceFileView-CuMjXYQn.js";
 export { WorkspaceFileView };