@loopstack/loopstack-studio 0.35.1 → 0.37.0

package/dist/features/run-view/useRunPrompts.js

@@ -0,0 +1,111 @@
+import { useLoopstackClient } from "../../packages/react/dist/provider.js";
+import "../../packages/react/dist/index.js";
+import { useDocumentConfigs } from "../../hooks/useConfig.js";
+import { promptRegistry } from "./prompts/registry.js";
+import { evaluateWorkflowPrompts, isAnswered, pickPrompt, toParkView } from "../../packages/contracts/dist/park-view/park-view.rules.js";
+import "../../packages/contracts/dist/park-view/index.js";
+import { useMemo } from "react";
+import { useQueries } from "@tanstack/react-query";
+function toWidgetConfig(e) {
+	let o = e.ui?.widgets?.[0];
+	if (!o) return;
+	let s = e.meta;
+	return {
+		widget: o.widget,
+		options: o.options,
+		enabledWhen: o.enabledWhen,
+		showWhen: o.showWhen,
+		schema: e.schema,
+		enableAtPlaces: s?.enableAtPlaces,
+		hideAtPlaces: s?.hideAtPlaces,
+		internal: e.tags?.includes("internal") || void 0
+	};
+}
+function toWorkflowInput(e) {
+	return {
+		id: e.id,
+		workflowName: e.workflowName,
+		status: e.status,
+		place: e.place ?? null,
+		availableTransitions: e.availableTransitions?.map((e) => e.id) ?? []
+	};
+}
+function useRunPrompts(d) {
+	let f = useLoopstackClient(), p = useDocumentConfigs(), m = useMemo(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let [o, s] of p) {
+			let c = toWidgetConfig(s);
+			c && e.set(o, c);
+		}
+		return e;
+	}, [p]), h = useMemo(() => [...new Set(d.map((e) => e.workflow.workflowName))], [d]), g = useQueries({ queries: h.map((e) => ({
+		...f.queries.workflowConfig(e),
+		staleTime: 6e4
+	})) }), _ = useMemo(() => {
+		let e = /* @__PURE__ */ new Map();
+		return h.forEach((o, s) => {
+			let c = g[s]?.data?.ui?.widgets ?? [];
+			e.set(o, c.map((e) => ({
+				widget: e.widget,
+				options: e.options,
+				enabledWhen: e.enabledWhen,
+				showWhen: e.showWhen
+			})));
+		}), e;
+	}, [h, ...g.map((e) => e.data)]);
+	return useMemo(() => {
+		let e = pickPrompt(d.flatMap((e) => {
+			let o = e.documents.filter((e) => !e.isInvalidated).map((e) => ({
+				documentName: e.documentName,
+				place: e.place ?? null,
+				content: e.content ?? null,
+				tags: e.tags
+			}));
+			return evaluateWorkflowPrompts(toWorkflowInput(e.workflow), o, m, _.get(e.workflow.workflowName) ?? []);
+		}), (e) => !!e.widget && promptRegistry.has(e.widget.widget)), o = (e) => e ? {
+			candidate: e,
+			view: toParkView(e)
+		} : void 0, l;
+		if (!e.prompt && !e.blocked) {
+			for (let e of d) if (!(e.workflow.status !== "running" && e.workflow.status !== "pending")) {
+				for (let o of _.get(e.workflow.workflowName) ?? []) {
+					if (!promptRegistry.has(o.widget) || o.showWhen && !o.showWhen.includes(e.workflow.place ?? "")) continue;
+					let c = {
+						kind: "workflow",
+						workflow: toWorkflowInput(e.workflow),
+						widget: o,
+						state: "disabled"
+					};
+					l = {
+						candidate: c,
+						view: toParkView(c)
+					};
+					break;
+				}
+				if (l) break;
+			}
+		}
+		let u = /* @__PURE__ */ new Map();
+		for (let e of d) if (e.workflow.status !== "completed") for (let o of _.get(e.workflow.workflowName) ?? []) {
+			if (o.widget !== "sandbox-run" || o.showWhen && !o.showWhen.includes(e.workflow.place ?? "")) continue;
+			let s = o.options;
+			u.set(s?.slotId ?? "", {
+				slotId: s?.slotId,
+				label: s?.label
+			});
+		}
+		return {
+			picked: o(e.prompt),
+			blocked: o(e.blocked),
+			fallback: o(e.fallback),
+			idlePrompt: l,
+			answered: (e) => isAnswered(e.content),
+			sandboxSlots: [...u.values()]
+		};
+	}, [
+		d,
+		m,
+		_
+	]);
+}
+export { useRunPrompts };

package/dist/features/run-view/useRunTree.js

@@ -0,0 +1,59 @@
+import { useLoopstackClient } from "../../packages/react/dist/provider.js";
+import { SortOrder } from "../../packages/contracts/dist/enums/sort-order.enum.js";
+import "../../packages/contracts/dist/enums/index.js";
+import "../../packages/react/dist/index.js";
+import { useEffect, useMemo, useState } from "react";
+import { useQueries } from "@tanstack/react-query";
+var DOCUMENTS_PAGE_SIZE = 100, DOCUMENTS_MAX_PAGES = 5;
+function allDocumentsQuery(e, r) {
+	return {
+		queryKey: [...e.queries.documents(r).queryKey, "all"],
+		queryFn: async () => {
+			let i = [];
+			for (let a = 0; a < DOCUMENTS_MAX_PAGES; a++) {
+				let o = await e.documents.list({
+					filter: { workflowId: r },
+					sortBy: [{
+						field: "index",
+						order: SortOrder.ASC
+					}],
+					page: a,
+					limit: DOCUMENTS_PAGE_SIZE
+				});
+				if (i.push(...o.data), o.data.length < DOCUMENTS_PAGE_SIZE) break;
+			}
+			return i;
+		}
+	};
+}
+function useRunTree(n) {
+	let s = useLoopstackClient(), [c, l] = useState(n ? [n] : []), u = useMemo(() => new Map(n ? [[n, 0]] : []), [n]);
+	useEffect(() => {
+		l(n ? [n] : []);
+	}, [n]);
+	let d = useQueries({ queries: c.map((e) => ({ ...s.queries.workflow(e) })) }), f = useQueries({ queries: c.map((e) => ({ ...s.queries.childWorkflows(e) })) }), p = useQueries({ queries: c.map((e) => allDocumentsQuery(s, e)) });
+	return useEffect(() => {
+		let e = new Set(c), n = [];
+		c.forEach((r, i) => {
+			let a = f[i]?.data?.data ?? [];
+			for (let i of a) e.has(i.id) || (e.add(i.id), u.set(i.id, (u.get(r) ?? 0) + 1), n.push(i.id));
+		}), n.length > 0 && l((e) => [...e, ...n]);
+	}, [c, ...f.map((e) => e.data)]), {
+		nodes: useMemo(() => c.map((e, n) => {
+			let r = d[n]?.data;
+			if (r) return {
+				workflowId: e,
+				depth: u.get(e) ?? 0,
+				workflow: r,
+				documents: p[n]?.data ?? []
+			};
+		}).filter((e) => e !== void 0), [
+			c,
+			u,
+			...d.map((e) => e.data),
+			...p.map((e) => e.data)
+		]),
+		isLoading: d[0]?.isLoading ?? !0
+	};
+}
+export { useRunTree };

package/dist/features/run-view/useTreeLlmStreams.js

@@ -0,0 +1,91 @@
+import { useLoopstackClient } from "../../packages/react/dist/provider.js";
+import { isLlmResponseEvent } from "../../packages/contracts/dist/events/client-message.schema.js";
+import "../../packages/contracts/dist/events/index.js";
+import { reduceLlmStream } from "../../packages/client/dist/stream/llm-reducer.js";
+import "../../packages/client/dist/index.js";
+import "../../packages/react/dist/index.js";
+import { c } from "react/compiler-runtime";
+import { useEffect, useMemo, useState } from "react";
+function useTreeLlmStreams(a) {
+	let s = c(9), l = useLoopstackClient(), u;
+	s[0] === Symbol.for("react.memo_cache_sentinel") ? (u = {}, s[0] = u) : u = s[0];
+	let [d, f] = useState(u), p;
+	s[1] === a ? p = s[2] : (p = a.join(","), s[1] = a, s[2] = p);
+	let m = p, h;
+	s[3] !== l.stream || s[4] !== m ? (h = () => {
+		let e = new Set(m.split(",").filter(Boolean));
+		return l.stream.onAny((r) => {
+			"userId" in r && isLlmResponseEvent(r) && e.has(r.workflowId) && f((e) => ({
+				...e,
+				[r.workflowId]: reduceLlmStream(e[r.workflowId] ?? {}, r)
+			}));
+		});
+	}, s[3] = l.stream, s[4] = m, s[5] = h) : h = s[5];
+	let g;
+	return s[6] !== l || s[7] !== m ? (g = [l, m], s[6] = l, s[7] = m, s[8] = g) : g = s[8], useEffect(h, g), d;
+}
+function getLlmMessageId(e) {
+	let t = e.content;
+	return e.documentName === "llm_message" && typeof t?.id == "string" ? t.id : void 0;
+}
+function toStreamingDocument(e, t, n) {
+	let r = n.error ? `Error while streaming response: ${n.error}` : n.text, i = [
+		...n.thinking ? [{
+			type: "thinking",
+			text: n.thinking
+		}] : [],
+		{
+			type: "text",
+			text: r
+		},
+		...n.toolCalls.map((e) => ({
+			type: "tool_call",
+			...e
+		}))
+	], a = (/* @__PURE__ */ new Date()).toISOString();
+	return {
+		id: `streaming-${n.messageId}`,
+		documentName: "llm_message",
+		content: {
+			id: n.messageId,
+			role: "assistant",
+			text: r,
+			blocks: i
+		},
+		validationError: null,
+		meta: { streaming: !n.completed && !n.error },
+		isInvalidated: !1,
+		index: 2 ** 53 - 1,
+		transition: null,
+		place: t,
+		labels: [],
+		tags: ["message"],
+		createdAt: a,
+		updatedAt: a,
+		workspaceId: "",
+		workflowId: e
+	};
+}
+function mergeStreamingDocuments(e, t, n, r) {
+	let i = Object.values(r ?? {});
+	if (i.length === 0) return n;
+	let a = new Set(n.map(getLlmMessageId).filter((e) => !!e)), o = i.filter((e) => !a.has(e.messageId)).map((n) => toStreamingDocument(e, t ?? "", n));
+	return o.length > 0 ? [...n, ...o] : n;
+}
+function useStreamingNodes(e) {
+	let t = c(7), n;
+	t[0] === e ? n = t[1] : (n = e.map(_temp), t[0] = e, t[1] = n);
+	let i = useTreeLlmStreams(n), a;
+	if (t[2] !== e || t[3] !== i) {
+		let n;
+		t[5] === i ? n = t[6] : (n = (e) => ({
+			...e,
+			documents: mergeStreamingDocuments(e.workflowId, e.workflow.place ?? null, e.documents, i[e.workflowId])
+		}), t[5] = i, t[6] = n), a = e.map(n), t[2] = e, t[3] = i, t[4] = a;
+	} else a = t[4];
+	return a;
+}
+function _temp(e) {
+	return e.workflowId;
+}
+export { useStreamingNodes };

package/dist/features/secrets/components/WorkbenchSecretsPanel.js

@@ -1,10 +1,10 @@
 import { Button } from "../../../components/ui/button.js";
 import { Input } from "../../../components/ui/input.js";
 import { Label } from "../../../components/ui/label.js";
+import { useCreateSecret, useDeleteSecret, useUpdateSecret, useWorkspaceSecrets } from "../../../hooks/useSecrets.js";
 import { useWorkbenchLayout } from "../../workbench/providers/WorkbenchLayoutProvider.js";
 import { SidebarPanel } from "../../workbench/components/SidebarPanel.js";
 import "../../workbench/index.js";
-import { useCreateSecret, useDeleteSecret, useUpdateSecret, useWorkspaceSecrets } from "../../../hooks/useSecrets.js";
 import { c } from "react/compiler-runtime";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/features/secrets/renderers/SecretInputRenderer.js

@@ -5,9 +5,9 @@ import { Input } from "../../../components/ui/input.js";
 import { Label } from "../../../components/ui/label.js";
 import CompletionMessagePaper_default from "../../../components/messages/CompletionMessagePaper.js";
 import "../../../hooks/useProcessor.js";
+import { useUpsertSecret } from "../../../hooks/useSecrets.js";
 import { useWorkbenchLayout } from "../../workbench/providers/WorkbenchLayoutProvider.js";
 import "../../workbench/index.js";
-import { useUpsertSecret } from "../../../hooks/useSecrets.js";
 import React, { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Info, KeyRound, Loader2 } from "lucide-react";

package/dist/features/workbench/WorkflowList.js

@@ -1,10 +1,13 @@
 import { useChildWorkflows, useWorkflowConfigByName } from "../../hooks/useWorkflows.js";
+import { useOptionalStudioPreferences } from "../../providers/StudioPreferencesProvider.js";
+import { cn } from "../../lib/utils.js";
 import { Button } from "../../components/ui/button.js";
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from "../../components/ui/dialog.js";
 import { Tooltip, TooltipContent, TooltipTrigger } from "../../components/ui/tooltip.js";
 import { ReactFlowProvider } from "../../node_modules/@xyflow/react/dist/esm/index.js";
 import WorkflowFlowViewer_default from "../debug/components/WorkflowFlowViewer.js";
 import "../debug/index.js";
+import { RunView } from "../run-view/RunView.js";
 import WorkflowItem_default from "./WorkflowItem.js";
 import WorkbenchSettingsModal_default from "./components/WorkbenchSettingsModal.js";
 import WorkflowHistoryList_default from "./components/WorkflowHistoryList.js";
@@ -13,35 +16,84 @@ import { useWorkflowListState } from "./hooks/useWorkflowListState.js";
 import { c } from "react/compiler-runtime";
 import React, { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ArrowDownIcon, ListOrdered, Workflow } from "lucide-react";
-var WorkflowList_default = (S) => {
-	let C = c(43), { workflow: w } = S, [T, E] = useState(!1), D;
-	C[0] === Symbol.for("react.memo_cache_sentinel") ? (D = {
+import { ArrowDownIcon, Layers, ListOrdered, ListVideo, Workflow } from "lucide-react";
+var WorkflowList_default = (t) => {
+	let n = c(72), { workflow: r } = t, [i, a] = useState(!1), o;
+	n[0] === Symbol.for("react.memo_cache_sentinel") ? (o = {
 		enableDebugMode: !1,
 		showFullMessageHistory: !1
-	}, C[0] = D) : D = C[0];
-	let [O, k] = useState(D), { listRef: A, scrollTo: j, canScrollDown: M, scrollToBottom: N } = useWorkflowListState(), P = useWorkflowConfigByName(w.workflowName), F = useChildWorkflows(w.id), I;
-	C[1] === F.data ? I = C[2] : (I = F.data ?? [], C[1] = F.data, C[2] = I);
-	let L = I, R;
-	C[3] !== M || C[4] !== N ? (R = M && /* @__PURE__ */ jsx(Button, {
+	}, n[0] = o) : o = n[0];
+	let [s, l] = useState(o), u = useOptionalStudioPreferences(), [ke, d] = useState("classic"), f = u?.preferences.workbenchView ?? ke, p;
+	n[1] === u ? p = n[2] : (p = (e) => u ? u.setPreference("workbenchView", e) : d(e), n[1] = u, n[2] = p);
+	let m = p, { listRef: h, scrollTo: g, canScrollDown: _, scrollToBottom: v } = useWorkflowListState(), y = useWorkflowConfigByName(r.workflowName), b = useChildWorkflows(r.id), x;
+	n[3] === b.data ? x = n[4] : (x = b.data ?? [], n[3] = b.data, n[4] = x);
+	let S = x, C;
+	n[5] !== _ || n[6] !== v ? (C = _ && /* @__PURE__ */ jsx(Button, {
 		variant: "outline",
 		size: "icon",
-		onClick: N,
+		onClick: v,
 		className: "bg-background/80 fixed right-[calc(var(--sidebar-width)+1.5rem)] bottom-6 z-50 rounded-full shadow-md backdrop-blur-sm",
 		children: /* @__PURE__ */ jsx(ArrowDownIcon, { className: "size-4" })
-	}), C[3] = M, C[4] = N, C[5] = R) : R = C[5];
-	let z = P.data?.title ?? w.workflowName, B;
-	C[6] === z ? B = C[7] : (B = /* @__PURE__ */ jsx("span", {
+	}), n[5] = _, n[6] = v, n[7] = C) : C = n[7];
+	let w = y.data?.title ?? r.workflowName, T;
+	n[8] === w ? T = n[9] : (T = /* @__PURE__ */ jsx("span", {
 		className: "flex-1 truncate text-sm",
-		children: z
-	}), C[6] = z, C[7] = B);
+		children: w
+	}), n[8] = w, n[9] = T);
+	let E = f === "classic" && "bg-accent text-accent-foreground", D;
+	n[10] === E ? D = n[11] : (D = cn("h-6 w-6", E), n[10] = E, n[11] = D);
+	let O;
+	n[12] === m ? O = n[13] : (O = () => m("classic"), n[12] = m, n[13] = O);
+	let k;
+	n[14] === Symbol.for("react.memo_cache_sentinel") ? (k = /* @__PURE__ */ jsx(Layers, { className: "h-3.5 w-3.5" }), n[14] = k) : k = n[14];
+	let A;
+	n[15] !== D || n[16] !== O ? (A = /* @__PURE__ */ jsx(TooltipTrigger, {
+		asChild: !0,
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "icon",
+			className: D,
+			onClick: O,
+			children: k
+		})
+	}), n[15] = D, n[16] = O, n[17] = A) : A = n[17];
+	let j;
+	n[18] === Symbol.for("react.memo_cache_sentinel") ? (j = /* @__PURE__ */ jsx(TooltipContent, { children: "Classic view" }), n[18] = j) : j = n[18];
+	let M;
+	n[19] === A ? M = n[20] : (M = /* @__PURE__ */ jsxs(Tooltip, { children: [A, j] }), n[19] = A, n[20] = M);
+	let N = f === "run" && "bg-accent text-accent-foreground", P;
+	n[21] === N ? P = n[22] : (P = cn("h-6 w-6", N), n[21] = N, n[22] = P);
+	let F;
+	n[23] === m ? F = n[24] : (F = () => m("run"), n[23] = m, n[24] = F);
+	let I;
+	n[25] === Symbol.for("react.memo_cache_sentinel") ? (I = /* @__PURE__ */ jsx(ListVideo, { className: "h-3.5 w-3.5" }), n[25] = I) : I = n[25];
+	let L;
+	n[26] !== P || n[27] !== F ? (L = /* @__PURE__ */ jsx(TooltipTrigger, {
+		asChild: !0,
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "icon",
+			className: P,
+			onClick: F,
+			children: I
+		})
+	}), n[26] = P, n[27] = F, n[28] = L) : L = n[28];
+	let R;
+	n[29] === Symbol.for("react.memo_cache_sentinel") ? (R = /* @__PURE__ */ jsx(TooltipContent, { children: "Run view" }), n[29] = R) : R = n[29];
+	let z;
+	n[30] === L ? z = n[31] : (z = /* @__PURE__ */ jsxs(Tooltip, { children: [L, R] }), n[30] = L, n[31] = z);
+	let B;
+	n[32] !== M || n[33] !== z ? (B = /* @__PURE__ */ jsxs("div", {
+		className: "border-input mr-1 flex items-center rounded-md border p-0.5",
+		children: [M, z]
+	}), n[32] = M, n[33] = z, n[34] = B) : B = n[34];
 	let V;
-	C[8] === w ? V = C[9] : (V = /* @__PURE__ */ jsx(WorkflowButtons_default, {
-		workflow: w,
-		workflowId: w.id
-	}), C[8] = w, C[9] = V);
+	n[35] === r ? V = n[36] : (V = /* @__PURE__ */ jsx(WorkflowButtons_default, {
+		workflow: r,
+		workflowId: r.id
+	}), n[35] = r, n[36] = V);
 	let H;
-	C[10] === Symbol.for("react.memo_cache_sentinel") ? (H = /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
+	n[37] === Symbol.for("react.memo_cache_sentinel") ? (H = /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
 		asChild: !0,
 		children: /* @__PURE__ */ jsx(DialogTrigger, {
 			asChild: !0,
@@ -52,19 +104,19 @@ var WorkflowList_default = (S) => {
 				children: /* @__PURE__ */ jsx(ListOrdered, { className: "h-5 w-5" })
 			})
 		})
-	}), /* @__PURE__ */ jsx(TooltipContent, { children: "Run Log" })] }), C[10] = H) : H = C[10];
+	}), /* @__PURE__ */ jsx(TooltipContent, { children: "Run Log" })] }), n[37] = H) : H = n[37];
 	let U;
-	C[11] === Symbol.for("react.memo_cache_sentinel") ? (U = /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Run Log" }) }), C[11] = U) : U = C[11];
+	n[38] === Symbol.for("react.memo_cache_sentinel") ? (U = /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Run Log" }) }), n[38] = U) : U = n[38];
 	let W;
-	C[12] === w ? W = C[13] : (W = /* @__PURE__ */ jsxs(Dialog, { children: [H, /* @__PURE__ */ jsxs(DialogContent, {
+	n[39] === r ? W = n[40] : (W = /* @__PURE__ */ jsxs(Dialog, { children: [H, /* @__PURE__ */ jsxs(DialogContent, {
 		className: "sm:max-w-lg max-h-[80vh] overflow-hidden flex flex-col",
 		children: [U, /* @__PURE__ */ jsx("div", {
 			className: "flex-1 overflow-auto",
-			children: /* @__PURE__ */ jsx(WorkflowHistoryList_default, { workflow: w })
+			children: /* @__PURE__ */ jsx(WorkflowHistoryList_default, { workflow: r })
 		})]
-	})] }), C[12] = w, C[13] = W);
+	})] }), n[39] = r, n[40] = W);
 	let G;
-	C[14] === Symbol.for("react.memo_cache_sentinel") ? (G = /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
+	n[41] === Symbol.for("react.memo_cache_sentinel") ? (G = /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
 		asChild: !0,
 		children: /* @__PURE__ */ jsx(DialogTrigger, {
 			asChild: !0,
@@ -75,36 +127,37 @@ var WorkflowList_default = (S) => {
 				children: /* @__PURE__ */ jsx(Workflow, { className: "h-5 w-5" })
 			})
 		})
-	}), /* @__PURE__ */ jsx(TooltipContent, { children: "Graph" })] }), C[14] = G) : G = C[14];
+	}), /* @__PURE__ */ jsx(TooltipContent, { children: "Graph" })] }), n[41] = G) : G = n[41];
 	let K;
-	C[15] === Symbol.for("react.memo_cache_sentinel") ? (K = /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Graph" }) }), C[15] = K) : K = C[15];
+	n[42] === Symbol.for("react.memo_cache_sentinel") ? (K = /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Graph" }) }), n[42] = K) : K = n[42];
 	let q;
-	C[16] !== L || C[17] !== w ? (q = [w, ...L], C[16] = L, C[17] = w, C[18] = q) : q = C[18];
+	n[43] !== S || n[44] !== r ? (q = [r, ...S], n[43] = S, n[44] = r, n[45] = q) : q = n[45];
 	let J;
-	C[19] !== P.data || C[20] !== q || C[21] !== w.id ? (J = /* @__PURE__ */ jsxs(Dialog, { children: [G, /* @__PURE__ */ jsxs(DialogContent, {
+	n[46] !== y.data || n[47] !== q || n[48] !== r.id ? (J = /* @__PURE__ */ jsxs(Dialog, { children: [G, /* @__PURE__ */ jsxs(DialogContent, {
 		className: "sm:max-w-4xl h-[70vh] overflow-hidden flex flex-col",
 		children: [K, /* @__PURE__ */ jsx("div", {
 			className: "flex-1 overflow-hidden",
 			children: /* @__PURE__ */ jsx(ReactFlowProvider, { children: /* @__PURE__ */ jsx(WorkflowFlowViewer_default, {
-				workflowId: w.id,
+				workflowId: r.id,
 				workflows: q,
-				workflowConfig: P.data
+				workflowConfig: y.data
 			}) })
 		})]
-	})] }), C[19] = P.data, C[20] = q, C[21] = w.id, C[22] = J) : J = C[22];
+	})] }), n[46] = y.data, n[47] = q, n[48] = r.id, n[49] = J) : J = n[49];
 	let Y;
-	C[23] !== T || C[24] !== O ? (Y = /* @__PURE__ */ jsx(WorkbenchSettingsModal_default, {
-		settings: O,
-		onSettingsChange: k,
-		open: T,
-		onOpenChange: E
-	}), C[23] = T, C[24] = O, C[25] = Y) : Y = C[25];
+	n[50] !== i || n[51] !== s ? (Y = /* @__PURE__ */ jsx(WorkbenchSettingsModal_default, {
+		settings: s,
+		onSettingsChange: l,
+		open: i,
+		onOpenChange: a
+	}), n[50] = i, n[51] = s, n[52] = Y) : Y = n[52];
 	let X;
-	C[26] !== J || C[27] !== Y || C[28] !== B || C[29] !== V || C[30] !== W ? (X = /* @__PURE__ */ jsx("div", {
+	n[53] !== B || n[54] !== V || n[55] !== W || n[56] !== J || n[57] !== Y || n[58] !== T ? (X = /* @__PURE__ */ jsx("div", {
 		className: "bg-background/95 supports-[backdrop-filter]:bg-background/60 sticky top-0 z-10 backdrop-blur",
 		children: /* @__PURE__ */ jsxs("div", {
 			className: "flex w-full items-center gap-2 rounded-md p-2 px-3 text-left text-sm font-medium",
 			children: [
+				T,
 				B,
 				V,
 				W,
@@ -112,24 +165,30 @@ var WorkflowList_default = (S) => {
 				Y
 			]
 		})
-	}), C[26] = J, C[27] = Y, C[28] = B, C[29] = V, C[30] = W, C[31] = X) : X = C[31];
+	}), n[53] = B, n[54] = V, n[55] = W, n[56] = J, n[57] = Y, n[58] = T, n[59] = X) : X = n[59];
 	let Z;
-	C[32] !== j || C[33] !== O || C[34] !== w ? (Z = /* @__PURE__ */ jsx("div", {
+	n[60] !== g || n[61] !== s || n[62] !== f || n[63] !== r ? (Z = /* @__PURE__ */ jsx("div", {
 		className: "max-w-4xl py-1",
-		children: /* @__PURE__ */ jsx(WorkflowItem_default, {
-			workflow: w,
-			workflowId: w.id,
-			scrollTo: j,
-			settings: O
+		children: f === "run" ? /* @__PURE__ */ jsx("div", {
+			className: "p-4",
+			children: /* @__PURE__ */ jsx(RunView, {
+				workflowId: r.id,
+				settings: s
+			})
+		}) : /* @__PURE__ */ jsx(WorkflowItem_default, {
+			workflow: r,
+			workflowId: r.id,
+			scrollTo: g,
+			settings: s
 		})
-	}), C[32] = j, C[33] = O, C[34] = w, C[35] = Z) : Z = C[35];
+	}), n[60] = g, n[61] = s, n[62] = f, n[63] = r, n[64] = Z) : Z = n[64];
 	let Q;
-	C[36] !== A || C[37] !== X || C[38] !== Z ? (Q = /* @__PURE__ */ jsxs("div", {
+	n[65] !== h || n[66] !== X || n[67] !== Z ? (Q = /* @__PURE__ */ jsxs("div", {
 		className: "mb-10",
-		ref: A,
+		ref: h,
 		children: [X, Z]
-	}), C[36] = A, C[37] = X, C[38] = Z, C[39] = Q) : Q = C[39];
+	}), n[65] = h, n[66] = X, n[67] = Z, n[68] = Q) : Q = n[68];
 	let $;
-	return C[40] !== Q || C[41] !== R ? ($ = /* @__PURE__ */ jsxs("div", { children: [R, Q] }), C[40] = Q, C[41] = R, C[42] = $) : $ = C[42], $;
+	return n[69] !== Q || n[70] !== C ? ($ = /* @__PURE__ */ jsxs("div", { children: [C, Q] }), n[69] = Q, n[70] = C, n[71] = $) : $ = n[71], $;
 };
 export { WorkflowList_default as default };

package/dist/features/workbench/components/EnvironmentSelector.js

@@ -0,0 +1,46 @@
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../../components/ui/select.js";
+import { useWorkbenchLayout } from "../providers/WorkbenchLayoutProvider.js";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+function EnvironmentSelector() {
+	let u = c(11), { environments: d, selectedSlotId: f, setSelectedSlotId: p } = useWorkbenchLayout(), m;
+	u[0] === d ? m = u[1] : (m = d ?? [], u[0] = d, u[1] = m);
+	let h = m;
+	if (h.length <= 1) return null;
+	let g;
+	u[2] === Symbol.for("react.memo_cache_sentinel") ? (g = /* @__PURE__ */ jsx(SelectTrigger, {
+		className: "h-7 text-xs",
+		children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select environment" })
+	}), u[2] = g) : g = u[2];
+	let _;
+	u[3] === h ? _ = u[4] : (_ = h.map(_temp), u[3] = h, u[4] = _);
+	let v;
+	u[5] === _ ? v = u[6] : (v = /* @__PURE__ */ jsx(SelectContent, { children: _ }), u[5] = _, u[6] = v);
+	let y;
+	return u[7] !== f || u[8] !== p || u[9] !== v ? (y = /* @__PURE__ */ jsx("div", {
+		className: "border-b px-3 py-2",
+		children: /* @__PURE__ */ jsxs(Select, {
+			value: f,
+			onValueChange: p,
+			children: [g, v]
+		})
+	}), u[7] = f, u[8] = p, u[9] = v, u[10] = y) : y = u[10], y;
+}
+function _temp(e) {
+	return /* @__PURE__ */ jsx(SelectItem, {
+		value: e.slotId,
+		className: "text-xs",
+		children: /* @__PURE__ */ jsxs("span", {
+			className: "flex items-center gap-2",
+			children: [
+				/* @__PURE__ */ jsx("span", { className: `h-1.5 w-1.5 rounded-full ${e.status === "running" ? "bg-green-500" : "bg-muted-foreground/40"}` }),
+				e.envName || e.slotId,
+				e.status !== "running" && /* @__PURE__ */ jsx("span", {
+					className: "text-muted-foreground",
+					children: "(stopped)"
+				})
+			]
+		})
+	}, e.slotId);
+}
+export { EnvironmentSelector };

package/dist/features/workbench/components/NewRunDialog.js

@@ -8,8 +8,8 @@ import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../co
 import { Dialog, DialogContent, DialogTitle } from "../../../components/ui/dialog.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../../components/ui/select.js";
 import ErrorSnackbar_default from "../../../components/feedback/ErrorSnackbar.js";
-import "../../../hooks/useProcessor.js";
 import Form_default from "../../../components/dynamic-form/Form.js";
+import "../../../hooks/useProcessor.js";
 import CreateWorkspace_default from "../../workspaces/components/CreateWorkspace.js";
 import "../../workspaces/index.js";
 import { c } from "react/compiler-runtime";

package/dist/features/workbench/index.js

@@ -2,7 +2,7 @@ import WorkflowItem_default from "./WorkflowItem.js";
 import WorkflowHistoryList_default from "./components/WorkflowHistoryList.js";
 import WorkflowButtons_default from "./components/buttons/WorkflowButtons.js";
 import WorkflowList_default from "./WorkflowList.js";
-import { useWorkbenchLayout } from "./providers/WorkbenchLayoutProvider.js";
+import { useOptionalWorkbenchLayout, useWorkbenchLayout } from "./providers/WorkbenchLayoutProvider.js";
 import { WorkbenchSidebarShell } from "./components/WorkbenchSidebarShell.js";
 import Workbench from "./Workbench.js";
 import { NewRunDialog } from "./components/NewRunDialog.js";