@mcp-b/react-components 0.47.0 → 0.48.0

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

@@ -1,22 +1,25 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { S as FileIcon, d as CheckIcon } from "../../icons-cuEtsgj9.js";
+import { S as FileIcon, d as CheckIcon } from "../../icons-CeGfXO21.js";
 import { Button } from "../foundations/Button.js";
-import { IconButton } from "../foundations/IconButton.js";
-import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
 import { Field } from "../foundations/Field.js";
 import { Textarea } from "../foundations/Textarea.js";
-import { Input } from "../foundations/Input.js";
-import { DescriptionList } from "../foundations/DescriptionList.js";
+import { IconButton } from "../foundations/IconButton.js";
+import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
 import { Card, CardAction, CardContent, CardFooter, CardHeader, CardTitle } from "../foundations/Card.js";
+import { DescriptionList } from "../foundations/DescriptionList.js";
+import { Input } from "../foundations/Input.js";
 import { EmailMessageCard, SlackMessageCard } from "../ai-sdk/ConnectedAppCards.js";
-import { i as WorkspaceDeleteControl, r as httpUrl, t as FaviconMark } from "../../workspace-assets-CxpEHsac.js";
+import { i as WorkspaceDeleteControl, r as httpUrl, t as FaviconMark } from "../../workspace-assets-GqsCYxqT.js";
 import * as React from "react";
+import { createElement } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { hashKey, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 //#region src/components/agents-sdk/WorkspaceCorrespondence.tsx
 const SAVE_DEBOUNCE_MS = 400;
 const SEND_BLOCKED_MESSAGE = "Your edit has not saved, so nothing was sent. Retry the save first.";
 const FILE_MISSING_MESSAGE = "The file is no longer in the workspace.";
+const SAVE_UNAVAILABLE_MESSAGE = "Saving is no longer available.";
+const SEND_UNAVAILABLE_MESSAGE = "Sending is no longer available.";
 function fieldValue(fields, name) {
 	return fields.find((field) => field.name === name)?.value;
 }
@@ -298,11 +301,17 @@ function WorkspaceCorrespondenceCard({ body, fields, kind, path, icon, saveState
 * flushes the outstanding edit first and refuses when that save fails — the
 * agent must never be told to send content the workspace does not hold.
 *
-* Interaction state belongs to one file. The adapter resets it when the
-* source's query key changes, but hosts should still key this element by path
-* where a placement can swap files, so React reconciles it as a new card.
+* Interaction state belongs to one query identity. The keyed session makes a
+* source swap a real unmount, so an old save or send cannot settle onto the
+* next file.
 */
-function WorkspaceCorrespondenceFile({ fallback = null, source, ...props }) {
+function WorkspaceCorrespondenceFile(props) {
+	return /* @__PURE__ */ createElement(WorkspaceCorrespondenceFileSession, {
+		...props,
+		key: hashKey(props.source.queryOptions.queryKey)
+	});
+}
+function WorkspaceCorrespondenceFileSession({ fallback = null, source, ...props }) {
 	const queryClient = useQueryClient();
 	const persisted = useQuery(source.queryOptions).data ?? null;
 	const path = persisted?.path;
@@ -316,20 +325,9 @@ function WorkspaceCorrespondenceFile({ fallback = null, source, ...props }) {
 	const savePromiseRef = React.useRef(null);
 	/** The last projection this card rendered, kept for the sent snapshot. */
 	const lastShownRef = React.useRef(null);
-	const identity = String(source.queryOptions.queryKey);
-	const [seenIdentity, setSeenIdentity] = React.useState(identity);
-	if (identity !== seenIdentity) {
-		setSeenIdentity(identity);
-		setDraft(null);
-		setSessionSent(false);
-		attemptedDraftRef.current = null;
-		savedDraftRef.current = null;
-		savePromiseRef.current = null;
-		lastShownRef.current = null;
-	}
 	const saveMutation = useMutation({
 		mutationFn: async (next) => {
-			if (!source.onChange) return;
+			if (!source.onChange) throw new Error(SAVE_UNAVAILABLE_MESSAGE);
 			if (path === void 0) throw new Error(FILE_MISSING_MESSAGE);
 			await source.onChange(path, next);
 		},
@@ -357,36 +355,34 @@ function WorkspaceCorrespondenceFile({ fallback = null, source, ...props }) {
 		savePromiseRef.current = settled;
 		return settled;
 	}, [mutateSaveAsync]);
-	const sendMutation = useMutation({ mutationFn: async () => {
-		if (!source.onSend) return;
-		if (path === void 0) throw new Error(FILE_MISSING_MESSAGE);
-		await source.onSend(path);
-	} });
-	const { mutateAsync: mutateSendAsync } = sendMutation;
+	const { mutateAsync: mutateSendAsync } = useMutation({
+		mutationFn: async () => {
+			if (!source.onSend) throw new Error(SEND_UNAVAILABLE_MESSAGE);
+			if (path === void 0) throw new Error(FILE_MISSING_MESSAGE);
+			await source.onSend(path);
+		},
+		onSuccess: () => queryClient.invalidateQueries({
+			queryKey: source.queryOptions.queryKey,
+			exact: true
+		})
+	});
 	const canSave = source.onChange != null;
+	const settled = persisted?.state === "sent" || persisted?.state === void 0 && sessionSent;
+	const runDebouncedSave = React.useEffectEvent((next) => {
+		runSave(next);
+	});
 	React.useEffect(() => {
-		if (!canSave || path === void 0 || sessionSent || draft === null) return;
+		if (!canSave || path === void 0 || settled || draft === null) return;
 		if (draft === savedDraftRef.current || draft === attemptedDraftRef.current) return;
 		if (savePending) return;
-		const timer = setTimeout(() => void runSave(draft), SAVE_DEBOUNCE_MS);
+		const timer = setTimeout(() => runDebouncedSave(draft), SAVE_DEBOUNCE_MS);
 		return () => clearTimeout(timer);
 	}, [
 		canSave,
 		draft,
 		path,
-		runSave,
 		savePending,
-		sessionSent
-	]);
-	const { reset: resetSave } = saveMutation;
-	const { reset: resetSend } = sendMutation;
-	React.useEffect(() => {
-		resetSave();
-		resetSend();
-	}, [
-		identity,
-		resetSave,
-		resetSend
+		settled
 	]);
 	const send = React.useCallback(async () => {
 		if (savePromiseRef.current !== null && !await savePromiseRef.current) throw new Error(SEND_BLOCKED_MESSAGE);
@@ -395,13 +391,17 @@ function WorkspaceCorrespondenceFile({ fallback = null, source, ...props }) {
 			if (!await runSave(outstanding)) throw new Error(SEND_BLOCKED_MESSAGE);
 		}
 		await mutateSendAsync();
+		if (persisted) lastShownRef.current = draft === null ? persisted : {
+			...persisted,
+			...draft
+		};
 		setSessionSent(true);
 	}, [
 		draft,
 		mutateSendAsync,
+		persisted,
 		runSave
 	]);
-	if (persisted) lastShownRef.current = persisted;
 	const shown = persisted ?? (sessionSent ? lastShownRef.current : null);
 	if (!shown) return fallback;
 	const visible = draft ?? shown;

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

@@ -10,51 +10,60 @@ interface WorkspaceExecutionParam {
   label: string;
   type: WorkspaceExecutionParamType;
   /**
-   * Whether the module's schema lists this property as required. Optional
-   * string and number fields may run empty and are omitted from the submitted
-   * values; required ones refuse the run until filled.
+   * Whether the module's schema lists this property as required. This is a
+   * presentation hint only; the execution runtime owns argument validation.
    */
   required: boolean;
-  value: string | number | boolean;
+  value?: string | number | boolean;
 }
 interface WorkspaceExecutionRun {
   path: string;
   label: string;
+}
+interface WorkspaceExecutionRunView extends WorkspaceExecutionRun {
   onOpen?: () => void;
 }
+interface WorkspaceExecutionOutcome {
+  /** Serialized return value from the existing execution runtime. */
+  result: unknown;
+  logs: readonly string[];
+  /** Result and log files emitted when the runtime overflowed its inline bounds. */
+  runs: readonly WorkspaceExecutionRun[];
+}
+interface WorkspaceExecutionViewOutcome extends Omit<WorkspaceExecutionOutcome, "runs"> {
+  runs: readonly WorkspaceExecutionRunView[];
+}
 interface WorkspaceExecution {
   /** Workspace path of the module file. */
   path: string;
   name: string;
   description?: string;
-  /**
-   * Hostnames or URLs the model said this operates on. Shown like user-script
-   * Sites. Not a run argument and not parsed from the JavaScript.
-   */
-  sites?: readonly string[];
-  /** Brand mark. Defaults to the first site favicon, then `TerminalIcon`. */
+  /** Brand mark. Defaults to `TerminalIcon`. */
   icon?: React.ReactNode;
   parameters: readonly WorkspaceExecutionParam[];
   /** Recent result peeks, newest first. Not a results directory. */
   runs?: readonly WorkspaceExecutionRun[];
+}
+/** Data-only execution projection hydrated with card actions outside Query. */
+interface WorkspaceExecutionView extends WorkspaceExecution {
+  runs?: readonly WorkspaceExecutionRunView[];
   /**
-   * Runs the module with the submitted values and resolves with its visible
-   * result files. The card owns the run lifecycle: a resolved promise shows a
-   * completed run even when the array is empty; returned files enrich that row.
+   * Runs the module with the submitted values. The card owns the run lifecycle;
+   * inline output and any overflow files enrich the completed row.
    */
-  onRun?: (parameters: readonly WorkspaceExecutionParam[]) => Promise<readonly WorkspaceExecutionRun[]>;
+  onRun?: (parameters: readonly WorkspaceExecutionParam[]) => Promise<WorkspaceExecutionViewOutcome>;
   onOpen?: () => void;
   onDelete?: () => void | Promise<void>;
 }
 interface WorkspaceExecutionSource {
   queryOptions: WorkspaceConceptQueryOptions<readonly WorkspaceExecution[]>;
-  /** Runs the module with the submitted values and returns its visible result files. */
-  onRun?: (path: string, parameters: readonly WorkspaceExecutionParam[]) => Promise<readonly WorkspaceExecutionRun[]>;
+  /** Runs the module with the submitted values and returns its visible outcome. */
+  onRun?: (path: string, parameters: readonly WorkspaceExecutionParam[]) => Promise<WorkspaceExecutionOutcome>;
   onOpen?: (path: string) => void;
   onDelete?: (path: string) => void | Promise<void>;
 }
 interface WorkspaceExecutionCardProps extends Omit<CardProps, "children" | "hover" | "size" | "title"> {
-  module: WorkspaceExecution;
+  module: WorkspaceExecutionView;
 }
 interface WorkspaceExecutionFileProps extends Omit<WorkspaceExecutionCardProps, "module"> {
   path: string;
@@ -62,15 +71,14 @@ interface WorkspaceExecutionFileProps extends Omit<WorkspaceExecutionCardProps,
   fallback?: React.ReactNode;
 }
 interface WorkspaceExecutionsPanelProps extends Omit<React.HTMLAttributes<HTMLElement>, "children"> {
-  modules: readonly WorkspaceExecution[];
+  modules: readonly WorkspaceExecutionView[];
+  loading?: boolean;
   /** Query failure to show instead of the empty state. Loaded modules win. */
   error?: string;
   onRetry?: () => void;
 }
 declare function WorkspaceExecutionCard({
-  className,
   module,
-  ref,
   ...props
 }: WorkspaceExecutionCardProps & {
   ref?: React.Ref<HTMLDivElement>;
@@ -93,6 +101,7 @@ declare function WorkspaceExecutionFile({
 declare function WorkspaceExecutionsPanel({
   className,
   error,
+  loading,
   modules,
   onRetry,
   ref,
@@ -103,4 +112,4 @@ declare function WorkspaceExecutionsPanel({
 /** Canonical workbench descriptor; hosts supply only the source adapter. */
 declare function workspaceExecutionsPanel(source: WorkspaceExecutionSource): ThinkFullAppPanel;
 //#endregion
-export { WorkspaceExecution, WorkspaceExecutionCard, WorkspaceExecutionCardProps, WorkspaceExecutionFile, WorkspaceExecutionFileProps, WorkspaceExecutionParam, WorkspaceExecutionParamType, WorkspaceExecutionRun, WorkspaceExecutionSource, WorkspaceExecutionsPanel, WorkspaceExecutionsPanelProps, workspaceExecutionsPanel };
+export { WorkspaceExecution, WorkspaceExecutionCard, WorkspaceExecutionCardProps, WorkspaceExecutionFile, WorkspaceExecutionFileProps, WorkspaceExecutionOutcome, WorkspaceExecutionParam, WorkspaceExecutionParamType, WorkspaceExecutionRun, WorkspaceExecutionRunView, WorkspaceExecutionSource, WorkspaceExecutionView, WorkspaceExecutionViewOutcome, WorkspaceExecutionsPanel, WorkspaceExecutionsPanelProps, workspaceExecutionsPanel };

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

@@ -1,34 +1,33 @@
 import { t as cx } from "../../class-names-BiMDVpUo.js";
-import { P as MonitorIcon, S as FileIcon, Z as TerminalIcon, d as CheckIcon, z as PlayIcon } from "../../icons-cuEtsgj9.js";
+import { K as SpinnerIcon, S as FileIcon, Z as TerminalIcon, d as CheckIcon, z as PlayIcon } from "../../icons-CeGfXO21.js";
 import { Button } from "../foundations/Button.js";
-import { IconButton } from "../foundations/IconButton.js";
-import { a as formatErrorMessage } from "../../format-COCyV98Z.js";
-import { EmptyState } from "../foundations/EmptyState.js";
 import { Field } from "../foundations/Field.js";
 import { Form } from "../foundations/Form.js";
-import { Input } from "../foundations/Input.js";
-import { DescriptionList } from "../foundations/DescriptionList.js";
-import { Switch } from "../foundations/Switch.js";
+import { IconButton } from "../foundations/IconButton.js";
+import { a as formatErrorMessage, o as formatUnknownValue, r as firstLine } from "../../format-COCyV98Z.js";
 import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "../foundations/Card.js";
-import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, r as httpUrl, t as FaviconMark } from "../../workspace-assets-CxpEHsac.js";
+import { DescriptionList } from "../foundations/DescriptionList.js";
+import { Input } from "../foundations/Input.js";
+import { Checkbox } from "../foundations/Checkbox.js";
+import { EmptyState } from "../foundations/EmptyState.js";
+import { i as WorkspaceDeleteControl, n as WorkspaceComposerLink, r as httpUrl, t as FaviconMark } from "../../workspace-assets-GqsCYxqT.js";
 import * as React from "react";
+import { createElement } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 //#region src/components/agents-sdk/WorkspaceExecution.tsx
 function draftFrom(parameters) {
-	return Object.fromEntries(parameters.map((parameter) => [parameter.name, parameter.type === "boolean" ? Boolean(parameter.value) : String(parameter.value ?? "")]));
+	return Object.fromEntries(parameters.flatMap((parameter) => parameter.value === void 0 ? [] : [[parameter.name, parameter.type === "boolean" ? Boolean(parameter.value) : String(parameter.value)]]));
 }
 /**
-* Typed values for one run. Empty optional fields are omitted — an absent
-* property is the schema's own "use the default" — while empty required
-* fields and non-numeric numbers refuse the run with a field-level message.
+* Values for one run. Empty and untouched fields stay absent so module
+* defaults work. Schema types improve the input but never gate execution.
 */
 function collectRunParameters(parameters, draft) {
 	const collected = [];
-	const problems = [];
 	for (const parameter of parameters) {
 		if (parameter.type === "boolean") {
-			collected.push({
+			if (Object.hasOwn(draft, parameter.name)) collected.push({
 				...parameter,
 				value: Boolean(draft[parameter.name])
 			});
@@ -36,19 +35,12 @@ function collectRunParameters(parameters, draft) {
 		}
 		const raw = draft[parameter.name];
 		const text = (typeof raw === "string" ? raw : String(raw ?? "")).trim();
-		if (text === "") {
-			if (parameter.required) problems.push(`${parameter.label} is required.`);
-			continue;
-		}
+		if (text === "") continue;
 		if (parameter.type === "number") {
 			const numeric = Number(text);
-			if (!Number.isFinite(numeric)) {
-				problems.push(`${parameter.label} must be a number.`);
-				continue;
-			}
 			collected.push({
 				...parameter,
-				value: numeric
+				value: Number.isFinite(numeric) ? numeric : text
 			});
 			continue;
 		}
@@ -57,66 +49,15 @@ function collectRunParameters(parameters, draft) {
 			value: text
 		});
 	}
-	return problems.length > 0 ? {
-		status: "invalid",
-		message: problems.join(" ")
-	} : {
-		status: "ok",
-		parameters: collected
-	};
+	return collected;
 }
 function snapshotValue(parameter) {
+	if (parameter.value === void 0) return "";
 	if (parameter.type === "boolean") return parameter.value ? "Yes" : "No";
-	return String(parameter.value ?? "");
-}
-function siteHref(value) {
-	return httpUrl(value.includes("://") ? value : `https://${value}`);
-}
-function siteMarks(values) {
-	const marks = [];
-	for (const value of values) {
-		const trimmed = value.trim();
-		if (!trimmed) continue;
-		const href = siteHref(trimmed);
-		let site = trimmed;
-		if (href) try {
-			site = new URL(href).hostname.replace(/^www\./, "");
-		} catch {
-			site = trimmed;
-		}
-		if (!site || marks.some((mark) => mark.site === site)) continue;
-		marks.push({
-			site,
-			href,
-			hint: trimmed
-		});
-	}
-	return marks;
+	return String(parameter.value);
 }
 function ExecutionIcon({ module }) {
-	if (module.icon) return module.icon;
-	const href = siteMarks(module.sites ?? []).find((mark) => mark.href)?.href;
-	return href ? /* @__PURE__ */ jsx(FaviconMark, {
-		href,
-		fallback: /* @__PURE__ */ jsx(TerminalIcon, {})
-	}) : /* @__PURE__ */ jsx(TerminalIcon, {});
-}
-function SiteDetails({ sites }) {
-	const marks = siteMarks(sites);
-	if (marks.length === 0) return null;
-	return /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: "Sites" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: /* @__PURE__ */ jsx("div", {
-		className: "sigvelo-cluster",
-		children: marks.map(({ href, hint, site }) => /* @__PURE__ */ jsx(WorkspaceComposerLink, {
-			kind: "tab",
-			value: site,
-			label: site,
-			hint: hint === site ? void 0 : hint,
-			icon: /* @__PURE__ */ jsx(FaviconMark, {
-				href,
-				fallback: /* @__PURE__ */ jsx(MonitorIcon, {})
-			})
-		}, site))
-	}) })] });
+	return module.icon ?? /* @__PURE__ */ jsx(TerminalIcon, {});
 }
 function RunLinks({ runs }) {
 	return /* @__PURE__ */ jsx("div", {
@@ -129,61 +70,63 @@ function RunLinks({ runs }) {
 		}, run.path))
 	});
 }
-function RunDetails({ runState, runs }) {
-	const completed = runState.status === "completed";
-	return /* @__PURE__ */ jsxs(Fragment, { children: [completed ? /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: "Last run" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: /* @__PURE__ */ jsxs("div", {
-		className: "sigvelo-cluster",
-		children: [/* @__PURE__ */ jsxs("span", {
-			className: "workspace-execution-outcome",
-			children: [/* @__PURE__ */ jsx(CheckIcon, { size: 14 }), "Completed"]
-		}), runState.runs.length > 0 ? /* @__PURE__ */ jsx(RunLinks, { runs: runState.runs }) : null]
-	}) })] }) : null, runs.length > 0 ? /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: completed ? "Earlier" : runs.length === 1 ? "Last" : "Runs" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: /* @__PURE__ */ jsx(RunLinks, { runs }) })] }) : null] });
+function RunDetails({ outcome, runs }) {
+	const completed = outcome !== void 0;
+	const result = outcome?.result != null ? firstLine(formatUnknownValue(outcome.result)) : "";
+	const log = outcome ? firstLine(outcome.logs.join("\n")) : "";
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		completed ? /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: "Last run" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: /* @__PURE__ */ jsxs("div", {
+			className: "sigvelo-cluster",
+			children: [/* @__PURE__ */ jsxs("span", {
+				className: "workspace-execution-outcome",
+				children: [/* @__PURE__ */ jsx(CheckIcon, { size: 14 }), "Completed"]
+			}), outcome.runs.length > 0 ? /* @__PURE__ */ jsx(RunLinks, { runs: outcome.runs }) : null]
+		}) })] }) : null,
+		result ? /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: "Result" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: result })] }) : null,
+		log ? /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: "Log" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: log })] }) : null,
+		runs.length > 0 ? /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsx(DescriptionList.Term, { children: completed ? "Earlier" : runs.length === 1 ? "Last" : "Runs" }), /* @__PURE__ */ jsx(DescriptionList.Details, { children: /* @__PURE__ */ jsx(RunLinks, { runs }) })] }) : null
+	] });
 }
-function ExecutionFields({ draft, parameters, runState, runs, sites, onDraftChange }) {
+function ExecutionFields({ draft, outcome, parameters, runs, onDraftChange }) {
 	const fieldId = React.useId();
 	const editing = draft != null && onDraftChange != null;
-	const siteItems = siteMarks(sites ?? []);
 	const runItems = runs ?? [];
 	const visibleParameters = editing ? parameters : parameters.filter((parameter) => snapshotValue(parameter) !== "");
-	if (visibleParameters.length === 0 && siteItems.length === 0 && runItems.length === 0 && runState.status !== "completed") return null;
+	if (visibleParameters.length === 0 && runItems.length === 0 && outcome === void 0) return null;
 	return /* @__PURE__ */ jsxs(DescriptionList.Root, {
 		align: "start",
 		variant: "divided",
-		children: [
-			siteItems.length > 0 ? /* @__PURE__ */ jsx(SiteDetails, { sites: sites ?? [] }) : null,
-			visibleParameters.map((parameter) => {
-				const id = `${fieldId}-${parameter.name}`;
-				const href = parameter.type === "string" ? httpUrl(String(editing ? draft?.[parameter.name] ?? parameter.value : parameter.value)) : void 0;
-				return /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsxs(DescriptionList.Term, {
-					id: parameter.type === "boolean" ? id : void 0,
-					children: [href ? /* @__PURE__ */ jsx(FaviconMark, { href }) : null, editing && parameter.type !== "boolean" ? /* @__PURE__ */ jsx("label", {
-						htmlFor: id,
-						children: parameter.label
-					}) : parameter.label]
-				}), /* @__PURE__ */ jsx(DescriptionList.Details, { children: editing && parameter.type === "boolean" ? /* @__PURE__ */ jsx(Switch.Root, {
-					size: "sm",
-					checked: Boolean(draft?.[parameter.name]),
-					"aria-labelledby": id,
-					onCheckedChange: (checked) => {
-						if (typeof checked === "boolean") onDraftChange?.(parameter.name, checked);
-					},
-					children: /* @__PURE__ */ jsx(Switch.Thumb, {})
-				}) : editing ? /* @__PURE__ */ jsx(Input, {
-					id,
-					name: parameter.name,
-					type: href ? "url" : void 0,
-					required: parameter.required || void 0,
-					value: String(draft?.[parameter.name] ?? ""),
-					autoComplete: "off",
-					inputMode: parameter.type === "number" ? "decimal" : void 0,
-					onChange: (event) => onDraftChange?.(parameter.name, event.currentTarget.value)
-				}) : snapshotValue(parameter) })] }, parameter.name);
-			}),
-			/* @__PURE__ */ jsx(RunDetails, {
-				runState,
-				runs: runItems
-			})
-		]
+		children: [visibleParameters.map((parameter) => {
+			const id = `${fieldId}-${parameter.name}`;
+			const parameterLabel = editing && parameter.required ? `${parameter.label} (required)` : parameter.label;
+			const href = parameter.type === "string" ? httpUrl(String(editing ? draft?.[parameter.name] ?? parameter.value : parameter.value)) : void 0;
+			return /* @__PURE__ */ jsxs(DescriptionList.Item, { children: [/* @__PURE__ */ jsxs(DescriptionList.Term, {
+				id: parameter.type === "boolean" ? id : void 0,
+				children: [href ? /* @__PURE__ */ jsx(FaviconMark, { href }) : null, editing && parameter.type !== "boolean" ? /* @__PURE__ */ jsx("label", {
+					htmlFor: id,
+					children: parameterLabel
+				}) : parameterLabel]
+			}), /* @__PURE__ */ jsx(DescriptionList.Details, { children: editing && parameter.type === "boolean" ? /* @__PURE__ */ jsx(Checkbox.Root, {
+				checked: draft?.[parameter.name] === true,
+				indeterminate: draft?.[parameter.name] === void 0,
+				"aria-labelledby": id,
+				onCheckedChange: (checked) => {
+					if (typeof checked === "boolean") onDraftChange?.(parameter.name, checked);
+				},
+				children: /* @__PURE__ */ jsx(Checkbox.Indicator, {})
+			}) : editing ? /* @__PURE__ */ jsx(Input, {
+				id,
+				name: parameter.name,
+				type: href ? "url" : void 0,
+				value: String(draft?.[parameter.name] ?? ""),
+				autoComplete: "off",
+				inputMode: parameter.type === "number" ? "decimal" : void 0,
+				onChange: (event) => onDraftChange?.(parameter.name, event.currentTarget.value)
+			}) : snapshotValue(parameter) })] }, parameter.name);
+		}), /* @__PURE__ */ jsx(RunDetails, {
+			outcome,
+			runs: runItems
+		})]
 	});
 }
 function ExecutionActions({ busy, module }) {
@@ -218,45 +161,32 @@ function ExecutionActions({ busy, module }) {
 function executionFormKey(module) {
 	return `${module.path}:${JSON.stringify(module.parameters)}`;
 }
-function WorkspaceExecutionCard({ className, module, ref, ...props }) {
+function WorkspaceExecutionCard({ module, ...props }) {
+	return /* @__PURE__ */ createElement(WorkspaceExecutionCardSession, {
+		...props,
+		key: module.path,
+		module
+	});
+}
+function WorkspaceExecutionCardSession({ className, module, ref, ...props }) {
 	const titleId = React.useId();
 	const ariaLabel = props["aria-label"];
 	const ariaLabelledBy = props["aria-labelledby"] ?? (ariaLabel ? void 0 : titleId);
 	const editing = module.onRun != null;
 	const [draft, setDraft] = React.useState(() => draftFrom(module.parameters));
-	const [runState, setRunState] = React.useState({ status: "idle" });
-	const [validationMessage, setValidationMessage] = React.useState("");
 	const formKey = executionFormKey(module);
 	const [seenFormKey, setSeenFormKey] = React.useState(formKey);
 	if (formKey !== seenFormKey) {
 		setSeenFormKey(formKey);
 		setDraft(draftFrom(module.parameters));
-		setValidationMessage("");
 	}
-	const busy = runState.status === "running";
-	const run = async () => {
-		if (!module.onRun || busy) return;
-		const submission = collectRunParameters(module.parameters, draft);
-		if (submission.status === "invalid") {
-			setValidationMessage(submission.message);
-			return;
-		}
-		setValidationMessage("");
-		setRunState({ status: "running" });
-		try {
-			setRunState({
-				status: "completed",
-				runs: await module.onRun(submission.parameters)
-			});
-		} catch (error) {
-			setRunState({
-				status: "failed",
-				message: formatErrorMessage(error)
-			});
-		}
-	};
-	const errorMessage = validationMessage || (runState.status === "failed" ? runState.message : "");
-	const hasBody = module.parameters.length > 0 || (module.sites?.length ?? 0) > 0 || (module.runs?.length ?? 0) > 0 || runState.status === "completed" || editing || Boolean(errorMessage);
+	const runMutation = useMutation({ mutationFn: async () => {
+		if (!module.onRun) throw new Error("Execution is no longer available.");
+		return module.onRun(collectRunParameters(module.parameters, draft));
+	} });
+	const busy = runMutation.isPending;
+	const errorMessage = runMutation.isError ? formatErrorMessage(runMutation.error) : "";
+	const hasBody = module.parameters.length > 0 || (module.runs?.length ?? 0) > 0 || runMutation.isSuccess || editing || Boolean(errorMessage);
 	const header = /* @__PURE__ */ jsxs(CardHeader, { children: [
 		/* @__PURE__ */ jsxs(CardTitle, {
 			id: titleId,
@@ -277,30 +207,27 @@ function WorkspaceExecutionCard({ className, module, ref, ...props }) {
 	const body = hasBody ? /* @__PURE__ */ jsxs(CardContent, { children: [
 		/* @__PURE__ */ jsx(ExecutionFields, {
 			draft: editing ? draft : void 0,
+			outcome: runMutation.isSuccess ? runMutation.data : void 0,
 			parameters: module.parameters,
-			runState,
 			runs: module.runs,
-			sites: module.sites,
-			onDraftChange: editing ? (name, value) => {
-				setValidationMessage("");
-				setDraft((current) => ({
-					...current,
-					[name]: value
-				}));
-			} : void 0
+			onDraftChange: editing ? (name, value) => setDraft((current) => ({
+				...current,
+				[name]: value
+			})) : void 0
 		}),
 		errorMessage ? /* @__PURE__ */ jsx(Field.Errors, { errors: [errorMessage] }) : null,
 		/* @__PURE__ */ jsx("span", {
 			className: "sigvelo-visually-hidden",
 			role: "status",
 			"aria-atomic": "true",
-			children: errorMessage || (busy ? "Running" : runState.status === "completed" ? "Completed" : "")
+			children: errorMessage || (busy ? "Running" : runMutation.isSuccess ? "Completed" : "")
 		})
 	] }) : null;
 	const inner = editing ? /* @__PURE__ */ jsxs(Form, {
+		noValidate: true,
 		onSubmit: (event) => {
 			event.preventDefault();
-			run();
+			if (!busy) runMutation.mutate();
 		},
 		children: [header, body]
 	}) : /* @__PURE__ */ jsxs(Fragment, { children: [header, body] });
@@ -330,7 +257,7 @@ function WorkspaceExecutionFile({ fallback = null, path, source, ...props }) {
 * Workbench library. Same card as the inline placement. A query failure with
 * nothing loaded renders as a quiet inline error, never as an empty library.
 */
-function WorkspaceExecutionsPanel({ className, error, modules, onRetry, ref, ...props }) {
+function WorkspaceExecutionsPanel({ className, error, loading = false, modules, onRetry, ref, ...props }) {
 	return /* @__PURE__ */ jsx("section", {
 		ref,
 		"data-slot": "workspace-executions-panel",
@@ -351,6 +278,9 @@ function WorkspaceExecutionsPanel({ className, error, modules, onRetry, ref, ...
 				onClick: onRetry,
 				children: "Retry"
 			}) : null
+		}) : loading ? /* @__PURE__ */ jsx(EmptyState, {
+			icon: /* @__PURE__ */ jsx(SpinnerIcon, {}),
+			title: "Loading modules"
 		}) : /* @__PURE__ */ jsx(EmptyState, {
 			icon: /* @__PURE__ */ jsx(TerminalIcon, {}),
 			title: "No modules"
@@ -366,7 +296,13 @@ function executionWithSource(module, source) {
 	return {
 		...module,
 		runs: module.runs?.map(withOpen),
-		onRun: onRun ? async (parameters) => (await onRun(module.path, parameters)).map(withOpen) : void 0,
+		onRun: onRun ? async (parameters) => {
+			const outcome = await onRun(module.path, parameters);
+			return {
+				...outcome,
+				runs: outcome.runs.map(withOpen)
+			};
+		} : void 0,
 		onOpen: onOpen ? () => onOpen(module.path) : void 0,
 		onDelete: onDelete ? () => onDelete(module.path) : void 0
 	};
@@ -376,6 +312,7 @@ function WorkspaceExecutionSourcePanel({ source }) {
 	return /* @__PURE__ */ jsx(WorkspaceExecutionsPanel, {
 		modules: (query.data ?? []).map((module) => executionWithSource(module, source)),
 		error: query.isError ? formatErrorMessage(query.error) : void 0,
+		loading: query.isPending,
 		onRetry: query.isError ? () => void query.refetch() : void 0,
 		"aria-busy": query.isFetching || void 0
 	});