@mcp-b/react-components 0.35.0 → 0.37.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-DtBxWqRn.js";
+import { t as cx } from "../../class-names-BiMDVpUo.js";
+import { G as SearchIcon, f as ChevronDownIcon } from "../../icons-B4mGvCvc.js";
+import { Button } from "../foundations/Button.js";
+import { Autocomplete } from "../foundations/Autocomplete.js";
+import { Dialog } from "../foundations/Dialog.js";
+import { o as titleCase } from "../../format-DB2mX9DA.js";
+import { Separator } from "../foundations/Separator.js";
+import { ScrollArea } from "../foundations/ScrollArea.js";
+import { t as ProviderLogo } from "../../provider-logos-zjZycgV6.js";
+import { EmptyState } from "../foundations/EmptyState.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/PromptInputApproval.js

@@ -1,6 +1,6 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { ThinkExecutionApproval, ThinkPendingApproval, getPausedExecution } from "./ThinkPendingApproval.js";
 import { ToolApproval } from "../ai-sdk/ToolApproval.js";
+import { ThinkExecutionApproval, ThinkPendingApproval, getPausedExecution } from "./ThinkPendingApproval.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { isToolUIPart } from "ai";

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/PromptInputCommands.js

@@ -1,4 +1,4 @@
-import { c as BoxIcon, j as McpIcon } from "../../icons-B1Qw05te.js";
+import { c as BoxIcon, j as McpIcon } from "../../icons-B4mGvCvc.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/agents-sdk/PromptInputCommands.tsx
 /** Project whole upstream Agents MCP state into composer mention commands. */

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

@@ -1,5 +1,5 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { J as SpinnerIcon, X as StopIcon, d as CheckIcon, tt as WarningIcon } from "../../icons-B1Qw05te.js";
+import { J as SpinnerIcon, X as StopIcon, d as CheckIcon, tt as WarningIcon } from "../../icons-B4mGvCvc.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/agents-sdk/SubagentRunIndicator.tsx

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

@@ -1,8 +1,8 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { l as BrainIcon } from "../../icons-B1Qw05te.js";
-import { t as NavigationLink } from "../../navigation-link-kqMa81v5.js";
+import { l as BrainIcon } from "../../icons-B4mGvCvc.js";
 import { buttonVariants } from "../foundations/Button.js";
 import { Tooltip } from "../foundations/Tooltip.js";
+import { t as NavigationLink } from "../../navigation-link-kqMa81v5.js";
 import { SubagentRunIndicator, getSubagentRunName, getSubagentRunTooltip } from "./SubagentRunIndicator.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";