@mcp-b/react-components 0.20.0 → 0.20.4

package/dist/{AgentChat-CaQaT0LF.d.ts → AgentChat-C-ZyXbJz.d.ts}

@@ -140,6 +140,8 @@ interface AgentChatProps<MessageT extends UIMessage = UIMessage> {
   onApprovalResponse?: ChatAddToolApproveResponseFunction;
   /** Whole upstream Think stub used to resolve paused and durable execution approvals. */
   thinkStub?: AgentStub<Think>;
+  /** Disable approval scanning, automatic responses, cards, and composer controls. */
+  approvalsEnabled?: boolean;
   /** Parent-owned approval policy. Omit to keep AgentChat's session-local mode. */
   permissionModeControl?: PermissionModeControl;
   /** Called after a Think approve/reject RPC settles, including when it rejects. */
@@ -216,6 +218,7 @@ declare function AgentChat<MessageT extends UIMessage = UIMessage>({
   onEditAndResend,
   onApprovalResponse,
   thinkStub,
+  approvalsEnabled,
   permissionModeControl,
   onExecutionSettled,
   pendingApprovals: durableApprovals,

package/dist/{CodeBlock-Bb-IPBc_.js → CodeBlock-ygtuzqJd.js}

@@ -1,6 +1,6 @@
 import { t as cx } from "./class-names-BiMDVpUo.js";
 import { Select } from "./components/Select.js";
-import { t as CopyButton } from "./copy-button-BtRwhRks.js";
+import { t as CopyButton } from "./copy-button-vo1paUSi.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createHighlighter } from "shiki";

package/dist/{FileTree-CUlXfnmc.js → FileTree-CdgfccsM.js}

@@ -1,5 +1,5 @@
 import { t as cx } from "./class-names-BiMDVpUo.js";
-import { C as FolderIcon, S as FileIcon, p as ChevronRightIcon, w as FolderOpenIcon } from "./icons-DKXiSepE.js";
+import { C as FolderIcon, S as FileIcon, p as ChevronRightIcon, w as FolderOpenIcon } from "./icons-DyOM0EJs.js";
 import { t as NavigationLink } from "./navigation-link-Cob7KBlM.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -231,7 +231,7 @@ function FileTreeFolder({ className, path, name, level = 0, children, ref, ...pr
 					children: isExpanded ? /* @__PURE__ */ jsx(FolderOpenIcon, {}) : /* @__PURE__ */ jsx(FolderIcon, {})
 				}),
 				/* @__PURE__ */ jsx("span", {
-					className: "file-tree__name sigvelo-truncate",
+					className: "file-tree__name sigvelo-truncate sigvelo-truncate-grow",
 					children: name
 				})
 			]
@@ -270,7 +270,7 @@ function FileTreeFile({ className, path, name, icon, render, level = 0, ref, ...
 				"aria-hidden": "true",
 				children: icon ?? /* @__PURE__ */ jsx(FileIcon, {})
 			}), /* @__PURE__ */ jsx("span", {
-				className: "file-tree__name sigvelo-truncate",
+				className: "file-tree__name sigvelo-truncate sigvelo-truncate-grow",
 				children: name
 			})]
 		}) : /* @__PURE__ */ jsxs("button", {
@@ -289,7 +289,7 @@ function FileTreeFile({ className, path, name, icon, render, level = 0, ref, ...
 				"aria-hidden": "true",
 				children: icon ?? /* @__PURE__ */ jsx(FileIcon, {})
 			}), /* @__PURE__ */ jsx("span", {
-				className: "file-tree__name sigvelo-truncate",
+				className: "file-tree__name sigvelo-truncate sigvelo-truncate-grow",
 				children: name
 			})]
 		})
@@ -307,7 +307,7 @@ function FileTreeIcon({ className, children, ref, ...props }) {
 function FileTreeName({ className, children, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
-		className: cx("file-tree__name", "sigvelo-truncate", className),
+		className: cx("file-tree__name", "sigvelo-truncate", "sigvelo-truncate-grow", className),
 		...props,
 		children
 	});

package/dist/{Message-rZEaaD8Q.js → Message-DzuteocT.js}

@@ -1,9 +1,10 @@
 import { t as cx } from "./class-names-BiMDVpUo.js";
-import { S as FileIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "./icons-DKXiSepE.js";
+import { S as FileIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "./icons-DyOM0EJs.js";
 import { Button } from "./components/Button.js";
 import { Tooltip } from "./components/Tooltip.js";
 import { c as useWorkspaceNavigationContext, r as resolveWorkspaceLink, t as WorkspaceFileLink } from "./WorkspaceLink-BYYeTQLf.js";
 import { t as AttachmentPreview } from "./attachment-preview-DIs50Q0h.js";
+import { n as clamp } from "./format-S6uWyoSb.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cjk } from "@streamdown/cjk";
@@ -185,7 +186,7 @@ function MessageAttachment({ part, className, ...props }) {
 		download: part.filename,
 		...props,
 		children: [/* @__PURE__ */ jsx(FileIcon, { className: "message__attachment-icon" }), /* @__PURE__ */ jsx("span", {
-			className: "message__attachment-name",
+			className: "message__attachment-name sigvelo-truncate",
 			children: name
 		})]
 	});
@@ -284,7 +285,7 @@ function MessageBranch({ className, branchCount, defaultBranch = 0, branch, onBr
 function MessageBranchContent({ className, children, ref, ...props }) {
 	const { branchIndex } = useMessageBranch("MessageBranchContent");
 	const items = React.Children.toArray(children);
-	const safeIndex = items.length === 0 ? 0 : Math.min(Math.max(branchIndex, 0), items.length - 1);
+	const safeIndex = items.length === 0 ? 0 : clamp(branchIndex, 0, items.length - 1);
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		className: cx("message__branch-content", className),

package/dist/{ModelSelector-4GsCWcZV.js → ModelSelector-pecWyOFI.js}

@@ -1,7 +1,8 @@
 import { t as cx } from "./class-names-BiMDVpUo.js";
-import { W as SearchIcon, d as ChevronDownIcon } from "./icons-DKXiSepE.js";
+import { W as SearchIcon, d as ChevronDownIcon } from "./icons-DyOM0EJs.js";
 import { Button } from "./components/Button.js";
 import { Dialog } from "./components/Dialog.js";
+import { i as titleCase } from "./format-S6uWyoSb.js";
 import { Separator } from "./components/Separator.js";
 import { Input } from "./components/Input.js";
 import * as React from "react";
@@ -152,7 +153,7 @@ function getCloudflareModelProvider(modelId) {
 function formatCloudflareModelProvider(provider) {
 	const normalized = provider.trim().toLowerCase();
 	if (cloudflareModelProviderLabels[normalized]) return cloudflareModelProviderLabels[normalized];
-	return normalized.split(/[-_]/).filter(Boolean).map((word) => word[0].toUpperCase() + word.slice(1)).join(" ");
+	return titleCase(normalized);
 }
 function normalizeCloudflareModelSelectorModels(models) {
 	const seen = /* @__PURE__ */ new Set();
@@ -477,7 +478,7 @@ function ModelSelectorLogoGroup({ className, children, ref, ...props }) {
 function ModelSelectorName({ className, children, ref, ...props }) {
 	return /* @__PURE__ */ jsx("span", {
 		ref,
-		className: cx("model-selector__name", "sigvelo-truncate", className),
+		className: cx("model-selector__name", "sigvelo-truncate", "sigvelo-truncate-grow", className),
 		...props,
 		children
 	});

package/dist/{ThinkChat-15EhfvYJ.js → ThinkChat-E_HrfH76.js}

@@ -45,9 +45,12 @@ function thinkPendingExecutionApprovalsQueryOptions(stub, sourceKey) {
 		staleTime: 5e3
 	});
 }
-function useThinkPendingExecutionApprovals(stub, sourceKey, refreshSignal) {
+function useThinkPendingExecutionApprovals(stub, sourceKey, refreshSignal, enabled = true) {
 	const queryClient = useQueryClient();
-	const approvalsQuery = useQuery(thinkPendingExecutionApprovalsQueryOptions(stub, sourceKey));
+	const approvalsQuery = useQuery({
+		...thinkPendingExecutionApprovalsQueryOptions(stub, sourceKey),
+		enabled
+	});
 	const refreshState = React.useRef({
 		sourceKey,
 		observedSignal: refreshSignal,
@@ -55,15 +58,20 @@ function useThinkPendingExecutionApprovals(stub, sourceKey, refreshSignal) {
 	});
 	const refetch = React.useEffectEvent(() => approvalsQuery.refetch());
 	const refreshPendingApprovals = React.useCallback(async () => {
+		if (!enabled) return;
 		const filters = {
 			queryKey: thinkPendingExecutionApprovalsQueryKey(sourceKey),
 			exact: true
 		};
 		await queryClient.cancelQueries(filters);
 		await queryClient.invalidateQueries(filters);
-	}, [queryClient, sourceKey]);
+	}, [
+		enabled,
+		queryClient,
+		sourceKey
+	]);
 	React.useEffect(() => {
-		if (refreshState.current.sourceKey !== sourceKey) {
+		if (!enabled || refreshState.current.sourceKey !== sourceKey) {
 			refreshState.current = {
 				sourceKey,
 				observedSignal: refreshSignal,
@@ -80,6 +88,7 @@ function useThinkPendingExecutionApprovals(stub, sourceKey, refreshSignal) {
 		refetch();
 	}, [
 		approvalsQuery.isFetching,
+		enabled,
 		refreshSignal,
 		sourceKey
 	]);
@@ -122,7 +131,7 @@ function ThinkChatProvider({ agentTools, chat, children }) {
 * </QueryClientProvider>
 * ```
 */
-function ThinkChatRoot({ agent: agentOption, name, sourceKey, children }) {
+function ThinkChatRoot({ agent: agentOption, approvalsEnabled = true, name, sourceKey, children }) {
 	const agent = useAgent(typeof agentOption === "string" ? {
 		agent: agentOption,
 		name
@@ -133,7 +142,7 @@ function ThinkChatRoot({ agent: agentOption, name, sourceKey, children }) {
 	const chat = useAgentChat({ agent });
 	const agentTools = useAgentToolEvents({ agent });
 	const agentIdentity = JSON.stringify(agent.path);
-	const approvals = useThinkPendingExecutionApprovals(agent.stub, sourceKey, `${chat.messages.length}:${chat.status}`);
+	const approvals = useThinkPendingExecutionApprovals(agent.stub, sourceKey, `${chat.messages.length}:${chat.status}`, approvalsEnabled);
 	const resetAgentTools = React.useEffectEvent(() => agentTools.resetLocalState());
 	React.useEffect(() => {
 		resetAgentTools();

package/dist/{ThinkChatActivity-CnIJPvV5.d.ts → ThinkChatActivity-CdbL0aoA.d.ts}

@@ -1,5 +1,5 @@
 import { i as AgentMessageRenderPartContext } from "./AgentMessageParts-CyD2UB3V.js";
-import { r as AgentChatProps } from "./AgentChat-CaQaT0LF.js";
+import { r as AgentChatProps } from "./AgentChat-C-ZyXbJz.js";
 import { l as ThinkChatPart } from "./ThinkChatToolParts-CSzVwMXf.js";
 import * as React from "react";
 import { DynamicToolUIPart, ToolUIPart, UIMessage } from "ai";

package/dist/{WorkspaceFileView-CEdArlOT.js → WorkspaceFileView-Bxx4wEzJ.js}

@@ -1,9 +1,10 @@
-import { Q as WarningIcon, b as EyeIcon, et as XIcon, k as MaximizeIcon, m as CodeIcon, u as CheckIcon, v as DownloadIcon } from "./icons-DKXiSepE.js";
+import { Q as WarningIcon, b as EyeIcon, et as XIcon, k as MaximizeIcon, m as CodeIcon, u as CheckIcon, v as DownloadIcon } from "./icons-DyOM0EJs.js";
 import { t as NavigationLink } from "./navigation-link-Cob7KBlM.js";
 import { buttonVariants } from "./components/Button.js";
 import { c as useWorkspaceNavigationContext, s as useWorkspaceNavigationRestoration } from "./WorkspaceLink-BYYeTQLf.js";
-import { f as MessageResponse, m as createWorkspaceRehypePlugins } from "./Message-rZEaaD8Q.js";
-import { a as CodeBlockCopyButton, i as CodeBlockContent, r as CodeBlockContainer, t as CodeBlock } from "./CodeBlock-Bb-IPBc_.js";
+import { r as formatClock } from "./format-S6uWyoSb.js";
+import { f as MessageResponse, m as createWorkspaceRehypePlugins } from "./Message-DzuteocT.js";
+import { a as CodeBlockCopyButton, i as CodeBlockContent, r as CodeBlockContainer, t as CodeBlock } from "./CodeBlock-ygtuzqJd.js";
 import { AppTopBar } from "./components/AppTopBar.js";
 import { inferWorkspaceLanguage, inferWorkspaceMedia, isWorkspaceMarkdownPath, isWorkspaceSkillPath, parseWorkspaceSkill } from "./components/WorkspaceFile.js";
 import { WorkspaceHeader } from "./components/WorkspaceHeader.js";
@@ -160,16 +161,9 @@ function formatBytes(size) {
 	}
 	return `${value >= 10 ? value.toFixed(0) : value.toFixed(1)} ${unit}`;
 }
-function formatDuration(duration) {
-	const seconds = Math.max(0, Math.round(duration));
-	const hours = Math.floor(seconds / 3600);
-	const minutes = Math.floor(seconds % 3600 / 60);
-	const remainder = seconds % 60;
-	return hours > 0 ? `${hours}:${String(minutes).padStart(2, "0")}:${String(remainder).padStart(2, "0")}` : `${minutes}:${String(remainder).padStart(2, "0")}`;
-}
 function WorkspaceMediaDetails({ mimeType, size, dimensions, dimensionsPending = false, duration, durationPending = false, transcriptUrl }) {
 	const dimensionValue = dimensionsPending ? "Loading…" : dimensions ? `${dimensions.width} × ${dimensions.height} px` : null;
-	const durationValue = durationPending ? "Loading…" : duration !== void 0 && duration !== null ? formatDuration(duration) : null;
+	const durationValue = durationPending ? "Loading…" : duration !== void 0 && duration !== null ? formatClock(Math.round(duration)) : null;
 	return /* @__PURE__ */ jsxs("figcaption", {
 		className: "workspace-explorer__media-caption",
 		children: [/* @__PURE__ */ jsxs("dl", {

package/dist/components/Accordion.js

@@ -23,7 +23,7 @@ import { jsx } from "react/jsx-runtime";
 * @see {@link https://base-ui.com/react/components/accordion | Base UI Accordion}
 */
 function AccordionRoot({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["accordion"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("accordion", className);
 	return /* @__PURE__ */ jsx(Accordion$1.Root, {
 		ref,
 		"data-slot": "accordion",
@@ -35,7 +35,7 @@ function AccordionRoot({ className, ref, ...props }) {
 * A single item within an Accordion.
 */
 function AccordionItem({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["accordion__item"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("accordion__item", className);
 	return /* @__PURE__ */ jsx(Accordion$1.Item, {
 		ref,
 		"data-slot": "accordion-item",
@@ -44,7 +44,7 @@ function AccordionItem({ className, ref, ...props }) {
 	});
 }
 function AccordionHeader({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["accordion__header"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("accordion__header", className);
 	return /* @__PURE__ */ jsx(Accordion$1.Header, {
 		ref,
 		"data-slot": "accordion-header",
@@ -59,7 +59,7 @@ function AccordionHeader({ className, ref, ...props }) {
 * The clickable trigger button within an AccordionItem.
 */
 function AccordionTrigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["accordion__trigger"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("accordion__trigger", className);
 	return /* @__PURE__ */ jsx(Accordion$1.Trigger, {
 		ref,
 		"data-slot": "accordion-trigger",

package/dist/components/Activity.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
 import { Collapsible } from "./Collapsible.js";
-import { p as ChevronRightIcon } from "../icons-DKXiSepE.js";
+import { p as ChevronRightIcon } from "../icons-DyOM0EJs.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Activity.tsx
@@ -52,7 +52,7 @@ function ActivityHeader({ className, icon, isStreaming = false, label = "Working
 				children: icon
 			}) : null,
 			/* @__PURE__ */ jsx("span", {
-				className: "activity__header-label",
+				className: "activity__header-label sigvelo-truncate",
 				children: label
 			}),
 			trailing

package/dist/components/AgentActivity.js

@@ -1,4 +1,4 @@
-import { $ as WrenchIcon, D as InfoIcon, O as LinkIcon, P as MonitorIcon, Q as WarningIcon, S as FileIcon, W as SearchIcon, X as TerminalIcon, z as PencilIcon } from "../icons-DKXiSepE.js";
+import { $ as WrenchIcon, D as InfoIcon, O as LinkIcon, P as MonitorIcon, Q as WarningIcon, S as FileIcon, W as SearchIcon, X as TerminalIcon, z as PencilIcon } from "../icons-DyOM0EJs.js";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/AgentActivity.tsx

package/dist/components/AgentActivityPreview.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { A as McpIcon, K as SpinnerIcon, Q as WarningIcon, S as FileIcon, et as XIcon } from "../icons-DKXiSepE.js";
+import { A as McpIcon, K as SpinnerIcon, Q as WarningIcon, S as FileIcon, et as XIcon } from "../icons-DyOM0EJs.js";
 import { ActivityHeader } from "./Activity.js";
 import { AgentActivityFavicon, AgentActivityIcon } from "./AgentActivity.js";
 import { t as NavigationLink } from "../navigation-link-Cob7KBlM.js";

package/dist/components/AgentAttention.js

@@ -23,10 +23,10 @@ function AgentAttentionHeading({ description, icon, title }) {
 	}) : null, /* @__PURE__ */ jsxs("span", {
 		className: "agent-attention__text",
 		children: [/* @__PURE__ */ jsx("span", {
-			className: "agent-attention__title",
+			className: "agent-attention__title sigvelo-truncate",
 			children: title
 		}), description ? /* @__PURE__ */ jsx("span", {
-			className: "agent-attention__description",
+			className: "agent-attention__description sigvelo-truncate",
 			children: description
 		}) : null]
 	})] });

package/dist/components/AgentChat.d.ts

@@ -1,2 +1,2 @@
-import { a as PermissionModeControl, i as AgentChatRenderMessageContext, n as AgentChatComposerDraft, r as AgentChatProps, t as AgentChat } from "../AgentChat-CaQaT0LF.js";
+import { a as PermissionModeControl, i as AgentChatRenderMessageContext, n as AgentChatComposerDraft, r as AgentChatProps, t as AgentChat } from "../AgentChat-C-ZyXbJz.js";
 export { AgentChat, AgentChatComposerDraft, AgentChatProps, AgentChatRenderMessageContext, PermissionModeControl };

package/dist/components/AgentChat.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { H as QueueIcon, I as MoveToFrontIcon, U as RefreshIcon, V as PlusIcon, Z as TrashIcon, z as PencilIcon } from "../icons-DKXiSepE.js";
-import { n as MessageAction, r as MessageActions, t as Message } from "../Message-rZEaaD8Q.js";
+import { H as QueueIcon, I as MoveToFrontIcon, U as RefreshIcon, V as PlusIcon, Z as TrashIcon, z as PencilIcon } from "../icons-DyOM0EJs.js";
+import { n as MessageAction, r as MessageActions, t as Message } from "../Message-DzuteocT.js";
 import { AgentMessageParts } from "./AgentMessageParts.js";
 import { Context, ContextContent, ContextContentBody, ContextContentHeader, ContextTrigger, getContextUsage, getContextUsedTokens } from "./Context.js";
 import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "./MessageScroller.js";
@@ -10,7 +10,7 @@ import { Marker, MarkerContent } from "./Marker.js";
 import { Menu } from "./Menu.js";
 import { TransitionSurface } from "./TransitionSurface.js";
 import { PromptInput, PromptInputActionAddAttachments, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuTrigger, PromptInputApproval, PromptInputAttachments, PromptInputBody, PromptInputButton, PromptInputCommandComposer, PromptInputContextSelector, PromptInputDictation, PromptInputFooter, PromptInputHeader, PromptInputPermissionSelector, PromptInputReferences, PromptInputSubmit, PromptInputTextarea, PromptInputTools, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals, usePromptInputAttachments } from "./PromptInput.js";
-import { t as CopyButton } from "../copy-button-BtRwhRks.js";
+import { t as CopyButton } from "../copy-button-vo1paUSi.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { isCompactionMessage } from "agents/experimental/memory/utils";
@@ -108,7 +108,7 @@ function getEditableUserText(message) {
 * transport. Product code that talks to a Cloudflare Think agent should render
 * `ThinkChat`; use this directly only for plain AI SDK or read-only messages.
 */
-function AgentChat({ className, messages, status = "ready", onSubmit, showComposer = onSubmit !== void 0, onStop, placeholder = "Ask anything...", disabled, emptyState, composerHeader, composerTools, slashCommands, mentionCommands, contextSelector, composerEndTools, voiceInput, beforeVoiceStart, composerAddMenuItems, notice, onRegenerate, onEditAndResend, onApprovalResponse, thinkStub, permissionModeControl, onExecutionSettled, pendingApprovals: durableApprovals = EMPTY_PENDING_APPROVALS, contextWindow, renderPart, renderMessageAfter, ref }) {
+function AgentChat({ className, messages, status = "ready", onSubmit, showComposer = onSubmit !== void 0, onStop, placeholder = "Ask anything...", disabled, emptyState, composerHeader, composerTools, slashCommands, mentionCommands, contextSelector, composerEndTools, voiceInput, beforeVoiceStart, composerAddMenuItems, notice, onRegenerate, onEditAndResend, onApprovalResponse, thinkStub, approvalsEnabled = true, permissionModeControl, onExecutionSettled, pendingApprovals: durableApprovals = EMPTY_PENDING_APPROVALS, contextWindow, renderPart, renderMessageAfter, ref }) {
 	const [copyAnnouncement, setCopyAnnouncement] = React.useState("");
 	const [composerDraft, setComposerDraft] = React.useState("");
 	const [composerReferences, setComposerReferences] = React.useState([]);
@@ -214,19 +214,21 @@ function AgentChat({ className, messages, status = "ready", onSubmit, showCompos
 	}, [thinkStub]);
 	const skippedApprovalIdSet = React.useMemo(() => new Set(skippedApprovalIds), [skippedApprovalIds]);
 	const pendingApprovalItems = React.useMemo(() => {
+		if (!approvalsEnabled) return [];
 		return [...getPendingToolApprovals(messages, { pausedExecutions: Boolean(thinkStub) }).filter((part) => {
 			if (part.state === "approval-requested" && !onApprovalResponse) return false;
 			const id = getApprovalStateKey(part);
 			return Boolean(id) && !skippedApprovalIdSet.has(id);
 		}).map((part) => ({ part })), ...thinkStub ? durableApprovals.filter((approval) => approval.source === "action" && !skippedApprovalIdSet.has(approval.executionId)).map((approval) => ({ approval })) : []];
 	}, [
+		approvalsEnabled,
 		durableApprovals,
 		messages,
 		onApprovalResponse,
 		skippedApprovalIdSet,
 		thinkStub
 	]);
-	const approvalsWired = Boolean(onApprovalResponse || thinkStub);
+	const approvalsWired = approvalsEnabled && Boolean(onApprovalResponse || thinkStub);
 	const autoApprovedIds = React.useRef({
 		thinkStub,
 		ids: /* @__PURE__ */ new Set()
@@ -397,7 +399,7 @@ function AgentChat({ className, messages, status = "ready", onSubmit, showCompos
 											children: /* @__PURE__ */ jsx(QueueIcon, {})
 										}),
 										/* @__PURE__ */ jsx("span", {
-											className: "agent-chat__queued-text sigvelo-truncate",
+											className: "agent-chat__queued-text sigvelo-truncate sigvelo-truncate-grow",
 											children: messageText
 										}),
 										/* @__PURE__ */ jsxs("button", {

package/dist/components/AgentConnection.js

@@ -1,10 +1,10 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { O as LinkIcon } from "../icons-DKXiSepE.js";
+import { O as LinkIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
 import { Popover } from "./Popover.js";
 import { Field } from "./Field.js";
 import { Form } from "./Form.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-Bb-IPBc_.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-ygtuzqJd.js";
 import { CUSTOM_MCP_SERVER_CARD } from "../utils/mcp-server-catalog.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/AgentMessageParts.js

@@ -1,4 +1,4 @@
-import { d as MessageContent, f as MessageResponse, i as MessageAttachment } from "../Message-rZEaaD8Q.js";
+import { d as MessageContent, f as MessageResponse, i as MessageAttachment } from "../Message-DzuteocT.js";
 import { Reasoning, ReasoningContent, ReasoningTrigger } from "./Reasoning.js";
 import { Source, Sources, SourcesContent, SourcesTrigger } from "./Sources.js";
 import { ToolInvocation } from "./ToolInvocation.js";

package/dist/components/AgentToolDetail.js

@@ -1,11 +1,11 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { r as ArrowLeftIcon } from "../icons-DKXiSepE.js";
+import { r as ArrowLeftIcon } from "../icons-DyOM0EJs.js";
 import { TransitionSurface } from "./TransitionSurface.js";
 import { AppTopBar } from "./AppTopBar.js";
 import { NaniteMark } from "./NaniteScene.js";
 import { SubagentRunIndicator, getSubagentRunName } from "./SubagentRunIndicator.js";
 import { SubagentRunMilestone, SubagentRunMilestones, SubagentRunProgress } from "./SubagentRunDetails.js";
-import { t as ThinkChat } from "../ThinkChat-15EhfvYJ.js";
+import { t as ThinkChat } from "../ThinkChat-E_HrfH76.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useAgentChat } from "@cloudflare/think/react";

package/dist/components/AlertDialog.js

@@ -33,7 +33,7 @@ import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
 * @see {@link https://base-ui.com/react/components/alert-dialog | Base UI Alert Dialog}
 */
 function AlertDialogTrigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["alert-dialog__trigger"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("alert-dialog__trigger", className);
 	return /* @__PURE__ */ jsx(AlertDialog$1.Trigger, {
 		ref,
 		"data-slot": "alert-dialog-trigger",
@@ -42,7 +42,7 @@ function AlertDialogTrigger({ className, ref, ...props }) {
 	});
 }
 function AlertDialogBackdrop({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["alert-dialog__backdrop", "base-ui-backdrop"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("alert-dialog__backdrop base-ui-backdrop", className);
 	return /* @__PURE__ */ jsx(AlertDialog$1.Backdrop, {
 		ref,
 		"data-slot": "alert-dialog-overlay",
@@ -51,7 +51,7 @@ function AlertDialogBackdrop({ className, ref, ...props }) {
 	});
 }
 function AlertDialogViewport({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["alert-dialog__viewport"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("alert-dialog__viewport", className);
 	return /* @__PURE__ */ jsx(AlertDialog$1.Viewport, {
 		ref,
 		"data-slot": "alert-dialog-viewport",
@@ -76,7 +76,7 @@ function AlertDialogHeader({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "alert-dialog-header",
-		className: mergeBaseClassName(["alert-dialog__header"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("alert-dialog__header", className),
 		...props
 	});
 }
@@ -84,7 +84,7 @@ function AlertDialogFooter({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "alert-dialog-footer",
-		className: mergeBaseClassName(["alert-dialog__footer"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("alert-dialog__footer", className),
 		...props
 	});
 }
@@ -92,12 +92,12 @@ function AlertDialogMedia({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		ref,
 		"data-slot": "alert-dialog-media",
-		className: mergeBaseClassName(["alert-dialog__media"].filter(Boolean).join(" "), className),
+		className: mergeBaseClassName("alert-dialog__media", className),
 		...props
 	});
 }
 function AlertDialogTitle({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["alert-dialog__title"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("alert-dialog__title", className);
 	return /* @__PURE__ */ jsx(AlertDialog$1.Title, {
 		ref,
 		"data-slot": "alert-dialog-title",
@@ -106,7 +106,7 @@ function AlertDialogTitle({ className, ref, ...props }) {
 	});
 }
 function AlertDialogDescription({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["alert-dialog__description"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("alert-dialog__description", className);
 	return /* @__PURE__ */ jsx(AlertDialog$1.Description, {
 		ref,
 		"data-slot": "alert-dialog-description",

package/dist/components/AppTopBar.js

@@ -31,7 +31,7 @@ function AppTopBarTitle({ className, render, ref, ...props }) {
 		props: {
 			...props,
 			"data-slot": "app-top-bar-title",
-			className: cx("app-top-bar__title", className)
+			className: cx("app-top-bar__title", "sigvelo-truncate", className)
 		}
 	});
 }

package/dist/components/Approval.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { z as PencilIcon } from "../icons-DKXiSepE.js";
+import { z as PencilIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/Artifact.js

@@ -1,5 +1,5 @@
 import { t as cx } from "../class-names-BiMDVpUo.js";
-import { et as XIcon } from "../icons-DKXiSepE.js";
+import { et as XIcon } from "../icons-DyOM0EJs.js";
 import { Button } from "./Button.js";
 import { Tooltip } from "./Tooltip.js";
 import "react";

package/dist/components/Autocomplete.js

@@ -4,7 +4,7 @@ import { jsx } from "react/jsx-runtime";
 import { Autocomplete as Autocomplete$1 } from "@base-ui/react/autocomplete";
 //#region src/components/Autocomplete.tsx
 function Input({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__input"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__input", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Input, {
 		ref,
 		"data-slot": "autocomplete-input",
@@ -13,7 +13,7 @@ function Input({ className, ref, ...props }) {
 	});
 }
 function Trigger({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__trigger"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__trigger", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Trigger, {
 		ref,
 		"data-slot": "autocomplete-trigger",
@@ -22,7 +22,7 @@ function Trigger({ className, ref, ...props }) {
 	});
 }
 function Clear({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__clear"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__clear", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Clear, {
 		ref,
 		"data-slot": "autocomplete-clear",
@@ -31,7 +31,7 @@ function Clear({ className, ref, ...props }) {
 	});
 }
 function Positioner({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__positioner", "base-ui-positioner"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__positioner base-ui-positioner", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Positioner, {
 		ref,
 		"data-slot": "autocomplete-positioner",
@@ -40,7 +40,7 @@ function Positioner({ className, ref, ...props }) {
 	});
 }
 function Popup({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__popup", "base-ui-popup"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__popup base-ui-popup", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Popup, {
 		ref,
 		"data-slot": "autocomplete-content",
@@ -49,7 +49,7 @@ function Popup({ className, ref, ...props }) {
 	});
 }
 function List({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__list"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__list", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.List, {
 		ref,
 		"data-slot": "autocomplete-list",
@@ -58,7 +58,7 @@ function List({ className, ref, ...props }) {
 	});
 }
 function Item({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__item"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__item", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Item, {
 		ref,
 		"data-slot": "autocomplete-item",
@@ -67,7 +67,7 @@ function Item({ className, ref, ...props }) {
 	});
 }
 function Empty({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__empty"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__empty", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Empty, {
 		ref,
 		"data-slot": "autocomplete-empty",
@@ -76,7 +76,7 @@ function Empty({ className, ref, ...props }) {
 	});
 }
 function Status({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__status"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__status", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Status, {
 		ref,
 		"data-slot": "autocomplete-status",
@@ -85,7 +85,7 @@ function Status({ className, ref, ...props }) {
 	});
 }
 function Group({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__group"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__group", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.Group, {
 		ref,
 		"data-slot": "autocomplete-group",
@@ -94,7 +94,7 @@ function Group({ className, ref, ...props }) {
 	});
 }
 function GroupLabel({ className, ref, ...props }) {
-	const classes = mergeBaseClassName(["autocomplete__group-label"].filter(Boolean).join(" "), className);
+	const classes = mergeBaseClassName("autocomplete__group-label", className);
 	return /* @__PURE__ */ jsx(Autocomplete$1.GroupLabel, {
 		ref,
 		"data-slot": "autocomplete-group-label",