@mcp-b/react-components 0.7.1 → 0.8.0

package/dist/{CodeBlock-D9koxDA7.js → CodeBlock-XNQOupQ3.js}

@@ -1,6 +1,6 @@
 import { t as cx } from "./class-names-9UtZwb0J.js";
 import { Select, SelectContent, SelectItem, SelectList, SelectTrigger, SelectValue } from "./components/Select.js";
-import { t as CopyButton } from "./copy-button-TVhDAroI.js";
+import { t as CopyButton } from "./copy-button-C6JSKtFE.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createHighlighter } from "shiki";

package/dist/{FileTree-BdK93Uuu.js → FileTree-wMyZhhHO.js}

@@ -1,5 +1,5 @@
 import { t as cx } from "./class-names-9UtZwb0J.js";
-import { _ as FolderOpenIcon, c as ChevronRightIcon, g as FolderIcon, h as FileIcon } from "./icons-BAlTbWWP.js";
+import { _ as FolderOpenIcon, c as ChevronRightIcon, g as FolderIcon, h as FileIcon } from "./icons-D2Q5n5C1.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/_internal/use-file-tree-nav.ts

package/dist/{ModelSelector-MQvK-pNb.js → ModelSelector-9G_-GooI.js}

@@ -1,5 +1,5 @@
 import { t as cx } from "./class-names-9UtZwb0J.js";
-import { A as SearchIcon, o as ChevronDownIcon } from "./icons-BAlTbWWP.js";
+import { A as SearchIcon, o as ChevronDownIcon } from "./icons-D2Q5n5C1.js";
 import { Button } from "./components/Button.js";
 import { Dialog, DialogBackdrop, DialogPopup, DialogPortal, DialogTitle, DialogTrigger } from "./components/Dialog.js";
 import * as React from "react";

package/dist/{ThinkChatContext-CC94HL4u.d.ts → ThinkChatContext-BLAAb8J5.d.ts}

@@ -1,6 +1,6 @@
 import * as React from "react";
-import { UIMessage } from "ai";
 import { useAgentChat } from "@cloudflare/think/react";
+import { UIMessage } from "ai";
 
 //#region src/components/ThinkChatContext.d.ts
 type ThinkChatValue = ReturnType<typeof useAgentChat<unknown, UIMessage>>;

package/dist/components/Activity.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { c as ChevronRightIcon } from "../icons-BAlTbWWP.js";
+import { c as ChevronRightIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Activity.tsx

package/dist/components/AgentChat.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { O as PlusIcon, k as RefreshIcon } from "../icons-BAlTbWWP.js";
+import { O as PlusIcon, k as RefreshIcon } from "../icons-D2Q5n5C1.js";
 import { Activity, ActivityContent, ActivityPanel, ActivityTrigger } from "./Activity.js";
 import { Context, ContextContent, ContextContentBody, ContextContentHeader, ContextTrigger, getContextUsage, getContextUsedTokens } from "./Context.js";
 import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./MessageScroller.js";
@@ -10,6 +10,7 @@ import { PromptInput, PromptInputActionAddAttachments, PromptInputActionMenu, Pr
 import { Reasoning, ReasoningContent, ReasoningTrigger } from "./Reasoning.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { getToolInput, getToolOutput, getToolPartState } from "@cloudflare/think/react";
 import { getToolName, isFileUIPart, isReasoningUIPart, isTextUIPart, isToolUIPart } from "ai";
 //#region src/components/AgentChat.tsx
 const EMPTY_PENDING_APPROVALS = [];
@@ -52,15 +53,17 @@ function summarizeToolInput(input) {
 	return null;
 }
 function isToolPartWorking(part) {
-	return part.state === "input-streaming" || part.state === "input-available" || part.state === "approval-requested";
+	const state = getToolPartState(part);
+	return state === "loading" || state === "streaming" || state === "waiting-approval";
 }
 function isToolPartFailed(part) {
-	return part.state === "output-error" || part.state === "output-denied";
+	const state = getToolPartState(part);
+	return state === "error" || state === "denied";
 }
 function describeToolPart(part) {
 	const name = getToolName(part);
 	const verb = isToolPartFailed(part) ? `${name} failed` : isToolPartWorking(part) ? `Running ${name}` : `Ran ${name}`;
-	const detail = summarizeToolInput(part.input);
+	const detail = summarizeToolInput(getToolInput(part));
 	return detail ? `${verb} · ${detail}` : verb;
 }
 function formatToolValue(value) {
@@ -68,17 +71,19 @@ function formatToolValue(value) {
 	return typeof value === "string" ? value : JSON.stringify(value, null, 2);
 }
 function renderToolActivity(part) {
+	const state = getToolPartState(part);
 	const failed = isToolPartFailed(part);
-	const output = part.state === "output-error" ? part.errorText : part.state === "output-denied" ? part.approval.reason ?? "Denied" : formatToolValue("output" in part ? part.output : void 0);
+	const deniedReason = part.state === "output-denied" ? part.approval.reason : void 0;
+	const output = state === "error" ? part.errorText : state === "denied" ? deniedReason ?? "Denied" : formatToolValue(getToolOutput(part));
 	return /* @__PURE__ */ jsxs(Activity, {
 		isStreaming: isToolPartWorking(part),
 		children: [/* @__PURE__ */ jsx(ActivityTrigger, { label: describeToolPart(part) }), /* @__PURE__ */ jsxs(ActivityContent, { children: [/* @__PURE__ */ jsx(ActivityPanel, {
 			label: getToolName(part),
-			text: formatToolValue(part.input)
+			text: formatToolValue(getToolInput(part))
 		}), output ? /* @__PURE__ */ jsx(ActivityPanel, {
 			label: "output",
 			text: output,
-			status: part.state === "output-denied" ? "denied" : failed ? "error" : void 0,
+			status: state === "denied" ? "denied" : failed ? "error" : void 0,
 			error: failed
 		}) : null] })]
 	});

package/dist/components/AgentConnection.js

@@ -1,8 +1,8 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { b as LinkIcon } from "../icons-BAlTbWWP.js";
+import { b as LinkIcon } from "../icons-D2Q5n5C1.js";
 import { Popover } from "./Popover.js";
 import { Button } from "./Button.js";
-import { a as CodeBlockCopyButton, i as CodeBlockContent, n as CodeBlockActions, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock } from "../CodeBlock-D9koxDA7.js";
+import { a as CodeBlockCopyButton, i as CodeBlockContent, n as CodeBlockActions, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock } from "../CodeBlock-XNQOupQ3.js";
 import { Field } from "./Field.js";
 import { Form } from "./Form.js";
 import { DCR_MCP_SERVER_CARDS, MANUAL_MCP_SERVER_CARDS, getMcpServerIconSrc } from "../utils/mcp-server-catalog.js";

package/dist/components/Artifact.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { I as XIcon } from "../icons-BAlTbWWP.js";
+import { L as XIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
 import "react";

package/dist/components/BrowserLiveView.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { j as SpinnerIcon, x as MaximizeIcon } from "../icons-BAlTbWWP.js";
+import { M as SpinnerIcon, x as MaximizeIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Dialog, DialogContent, DialogTitle } from "./Dialog.js";
 import { Badge } from "./Badge.js";

package/dist/components/BrowserReplay.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { D as PlayIcon, T as PauseIcon } from "../icons-BAlTbWWP.js";
+import { D as PlayIcon, T as PauseIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Slider, SliderControl, SliderIndicator, SliderThumb, SliderTrack } from "./Slider.js";
 import * as React from "react";

package/dist/components/ChainOfThought.d.ts

@@ -1,5 +1,5 @@
 import { CollapsiblePanelProps, CollapsibleRootProps, CollapsibleTriggerProps } from "./Collapsible.js";
-import { v as IconProps } from "../icons-BRI54ATJ.js";
+import { v as IconProps } from "../icons-CbjtbIJK.js";
 import * as React from "react";
 
 //#region src/components/ChainOfThought.d.ts

package/dist/components/ChainOfThought.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, c as ChevronRightIcon, j as SpinnerIcon, u as DotIcon } from "../icons-BAlTbWWP.js";
+import { M as SpinnerIcon, a as CheckIcon, c as ChevronRightIcon, u as DotIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ChainOfThought.tsx

package/dist/components/ChatGptSignInScreen.js

@@ -1,7 +1,7 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { j as SpinnerIcon } from "../icons-BAlTbWWP.js";
+import { M as SpinnerIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
-import { l as ModelSelectorLogo } from "../ModelSelector-MQvK-pNb.js";
+import { l as ModelSelectorLogo } from "../ModelSelector-9G_-GooI.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ChatGptSignInScreen.tsx

package/dist/components/CodeBlock.js

@@ -1,2 +1,2 @@
-import { a as CodeBlockCopyButton, c as CodeBlockLanguageSelector, d as CodeBlockLanguageSelectorTrigger, f as CodeBlockLanguageSelectorValue, h as CODE_BLOCK_LANGUAGES, i as CodeBlockContent, l as CodeBlockLanguageSelectorContent, m as highlightCode, n as CodeBlockActions, o as CodeBlockFilename, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock, u as CodeBlockLanguageSelectorItem } from "../CodeBlock-D9koxDA7.js";
+import { a as CodeBlockCopyButton, c as CodeBlockLanguageSelector, d as CodeBlockLanguageSelectorTrigger, f as CodeBlockLanguageSelectorValue, h as CODE_BLOCK_LANGUAGES, i as CodeBlockContent, l as CodeBlockLanguageSelectorContent, m as highlightCode, n as CodeBlockActions, o as CodeBlockFilename, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock, u as CodeBlockLanguageSelectorItem } from "../CodeBlock-XNQOupQ3.js";
 export { CODE_BLOCK_LANGUAGES, CodeBlock, CodeBlockActions, CodeBlockContainer, CodeBlockContent, CodeBlockCopyButton, CodeBlockFilename, CodeBlockHeader, CodeBlockLanguageSelector, CodeBlockLanguageSelectorContent, CodeBlockLanguageSelectorItem, CodeBlockLanguageSelectorTrigger, CodeBlockLanguageSelectorValue, CodeBlockTitle, highlightCode };

package/dist/components/Commit.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, l as CopyIcon } from "../icons-BAlTbWWP.js";
+import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, l as CopyIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
 import { Avatar } from "./Avatar.js";

package/dist/components/ContextMenu.js

@@ -1,4 +1,4 @@
-import { a as CheckIcon, c as ChevronRightIcon, u as DotIcon } from "../icons-BAlTbWWP.js";
+import { a as CheckIcon, c as ChevronRightIcon, u as DotIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ContextMenu as ContextMenu$1 } from "@base-ui/react/context-menu";

package/dist/components/Conversation.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { d as DownloadIcon, t as ArrowDownIcon } from "../icons-BAlTbWWP.js";
+import { d as DownloadIcon, t as ArrowDownIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./MessageScroller.js";
 import * as React from "react";

package/dist/components/Dialog.js

@@ -1,4 +1,4 @@
-import { I as XIcon } from "../icons-BAlTbWWP.js";
+import { L as XIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Dialog as Dialog$1 } from "@base-ui/react/dialog";

package/dist/components/EnvironmentVariables.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, l as CopyIcon, m as EyeOffIcon, p as EyeIcon } from "../icons-BAlTbWWP.js";
+import { a as CheckIcon, l as CopyIcon, m as EyeOffIcon, p as EyeIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
 import { Badge } from "./Badge.js";

package/dist/components/FileTree.js

@@ -1,2 +1,2 @@
-import { a as FileTreeIcon, i as FileTreeFolder, n as FileTreeActions, o as FileTreeName, r as FileTreeFile, t as FileTree } from "../FileTree-BdK93Uuu.js";
+import { a as FileTreeIcon, i as FileTreeFolder, n as FileTreeActions, o as FileTreeName, r as FileTreeFile, t as FileTree } from "../FileTree-wMyZhhHO.js";
 export { FileTree, FileTreeActions, FileTreeFile, FileTreeFolder, FileTreeIcon, FileTreeName };

package/dist/components/McpServerPicker.js

@@ -1,4 +1,4 @@
-import { O as PlusIcon, P as WarningIcon, a as CheckIcon, j as SpinnerIcon } from "../icons-BAlTbWWP.js";
+import { F as WarningIcon, M as SpinnerIcon, O as PlusIcon, a as CheckIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuRoot, MenuShortcut, MenuTrigger } from "./Menu.js";
 import { getMcpServerIconSrc } from "../utils/mcp-server-catalog.js";
@@ -53,8 +53,8 @@ function McpServerPickerItems({ servers, onConnect }) {
 function McpServerPickerRow({ server, onConnect }) {
 	const descriptionId = React.useId();
 	const statusText = server.statusLabel ?? getStatusLabel(server.status);
-	const busy = server.status === "connecting" || server.status === "authenticating";
-	const disabled = busy || server.status === "ready";
+	const busy = server.status === "connecting" || server.status === "authenticating" || server.status === "discovering";
+	const disabled = busy || server.status === "ready" || server.status === "connected";
 	return /* @__PURE__ */ jsxs(MenuItem, {
 		className: "mcp-server-picker__row",
 		closeOnClick: false,
@@ -91,9 +91,9 @@ function McpServerPickerRow({ server, onConnect }) {
 	});
 }
 function StatusIcon({ status }) {
-	if (status === "ready") return /* @__PURE__ */ jsx(CheckIcon, { size: 14 });
+	if (status === "ready" || status === "connected") return /* @__PURE__ */ jsx(CheckIcon, { size: 14 });
 	if (status === "failed" || status === "needs-auth") return /* @__PURE__ */ jsx(WarningIcon, { size: 14 });
-	if (status === "connecting" || status === "authenticating") return /* @__PURE__ */ jsx(SpinnerIcon, {
+	if (status === "connecting" || status === "authenticating" || status === "discovering") return /* @__PURE__ */ jsx(SpinnerIcon, {
 		className: "mcp-server-picker__spinner",
 		size: 14
 	});
@@ -101,10 +101,12 @@ function StatusIcon({ status }) {
 }
 function getStatusLabel(status) {
 	if (status === "ready") return "Connected";
+	if (status === "connected") return "Connected";
 	if (status === "failed") return "Failed";
 	if (status === "needs-auth") return "Authorize";
 	if (status === "authenticating") return "Authenticating";
 	if (status === "connecting") return "Connecting";
+	if (status === "discovering") return "Discovering";
 	return "";
 }
 function renderIcon(server) {

package/dist/components/Menubar.js

@@ -1,4 +1,4 @@
-import { a as CheckIcon, c as ChevronRightIcon, u as DotIcon } from "../icons-BAlTbWWP.js";
+import { a as CheckIcon, c as ChevronRightIcon, u as DotIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react/menu";

package/dist/components/Message.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { h as FileIcon, n as ArrowLeftIcon, r as ArrowRightIcon } from "../icons-BAlTbWWP.js";
+import { h as FileIcon, n as ArrowLeftIcon, r as ArrowRightIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
 import { t as AttachmentPreview } from "../attachment-preview-ChtC3HiU.js";

package/dist/components/MessageScroller.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { t as ArrowDownIcon } from "../icons-BAlTbWWP.js";
+import { t as ArrowDownIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/ModelSelector.js

@@ -1,2 +1,2 @@
-import { a as ModelSelectorGroup, c as ModelSelectorList, d as ModelSelectorName, f as ModelSelectorSeparator, i as ModelSelectorEmpty, l as ModelSelectorLogo, m as ModelSelectorTrigger, n as ModelSelectorContent, o as ModelSelectorInput, p as ModelSelectorShortcut, r as ModelSelectorDialog, s as ModelSelectorItem, t as ModelSelector, u as ModelSelectorLogoGroup } from "../ModelSelector-MQvK-pNb.js";
+import { a as ModelSelectorGroup, c as ModelSelectorList, d as ModelSelectorName, f as ModelSelectorSeparator, i as ModelSelectorEmpty, l as ModelSelectorLogo, m as ModelSelectorTrigger, n as ModelSelectorContent, o as ModelSelectorInput, p as ModelSelectorShortcut, r as ModelSelectorDialog, s as ModelSelectorItem, t as ModelSelector, u as ModelSelectorLogoGroup } from "../ModelSelector-9G_-GooI.js";
 export { ModelSelector, ModelSelectorContent, ModelSelectorDialog, ModelSelectorEmpty, ModelSelectorGroup, ModelSelectorInput, ModelSelectorItem, ModelSelectorList, ModelSelectorLogo, ModelSelectorLogoGroup, ModelSelectorName, ModelSelectorSeparator, ModelSelectorShortcut, ModelSelectorTrigger };

package/dist/components/NavigationMenu.js

@@ -1,4 +1,4 @@
-import { o as ChevronDownIcon } from "../icons-BAlTbWWP.js";
+import { o as ChevronDownIcon } from "../icons-D2Q5n5C1.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { NavigationMenu as NavigationMenu$1 } from "@base-ui/react/navigation-menu";

package/dist/components/PromptInput.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { C as MonitorIcon, E as PencilIcon, I as XIcon, M as SquareIcon, O as PlusIcon, P as WarningIcon, h as FileIcon, i as ArrowUpIcon, j as SpinnerIcon, o as ChevronDownIcon, w as PaperclipIcon } from "../icons-BAlTbWWP.js";
+import { C as MonitorIcon, E as PencilIcon, F as WarningIcon, L as XIcon, M as SpinnerIcon, N as SquareIcon, O as PlusIcon, h as FileIcon, i as ArrowUpIcon, o as ChevronDownIcon, w as PaperclipIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
 import { t as AttachmentPreview } from "../attachment-preview-ChtC3HiU.js";
@@ -9,6 +9,7 @@ import { Select, SelectContent, SelectItem, SelectPortal, SelectPositioner, Sele
 import { Tab, TabPanel, TabsList } from "./Tabs.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { getToolApproval, getToolInput, getToolOutput } from "@cloudflare/think/react";
 import { getToolName, isToolUIPart } from "ai";
 //#region src/components/PromptInput.tsx
 const PromptInputContext = React.createContext(null);
@@ -659,17 +660,17 @@ function PromptInputSubmit({ className, status = "ready", onStop, variant = "nor
 }
 function getPausedExecution(part) {
 	if (part.state !== "output-available") return void 0;
-	const output = part.output;
+	const output = getToolOutput(part);
 	return output?.status === "paused" && typeof output.executionId === "string" ? output : void 0;
 }
 /** The id a response must carry: the approval id, or the paused run's executionId. */
 function getApprovalRequestId(part) {
-	if (part.state === "approval-requested") return part.approval.id;
+	if (part.state === "approval-requested") return getToolApproval(part)?.id;
 	return getPausedExecution(part)?.executionId;
 }
 /** Component-local identity: paused executions can ask for multiple approvals. */
 function getApprovalStateKey(part) {
-	if (part.state === "approval-requested") return part.approval.id;
+	if (part.state === "approval-requested") return getToolApproval(part)?.id;
 	const paused = getPausedExecution(part);
 	if (!paused) return void 0;
 	const seq = paused.pending[0]?.seq;
@@ -736,7 +737,7 @@ function PromptInputApproval({ part, approval: durableApproval, onRespond, execu
 		}
 	};
 	const submit = () => void respond(selected === "approve");
-	const input = durableApproval?.descriptor.input ?? (part && "input" in part ? part.input : void 0);
+	const input = durableApproval?.descriptor.input ?? (part ? getToolInput(part) : void 0);
 	const inputEntries = input && typeof input === "object" && !Array.isArray(input) ? Object.entries(input) : void 0;
 	return /* @__PURE__ */ jsxs("div", {
 		ref,

package/dist/components/Queue.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, u as DotIcon } from "../icons-BAlTbWWP.js";
+import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, u as DotIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Badge } from "./Badge.js";
 import { ScrollArea } from "./ScrollArea.js";

package/dist/components/Reasoning.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { c as ChevronRightIcon } from "../icons-BAlTbWWP.js";
+import { c as ChevronRightIcon } from "../icons-D2Q5n5C1.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cjk } from "@streamdown/cjk";

package/dist/components/Select.js

@@ -1,4 +1,4 @@
-import { a as CheckIcon, i as ArrowUpIcon, t as ArrowDownIcon } from "../icons-BAlTbWWP.js";
+import { a as CheckIcon, i as ArrowUpIcon, t as ArrowDownIcon } from "../icons-D2Q5n5C1.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Select as Select$1 } from "@base-ui/react/select";

package/dist/components/Sources.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { b as LinkIcon, c as ChevronRightIcon } from "../icons-BAlTbWWP.js";
+import { b as LinkIcon, c as ChevronRightIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Sources.tsx

package/dist/components/Stepper.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, j as SpinnerIcon } from "../icons-BAlTbWWP.js";
+import { M as SpinnerIcon, a as CheckIcon } from "../icons-D2Q5n5C1.js";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Stepper.tsx

package/dist/components/Task.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { A as SearchIcon, c as ChevronRightIcon, h as FileIcon } from "../icons-BAlTbWWP.js";
+import { A as SearchIcon, c as ChevronRightIcon, h as FileIcon } from "../icons-D2Q5n5C1.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Task.tsx

package/dist/components/Terminal.js

@@ -1,8 +1,8 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { I as XIcon, N as TerminalIcon } from "../icons-BAlTbWWP.js";
+import { L as XIcon, P as TerminalIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
-import { t as CopyButton } from "../copy-button-TVhDAroI.js";
+import { t as CopyButton } from "../copy-button-C6JSKtFE.js";
 import { Badge } from "./Badge.js";
 import { ScrollArea } from "./ScrollArea.js";
 import * as React from "react";
@@ -165,7 +165,8 @@ function TerminalContent({ className, ref, ...props }) {
 	]);
 	const handleScroll = (e) => {
 		const target = e.currentTarget;
-		setStickToBottom(target.scrollHeight - target.scrollTop - target.clientHeight < 8);
+		const atBottom = target.scrollHeight - target.scrollTop - target.clientHeight < 8;
+		setStickToBottom(atBottom);
 	};
 	return /* @__PURE__ */ jsxs(ScrollArea.Root, {
 		ref,

package/dist/components/TestResults.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { I as XIcon, a as CheckIcon, c as ChevronRightIcon, j as SpinnerIcon } from "../icons-BAlTbWWP.js";
+import { L as XIcon, M as SpinnerIcon, a as CheckIcon, c as ChevronRightIcon } from "../icons-D2Q5n5C1.js";
 import { Badge } from "./Badge.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/ThinkChat.d.ts

@@ -4,21 +4,19 @@ import { n as BrowserLiveViewProps, t as BrowserLiveView } from "../BrowserLiveV
 import { n as BrowserReplayProps, t as BrowserReplay } from "../BrowserReplay-6G-mnwcn.js";
 import { _ as isThinkChatActivityPart } from "../ThinkChatToolParts-DnUiZgCC.js";
 import { a as ThinkChatToolRenderers, c as renderThinkChatActivityPart, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as describeThinkChatActivityPart, t as ThinkChatActivity } from "../ThinkChatActivity-CeHzk6-K.js";
-import { n as ThinkChatValue } from "../ThinkChatContext-CC94HL4u.js";
+import { n as ThinkChatValue } from "../ThinkChatContext-BLAAb8J5.js";
 import { FileInfo, UseWorkspaceOptions, WorkspaceExplorer, WorkspaceExplorerProps, WorkspaceFileState, WorkspaceInfo, WorkspaceSource, WorkspaceState, inferWorkspaceLanguage, useWorkspace } from "./WorkspaceExplorer.js";
 import * as React from "react";
 import { UIMessage } from "ai";
 import { UseAgentOptions } from "agents/react";
-import { PendingApproval } from "@cloudflare/think";
+import { PendingApproval, Think } from "@cloudflare/think";
+import { AgentStub } from "agents/client";
 
 //#region src/components/ThinkChat.d.ts
-interface ThinkApprovalStub {
-  pendingApprovals(executionId?: string): Promise<PendingApproval[]>;
-  approveExecution(executionId: string): Promise<unknown>;
-  rejectExecution(executionId: string, reason?: string): Promise<unknown>;
-}
+type ThinkAgent<State> = Think<object, State>;
+type ThinkApprovalStub<State = unknown> = AgentStub<ThinkAgent<State>>;
 interface ThinkChatProviderProps {
-  /** The `useAgentChat` value from the `agents` SDK that descendants read. */
+  /** The `useAgentChat` value from `@cloudflare/think/react` that descendants read. */
   chat: ThinkChatValue;
   children: React.ReactNode;
 }

package/dist/components/ThinkChatActivity.js

@@ -1,10 +1,11 @@
-import { A as SearchIcon, C as MonitorIcon, E as PencilIcon, F as WrenchIcon, N as TerminalIcon, P as WarningIcon, b as LinkIcon, h as FileIcon, y as InfoIcon } from "../icons-BAlTbWWP.js";
+import { A as SearchIcon, C as MonitorIcon, E as PencilIcon, F as WarningIcon, I as WrenchIcon, P as TerminalIcon, b as LinkIcon, h as FileIcon, y as InfoIcon } from "../icons-D2Q5n5C1.js";
 import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityText, ActivityTrigger } from "./Activity.js";
 import { ThinkChatContext } from "./ThinkChatContext.js";
 import { displayUrl, isBrowserToolPart, isExecuteToolPart, isFetchToolPart, isPartFailed, isPartWorking, isSkillToolPart, isThinkChatActivityPart, isWorkspaceToolPart } from "./ThinkChatToolParts.js";
 import { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel } from "./ThinkChatToolPanels.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { getToolInput, getToolOutput } from "@cloudflare/think/react";
 import { getToolName, isReasoningUIPart, isToolUIPart } from "ai";
 //#region src/components/ThinkChatActivity.tsx
 function summarizeToolInput(input) {
@@ -114,13 +115,13 @@ function genericToolLabels(name, hasUrl) {
 function describeGenericToolPart(part) {
 	const labels = genericToolLabels(getToolName(part), activityPartUrl(part) !== null);
 	const label = isPartFailed(part) ? labels.failed : isPartWorking(part) ? labels.working : labels.done;
-	const detail = summarizeToolInput(part.input);
+	const detail = summarizeToolInput(getToolInput(part));
 	return detail ? `${label} · ${detail}` : label;
 }
 function activityPartUrl(part) {
 	if (isFetchToolPart(part)) return firstHttpUrl(part.input?.url ?? part.input?.path);
 	if (isBrowserToolPart(part) && part.type !== "tool-browser_execute") return firstHttpUrl(part.input?.url);
-	if (isToolUIPart(part) && !isExecuteToolPart(part)) return firstHttpUrl(part.input) ?? (part.state === "output-available" ? firstHttpUrl(part.output) : null);
+	if (isToolUIPart(part) && !isExecuteToolPart(part)) return firstHttpUrl(getToolInput(part)) ?? (part.state === "output-available" ? firstHttpUrl(getToolOutput(part)) : null);
 	return null;
 }
 function activityPartIconKind(part) {

package/dist/components/ThinkChatContext.d.ts

@@ -1,2 +1,2 @@
-import { n as ThinkChatValue, r as useThinkChatContext, t as ThinkChatContext } from "../ThinkChatContext-CC94HL4u.js";
+import { n as ThinkChatValue, r as useThinkChatContext, t as ThinkChatContext } from "../ThinkChatContext-BLAAb8J5.js";
 export { ThinkChatContext, ThinkChatValue, useThinkChatContext };

package/dist/components/ThinkChatToolPanels.js

@@ -1,6 +1,6 @@
 import { ActivityOutput, ActivityPanel } from "./Activity.js";
 import { Tab, TabPanel, Tabs, TabsList } from "./Tabs.js";
-import { t as CodeBlock } from "../CodeBlock-D9koxDA7.js";
+import { t as CodeBlock } from "../CodeBlock-XNQOupQ3.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";
 import { displayUrl } from "./ThinkChatToolParts.js";
 import * as React from "react";

package/dist/components/ThinkChatToolParts.js

@@ -1,7 +1,7 @@
-import { getStaticToolName, getToolName, isReasoningUIPart, isStaticToolUIPart, isToolUIPart } from "ai";
 import { getToolPartState } from "@cloudflare/think/react";
+import { getStaticToolName, getToolName, isReasoningUIPart, isStaticToolUIPart, isToolUIPart } from "ai";
 //#region src/components/ThinkChatToolParts.ts
-const WORKSPACE_TOOL_NAMES = new Set([
+const WORKSPACE_TOOL_NAMES = /* @__PURE__ */ new Set([
 	"read",
 	"write",
 	"edit",
@@ -14,7 +14,7 @@ const WORKSPACE_TOOL_NAMES = new Set([
 function isWorkspaceToolPart(part) {
 	return isStaticToolUIPart(part) && WORKSPACE_TOOL_NAMES.has(getStaticToolName(part));
 }
-const SKILL_TOOL_NAMES = new Set([
+const SKILL_TOOL_NAMES = /* @__PURE__ */ new Set([
 	"activate_skill",
 	"read_skill_resource",
 	"run_skill_script"
@@ -25,7 +25,7 @@ function isSkillToolPart(part) {
 function isFetchToolPart(part) {
 	return isStaticToolUIPart(part) && getStaticToolName(part).startsWith("fetch_");
 }
-const BROWSER_TOOL_NAMES = new Set([
+const BROWSER_TOOL_NAMES = /* @__PURE__ */ new Set([
 	"browser_execute",
 	"browser_markdown",
 	"browser_extract",

package/dist/components/ThinkExecutionWorkbench.d.ts

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { Think } from "@cloudflare/think";
+import { AgentStub } from "agents/client";
+
+//#region src/components/ThinkExecutionWorkbench.d.ts
+type ThinkExecutionAgent<State = unknown> = Think<object, State>;
+type ThinkExecutionWorkbenchSource<State = unknown> = AgentStub<ThinkExecutionAgent<State>>;
+interface ThinkExecutionWorkbenchProps<State = unknown> extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+  /** Agents SDK client stub for a Think agent; this UI calls native submission/workflow methods. */
+  source: ThinkExecutionWorkbenchSource<State>;
+  title?: React.ReactNode;
+  backButton?: React.ReactNode;
+  pageSize?: number;
+}
+declare function ThinkExecutionWorkbench<State = unknown>({
+  backButton,
+  className,
+  pageSize,
+  ref,
+  source,
+  title,
+  ...props
+}: ThinkExecutionWorkbenchProps<State> & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+//#endregion
+export { ThinkExecutionAgent, ThinkExecutionWorkbench, ThinkExecutionWorkbenchProps, ThinkExecutionWorkbenchSource };