@mcp-b/react-components 0.7.1 → 0.9.0

package/dist/components/Terminal.js

@@ -1,8 +1,8 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { I as XIcon, N as TerminalIcon } from "../icons-BAlTbWWP.js";
+import { L as XIcon, P as TerminalIcon } from "../icons-D2Q5n5C1.js";
 import { Button } from "./Button.js";
 import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
-import { t as CopyButton } from "../copy-button-TVhDAroI.js";
+import { t as CopyButton } from "../copy-button-C6JSKtFE.js";
 import { Badge } from "./Badge.js";
 import { ScrollArea } from "./ScrollArea.js";
 import * as React from "react";
@@ -165,7 +165,8 @@ function TerminalContent({ className, ref, ...props }) {
 	]);
 	const handleScroll = (e) => {
 		const target = e.currentTarget;
-		setStickToBottom(target.scrollHeight - target.scrollTop - target.clientHeight < 8);
+		const atBottom = target.scrollHeight - target.scrollTop - target.clientHeight < 8;
+		setStickToBottom(atBottom);
 	};
 	return /* @__PURE__ */ jsxs(ScrollArea.Root, {
 		ref,

package/dist/components/TestResults.js

@@ -1,6 +1,6 @@
 import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { I as XIcon, a as CheckIcon, c as ChevronRightIcon, j as SpinnerIcon } from "../icons-BAlTbWWP.js";
+import { L as XIcon, M as SpinnerIcon, a as CheckIcon, c as ChevronRightIcon } from "../icons-D2Q5n5C1.js";
 import { Badge } from "./Badge.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/ThinkChat.d.ts

@@ -1,24 +1,22 @@
 import { n as ExecutionApprovals } from "../PromptInput-D6-G24p7.js";
-import { a as AgentChatRenderPartContext, r as AgentChatProps } from "../AgentChat-403mckDG.js";
+import { a as AgentChatRenderPartContext, r as AgentChatProps } from "../AgentChat-B9LD_WF1.js";
 import { n as BrowserLiveViewProps, t as BrowserLiveView } from "../BrowserLiveView-ZktFZiMD.js";
 import { n as BrowserReplayProps, t as BrowserReplay } from "../BrowserReplay-6G-mnwcn.js";
 import { _ as isThinkChatActivityPart } from "../ThinkChatToolParts-DnUiZgCC.js";
-import { a as ThinkChatToolRenderers, c as renderThinkChatActivityPart, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as describeThinkChatActivityPart, t as ThinkChatActivity } from "../ThinkChatActivity-CeHzk6-K.js";
-import { n as ThinkChatValue } from "../ThinkChatContext-CC94HL4u.js";
+import { a as ThinkChatToolRenderers, c as renderThinkChatActivityPart, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as describeThinkChatActivityPart, t as ThinkChatActivity } from "../ThinkChatActivity-B2UD95My.js";
+import { n as ThinkChatValue } from "../ThinkChatContext-BLAAb8J5.js";
 import { FileInfo, UseWorkspaceOptions, WorkspaceExplorer, WorkspaceExplorerProps, WorkspaceFileState, WorkspaceInfo, WorkspaceSource, WorkspaceState, inferWorkspaceLanguage, useWorkspace } from "./WorkspaceExplorer.js";
 import * as React from "react";
 import { UIMessage } from "ai";
 import { UseAgentOptions } from "agents/react";
-import { PendingApproval } from "@cloudflare/think";
+import { PendingApproval, Think } from "@cloudflare/think";
+import { AgentStub } from "agents/client";
 
 //#region src/components/ThinkChat.d.ts
-interface ThinkApprovalStub {
-  pendingApprovals(executionId?: string): Promise<PendingApproval[]>;
-  approveExecution(executionId: string): Promise<unknown>;
-  rejectExecution(executionId: string, reason?: string): Promise<unknown>;
-}
+type ThinkAgent<State> = Think<object, State>;
+type ThinkApprovalStub<State = unknown> = AgentStub<ThinkAgent<State>>;
 interface ThinkChatProviderProps {
-  /** The `useAgentChat` value from the `agents` SDK that descendants read. */
+  /** The `useAgentChat` value from `@cloudflare/think/react` that descendants read. */
   chat: ThinkChatValue;
   children: React.ReactNode;
 }

package/dist/components/ThinkChatActivity.d.ts

@@ -1,3 +1,3 @@
 import { _ as isThinkChatActivityPart } from "../ThinkChatToolParts-DnUiZgCC.js";
-import { a as ThinkChatToolRenderers, c as renderThinkChatActivityPart, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as describeThinkChatActivityPart, t as ThinkChatActivity } from "../ThinkChatActivity-CeHzk6-K.js";
+import { a as ThinkChatToolRenderers, c as renderThinkChatActivityPart, i as ThinkChatToolRenderer, n as ThinkChatActivityProps, o as createThinkChatActivityRenderer, r as ThinkChatActivityRendererOptions, s as describeThinkChatActivityPart, t as ThinkChatActivity } from "../ThinkChatActivity-B2UD95My.js";
 export { ThinkChatActivity, ThinkChatActivityProps, ThinkChatActivityRendererOptions, ThinkChatToolRenderer, ThinkChatToolRenderers, createThinkChatActivityRenderer, describeThinkChatActivityPart, isThinkChatActivityPart, renderThinkChatActivityPart };

package/dist/components/ThinkChatActivity.js

@@ -1,10 +1,11 @@
-import { A as SearchIcon, C as MonitorIcon, E as PencilIcon, F as WrenchIcon, N as TerminalIcon, P as WarningIcon, b as LinkIcon, h as FileIcon, y as InfoIcon } from "../icons-BAlTbWWP.js";
+import { A as SearchIcon, C as MonitorIcon, E as PencilIcon, F as WarningIcon, I as WrenchIcon, P as TerminalIcon, b as LinkIcon, h as FileIcon, y as InfoIcon } from "../icons-D2Q5n5C1.js";
 import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityText, ActivityTrigger } from "./Activity.js";
 import { ThinkChatContext } from "./ThinkChatContext.js";
 import { displayUrl, isBrowserToolPart, isExecuteToolPart, isFetchToolPart, isPartFailed, isPartWorking, isSkillToolPart, isThinkChatActivityPart, isWorkspaceToolPart } from "./ThinkChatToolParts.js";
 import { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel } from "./ThinkChatToolPanels.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { getToolInput, getToolOutput } from "@cloudflare/think/react";
 import { getToolName, isReasoningUIPart, isToolUIPart } from "ai";
 //#region src/components/ThinkChatActivity.tsx
 function summarizeToolInput(input) {
@@ -114,13 +115,13 @@ function genericToolLabels(name, hasUrl) {
 function describeGenericToolPart(part) {
 	const labels = genericToolLabels(getToolName(part), activityPartUrl(part) !== null);
 	const label = isPartFailed(part) ? labels.failed : isPartWorking(part) ? labels.working : labels.done;
-	const detail = summarizeToolInput(part.input);
+	const detail = summarizeToolInput(getToolInput(part));
 	return detail ? `${label} · ${detail}` : label;
 }
 function activityPartUrl(part) {
 	if (isFetchToolPart(part)) return firstHttpUrl(part.input?.url ?? part.input?.path);
 	if (isBrowserToolPart(part) && part.type !== "tool-browser_execute") return firstHttpUrl(part.input?.url);
-	if (isToolUIPart(part) && !isExecuteToolPart(part)) return firstHttpUrl(part.input) ?? (part.state === "output-available" ? firstHttpUrl(part.output) : null);
+	if (isToolUIPart(part) && !isExecuteToolPart(part)) return firstHttpUrl(getToolInput(part)) ?? (part.state === "output-available" ? firstHttpUrl(getToolOutput(part)) : null);
 	return null;
 }
 function activityPartIconKind(part) {

package/dist/components/ThinkChatContext.d.ts

@@ -1,2 +1,2 @@
-import { n as ThinkChatValue, r as useThinkChatContext, t as ThinkChatContext } from "../ThinkChatContext-CC94HL4u.js";
+import { n as ThinkChatValue, r as useThinkChatContext, t as ThinkChatContext } from "../ThinkChatContext-BLAAb8J5.js";
 export { ThinkChatContext, ThinkChatValue, useThinkChatContext };

package/dist/components/ThinkChatToolPanels.js

@@ -1,6 +1,6 @@
 import { ActivityOutput, ActivityPanel } from "./Activity.js";
 import { Tab, TabPanel, Tabs, TabsList } from "./Tabs.js";
-import { t as CodeBlock } from "../CodeBlock-D9koxDA7.js";
+import { t as CodeBlock } from "../CodeBlock-XNQOupQ3.js";
 import { BrowserLiveView } from "./BrowserLiveView.js";
 import { displayUrl } from "./ThinkChatToolParts.js";
 import * as React from "react";

package/dist/components/ThinkChatToolParts.js

@@ -1,7 +1,7 @@
-import { getStaticToolName, getToolName, isReasoningUIPart, isStaticToolUIPart, isToolUIPart } from "ai";
 import { getToolPartState } from "@cloudflare/think/react";
+import { getStaticToolName, getToolName, isReasoningUIPart, isStaticToolUIPart, isToolUIPart } from "ai";
 //#region src/components/ThinkChatToolParts.ts
-const WORKSPACE_TOOL_NAMES = new Set([
+const WORKSPACE_TOOL_NAMES = /* @__PURE__ */ new Set([
 	"read",
 	"write",
 	"edit",
@@ -14,7 +14,7 @@ const WORKSPACE_TOOL_NAMES = new Set([
 function isWorkspaceToolPart(part) {
 	return isStaticToolUIPart(part) && WORKSPACE_TOOL_NAMES.has(getStaticToolName(part));
 }
-const SKILL_TOOL_NAMES = new Set([
+const SKILL_TOOL_NAMES = /* @__PURE__ */ new Set([
 	"activate_skill",
 	"read_skill_resource",
 	"run_skill_script"
@@ -25,7 +25,7 @@ function isSkillToolPart(part) {
 function isFetchToolPart(part) {
 	return isStaticToolUIPart(part) && getStaticToolName(part).startsWith("fetch_");
 }
-const BROWSER_TOOL_NAMES = new Set([
+const BROWSER_TOOL_NAMES = /* @__PURE__ */ new Set([
 	"browser_execute",
 	"browser_markdown",
 	"browser_extract",

package/dist/components/ThinkExecutionWorkbench.d.ts

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { Think } from "@cloudflare/think";
+import { AgentStub } from "agents/client";
+
+//#region src/components/ThinkExecutionWorkbench.d.ts
+type ThinkExecutionAgent<State = unknown> = Think<object, State>;
+type ThinkExecutionWorkbenchSource<State = unknown> = AgentStub<ThinkExecutionAgent<State>>;
+interface ThinkExecutionWorkbenchProps<State = unknown> extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+  /** Agents SDK client stub for a Think agent; this UI calls native submission/workflow methods. */
+  source: ThinkExecutionWorkbenchSource<State>;
+  title?: React.ReactNode;
+  backButton?: React.ReactNode;
+  pageSize?: number;
+}
+declare function ThinkExecutionWorkbench<State = unknown>({
+  backButton,
+  className,
+  pageSize,
+  ref,
+  source,
+  title,
+  ...props
+}: ThinkExecutionWorkbenchProps<State> & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+//#endregion
+export { ThinkExecutionAgent, ThinkExecutionWorkbench, ThinkExecutionWorkbenchProps, ThinkExecutionWorkbenchSource };

package/dist/components/ThinkExecutionWorkbench.js

@@ -0,0 +1,450 @@
+import { t as cx } from "../class-names-9UtZwb0J.js";
+import { A as SearchIcon, D as PlayIcon, L as XIcon, N as SquareIcon, T as PauseIcon, k as RefreshIcon, u as DotIcon } from "../icons-D2Q5n5C1.js";
+import { Button } from "./Button.js";
+import { Badge } from "./Badge.js";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/ThinkExecutionWorkbench.tsx
+const executionPanelPageSize = 20;
+function formatTimestamp(value) {
+	if (value == null) return "Not recorded";
+	const date = value instanceof Date ? value : new Date(value);
+	return Number.isNaN(date.getTime()) ? "Not recorded" : date.toLocaleString();
+}
+function formatJson(value) {
+	return JSON.stringify(value, null, 2);
+}
+function getErrorMessage(error) {
+	return error instanceof Error ? error.message : String(error);
+}
+function submissionStatusColor(status) {
+	if (status === "completed") return "success";
+	if (status === "error") return "destructive";
+	if (status === "aborted" || status === "skipped") return "warning";
+	if (status === "running") return "primary";
+	return "neutral";
+}
+function workflowStatusColor(status) {
+	const value = String(status);
+	if (value === "complete") return "success";
+	if (value === "errored" || value === "terminated") return "destructive";
+	if (value === "paused" || value === "waiting") return "warning";
+	if (value === "running") return "primary";
+	return "neutral";
+}
+function StatusBadge({ children, color }) {
+	return /* @__PURE__ */ jsxs(Badge, {
+		className: "think-execution-workbench__status",
+		color,
+		size: "sm",
+		children: [/* @__PURE__ */ jsx(DotIcon, {}), /* @__PURE__ */ jsx("span", { children })]
+	});
+}
+function isSubmissionCancelable(status) {
+	return status === "pending" || status === "running";
+}
+function isWorkflowTerminal(status) {
+	const value = String(status);
+	return value === "complete" || value === "errored" || value === "terminated";
+}
+function ThinkExecutionWorkbench({ backButton, className, pageSize = executionPanelPageSize, ref, source, title = "Execution", ...props }) {
+	const inspectionId = React.useId();
+	const submissionsId = React.useId();
+	const executionsId = React.useId();
+	const [busyAction, setBusyAction] = React.useState("refresh");
+	const [error, setError] = React.useState(null);
+	const [submissions, setSubmissions] = React.useState([]);
+	const [workflows, setWorkflows] = React.useState(null);
+	const [selectedSubmission, setSelectedSubmission] = React.useState(null);
+	const [selectedWorkflow, setSelectedWorkflow] = React.useState(null);
+	const loadData = React.useCallback(async () => {
+		const [nextSubmissions, nextWorkflows] = await Promise.all([source.listSubmissions({ limit: pageSize }), source.getWorkflows({
+			limit: pageSize,
+			orderBy: "desc"
+		})]);
+		setSubmissions(nextSubmissions);
+		setWorkflows(nextWorkflows);
+	}, [pageSize, source]);
+	const refresh = React.useCallback(async () => {
+		setBusyAction("refresh");
+		setError(null);
+		try {
+			await loadData();
+		} catch (nextError) {
+			setError(getErrorMessage(nextError));
+		} finally {
+			setBusyAction(null);
+		}
+	}, [loadData]);
+	const runAction = React.useCallback(async (key, action) => {
+		setBusyAction(key);
+		setError(null);
+		try {
+			await action();
+			await loadData();
+		} catch (nextError) {
+			setError(getErrorMessage(nextError));
+		} finally {
+			setBusyAction(null);
+		}
+	}, [loadData]);
+	React.useEffect(() => {
+		refresh();
+	}, [refresh]);
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cx("think-execution-workbench", className),
+		...props,
+		children: [
+			/* @__PURE__ */ jsxs("header", {
+				className: "think-execution-workbench__header",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "think-execution-workbench__heading",
+					children: [backButton, /* @__PURE__ */ jsx("h2", {
+						className: "think-execution-workbench__title",
+						children: title
+					})]
+				}), /* @__PURE__ */ jsxs(Button, {
+					type: "button",
+					variant: "outline",
+					color: "neutral",
+					size: "sm",
+					className: "think-execution-workbench__refresh",
+					"aria-label": "Refresh execution records",
+					disabled: busyAction !== null,
+					onClick: () => void refresh(),
+					children: [/* @__PURE__ */ jsx(RefreshIcon, {}), /* @__PURE__ */ jsx("span", { children: "Refresh" })]
+				})]
+			}),
+			error ? /* @__PURE__ */ jsx("div", {
+				className: "think-execution-workbench__error",
+				role: "alert",
+				children: error
+			}) : null,
+			/* @__PURE__ */ jsxs("div", {
+				className: "think-execution-workbench__sections",
+				"aria-busy": busyAction !== null,
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "think-execution-workbench__lists",
+					children: [/* @__PURE__ */ jsxs("section", {
+						className: "think-execution-workbench__section",
+						"aria-labelledby": submissionsId,
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__section-header",
+							children: [/* @__PURE__ */ jsx("h3", {
+								id: submissionsId,
+								children: "Submissions"
+							}), /* @__PURE__ */ jsx(Badge, {
+								color: "neutral",
+								size: "sm",
+								children: submissions.length
+							})]
+						}), busyAction === "refresh" && submissions.length === 0 ? /* @__PURE__ */ jsx("p", {
+							className: "think-execution-workbench__empty",
+							role: "status",
+							children: "Loading submissions..."
+						}) : submissions.length === 0 ? /* @__PURE__ */ jsx("p", {
+							className: "think-execution-workbench__empty",
+							children: "No submissions."
+						}) : /* @__PURE__ */ jsx("ul", {
+							className: "think-execution-workbench__list",
+							role: "list",
+							children: submissions.map((submission) => /* @__PURE__ */ jsxs("li", {
+								className: "think-execution-workbench__item",
+								"data-selected": selectedSubmission?.submissionId === submission.submissionId ? "true" : void 0,
+								children: [/* @__PURE__ */ jsxs("div", {
+									className: "think-execution-workbench__row-main",
+									children: [
+										/* @__PURE__ */ jsxs("div", {
+											className: "think-execution-workbench__item-topline",
+											children: [/* @__PURE__ */ jsx("code", { children: submission.submissionId }), /* @__PURE__ */ jsx(StatusBadge, {
+												color: submissionStatusColor(submission.status),
+												children: submission.status
+											})]
+										}),
+										/* @__PURE__ */ jsxs("p", {
+											className: "think-execution-workbench__row-meta",
+											children: [/* @__PURE__ */ jsxs("span", { children: ["Created ", formatTimestamp(submission.createdAt)] }), submission.idempotencyKey ? /* @__PURE__ */ jsxs("span", { children: ["Idempotency ", submission.idempotencyKey] }) : null]
+										}),
+										submission.error ? /* @__PURE__ */ jsx("p", {
+											className: "think-execution-workbench__item-error",
+											children: submission.error
+										}) : null
+									]
+								}), /* @__PURE__ */ jsxs("div", {
+									className: "think-execution-workbench__actions",
+									children: [
+										/* @__PURE__ */ jsx(Button, {
+											type: "button",
+											variant: "ghost",
+											color: "neutral",
+											size: "icon-xs",
+											"aria-label": `Inspect submission ${submission.submissionId}`,
+											disabled: busyAction !== null,
+											onClick: () => void runAction(`inspect-submission:${submission.submissionId}`, async () => {
+												setSelectedWorkflow(null);
+												setSelectedSubmission(await source.inspectSubmission(submission.submissionId));
+											}),
+											children: /* @__PURE__ */ jsx(SearchIcon, {})
+										}),
+										isSubmissionCancelable(submission.status) ? /* @__PURE__ */ jsx(Button, {
+											type: "button",
+											variant: "ghost",
+											color: "neutral",
+											size: "icon-xs",
+											"aria-label": `Cancel submission ${submission.submissionId}`,
+											disabled: busyAction !== null,
+											onClick: () => void runAction(`cancel-submission:${submission.submissionId}`, () => source.cancelSubmission(submission.submissionId)),
+											children: /* @__PURE__ */ jsx(SquareIcon, {})
+										}) : null,
+										/* @__PURE__ */ jsx(Button, {
+											type: "button",
+											variant: "ghost",
+											color: "destructive",
+											size: "icon-xs",
+											"aria-label": `Delete submission ${submission.submissionId}`,
+											disabled: busyAction !== null,
+											onClick: () => void runAction(`delete-submission:${submission.submissionId}`, () => source.deleteSubmission(submission.submissionId)),
+											children: /* @__PURE__ */ jsx(XIcon, {})
+										})
+									]
+								})]
+							}, submission.submissionId))
+						})]
+					}), /* @__PURE__ */ jsxs("section", {
+						className: "think-execution-workbench__section",
+						"aria-labelledby": executionsId,
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__section-header",
+							children: [/* @__PURE__ */ jsx("h3", {
+								id: executionsId,
+								children: "Tracked workflows"
+							}), /* @__PURE__ */ jsx(Badge, {
+								color: "neutral",
+								size: "sm",
+								children: workflows?.total ?? 0
+							})]
+						}), busyAction === "refresh" && workflows === null ? /* @__PURE__ */ jsx("p", {
+							className: "think-execution-workbench__empty",
+							role: "status",
+							children: "Loading workflows..."
+						}) : !workflows || workflows.workflows.length === 0 ? /* @__PURE__ */ jsx("p", {
+							className: "think-execution-workbench__empty",
+							children: "No tracked workflows."
+						}) : /* @__PURE__ */ jsx("ul", {
+							className: "think-execution-workbench__list",
+							role: "list",
+							children: workflows.workflows.map((workflow) => {
+								const workflowStatus = String(workflow.status);
+								return /* @__PURE__ */ jsxs("li", {
+									className: "think-execution-workbench__item",
+									"data-selected": selectedWorkflow?.workflowId === workflow.workflowId ? "true" : void 0,
+									children: [/* @__PURE__ */ jsxs("div", {
+										className: "think-execution-workbench__row-main",
+										children: [
+											/* @__PURE__ */ jsxs("div", {
+												className: "think-execution-workbench__item-topline",
+												children: [/* @__PURE__ */ jsx("code", { children: workflow.workflowName }), /* @__PURE__ */ jsx(StatusBadge, {
+													color: workflowStatusColor(workflow.status),
+													children: workflowStatus
+												})]
+											}),
+											/* @__PURE__ */ jsxs("p", {
+												className: "think-execution-workbench__row-meta",
+												children: [/* @__PURE__ */ jsx("span", { children: workflow.workflowId }), /* @__PURE__ */ jsxs("span", { children: ["Updated ", formatTimestamp(workflow.updatedAt)] })]
+											}),
+											workflow.error ? /* @__PURE__ */ jsxs("p", {
+												className: "think-execution-workbench__item-error",
+												children: [
+													workflow.error.name,
+													": ",
+													workflow.error.message
+												]
+											}) : null
+										]
+									}), /* @__PURE__ */ jsxs("div", {
+										className: "think-execution-workbench__actions",
+										children: [
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "neutral",
+												size: "icon-xs",
+												"aria-label": `Inspect workflow ${workflow.workflowId}`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`inspect-workflow:${workflow.workflowId}`, async () => {
+													setSelectedSubmission(null);
+													setSelectedWorkflow(await source.getWorkflow(workflow.workflowId) ?? workflow);
+												}),
+												children: /* @__PURE__ */ jsx(SearchIcon, {})
+											}),
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "neutral",
+												size: "icon-xs",
+												"aria-label": `Sync workflow ${workflow.workflowId} status`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`sync-workflow:${workflow.workflowId}`, () => source.getWorkflowStatus(workflow.workflowName, workflow.workflowId)),
+												children: /* @__PURE__ */ jsx(RefreshIcon, {})
+											}),
+											workflowStatus === "running" ? /* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "neutral",
+												size: "icon-xs",
+												"aria-label": `Pause workflow ${workflow.workflowId}`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`pause-workflow:${workflow.workflowId}`, () => source.pauseWorkflow(workflow.workflowId)),
+												children: /* @__PURE__ */ jsx(PauseIcon, {})
+											}) : null,
+											workflowStatus === "paused" ? /* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "neutral",
+												size: "icon-xs",
+												"aria-label": `Resume workflow ${workflow.workflowId}`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`resume-workflow:${workflow.workflowId}`, () => source.resumeWorkflow(workflow.workflowId)),
+												children: /* @__PURE__ */ jsx(PlayIcon, {})
+											}) : null,
+											isWorkflowTerminal(workflow.status) ? /* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "neutral",
+												size: "icon-xs",
+												"aria-label": `Restart workflow ${workflow.workflowId}`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`restart-workflow:${workflow.workflowId}`, () => source.restartWorkflow(workflow.workflowId)),
+												children: /* @__PURE__ */ jsx(RefreshIcon, {})
+											}) : null,
+											workflowStatus === "running" ? /* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "destructive",
+												size: "icon-xs",
+												"aria-label": `Terminate workflow ${workflow.workflowId}`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`terminate-workflow:${workflow.workflowId}`, () => source.terminateWorkflow(workflow.workflowId)),
+												children: /* @__PURE__ */ jsx(SquareIcon, {})
+											}) : null,
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: "ghost",
+												color: "destructive",
+												size: "icon-xs",
+												"aria-label": `Delete workflow ${workflow.workflowId}`,
+												disabled: busyAction !== null,
+												onClick: () => void runAction(`delete-workflow:${workflow.workflowId}`, () => source.deleteWorkflow(workflow.workflowId)),
+												children: /* @__PURE__ */ jsx(XIcon, {})
+											})
+										]
+									})]
+								}, workflow.workflowId);
+							})
+						})]
+					})]
+				}), /* @__PURE__ */ jsx("div", {
+					className: "think-execution-workbench__detail",
+					"aria-labelledby": inspectionId,
+					children: selectedSubmission ? /* @__PURE__ */ jsxs(Fragment, { children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__detail-header",
+							children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
+								className: "think-execution-workbench__eyebrow",
+								children: "Submission inspection"
+							}), /* @__PURE__ */ jsx("h3", {
+								id: inspectionId,
+								children: /* @__PURE__ */ jsx("code", { children: selectedSubmission.submissionId })
+							})] }), /* @__PURE__ */ jsx(StatusBadge, {
+								color: submissionStatusColor(selectedSubmission.status),
+								children: selectedSubmission.status
+							})]
+						}),
+						/* @__PURE__ */ jsxs("dl", {
+							className: "think-execution-workbench__meta think-execution-workbench__meta--detail",
+							children: [
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Created" }), /* @__PURE__ */ jsx("dd", { children: formatTimestamp(selectedSubmission.createdAt) })] }),
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Started" }), /* @__PURE__ */ jsx("dd", { children: formatTimestamp(selectedSubmission.startedAt) })] }),
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Completed" }), /* @__PURE__ */ jsx("dd", { children: formatTimestamp(selectedSubmission.completedAt) })] }),
+								selectedSubmission.requestId ? /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Request" }), /* @__PURE__ */ jsx("dd", { children: selectedSubmission.requestId })] }) : null,
+								selectedSubmission.idempotencyKey ? /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Idempotency" }), /* @__PURE__ */ jsx("dd", { children: selectedSubmission.idempotencyKey })] }) : null
+							]
+						}),
+						selectedSubmission.error ? /* @__PURE__ */ jsx("p", {
+							className: "think-execution-workbench__item-error",
+							children: selectedSubmission.error
+						}) : null,
+						selectedSubmission.metadata ? /* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__inspection",
+							children: [/* @__PURE__ */ jsx("h4", { children: "Metadata" }), /* @__PURE__ */ jsx("pre", {
+								tabIndex: 0,
+								children: formatJson(selectedSubmission.metadata)
+							})]
+						}) : null,
+						/* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__inspection",
+							children: [/* @__PURE__ */ jsx("h4", { children: "Raw record" }), /* @__PURE__ */ jsx("pre", {
+								tabIndex: 0,
+								children: formatJson(selectedSubmission)
+							})]
+						})
+					] }) : selectedWorkflow ? /* @__PURE__ */ jsxs(Fragment, { children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__detail-header",
+							children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
+								className: "think-execution-workbench__eyebrow",
+								children: "Workflow inspection"
+							}), /* @__PURE__ */ jsx("h3", {
+								id: inspectionId,
+								children: /* @__PURE__ */ jsx("code", { children: selectedWorkflow.workflowName })
+							})] }), /* @__PURE__ */ jsx(StatusBadge, {
+								color: workflowStatusColor(selectedWorkflow.status),
+								children: String(selectedWorkflow.status)
+							})]
+						}),
+						/* @__PURE__ */ jsxs("dl", {
+							className: "think-execution-workbench__meta think-execution-workbench__meta--detail",
+							children: [
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Instance" }), /* @__PURE__ */ jsx("dd", { children: selectedWorkflow.workflowId })] }),
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Created" }), /* @__PURE__ */ jsx("dd", { children: formatTimestamp(selectedWorkflow.createdAt) })] }),
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Updated" }), /* @__PURE__ */ jsx("dd", { children: formatTimestamp(selectedWorkflow.updatedAt) })] }),
+								/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: "Completed" }), /* @__PURE__ */ jsx("dd", { children: formatTimestamp(selectedWorkflow.completedAt) })] })
+							]
+						}),
+						selectedWorkflow.error ? /* @__PURE__ */ jsxs("p", {
+							className: "think-execution-workbench__item-error",
+							children: [
+								selectedWorkflow.error.name,
+								": ",
+								selectedWorkflow.error.message
+							]
+						}) : null,
+						selectedWorkflow.metadata ? /* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__inspection",
+							children: [/* @__PURE__ */ jsx("h4", { children: "Metadata" }), /* @__PURE__ */ jsx("pre", {
+								tabIndex: 0,
+								children: formatJson(selectedWorkflow.metadata)
+							})]
+						}) : null,
+						/* @__PURE__ */ jsxs("div", {
+							className: "think-execution-workbench__inspection",
+							children: [/* @__PURE__ */ jsx("h4", { children: "Raw record" }), /* @__PURE__ */ jsx("pre", {
+								tabIndex: 0,
+								children: formatJson(selectedWorkflow)
+							})]
+						})
+					] }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("h3", {
+						id: inspectionId,
+						children: "Inspection"
+					}), /* @__PURE__ */ jsx("p", {
+						className: "think-execution-workbench__empty think-execution-workbench__empty--detail",
+						children: "Inspect a submission or workflow."
+					})] })
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { ThinkExecutionWorkbench };