@mcp-b/react-components 0.46.4 → 0.46.6

package/dist/{Workspace-jdVZ9S0a.d.ts → Workspace-DZusrEeP.d.ts}

@@ -1,13 +1,12 @@
 import { a as WorkspaceMediaInfo, i as WorkspaceFileState, r as WorkspaceFileAssetResolver, t as WorkspaceFileAsset } from "./WorkspaceFile-Dq-GC0_T.js";
 import { DataTag, QueryKey, UnusedSkipTokenOptions } from "@tanstack/react-query";
-import { WorkspaceLike } from "@cloudflare/think";
-import { FileInfo, Workspace } from "@cloudflare/shell";
+import { FileInfo, Workspace, WorkspaceFsLike } from "@cloudflare/shell";
 
 //#region src/components/agents-sdk/Workspace.d.ts
 /** Workspace summary, as returned by `Workspace.getWorkspaceInfo()` upstream. */
 type WorkspaceInfo = Awaited<ReturnType<Workspace["getWorkspaceInfo"]>>;
-/** Whole upstream workspace shapes, accepted without narrowing or mirroring. */
-type WorkspaceSource = Workspace | WorkspaceLike;
+/** Upstream's proxy-safe filesystem contract plus its workspace summary. */
+type WorkspaceSource = WorkspaceFsLike & Pick<Workspace, "getWorkspaceInfo">;
 interface UseWorkspaceOptions {
   /** Must be referentially stable (memoize in the app). */
   source: WorkspaceSource;
@@ -54,7 +53,7 @@ interface WorkspaceState {
   loadingPaths: ReadonlySet<string>;
   /** Root/directory listing failure. Per-file read errors live on the file state. */
   error: string | null;
-  /** Workspace summary, when the source provides `getWorkspaceInfo`. */
+  /** Workspace summary. */
   info: WorkspaceInfo | null;
   /** Reload the root, every expanded directory, and the selected file. */
   refresh: () => void;
@@ -99,7 +98,7 @@ declare function workspaceFileVersion(target: WorkspaceFileReadTarget): {
 type WorkspaceFileVersion = ReturnType<typeof workspaceFileVersion>;
 type WorkspaceDirectoryQueryOptions = WorkspaceQueryOptions<readonly FileInfo[], WorkspaceDirectoryQueryKey>;
 type WorkspaceInfoQueryKey = readonly [...WorkspaceQueryKey, "info"];
-type WorkspaceInfoQueryOptions = WorkspaceQueryOptions<WorkspaceInfo | null, WorkspaceInfoQueryKey>;
+type WorkspaceInfoQueryOptions = WorkspaceQueryOptions<WorkspaceInfo, WorkspaceInfoQueryKey>;
 type WorkspaceFileStatQueryKey = readonly [...WorkspaceFileQueryKey, "stat"];
 type WorkspaceFileStatQueryOptions = WorkspaceQueryOptions<WorkspaceFileReadTarget, WorkspaceFileStatQueryKey>;
 type WorkspaceFileAssetQueryKey = readonly [...WorkspaceFileQueryKey, "asset", WorkspaceFileVersion];

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

@@ -5,7 +5,7 @@ import { n as McpPluginCatalogProps } from "../../McpPluginCatalog-3qWu8oK1.js";
 import { ThinkChatMessagesProps } from "./ThinkChat.js";
 import { ThinkThreadStatusSummary } from "./ThinkThreadPicker.js";
 import { r as WorkspaceFileAssetResolver } from "../../WorkspaceFile-Dq-GC0_T.js";
-import { v as WorkspaceSource } from "../../Workspace-jdVZ9S0a.js";
+import { v as WorkspaceSource } from "../../Workspace-DZusrEeP.js";
 import { t as ThinkAgent } from "../../think-agent-Cip5KAPj.js";
 import * as React from "react";
 import { UIMessage } from "ai";

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

@@ -2,7 +2,7 @@ import { ThinkRoutine } from "./ThinkRoutine.js";
 import { ThinkChatDraft } from "./ThinkChat.js";
 import { ThinkThreadItem } from "./ThinkThreadPicker.js";
 import { ThinkFullAppAgent, ThinkFullAppConversation, ThinkFullAppProps } from "./ThinkFullApp.js";
-import { SetupChecklistEntry } from "../general-purpose/SetupChecklist.js";
+import { SetupChecklistGroupProps } from "../general-purpose/SetupChecklist.js";
 import * as React from "react";
 import { UIMessage } from "ai";
 import { AgentToolRunState } from "agents/agent-tools";
@@ -59,7 +59,7 @@ interface ThinkSidepanelConnection {
   description?: string;
   onSelect: () => void;
 }
-interface ThinkSidepanelStart {
+interface ThinkSidepanelStart<Id extends string = string> {
   onSubmit: ThinkChatDraft["onSubmit"];
   suggestions?: readonly {
     label: string;
@@ -72,10 +72,7 @@ interface ThinkSidepanelStart {
   discord?: ThinkSidepanelConnection;
   onAttachFolder?: () => void;
   attachFolderBusy?: boolean;
-  personalization?: {
-    entries: readonly SetupChecklistEntry[];
-    onSelect: (id: string) => void;
-  };
+  personalization?: Pick<SetupChecklistGroupProps<Id>, "entries" | "onSelect">;
 }
 interface ThinkSidepanelSchedules<TRoutine extends ThinkRoutine = ThinkRoutine> {
   routines: readonly TRoutine[];
@@ -118,13 +115,10 @@ interface ThinkSidepanelIdentity {
   onBind?: () => void | Promise<void>;
   onUnbind?: () => void | Promise<void>;
 }
-interface ThinkSidepanelProps<AgentT extends ThinkFullAppAgent<State>, State = unknown, MessageT extends UIMessage = UIMessage, TRoutine extends ThinkRoutine = ThinkRoutine> extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+interface ThinkSidepanelProps<AgentT extends ThinkFullAppAgent<State>, State = unknown, MessageT extends UIMessage = UIMessage, TRoutine extends ThinkRoutine = ThinkRoutine, SetupId extends string = string> extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
   sourceKey: string;
   view: ThinkSidepanelView;
-  thread?: {
-    id: string;
-    title: string;
-  };
+  thread?: ThinkThreadItem;
   threads?: readonly ThinkThreadItem[];
   conversation?: ThinkFullAppConversation<AgentT, State, MessageT>;
   workspace?: ThinkFullAppProps<AgentT, State, MessageT>["workspace"];
@@ -147,7 +141,7 @@ interface ThinkSidepanelProps<AgentT extends ThinkFullAppAgent<State>, State = u
   status?: ThinkSidepanelStatus;
   connectingLabel?: string;
   modelSetup?: ThinkSidepanelModelSetup;
-  start?: ThinkSidepanelStart;
+  start?: ThinkSidepanelStart<SetupId>;
   schedules?: ThinkSidepanelSchedules<TRoutine>;
   agentRun?: ThinkSidepanelAgentRun;
   /** Host-owned live view. The side panel only frames it. */
@@ -158,7 +152,7 @@ interface ThinkSidepanelProps<AgentT extends ThinkFullAppAgent<State>, State = u
  * conversation plus workbench. Hosts hydrate conversation, workspace,
  * plugins, and callables. Storybook is the place to iterate the chrome.
  */
-declare function ThinkSidepanel<AgentT extends ThinkFullAppAgent<State>, State = unknown, MessageT extends UIMessage = UIMessage, TRoutine extends ThinkRoutine = ThinkRoutine>({
+declare function ThinkSidepanel<AgentT extends ThinkFullAppAgent<State>, State = unknown, MessageT extends UIMessage = UIMessage, TRoutine extends ThinkRoutine = ThinkRoutine, SetupId extends string = string>({
   agentRun,
   appBarLeading,
   brand,
@@ -186,6 +180,6 @@ declare function ThinkSidepanel<AgentT extends ThinkFullAppAgent<State>, State =
   view,
   workspace,
   ...props
-}: ThinkSidepanelProps<AgentT, State, MessageT, TRoutine>): React.JSX.Element;
+}: ThinkSidepanelProps<AgentT, State, MessageT, TRoutine, SetupId>): React.JSX.Element;
 //#endregion
 export { ThinkSidepanel, ThinkSidepanelAgentRun, ThinkSidepanelCompanion, ThinkSidepanelConnection, ThinkSidepanelDestination, ThinkSidepanelFollow, ThinkSidepanelIdentity, ThinkSidepanelModelSetup, ThinkSidepanelPasskeyVault, ThinkSidepanelProps, ThinkSidepanelSchedules, ThinkSidepanelStart, ThinkSidepanelStatus, ThinkSidepanelView };

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

@@ -1,2 +1,2 @@
-import { A as workspaceQueryKey, C as workspaceBinaryFileQueryOptions, D as workspaceFileAssetQueryOptions, E as workspaceDirectoryQueryPrefix, O as workspaceFileStatQueryOptions, S as useWorkspace, T as workspaceDirectoryQueryOptions, _ as WorkspaceResolvedAsset, a as WorkspaceDirectoryQueryOptions, b as WorkspaceTextFileQueryKey, c as WorkspaceFileQueryKey, d as WorkspaceFileStatQueryOptions, f as WorkspaceFileVersion, g as WorkspaceQueryKey, h as WorkspaceInfoQueryOptions, i as WorkspaceDirectoryQueryKey, j as workspaceTextFileQueryOptions, k as workspaceInfoQueryOptions, l as WorkspaceFileReadTarget, m as WorkspaceInfoQueryKey, n as WorkspaceBinaryFileQueryKey, o as WorkspaceFileAssetQueryKey, p as WorkspaceInfo, r as WorkspaceBinaryFileQueryOptions, s as WorkspaceFileAssetQueryOptions, t as UseWorkspaceOptions, u as WorkspaceFileStatQueryKey, v as WorkspaceSource, w as workspaceDirectoryQueryKey, x as WorkspaceTextFileQueryOptions, y as WorkspaceState } from "../../Workspace-jdVZ9S0a.js";
+import { A as workspaceQueryKey, C as workspaceBinaryFileQueryOptions, D as workspaceFileAssetQueryOptions, E as workspaceDirectoryQueryPrefix, O as workspaceFileStatQueryOptions, S as useWorkspace, T as workspaceDirectoryQueryOptions, _ as WorkspaceResolvedAsset, a as WorkspaceDirectoryQueryOptions, b as WorkspaceTextFileQueryKey, c as WorkspaceFileQueryKey, d as WorkspaceFileStatQueryOptions, f as WorkspaceFileVersion, g as WorkspaceQueryKey, h as WorkspaceInfoQueryOptions, i as WorkspaceDirectoryQueryKey, j as workspaceTextFileQueryOptions, k as workspaceInfoQueryOptions, l as WorkspaceFileReadTarget, m as WorkspaceInfoQueryKey, n as WorkspaceBinaryFileQueryKey, o as WorkspaceFileAssetQueryKey, p as WorkspaceInfo, r as WorkspaceBinaryFileQueryOptions, s as WorkspaceFileAssetQueryOptions, t as UseWorkspaceOptions, u as WorkspaceFileStatQueryKey, v as WorkspaceSource, w as workspaceDirectoryQueryKey, x as WorkspaceTextFileQueryOptions, y as WorkspaceState } from "../../Workspace-DZusrEeP.js";
 export { UseWorkspaceOptions, WorkspaceBinaryFileQueryKey, WorkspaceBinaryFileQueryOptions, WorkspaceDirectoryQueryKey, WorkspaceDirectoryQueryOptions, WorkspaceFileAssetQueryKey, WorkspaceFileAssetQueryOptions, WorkspaceFileQueryKey, WorkspaceFileReadTarget, WorkspaceFileStatQueryKey, WorkspaceFileStatQueryOptions, WorkspaceFileVersion, WorkspaceInfo, WorkspaceInfoQueryKey, WorkspaceInfoQueryOptions, WorkspaceQueryKey, WorkspaceResolvedAsset, WorkspaceSource, WorkspaceState, WorkspaceTextFileQueryKey, WorkspaceTextFileQueryOptions, useWorkspace, workspaceBinaryFileQueryOptions, workspaceDirectoryQueryKey, workspaceDirectoryQueryOptions, workspaceDirectoryQueryPrefix, workspaceFileAssetQueryOptions, workspaceFileStatQueryOptions, workspaceInfoQueryOptions, workspaceQueryKey, workspaceTextFileQueryOptions };

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

@@ -121,7 +121,6 @@ function workspaceInfoQueryOptions(source, sourceKey, root) {
 	return queryOptions({
 		queryKey: [...workspaceQueryKey(sourceKey, root), "info"],
 		queryFn: async ({ signal }) => {
-			if (!("getWorkspaceInfo" in source) || typeof source.getWorkspaceInfo !== "function") return null;
 			const info = await source.getWorkspaceInfo();
 			throwIfAborted(signal);
 			return info;
@@ -269,10 +268,7 @@ function useWorkspace({ source, sourceKey, root = "/", selectedPath, onSelectedP
 	const normalizedMaxInlineAssetBytes = Number.isFinite(maxInlineAssetBytes) && maxInlineAssetBytes >= 0 ? maxInlineAssetBytes : DEFAULT_MAX_INLINE_ASSET_BYTES;
 	const directoryPaths = React.useMemo(() => [.../* @__PURE__ */ new Set([root, ...expandedPaths])].sort(), [expandedPaths, root]);
 	const directoryQueries = useQueries({ queries: directoryPaths.map((path) => workspaceDirectoryQueryOptions(source, sourceKey, root, path)) });
-	const infoQuery = useQuery({
-		...workspaceInfoQueryOptions(source, sourceKey, root),
-		enabled: "getWorkspaceInfo" in source && typeof source.getWorkspaceInfo === "function"
-	});
+	const infoQuery = useQuery(workspaceInfoQueryOptions(source, sourceKey, root));
 	const statQuery = useQuery({
 		...workspaceFileStatQueryOptions(source, sourceKey, root, selectedPath ?? root),
 		enabled: selectedPath !== null
@@ -406,7 +402,7 @@ function useWorkspace({ source, sourceKey, root = "/", selectedPath, onSelectedP
 					return false;
 				}
 			}));
-			if ("getWorkspaceInfo" in source && typeof source.getWorkspaceInfo === "function") await queryClient.fetchQuery({
+			await queryClient.fetchQuery({
 				...workspaceInfoQueryOptions(source, sourceKey, root),
 				staleTime: 0
 			}).catch(() => void 0);

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

@@ -1,4 +1,4 @@
-import { y as WorkspaceState } from "../../Workspace-jdVZ9S0a.js";
+import { y as WorkspaceState } from "../../Workspace-DZusrEeP.js";
 import * as React from "react";
 
 //#region src/components/agents-sdk/WorkspaceBrowser.d.ts

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

@@ -1,5 +1,5 @@
 import { l as WorkspaceNavigationAdapter } from "../../WorkspaceLink-Bh9-Jo1r.js";
-import { y as WorkspaceState } from "../../Workspace-jdVZ9S0a.js";
+import { y as WorkspaceState } from "../../Workspace-DZusrEeP.js";
 import * as React from "react";
 
 //#region src/components/agents-sdk/WorkspaceExplorer.d.ts

package/dist/components/extension/CodexModelSelector.d.ts

@@ -11,8 +11,8 @@ interface CodexModelSelectorProps<ModelT extends CodexModel = CodexModel> {
   readonly models: readonly ModelT[];
   /** Current Codex catalog id. Use the selected entry's `model` field for inference. */
   readonly selectedModelId?: ModelId<ModelT> | null;
-  /** Called only with an id from the supplied Codex catalog. */
-  readonly onSelectModel: (modelId: ModelId<ModelT>) => void;
+  /** Called only with an entry from the supplied Codex catalog. */
+  readonly onSelectModel: (model: ModelT) => void;
   /** Current reasoning effort advertised by the selected model. */
   readonly selectedEffortId?: ReasoningEffort<ModelT> | null;
   readonly onSelectEffort?: (effortId: ReasoningEffort<ModelT>) => void;

package/dist/components/extension/CodexModelSelector.js

@@ -28,7 +28,7 @@ function CodexModelSelector({ models, selectedModelId = null, onSelectModel, sel
 	function handleSelectModel(modelId) {
 		const model = visibleModels.find((option) => option.id === modelId);
 		if (!model) return;
-		onSelectModel(model.id);
+		onSelectModel(model);
 	}
 	function handleSelectEffort(effortId) {
 		const effort = effortOptions.find((option) => option.reasoningEffort === effortId);

package/dist/components/extension/ConversationTabPicker.d.ts

@@ -8,11 +8,11 @@ interface ConversationTabPickerItem {
   url?: string;
   iconSrc?: string;
 }
-interface ConversationTabPickerProps {
+interface ConversationTabPickerProps<Tab extends ConversationTabPickerItem = ConversationTabPickerItem> {
   /** Browser-enriched tabs already scoped to the current conversation. */
-  tabs: readonly ConversationTabPickerItem[];
+  tabs: readonly Tab[];
   /** Host-owned activation, such as Chrome tab/window focus. */
-  onSelect: (id: ConversationTabId) => void | Promise<void>;
+  onSelect: (tab: Tab) => void | Promise<void>;
   /** Maximum avatars shown in the collapsed trigger. */
   maxVisible?: number;
   groupLabel?: React.ReactNode;
@@ -23,9 +23,9 @@ interface ConversationTabPickerProps {
  * The browser adapter owns tab lookup and activation. This component owns URL
  * labels, favicon fallbacks, menu state, and async activation feedback.
  */
-declare function ConversationTabPicker({
+declare function ConversationTabPicker<Tab extends ConversationTabPickerItem>({
   tabs,
   ...props
-}: ConversationTabPickerProps): React.JSX.Element | null;
+}: ConversationTabPickerProps<Tab>): React.JSX.Element | null;
 //#endregion
 export { ConversationTabId, ConversationTabPicker, ConversationTabPickerItem, ConversationTabPickerProps };

package/dist/components/extension/ConversationTabPicker.js

@@ -54,11 +54,11 @@ function ConversationTabPickerMenu({ tabs, onSelect, maxVisible = 3, groupLabel
 	const pending = action && "pending" in action ? action.pending : null;
 	const error = action && "error" in action ? action.error : null;
 	const label = `${tabs.length} controlled ${tabs.length === 1 ? "tab" : "tabs"}`;
-	async function selectTab(id) {
+	async function selectTab(tab) {
 		if (pending !== null) return;
-		setAction({ pending: id });
+		setAction({ pending: tab.id });
 		try {
-			await onSelect(id);
+			await onSelect(tab);
 			setAction(null);
 			setOpen(false);
 		} catch (cause) {
@@ -98,7 +98,7 @@ function ConversationTabPickerMenu({ tabs, onSelect, maxVisible = 3, groupLabel
 					closeOnClick: false,
 					"data-tab-id": tab.id,
 					disabled: pending !== null,
-					onClick: () => void selectTab(tab.id),
+					onClick: () => void selectTab(tab),
 					children: [/* @__PURE__ */ jsx(TabAvatar, { tab }), /* @__PURE__ */ jsxs("span", {
 						className: "conversation-tab-picker__identity sigvelo-truncate-grow",
 						children: [/* @__PURE__ */ jsx("span", {

package/dist/components/general-purpose/SettingsFormDialog.d.ts

@@ -17,32 +17,32 @@ interface SettingsFormField {
   required?: boolean;
   readOnly?: boolean;
 }
-type SettingsFormValues = Readonly<Record<string, string>>;
-interface SettingsFormDialogProps {
+type SettingsFormValues<Fields extends readonly SettingsFormField[]> = Readonly<Record<Fields[number]["name"], string>>;
+interface SettingsFormDialogProps<Fields extends readonly SettingsFormField[]> {
   open: boolean;
   onOpenChange: (open: boolean) => void;
   title: React.ReactNode;
   description: React.ReactNode;
-  fields: readonly SettingsFormField[];
-  initialValues?: Readonly<Record<string, string | undefined>>;
+  fields: Fields;
+  initialValues?: Readonly<Partial<Record<Fields[number]["name"], string | undefined>>>;
   submitLabel: string;
   submittingLabel?: string;
   removeLabel?: string;
   removingLabel?: string;
   externalError?: string;
-  onSubmit: (values: SettingsFormValues) => void | Promise<void>;
+  onSubmit: (values: SettingsFormValues<Fields>) => void | Promise<void>;
   onRemove?: () => void | Promise<void>;
 }
 /**
  * Uncontrolled, metadata-driven settings dialog with native validation and
  * shared async submit/remove feedback. Product schemas remain in the host.
  */
-declare function SettingsFormDialog({
+declare function SettingsFormDialog<const Fields extends readonly SettingsFormField[]>({
   open,
   onOpenChange,
   title,
   description,
   ...contentProps
-}: SettingsFormDialogProps): React.JSX.Element;
+}: SettingsFormDialogProps<Fields>): React.JSX.Element;
 //#endregion
 export { SETTINGS_FORM_CHECKED, SettingsFormDialog, SettingsFormDialogProps, SettingsFormField, SettingsFormFieldType, SettingsFormValues };

package/dist/components/general-purpose/SettingsFormDialog.js

@@ -24,6 +24,7 @@ function SettingsFormDialogContent({ fields, initialValues, submitLabel, submitt
 	const active = React.useRef(true);
 	const pending = submission === "submit" || submission === "remove";
 	const error = submission && typeof submission === "object" ? submission.error : null;
+	const initialValueByName = initialValues ?? {};
 	React.useEffect(() => {
 		active.current = true;
 		return () => {
@@ -62,7 +63,7 @@ function SettingsFormDialogContent({ fields, initialValues, submitLabel, submitt
 				name: field.name,
 				orientation: "horizontal",
 				children: [/* @__PURE__ */ jsx(Checkbox.Root, {
-					defaultChecked: initialValues?.[field.name] === SETTINGS_FORM_CHECKED,
+					defaultChecked: initialValueByName[field.name] === SETTINGS_FORM_CHECKED,
 					disabled: field.readOnly,
 					children: /* @__PURE__ */ jsx(Checkbox.Indicator, {})
 				}), /* @__PURE__ */ jsxs(Field.Content, { children: [/* @__PURE__ */ jsx(Field.Label, { children: field.label }), field.description ? /* @__PURE__ */ jsx(Field.Description, { children: field.description }) : null] })]
@@ -72,7 +73,7 @@ function SettingsFormDialogContent({ fields, initialValues, submitLabel, submitt
 					/* @__PURE__ */ jsx(Field.Label, { children: field.label }),
 					/* @__PURE__ */ jsx(Field.Control, {
 						autoComplete: field.autoComplete,
-						defaultValue: initialValues?.[field.name],
+						defaultValue: initialValueByName[field.name],
 						placeholder: field.placeholder,
 						readOnly: field.readOnly,
 						required: field.required,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mcp-b/react-components",
-  "version": "0.46.4",
+  "version": "0.46.6",
   "description": "MCP-B React components built on Base UI and shared design tokens, including Cloudflare Think chat primitives.",
   "homepage": "https://design-system.sigvelo.com",
   "bugs": {
@@ -54,7 +54,7 @@
     "streamdown": "^2.5.0",
     "unist-util-visit": "^5.1.0",
     "yet-another-react-lightbox": "^3.32.2",
-    "@mcp-b/design-tokens": "0.46.4"
+    "@mcp-b/design-tokens": "0.46.6"
   },
   "devDependencies": {
     "@ai-sdk/react": "^3.0.249",