@mcp-b/react-components 0.34.1 → 0.36.0

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

@@ -1,2 +1,505 @@
-import { _ as getCloudflareModelProvider, a as ModelSelectorEmpty, b as normalizeCloudflareModelSelectorModels, c as ModelSelectorItem, d as ModelSelectorLogoGroup, f as ModelSelectorName, g as formatCloudflareModelProvider, h as ModelSelectorTrigger, i as ModelSelectorDialog, l as ModelSelectorList, m as ModelSelectorSource, n as ModelSelector, o as ModelSelectorGroup, p as ModelSelectorSeparator, r as ModelSelectorContent, s as ModelSelectorInput, t as CloudflareModelSelector, u as ModelSelectorLogo, v as isCloudflareRunnableModelId, x as readCloudflareModelId, y as listCloudflareModelSelectorOptions } from "../../ModelSelector-DzdEs2fX.js";
+import { t as cx } from "../../class-names-BiMDVpUo.js";
+import { G as SearchIcon, f as ChevronDownIcon } from "../../icons-B1Qw05te.js";
+import { Button } from "../foundations/Button.js";
+import { Dialog } from "../foundations/Dialog.js";
+import { o as titleCase } from "../../format-DB2mX9DA.js";
+import { Separator } from "../foundations/Separator.js";
+import { EmptyState } from "../foundations/EmptyState.js";
+import { ScrollArea } from "../foundations/ScrollArea.js";
+import { Autocomplete } from "../foundations/Autocomplete.js";
+import { t as ProviderLogo } from "../../provider-logos-zjZycgV6.js";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+//#region src/components/agents-sdk/ModelSelector.tsx
+const ModelSelectorContext = React.createContext(null);
+const ModelSelectorEmptyContainerContext = React.createContext(void 0);
+function modelSelectorItemSearchValue({ keywords, value }) {
+	return `${value} ${keywords ?? ""}`.trim();
+}
+function modelSelectorFilter(item, query) {
+	return item.toLowerCase().includes(query.trim().toLowerCase());
+}
+function equalItems(left, right) {
+	return left?.length === right.length && left.every((item, index) => item === right[index]);
+}
+const cloudflareModelProviderLabels = {
+	ai4bharat: "AI4Bharat",
+	aisingapore: "AI Singapore",
+	alibaba: "Alibaba",
+	anthropic: "Anthropic",
+	baai: "BAAI",
+	cohere: "Cohere",
+	deepseek: "DeepSeek",
+	"deepseek-ai": "DeepSeek",
+	google: "Google",
+	"google-vertex": "Google Vertex",
+	groq: "Groq",
+	ibm: "IBM",
+	"ibm-granite": "IBM",
+	meta: "Meta",
+	"meta-llama": "Meta",
+	microsoft: "Microsoft",
+	mistral: "Mistral AI",
+	mistralai: "Mistral AI",
+	minimax: "MiniMax",
+	moonshotai: "Moonshot AI",
+	nvidia: "NVIDIA",
+	openai: "OpenAI",
+	openrouter: "OpenRouter",
+	perplexity: "Perplexity",
+	qwen: "Qwen",
+	replicate: "Replicate",
+	together: "Together AI",
+	xai: "xAI",
+	"zai-org": "Zhipu AI"
+};
+function isCloudflareRunnableModelId(value) {
+	const modelId = value.trim();
+	return /^@(?:cf|hf)\/[^/\s]+\/\S+$/.test(modelId) || /^[a-z0-9][a-z0-9._-]*\/\S+$/i.test(modelId);
+}
+function readCatalogString(value) {
+	if (typeof value !== "string") return null;
+	const trimmed = value.trim();
+	return trimmed.length > 0 ? trimmed : null;
+}
+function readCatalogField(entry, field) {
+	if (typeof entry !== "object" || entry === null || !Object.hasOwn(entry, field)) return null;
+	return readCatalogString(entry[field]);
+}
+function readCatalogEntries(entry) {
+	if (Array.isArray(entry)) return entry;
+	if (typeof entry !== "object" || entry === null || !Object.hasOwn(entry, "data")) return null;
+	const data = entry.data;
+	return Array.isArray(data) ? data : null;
+}
+function readCloudflareModelId(entry) {
+	if (typeof entry === "string") {
+		const modelId = readCatalogString(entry);
+		return modelId && isCloudflareRunnableModelId(modelId) ? modelId : null;
+	}
+	for (const field of [
+		"model_id",
+		"name",
+		"id"
+	]) {
+		const modelId = readCatalogField(entry, field);
+		if (modelId && isCloudflareRunnableModelId(modelId)) return modelId;
+	}
+	return null;
+}
+function getCloudflareModelProvider(modelId) {
+	const [, hostedProvider] = /^@(?:cf|hf)\/([^/]+)/.exec(modelId) ?? [];
+	if (hostedProvider) return hostedProvider;
+	return modelId.split("/", 1)[0] || "other";
+}
+function formatCloudflareModelProvider(provider) {
+	const normalized = provider.trim().toLowerCase();
+	if (cloudflareModelProviderLabels[normalized]) return cloudflareModelProviderLabels[normalized];
+	return titleCase(normalized);
+}
+function normalizeCloudflareModelSelectorModels(models) {
+	const seen = /* @__PURE__ */ new Set();
+	const options = [];
+	const appendOption = (entry) => {
+		const entries = readCatalogEntries(entry);
+		if (entries) {
+			for (const nestedEntry of entries) appendOption(nestedEntry);
+			return;
+		}
+		const id = readCloudflareModelId(entry);
+		if (!id || seen.has(id)) return;
+		seen.add(id);
+		const provider = getCloudflareModelProvider(id);
+		options.push({
+			id,
+			provider,
+			providerLabel: formatCloudflareModelProvider(provider),
+			source: id.startsWith("@") ? "workers-ai" : "ai-gateway",
+			description: readCatalogField(entry, "description")
+		});
+	};
+	for (const entry of models) appendOption(entry);
+	return options;
+}
+async function listCloudflareModelSelectorOptions(client, params) {
+	const { account_id, task, per_page = 100 } = params;
+	const models = [];
+	for (let page = 1;; page += 1) {
+		const response = await client.get(`/accounts/${account_id}/ai/catalog/models`, { query: {
+			page,
+			per_page
+		} });
+		const pageModels = response.result.filter((model) => !model.private && (!task || model.task === task));
+		models.push(...pageModels);
+		if (response.result.length < per_page) break;
+	}
+	return normalizeCloudflareModelSelectorModels(models);
+}
+function groupCloudflareModelOptions(options) {
+	const groups = [];
+	const groupsByLabel = /* @__PURE__ */ new Map();
+	for (const option of options) {
+		const group = groupsByLabel.get(option.providerLabel);
+		if (group) {
+			group.push(option);
+			continue;
+		}
+		const nextGroup = [option];
+		groupsByLabel.set(option.providerLabel, nextGroup);
+		groups.push({
+			providerLabel: option.providerLabel,
+			options: nextGroup
+		});
+	}
+	return groups;
+}
+function useModelSelectorContext() {
+	const ctx = React.useContext(ModelSelectorContext);
+	if (!ctx) throw new Error("ModelSelector subcomponents must be used inside <ModelSelector>.");
+	return ctx;
+}
+/**
+* A searchable model picker. Click the trigger to open a dialog containing a
+* search input and a grouped list of available models.
+*
+* Built internally for AI model selection. Use it when users choose one model
+* from a grouped provider list. Do not use it as a general command palette or
+* multiselect; use Combobox or a dedicated component for that.
+*
+* Sigvelo changes: composes the design-system Dialog, Autocomplete, ScrollArea,
+* and Button, and maps provider logos plus option styling to Sigvelo CSS tokens.
+*
+* Dialog owns modal focus and dismissal. Autocomplete owns listbox semantics,
+* active-descendant focus, and keyboard navigation. Styling consumes surface,
+* border, spacing, radius, focus, and typography tokens. Add provider/item
+* affordances here when they need to be shared.
+*
+* @example
+* ```tsx
+* <ModelSelector>
+*   <ModelSelectorTrigger>
+*     <ModelSelectorLogo provider="anthropic" />
+*     <ModelSelectorName>Claude Opus 4.6</ModelSelectorName>
+*   </ModelSelectorTrigger>
+*   <ModelSelectorContent>
+*     <ModelSelectorDialog>
+*       <ModelSelectorInput placeholder="Search models…" />
+*       <ModelSelectorList>
+*         <ModelSelectorGroup label="Anthropic">
+*           <ModelSelectorItem value="claude-opus-4-6" onSelect={…}>
+*             <ModelSelectorLogo provider="anthropic" />
+*             <ModelSelectorName>Claude Opus 4.6</ModelSelectorName>
+*           </ModelSelectorItem>
+*         </ModelSelectorGroup>
+*       </ModelSelectorList>
+*     </ModelSelectorDialog>
+*   </ModelSelectorContent>
+* </ModelSelector>
+* ```
+*/
+function ModelSelector({ open, defaultOpen = false, onOpenChange, children, className, ref, ...props }) {
+	const [query, setQuery] = React.useState("");
+	const [registeredGroups, setRegisteredGroups] = React.useState(() => /* @__PURE__ */ new Map());
+	const handleOpenChange = React.useCallback((...args) => {
+		const [next, eventDetails] = args;
+		onOpenChange?.(...args);
+		if (!eventDetails.isCanceled && !next) setQuery("");
+	}, [onOpenChange]);
+	const registerGroup = React.useCallback((id, items) => {
+		setRegisteredGroups((current) => {
+			if (equalItems(current.get(id), items)) return current;
+			const next = new Map(current);
+			next.set(id, items);
+			return next;
+		});
+		return () => {
+			setRegisteredGroups((current) => {
+				if (!current.has(id)) return current;
+				const next = new Map(current);
+				next.delete(id);
+				return next;
+			});
+		};
+	}, []);
+	const autocompleteItems = React.useMemo(() => Array.from(registeredGroups.values()).flat(), [registeredGroups]);
+	const ctxValue = React.useMemo(() => ({
+		query,
+		registerGroup,
+		setQuery
+	}), [query, registerGroup]);
+	return /* @__PURE__ */ jsx(ModelSelectorContext.Provider, {
+		value: ctxValue,
+		children: /* @__PURE__ */ jsx(Autocomplete.Root, {
+			open: true,
+			inline: true,
+			items: autocompleteItems,
+			filter: modelSelectorFilter,
+			value: query,
+			onValueChange: setQuery,
+			autoHighlight: "always",
+			keepHighlight: true,
+			children: /* @__PURE__ */ jsx("div", {
+				ref,
+				className: cx("model-selector", className),
+				...props,
+				children: /* @__PURE__ */ jsx(Dialog.Root, {
+					open,
+					defaultOpen,
+					onOpenChange: handleOpenChange,
+					children
+				})
+			})
+		})
+	});
+}
+function CloudflareModelSelector({ models, selectedModelId = null, onSelectModel, disabled = false, placeholder = "Search or paste an AI Gateway model id...", triggerLabel = "Select a model", emptyLabel = "No models found", allowTypedModel = true, onOpenChange, ...props }) {
+	const options = React.useMemo(() => normalizeCloudflareModelSelectorModels(models), [models]);
+	const groups = React.useMemo(() => groupCloudflareModelOptions(options), [options]);
+	const selectedOption = selectedModelId ? options.find((option) => option.id === selectedModelId) ?? {
+		id: selectedModelId,
+		provider: getCloudflareModelProvider(selectedModelId),
+		providerLabel: formatCloudflareModelProvider(getCloudflareModelProvider(selectedModelId)),
+		source: selectedModelId.startsWith("@") ? "workers-ai" : "ai-gateway",
+		description: null
+	} : null;
+	return /* @__PURE__ */ jsxs(ModelSelector, {
+		onOpenChange,
+		...props,
+		children: [/* @__PURE__ */ jsx(ModelSelectorTrigger, {
+			disabled,
+			children: selectedOption ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ModelSelectorLogo, { provider: selectedOption.provider }), /* @__PURE__ */ jsx(ModelSelectorName, { children: selectedOption.id })] }) : /* @__PURE__ */ jsx(ModelSelectorName, { children: triggerLabel })
+		}), /* @__PURE__ */ jsx(ModelSelectorContent, {
+			title: "Cloudflare model selector",
+			children: /* @__PURE__ */ jsxs(ModelSelectorDialog, { children: [/* @__PURE__ */ jsx(ModelSelectorInput, {
+				"aria-label": "Search Cloudflare AI models",
+				placeholder
+			}), /* @__PURE__ */ jsxs(ModelSelectorList, { children: [
+				/* @__PURE__ */ jsx(CloudflareTypedModelOption, {
+					allowTypedModel,
+					onSelectModel,
+					options,
+					selectedModelId
+				}),
+				groups.map((group) => /* @__PURE__ */ jsx(ModelSelectorGroup, {
+					label: group.providerLabel,
+					children: group.options.map((option) => /* @__PURE__ */ jsxs(ModelSelectorItem, {
+						value: option.id,
+						keywords: `${option.provider} ${option.providerLabel} ${option.source} ${option.description ?? ""}`,
+						selected: option.id === selectedModelId,
+						onSelect: onSelectModel,
+						children: [
+							/* @__PURE__ */ jsx(ModelSelectorLogo, { provider: option.provider }),
+							/* @__PURE__ */ jsx(ModelSelectorName, { children: option.id }),
+							/* @__PURE__ */ jsx(ModelSelectorSource, { children: option.source === "workers-ai" ? "Workers AI" : "Gateway" })
+						]
+					}, option.id))
+				}, group.providerLabel)),
+				/* @__PURE__ */ jsx(ModelSelectorEmpty, { children: emptyLabel })
+			] })] })
+		})]
+	});
+}
+function CloudflareTypedModelOption({ allowTypedModel, onSelectModel, options, selectedModelId }) {
+	const { query } = useModelSelectorContext();
+	const typedModelId = query.trim();
+	if (!allowTypedModel || !isCloudflareRunnableModelId(typedModelId) || typedModelId === selectedModelId || options.some((option) => option.id === typedModelId)) return null;
+	return /* @__PURE__ */ jsx(ModelSelectorGroup, {
+		label: "AI Gateway",
+		children: /* @__PURE__ */ jsxs(ModelSelectorItem, {
+			value: typedModelId,
+			onSelect: onSelectModel,
+			children: [
+				/* @__PURE__ */ jsx(ModelSelectorLogo, { provider: getCloudflareModelProvider(typedModelId) }),
+				/* @__PURE__ */ jsx(ModelSelectorName, { children: typedModelId }),
+				/* @__PURE__ */ jsx(ModelSelectorSource, { children: "Use" })
+			]
+		})
+	});
+}
+function ModelSelectorTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Trigger, { render: /* @__PURE__ */ jsxs(Button, {
+		variant: "outline",
+		color: "neutral",
+		className: cx("model-selector__trigger", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx("span", {
+			className: "model-selector__trigger-chevron",
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ jsx(ChevronDownIcon, {})
+		})]
+	}) });
+}
+function ModelSelectorContent({ children, title = "Model Selector", ...props }) {
+	return /* @__PURE__ */ jsxs(Dialog.Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, {}), /* @__PURE__ */ jsx(Dialog.Viewport, { children: /* @__PURE__ */ jsxs(Dialog.Popup, {
+		...props,
+		children: [/* @__PURE__ */ jsx(Dialog.Title, {
+			className: "model-selector__title sigvelo-visually-hidden",
+			children: title
+		}), children]
+	}) })] });
+}
+function ModelSelectorDialog({ className, children, ref, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cx("model-selector__dialog", className),
+		...props,
+		children
+	});
+}
+function ModelSelectorInput({ className, placeholder = "Search models…", ref, ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "model-selector__search",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "model-selector__search-icon",
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ jsx(SearchIcon, {})
+		}), /* @__PURE__ */ jsx(Autocomplete.Input, {
+			ref,
+			type: "search",
+			placeholder,
+			className: cx("model-selector__input", className),
+			autoFocus: true,
+			"aria-expanded": "true",
+			...props
+		})]
+	});
+}
+function ModelSelectorList({ className, children, ref, ...props }) {
+	const [contentElement, setContentElement] = React.useState(null);
+	return /* @__PURE__ */ jsxs(ScrollArea.Root, {
+		className: "model-selector__list",
+		children: [/* @__PURE__ */ jsx(ScrollArea.Viewport, {
+			ref,
+			className: cx("model-selector__list-viewport", className),
+			...props,
+			children: /* @__PURE__ */ jsx(ScrollArea.Content, {
+				ref: setContentElement,
+				className: "model-selector__list-content",
+				children: /* @__PURE__ */ jsx(ModelSelectorEmptyContainerContext.Provider, {
+					value: contentElement,
+					children: /* @__PURE__ */ jsx(Autocomplete.List, {
+						className: "model-selector__options",
+						children
+					})
+				})
+			})
+		}), /* @__PURE__ */ jsx(ScrollArea.Scrollbar, {
+			orientation: "vertical",
+			children: /* @__PURE__ */ jsx(ScrollArea.Thumb, {})
+		})]
+	});
+}
+function ModelSelectorGroup({ className, label, children, ref, ...props }) {
+	const { query, registerGroup } = useModelSelectorContext();
+	const groupId = React.useId();
+	const childArray = React.useMemo(() => React.Children.toArray(children).filter((child) => React.isValidElement(child)), [children]);
+	const items = React.useMemo(() => childArray.map((child) => modelSelectorItemSearchValue(child.props)), [childArray]);
+	React.useEffect(() => registerGroup(groupId, items), [
+		groupId,
+		items,
+		registerGroup
+	]);
+	const q = query.trim().toLowerCase();
+	const filtered = q ? childArray.filter((child) => {
+		const value = String(child.props.value ?? "").toLowerCase();
+		const keywords = String(child.props.keywords ?? "").toLowerCase();
+		return value.includes(q) || keywords.includes(q);
+	}) : childArray;
+	if (filtered.length === 0) return null;
+	return /* @__PURE__ */ jsxs(Autocomplete.Group, {
+		ref,
+		className: cx("model-selector__group", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(Autocomplete.GroupLabel, {
+			className: "model-selector__group-label",
+			children: label
+		}), filtered]
+	});
+}
+function ModelSelectorItem({ className, value, keywords, selected, onSelect, children, onClick, ref, disabled, ...props }) {
+	return /* @__PURE__ */ jsx(Autocomplete.Item, {
+		value: modelSelectorItemSearchValue({
+			keywords,
+			value
+		}),
+		disabled,
+		nativeButton: true,
+		"aria-selected": selected ? "true" : "false",
+		"data-selected": selected ? "" : void 0,
+		tabIndex: -1,
+		onClick: () => onSelect?.(value),
+		render: /* @__PURE__ */ jsx(Dialog.Close, {
+			disabled,
+			render: /* @__PURE__ */ jsx(Button, {
+				ref,
+				variant: "ghost",
+				color: "neutral",
+				disabled,
+				className: cx("model-selector__item", className),
+				onClick,
+				...props,
+				children
+			})
+		})
+	});
+}
+function ModelSelectorEmpty({ className, children = "No models found", ref, ...props }) {
+	const container = React.useContext(ModelSelectorEmptyContainerContext);
+	const empty = /* @__PURE__ */ jsx(Autocomplete.Empty, { children: /* @__PURE__ */ jsx(EmptyState, {
+		ref,
+		className: cx("model-selector__empty", className),
+		...props,
+		children
+	}) });
+	if (container === null) return null;
+	return container ? createPortal(empty, container) : empty;
+}
+function ModelSelectorSeparator({ className, ref, ...props }) {
+	return /* @__PURE__ */ jsx(Separator, {
+		ref,
+		className: cx("model-selector__separator", className),
+		...props
+	});
+}
+function ModelSelectorLogo({ className, provider, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: cx("model-selector__logo", className),
+		children: /* @__PURE__ */ jsx(ProviderLogo, {
+			provider,
+			...props
+		})
+	});
+}
+function ModelSelectorLogoGroup({ className, children, ref, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cx("model-selector__logo-group", className),
+		...props,
+		children
+	});
+}
+function ModelSelectorName({ className, children, ref, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		ref,
+		className: cx("model-selector__name", "sigvelo-truncate", "sigvelo-truncate-grow", className),
+		...props,
+		children
+	});
+}
+/**
+* Where a model comes from — "Workers AI", "Gateway" — shown at the end of its
+* row. This was a `<kbd>` named `ModelSelectorSource`, which announced
+* "Workers AI" to a screen reader as keyboard input and offered a shortcut
+* that does not exist.
+*/
+function ModelSelectorSource({ className, children, ref, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		ref,
+		className: cx("model-selector__source", className),
+		...props,
+		children
+	});
+}
+//#endregion
 export { CloudflareModelSelector, ModelSelector, ModelSelectorContent, ModelSelectorDialog, ModelSelectorEmpty, ModelSelectorGroup, ModelSelectorInput, ModelSelectorItem, ModelSelectorList, ModelSelectorLogo, ModelSelectorLogoGroup, ModelSelectorName, ModelSelectorSeparator, ModelSelectorSource, ModelSelectorTrigger, formatCloudflareModelProvider, getCloudflareModelProvider, isCloudflareRunnableModelId, listCloudflareModelSelectorOptions, normalizeCloudflareModelSelectorModels, readCloudflareModelId };

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

@@ -1,4 +1,4 @@
-import { O as PromptInputCommandDefinition } from "../../PromptInput-DOyee1kM.js";
+import { D as PromptInputCommandDefinition } from "../../PromptInput-BRX7FhjH.js";
 import { MCPServersState } from "agents";
 import { SkillDescriptor } from "agents/skills";
 

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

@@ -1,5 +1,5 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { n as clamp } from "../../format-CmopcfqJ.js";
+import { n as clamp } from "../../format-DB2mX9DA.js";
 import { Progress } from "../foundations/Progress.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

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

@@ -1,25 +1,17 @@
 import { i as AgentMessageRenderPartContext } from "../../AgentMessageParts-C7L-Mv9U.js";
-import { ct as PromptInputMessage } from "../../PromptInput-DOyee1kM.js";
-import { r as AgentChatProps } from "../../AgentChat-CV-GuYA6.js";
-import { a as useOptionalAgentToolRuns, i as AgentToolRunsProviderProps, n as AgentToolEventsValue, o as useSourceScopedAgentToolEvents, r as AgentToolRunsProvider, t as AgentToolEventSource } from "../../AgentToolRunsContext-BCVqCtJ1.js";
-import { n as BrowserLiveViewProps, t as BrowserLiveView } from "../../BrowserLiveView-tJTWkoyu.js";
-import { n as BrowserReplayProps, t as BrowserReplay } from "../../BrowserReplay-B0BQZr-N.js";
+import { K as PromptInputMessage } from "../../PromptInput-BRX7FhjH.js";
+import { r as AgentChatProps } from "../../AgentChat-CVO7xyLC.js";
+import { n as AgentToolEventsValue } from "../../AgentToolRunsContext-BCVqCtJ1.js";
 import { o as UseSessionCompactionResult } from "../../SessionCompaction-CmTJFpzj.js";
-import { x as isThinkChatActivityPart } from "../../ThinkChatToolParts-D4qcnnxt.js";
-import { u as describeThinkChatActivityPart } from "../../ThinkChatActivitySummary-teRjrPxW.js";
-import { a as ThinkChatToolRenderers, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as renderThinkChatActivityPart, t as ThinkChatActivity } from "../../ThinkChatActivity-CgqpROz_.js";
+import { o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, t as ThinkChatActivity } from "../../ThinkChatActivity-Dkmm2pIj.js";
 import { i as ThinkChatValue } from "../../ThinkChatContext-COIgzkYp.js";
-import { n as ThinkRecoveryNoticeProps, t as ThinkRecoveryNotice } from "../../ThinkRecoveryNotice-DGWr94rk.js";
-import { d as inferWorkspaceLanguage, i as WorkspaceFileState } from "../../WorkspaceFile-C8Riev9j.js";
-import { a as WorkspaceSource, c as workspaceBinaryFileQueryOptions, d as workspaceDirectoryQueryPrefix, f as workspaceFileAssetQueryOptions, g as workspaceTextFileQueryOptions, h as workspaceQueryKey, i as WorkspaceQueryKey, l as workspaceDirectoryQueryKey, m as workspaceInfoQueryOptions, n as WorkspaceFileReadTarget, o as WorkspaceState, p as workspaceFileStatQueryOptions, r as WorkspaceInfo, s as useWorkspace, t as UseWorkspaceOptions, u as workspaceDirectoryQueryOptions } from "../../Workspace-EhvvlHOB.js";
-import { n as WorkspaceExplorerProps, t as WorkspaceExplorer } from "../../WorkspaceExplorer-DygQnEyi.js";
+import { t as ThinkRecoveryNotice } from "../../ThinkRecoveryNotice-DGWr94rk.js";
 import * as React from "react";
 import { UIMessage } from "ai";
 import { UseAgentOptions } from "agents/react";
 import { DataTag, UndefinedInitialDataOptions } from "@tanstack/react-query";
 import { PendingApproval, Think } from "@cloudflare/think";
 import { AgentStub } from "agents/client";
-import { UseVoiceInputReturn } from "@cloudflare/voice/react";
 
 //#region src/components/agents-sdk/ThinkChat.d.ts
 type ThinkPendingExecutionApprovalsQueryKey = readonly ["think", sourceKey: string, "pending-approvals"];
@@ -63,90 +55,20 @@ interface ThinkChatDraft<MessageT extends UIMessage = UIMessage> {
   /** Set while the app is creating the conversation, so the composer reads busy. */
   status?: AgentChatProps<MessageT>["status"];
 }
-interface ThinkChatMessagesProps<MessageT extends UIMessage = UIMessage> extends ThinkChatActivityRendererOptions<MessageT> {
-  className?: string;
-  /**
-   * Renders without a chat provider, for the first turn of a conversation that
-   * does not exist yet. Everything else here behaves as it does on a live thread.
-   */
-  draft?: ThinkChatDraft<MessageT>;
-  /** Disable the composer (e.g. while the agent is unreachable). */
-  disabled?: boolean;
-  /** Hide the composer while retaining the normal Think transcript rendering. */
-  showComposer?: AgentChatProps<MessageT>["showComposer"];
-  /** Shown in place of the list while there are no messages. */
-  emptyState?: React.ReactNode;
-  /** Welcoming first-turn layout with the live composer centered above starter actions. */
-  startScreen?: AgentChatProps<MessageT>["startScreen"];
-  /** Extra controls rendered inside the composer, next to the send button. */
-  composerTools?: React.ReactNode;
-  /** Host-owned slash-command catalog and selection policy. */
-  slashCommands?: AgentChatProps<MessageT>["slashCommands"];
-  /** App compaction callable behind the built-in `/compact` slash entry. */
-  onCompact?: AgentChatProps<MessageT>["onCompact"];
-  /** Controlled MCP catalog revealed by `@`; selections become composer references. */
-  mentionCommands?: AgentChatProps<MessageT>["mentionCommands"];
-  /** Controlled folder or working-context picker in the composer footer. */
-  contextSelector?: AgentChatProps<MessageT>["contextSelector"];
-  /** Extra controls rendered at the trailing edge, before dictation and submit. */
-  composerEndTools?: React.ReactNode;
-  /** Whole upstream `useVoiceInput` result for the built-in microphone recorder. */
-  voiceInput?: UseVoiceInputReturn;
-  /** Host prerequisite run before the built-in recorder calls `voiceInput.start()`. */
-  beforeVoiceStart?: AgentChatProps<MessageT>["beforeVoiceStart"];
-  /** Optional product state rendered in the PromptInput header, such as an Activity. */
-  composerHeader?: AgentChatProps<MessageT>["composerHeader"];
-  /** Persistent context (e.g. the Goal banner) in the tray above the composer. */
-  composerTray?: AgentChatProps<MessageT>["composerTray"];
-  /** Called when a submission is queued behind a busy turn; see AgentChat. */
-  onPromptQueued?: AgentChatProps<MessageT>["onPromptQueued"];
-  /** Extra rows rendered in the built-in plus menu after files. */
-  composerAddMenuItems?: AgentChatProps<MessageT>["composerAddMenuItems"];
-  /** Composer placeholder text. */
-  placeholder?: string;
-  /** Rendered after each message (e.g. per-message actions). */
-  renderMessageAfter?: AgentChatProps<MessageT>["renderMessageAfter"];
-  /** Per-message policy for AgentChat's built-in assistant copy/retry toolbar. */
-  showAssistantActions?: AgentChatProps<MessageT>["showAssistantActions"];
-  /**
-   * Durable backend edit/resend operation. Think does not synchronize
-   * `setMessages`, so wire this to an agent callable that creates the branch.
-   */
-  onEditAndResend?: AgentChatProps<MessageT>["onEditAndResend"];
+type ThinkChatManagedAgentChatProp = "messages" | "onApprovalResponse" | "onRegenerate" | "onStop" | "onSubmit" | "status";
+/**
+ * The AgentChat composition surface, minus the live values ThinkChat supplies
+ * from `useAgentChat`. Think-specific activity and draft/session inputs extend
+ * that owner instead of mirroring every AgentChat prop here.
+ */
+type ThinkChatMessagesProps<MessageT extends UIMessage = UIMessage> = Omit<AgentChatProps<MessageT>, ThinkChatManagedAgentChatProp> & ThinkChatActivityRendererOptions<MessageT> & {
   /**
-   * Overrides the built-in connection notice (derived from the hook's
-   * `isRecovering`/`connectionError`) shown between transcript and composer.
+   * Renders without a chat provider, for the first turn of a conversation
+   * that does not exist yet.
    */
-  notice?: AgentChatProps<MessageT>["notice"];
-  /** Whole `useSessionCompaction` result for built-in progress and error notices. */
+  draft?: ThinkChatDraft<MessageT>; /** Whole `useSessionCompaction` result for built-in progress and error notices. */
   sessionCompaction?: UseSessionCompactionResult;
-  /**
-   * Extends the built-in Think activity renderer. Returning `undefined` keeps
-   * the built-in result; `defaultRender()` renders that same result on demand.
-   * Return `null` only when the part should be intentionally hidden.
-   */
-  renderPart?: AgentChatProps<MessageT>["renderPart"];
-  /** Whole upstream Think stub. `ThinkChat.Root` wires `agent.stub` automatically. */
-  thinkStub?: AgentStub<Think>;
-  /**
-   * Disable transcript approval scanning, automatic responses, cards, and
-   * composer controls. Set the matching prop on `ThinkChat.Root` to also skip
-   * durable pending-approval discovery; `ThinkFullApp` wires both from here.
-   */
-  approvalsEnabled?: AgentChatProps<MessageT>["approvalsEnabled"];
-  /** Parent-owned Ask/Bypass policy; omit to keep AgentChat's session-local mode. */
-  permissionModeControl?: AgentChatProps<MessageT>["permissionModeControl"];
-  /** Called after a Think approve/reject RPC settles. Root uses this to refresh approvals. */
-  onExecutionSettled?: AgentChatProps<MessageT>["onExecutionSettled"];
-  /** Think durable-pause approvals from `pendingApprovals()`. */
-  pendingApprovals?: AgentChatProps<MessageT>["pendingApprovals"];
-  /**
-   * Shows a Context ring in the composer footer — how much of the model's
-   * window the conversation occupies, from `metadata.usage` on the newest
-   * message that reports it.
-   */
-  contextWindow?: AgentChatProps<MessageT>["contextWindow"];
-}
+};
 /** Shared pending-approval options for components and TanStack Router loaders. */
 declare function thinkPendingExecutionApprovalsQueryOptions(stub: AgentStub<Think>, sourceKey: string): ThinkPendingExecutionApprovalsQueryOptions;
 declare function useThinkPendingExecutionApprovals(stub: AgentStub<Think>, sourceKey: string, refreshSignal?: unknown, enabled?: boolean): {
@@ -202,6 +124,7 @@ declare function ThinkChatRoot<State = unknown, MessageT extends UIMessage = UIM
 declare function ThinkChatMessages<State = unknown, MessageT extends UIMessage = UIMessage>({
   composerHeader,
   draft,
+  loading,
   renderPart,
   excludeTools,
   renderAgentToolRunLink,
@@ -253,4 +176,4 @@ declare const ThinkChat: {
   createActivityRenderer: typeof createThinkChatActivityRenderer;
 };
 //#endregion
-export { type AgentToolEventSource, type AgentToolEventsValue, AgentToolRunsProvider, type AgentToolRunsProviderProps, BrowserLiveView, type BrowserLiveViewProps, BrowserReplay, type BrowserReplayProps, ThinkChat, ThinkChatActivity, type ThinkChatActivityProps, type ThinkChatActivityRendererOptions, ThinkChatDraft, ThinkChatMessages, ThinkChatMessagesProps, ThinkChatProvider, ThinkChatProviderProps, ThinkChatRoot, ThinkChatRootProps, type ThinkChatToolRenderer, type ThinkChatToolRenderers, ThinkPendingExecutionApprovalsQueryKey, ThinkPendingExecutionApprovalsQueryOptions, ThinkRecoveryNotice, type ThinkRecoveryNoticeProps, type UseWorkspaceOptions, WorkspaceExplorer, type WorkspaceExplorerProps, type WorkspaceFileReadTarget, type WorkspaceFileState, type WorkspaceInfo, type WorkspaceQueryKey, type WorkspaceSource, type WorkspaceState, createThinkChatActivityRenderer, describeThinkChatActivityPart, inferWorkspaceLanguage, isThinkChatActivityPart, renderThinkChatActivityPart, thinkPendingExecutionApprovalsQueryOptions, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents, useThinkChat, useThinkPendingExecutionApprovals, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };
+export { ThinkChat, ThinkChatDraft, ThinkChatMessages, ThinkChatMessagesProps, ThinkChatProvider, ThinkChatProviderProps, ThinkChatRoot, ThinkChatRootProps, ThinkPendingExecutionApprovalsQueryKey, ThinkPendingExecutionApprovalsQueryOptions, thinkPendingExecutionApprovalsQueryOptions, useThinkChat, useThinkPendingExecutionApprovals };