@loopstack/loopstack-studio 0.35.1 → 0.37.0

package/dist/features/documents/DocumentRenderer.js

@@ -2,19 +2,19 @@ import { useDocumentConfigs } from "../../hooks/useConfig.js";
 import CompletionMessagePaper_default from "../../components/messages/CompletionMessagePaper.js";
 import { useFeatureRegistry } from "../feature-registry/FeatureRegistryProvider.js";
 import "../feature-registry/index.js";
-import OAuthPromptRenderer_default from "../oauth/OAuthPromptRenderer.js";
-import "../oauth/index.js";
 import AiMessage_default from "./renderers/AiMessage.js";
-import ChoicesRenderer_default from "./renderers/ChoicesRenderer.js";
-import ConfirmPromptRenderer_default from "./renderers/ConfirmPromptRenderer.js";
 import DocumentDebugRenderer_default from "./renderers/DocumentDebugRenderer.js";
 import DocumentFormRenderer_default from "./renderers/DocumentFormRenderer.js";
 import DocumentMessageRenderer_default from "./renderers/DocumentMessageRenderer.js";
 import ErrorMessageRenderer_default from "./renderers/ErrorMessageRenderer.js";
-import LinkMessageRenderer_default from "./renderers/LinkMessageRenderer.js";
 import LlmMessage_default from "./renderers/LlmMessage.js";
 import MarkdownMessageRenderer_default from "./renderers/MarkdownMessageRenderer.js";
 import PlainMessageRenderer_default from "./renderers/PlainMessageRenderer.js";
+import OAuthPromptRenderer_default from "../oauth/OAuthPromptRenderer.js";
+import "../oauth/index.js";
+import ChoicesRenderer_default from "./renderers/ChoicesRenderer.js";
+import ConfirmPromptRenderer_default from "./renderers/ConfirmPromptRenderer.js";
+import LinkMessageRenderer_default from "./renderers/LinkMessageRenderer.js";
 import TextPromptRenderer_default from "./renderers/TextPromptRenderer.js";
 import { c } from "react/compiler-runtime";
 import React, { useMemo } from "react";
@@ -52,11 +52,11 @@ var coreRendererRegistry = new Map([
 		workflow: e,
 		document: g
 	})],
-	["oauth-prompt", ({ parentWorkflow: e, workflow: g, document: _, isActive: y }) => /* @__PURE__ */ jsx(OAuthPromptRenderer_default, {
+	["oauth-prompt", ({ parentWorkflow: e, workflow: g, document: _, isActive: v }) => /* @__PURE__ */ jsx(OAuthPromptRenderer_default, {
 		parentWorkflow: e,
 		workflow: g,
 		document: _,
-		isActive: y
+		isActive: v
 	})],
 	["text-prompt", ({ parentWorkflow: e, workflow: g, document: _, isActive: v }) => /* @__PURE__ */ jsx(TextPromptRenderer_default, {
 		parentWorkflow: e,

package/dist/features/documents/renderers/DocumentFormRenderer.js

@@ -1,8 +1,8 @@
 import { useRunWorkflow } from "../../../packages/react/dist/hooks/mutations.js";
 import { useDocumentConfigs } from "../../../hooks/useConfig.js";
 import { Button } from "../../../components/ui/button.js";
-import "../../../hooks/useProcessor.js";
 import Form_default from "../../../components/dynamic-form/Form.js";
+import "../../../hooks/useProcessor.js";
 import { c } from "react/compiler-runtime";
 import React, { useEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/features/documents/renderers/DocumentMessageRenderer.js

@@ -2,7 +2,8 @@ import CompletionMessagePaper_default from "../../../components/messages/Complet
 import MarkdownContent_default from "../../../components/dynamic-form/MarkdownContent.js";
 import { c } from "react/compiler-runtime";
 import React from "react";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Info } from "lucide-react";
 var KNOWN_ROLES = [
 	"system",
 	"user",
@@ -10,13 +11,26 @@ var KNOWN_ROLES = [
 	"tool",
 	"error",
 	"document"
-], DocumentMessageRenderer_default = (a) => {
-	let o = c(5), { document: s } = a, { role: l, text: u } = s.content, d = KNOWN_ROLES.includes(l ?? "") ? l : void 0, f = u ?? "", p;
-	o[0] === f ? p = o[1] : (p = /* @__PURE__ */ jsx(MarkdownContent_default, { content: f }), o[0] = f, o[1] = p);
-	let m;
-	return o[2] !== d || o[3] !== p ? (m = /* @__PURE__ */ jsx(CompletionMessagePaper_default, {
-		role: d,
-		children: p
-	}), o[2] = d, o[3] = p, o[4] = m) : m = o[4], m;
+], DocumentMessageRenderer_default = (s) => {
+	let l = c(8), { document: u } = s, { role: d, text: f } = u.content, p = KNOWN_ROLES.includes(d ?? "") ? d : void 0;
+	if (p === "system") {
+		let e;
+		l[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx(Info, { className: "mt-0.5 size-3.5 shrink-0 opacity-70" }), l[0] = e) : e = l[0];
+		let o = f ?? "", s;
+		return l[1] === o ? s = l[2] : (s = /* @__PURE__ */ jsxs("div", {
+			className: "text-muted-foreground flex items-start gap-1.5 px-1 py-0.5 text-sm leading-relaxed [&_p]:m-0",
+			children: [e, /* @__PURE__ */ jsx("div", {
+				className: "min-w-0",
+				children: /* @__PURE__ */ jsx(MarkdownContent_default, { content: o })
+			})]
+		}), l[1] = o, l[2] = s), s;
+	}
+	let m = f ?? "", h;
+	l[3] === m ? h = l[4] : (h = /* @__PURE__ */ jsx(MarkdownContent_default, { content: m }), l[3] = m, l[4] = h);
+	let g;
+	return l[5] !== p || l[6] !== h ? (g = /* @__PURE__ */ jsx(CompletionMessagePaper_default, {
+		role: p,
+		children: h
+	}), l[5] = p, l[6] = h, l[7] = g) : g = l[7], g;
 };
 export { DocumentMessageRenderer_default as default };

package/dist/features/documents/renderers/LlmMessage.js

@@ -8,16 +8,50 @@ import { Fragment } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CopyIcon } from "lucide-react";
 var CopyActions = (e) => {
-	let _ = c(5), { text: v } = e, y;
-	_[0] === v ? y = _[1] : (y = () => void navigator.clipboard.writeText(v), _[0] = v, _[1] = y);
+	let g = c(5), { text: _ } = e, v;
+	g[0] === _ ? v = g[1] : (v = () => void navigator.clipboard.writeText(_), g[0] = _, g[1] = v);
+	let y;
+	g[2] === Symbol.for("react.memo_cache_sentinel") ? (y = /* @__PURE__ */ jsx(CopyIcon, { className: "size-3" }), g[2] = y) : y = g[2];
 	let b;
-	_[2] === Symbol.for("react.memo_cache_sentinel") ? (b = /* @__PURE__ */ jsx(CopyIcon, { className: "size-3" }), _[2] = b) : b = _[2];
-	let x;
-	return _[3] === y ? x = _[4] : (x = /* @__PURE__ */ jsx(FadeInBlock, { children: /* @__PURE__ */ jsx(MessageActions, { children: /* @__PURE__ */ jsx(MessageAction, {
-		onClick: y,
+	return g[3] === v ? b = g[4] : (b = /* @__PURE__ */ jsx(FadeInBlock, { children: /* @__PURE__ */ jsx(MessageActions, { children: /* @__PURE__ */ jsx(MessageAction, {
+		onClick: v,
 		label: "Copy",
-		children: b
-	}) }) }), _[3] = y, _[4] = x), x;
+		children: y
+	}) }) }), g[3] = v, g[4] = b), b;
+};
+function formatTokens(e) {
+	return e == null ? null : e >= 1e3 ? `${(e / 1e3).toFixed(1)}k` : String(e);
+}
+var CompletionMeta = (e) => {
+	let m = c(21), { meta: h } = e, g;
+	if (m[0] !== h.costUsd || m[1] !== h.durationMs || m[2] !== h.model || m[3] !== h.numTurns || m[4] !== h.usage?.cacheCreationInputTokens || m[5] !== h.usage?.cacheReadInputTokens || m[6] !== h.usage?.inputTokens || m[7] !== h.usage?.outputTokens) {
+		if (g = [], h.numTurns != null && g.push(`${h.numTurns} turn${h.numTurns === 1 ? "" : "s"}`), h.costUsd != null) {
+			let e;
+			m[9] === h.costUsd ? e = m[10] : (e = h.costUsd.toFixed(4), m[9] = h.costUsd, m[10] = e), g.push(`$${e}`);
+		}
+		let e = h.usage?.inputTokens, _;
+		m[11] === e ? _ = m[12] : (_ = formatTokens(e), m[11] = e, m[12] = _);
+		let v = _, y = h.usage?.outputTokens, b;
+		m[13] === y ? b = m[14] : (b = formatTokens(y), m[13] = y, m[14] = b);
+		let x = b;
+		v && x && g.push(`${v} in / ${x} out`);
+		let S = (h.usage?.cacheReadInputTokens ?? 0) + (h.usage?.cacheCreationInputTokens ?? 0);
+		if (S) {
+			let e;
+			m[15] === S ? e = m[16] : (e = formatTokens(S), m[15] = S, m[16] = e), g.push(`${e} cache`);
+		}
+		if (h.durationMs != null) {
+			let e = h.durationMs / 1e3, _;
+			m[17] === e ? _ = m[18] : (_ = e.toFixed(1), m[17] = e, m[18] = _), g.push(`${_}s`);
+		}
+		h.model && g.push(h.model), m[0] = h.costUsd, m[1] = h.durationMs, m[2] = h.model, m[3] = h.numTurns, m[4] = h.usage?.cacheCreationInputTokens, m[5] = h.usage?.cacheReadInputTokens, m[6] = h.usage?.inputTokens, m[7] = h.usage?.outputTokens, m[8] = g;
+	} else g = m[8];
+	if (!g.length) return null;
+	let _ = g.join(" · "), v;
+	return m[19] === _ ? v = m[20] : (v = /* @__PURE__ */ jsx("div", {
+		className: "text-muted-foreground mt-1 px-1 font-mono text-xs",
+		children: _
+	}), m[19] = _, m[20] = v), v;
 };
 function hasStructuredBlocks(e) {
 	return !!e?.some((e) => e.type !== "text");
@@ -25,81 +59,87 @@ function hasStructuredBlocks(e) {
 function textFromBlocks(e) {
 	return (e ?? []).filter((e) => e.type === "text").map((e) => e.text).join("\n");
 }
-var LlmMessage_default = (h) => {
-	let g = c(23), { document: C } = h, w = C.content, T = w.id ?? C.id, E = !!C.meta?.streaming;
-	if (!hasStructuredBlocks(w.blocks)) {
-		let h;
-		g[0] !== w.blocks || g[1] !== w.text ? (h = w.text ?? textFromBlocks(w.blocks), g[0] = w.blocks, g[1] = w.text, g[2] = h) : h = g[2];
-		let y = h, b;
-		g[3] !== E || g[4] !== y ? (b = /* @__PURE__ */ jsx(MessageContent, { children: E ? /* @__PURE__ */ jsx(StreamingText, { text: y }) : /* @__PURE__ */ jsx(MessageResponse, { children: y }) }), g[3] = E, g[4] = y, g[5] = b) : b = g[5];
+var LlmMessage_default = (m) => {
+	let h = c(31), { document: w } = m, T = w.content, E = T.id ?? w.id, D = !!w.meta?.streaming;
+	if (!hasStructuredBlocks(T.blocks)) {
+		let m;
+		h[0] !== T.blocks || h[1] !== T.text ? (m = T.text ?? textFromBlocks(T.blocks), h[0] = T.blocks, h[1] = T.text, h[2] = m) : m = h[2];
+		let v = m, y;
+		h[3] !== D || h[4] !== v ? (y = /* @__PURE__ */ jsx(MessageContent, { children: D ? /* @__PURE__ */ jsx(StreamingText, { text: v }) : /* @__PURE__ */ jsx(MessageResponse, { children: v }) }), h[3] = D, h[4] = v, h[5] = y) : y = h[5];
+		let b;
+		h[6] !== D || h[7] !== T.role || h[8] !== v ? (b = T.role === "assistant" && !D && /* @__PURE__ */ jsx(CopyActions, { text: v }), h[6] = D, h[7] = T.role, h[8] = v, h[9] = b) : b = h[9];
 		let x;
-		g[6] !== E || g[7] !== w.role || g[8] !== y ? (x = w.role === "assistant" && !E && /* @__PURE__ */ jsx(CopyActions, { text: y }), g[6] = E, g[7] = w.role, g[8] = y, g[9] = x) : x = g[9];
+		h[10] !== T.role || h[11] !== y || h[12] !== b ? (x = /* @__PURE__ */ jsxs(Message, {
+			from: T.role,
+			children: [y, b]
+		}), h[10] = T.role, h[11] = y, h[12] = b, h[13] = x) : x = h[13];
 		let S;
-		return g[10] !== w.role || g[11] !== b || g[12] !== x ? (S = /* @__PURE__ */ jsxs(Message, {
-			from: w.role,
-			children: [b, x]
-		}), g[10] = w.role, g[11] = b, g[12] = x, g[13] = S) : S = g[13], S;
+		h[14] === T.meta ? S = h[15] : (S = T.meta && /* @__PURE__ */ jsx(CompletionMeta, { meta: T.meta }), h[14] = T.meta, h[15] = S);
+		let C;
+		return h[16] !== x || h[17] !== S ? (C = /* @__PURE__ */ jsxs(Fragment, { children: [x, S] }), h[16] = x, h[17] = S, h[18] = C) : C = h[18], C;
 	}
-	let D;
-	g[14] === w.blocks ? D = g[15] : (D = w.blocks ?? [], g[14] = w.blocks, g[15] = D);
-	let O = D, k;
-	g[16] !== O || g[17] !== E || g[18] !== w.role || g[19] !== T ? (k = O.map((h, g) => {
-		switch (h.type) {
+	let O;
+	h[19] === T.blocks ? O = h[20] : (O = T.blocks ?? [], h[19] = T.blocks, h[20] = O);
+	let k = O, A;
+	h[21] !== k || h[22] !== D || h[23] !== T.role || h[24] !== E ? (A = k.map((m, h) => {
+		switch (m.type) {
 			case "text": return /* @__PURE__ */ jsxs(Message, {
-				from: w.role,
-				children: [/* @__PURE__ */ jsx(MessageContent, { children: E ? /* @__PURE__ */ jsx(StreamingText, { text: h.text }) : /* @__PURE__ */ jsx(MessageResponse, { children: h.text }) }), w.role === "assistant" && !E && /* @__PURE__ */ jsx(CopyActions, { text: h.text })]
-			}, `${T}-${g}`);
+				from: T.role,
+				children: [/* @__PURE__ */ jsx(MessageContent, { children: D ? /* @__PURE__ */ jsx(StreamingText, { text: m.text }) : /* @__PURE__ */ jsx(MessageResponse, { children: m.text }) }), T.role === "assistant" && !D && /* @__PURE__ */ jsx(CopyActions, { text: m.text })]
+			}, `${E}-${h}`);
 			case "thinking": return /* @__PURE__ */ jsxs(Reasoning, {
 				className: "w-full",
-				isStreaming: E,
-				children: [/* @__PURE__ */ jsx(ReasoningTrigger, {}), /* @__PURE__ */ jsx(ReasoningContent, { children: h.text })]
-			}, `${T}-${g}`);
+				isStreaming: D,
+				children: [/* @__PURE__ */ jsx(ReasoningTrigger, {}), /* @__PURE__ */ jsx(ReasoningContent, { children: m.text })]
+			}, `${E}-${h}`);
 			case "tool_call": return /* @__PURE__ */ jsx(FadeInBlock, { children: /* @__PURE__ */ jsx(Message, {
 				from: "assistant",
 				children: /* @__PURE__ */ jsxs(Tool, { children: [/* @__PURE__ */ jsx(ToolHeader, {
 					state: "input-available",
-					title: h.name,
+					title: m.name,
 					type: "tool-call"
-				}), /* @__PURE__ */ jsx(ToolContent, { children: /* @__PURE__ */ jsx(ToolInput, { input: h.args }) })] })
-			}) }, `${T}-${g}`);
+				}), /* @__PURE__ */ jsx(ToolContent, { children: /* @__PURE__ */ jsx(ToolInput, { input: m.args }) })] })
+			}) }, `${E}-${h}`);
 			case "tool_result": {
-				let _;
+				let g;
 				try {
-					_ = JSON.parse(h.content);
+					g = JSON.parse(m.content);
 				} catch {
-					_ = h.content;
+					g = m.content;
 				}
 				return /* @__PURE__ */ jsx(FadeInBlock, { children: /* @__PURE__ */ jsx(Message, {
 					from: "assistant",
 					children: /* @__PURE__ */ jsxs(Tool, { children: [/* @__PURE__ */ jsx(ToolHeader, {
-						state: h.isError ? "output-error" : "output-available",
+						state: m.isError ? "output-error" : "output-available",
 						title: "Tool Result",
 						type: "tool-call"
 					}), /* @__PURE__ */ jsx(ToolContent, { children: /* @__PURE__ */ jsx(ToolOutput, {
-						output: _,
-						errorText: h.isError ? h.content : ""
+						output: g,
+						errorText: m.isError ? m.content : ""
 					}) })] })
-				}) }, `${T}-${g}`);
+				}) }, `${E}-${h}`);
 			}
 			case "server_tool_use": {
-				let _ = O.find((e) => e.type === "server_tool_result" && e.toolUseId === h.id);
+				let g = k.find((e) => e.type === "server_tool_result" && e.toolUseId === m.id);
 				return /* @__PURE__ */ jsx(FadeInBlock, { children: /* @__PURE__ */ jsx(Message, {
 					from: "assistant",
 					children: /* @__PURE__ */ jsxs(Tool, { children: [/* @__PURE__ */ jsx(ToolHeader, {
-						state: _ ? "output-available" : "input-available",
-						title: h.name,
+						state: g ? "output-available" : "input-available",
+						title: m.name,
 						type: "tool-call"
-					}), /* @__PURE__ */ jsxs(ToolContent, { children: [/* @__PURE__ */ jsx(ToolInput, { input: h.input }), _ && /* @__PURE__ */ jsx(ToolOutput, {
-						output: _.content,
+					}), /* @__PURE__ */ jsxs(ToolContent, { children: [/* @__PURE__ */ jsx(ToolInput, { input: m.input }), g && /* @__PURE__ */ jsx(ToolOutput, {
+						output: g.content,
 						errorText: ""
 					})] })] })
-				}) }, `${T}-${g}`);
+				}) }, `${E}-${h}`);
 			}
 			case "server_tool_result": return null;
 			default: return null;
 		}
-	}), g[16] = O, g[17] = E, g[18] = w.role, g[19] = T, g[20] = k) : k = g[20];
-	let A;
-	return g[21] === k ? A = g[22] : (A = /* @__PURE__ */ jsx(Fragment, { children: k }), g[21] = k, g[22] = A), A;
+	}), h[21] = k, h[22] = D, h[23] = T.role, h[24] = E, h[25] = A) : A = h[25];
+	let j;
+	h[26] === T.meta ? j = h[27] : (j = T.meta && /* @__PURE__ */ jsx(CompletionMeta, { meta: T.meta }), h[26] = T.meta, h[27] = j);
+	let M;
+	return h[28] !== A || h[29] !== j ? (M = /* @__PURE__ */ jsxs(Fragment, { children: [A, j] }), h[28] = A, h[29] = j, h[30] = M) : M = h[30], M;
 };
 export { LlmMessage_default as default };

package/dist/features/file-explorer/components/FileExplorerPanel.js

@@ -5,6 +5,7 @@ import "../../feature-registry/index.js";
 import { useWorkbenchLayout } from "../../workbench/providers/WorkbenchLayoutProvider.js";
 import { SidebarPanel } from "../../workbench/components/SidebarPanel.js";
 import "../../workbench/index.js";
+import { EnvironmentSelector } from "../../workbench/components/EnvironmentSelector.js";
 import { FileExplorerProvider, useOptionalFileExplorer } from "../providers/FileExplorerProvider.js";
 import { FileTabsBar } from "./FileTabsBar.js";
 import { FileTree } from "./FileTree.js";
@@ -12,109 +13,101 @@ import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Files } from "lucide-react";
 function FileExplorerContent() {
-	let i = c(7), a = useOptionalFileExplorer();
-	if (!a) {
+	let o = c(7), s = useOptionalFileExplorer();
+	if (!s) {
 		let e;
-		return i[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("div", {
+		return o[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("div", {
 			className: "flex flex-1 items-center justify-center p-4",
 			children: /* @__PURE__ */ jsx("p", {
 				className: "text-muted-foreground text-sm",
 				children: "File explorer is not available for this workspace."
 			})
-		}), i[0] = e) : e = i[0], e;
+		}), o[0] = e) : e = o[0], e;
 	}
-	let o;
-	i[1] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ jsx("div", {
+	let l;
+	o[1] === Symbol.for("react.memo_cache_sentinel") ? (l = /* @__PURE__ */ jsx("div", {
 		className: "w-52 shrink-0 overflow-auto border-r bg-muted/40",
 		children: /* @__PURE__ */ jsx(FileTree, {})
-	}), i[1] = o) : o = i[1];
-	let s;
-	i[2] === Symbol.for("react.memo_cache_sentinel") ? (s = /* @__PURE__ */ jsx(FileTabsBar, {}), i[2] = s) : s = i[2];
-	let p;
-	return i[3] !== a.fileContent || i[4] !== a.isContentLoading || i[5] !== a.selectedFile ? (p = /* @__PURE__ */ jsxs("div", {
+	}), o[1] = l) : l = o[1];
+	let u;
+	o[2] === Symbol.for("react.memo_cache_sentinel") ? (u = /* @__PURE__ */ jsx(FileTabsBar, {}), o[2] = u) : u = o[2];
+	let d;
+	return o[3] !== s.fileContent || o[4] !== s.isContentLoading || o[5] !== s.selectedFile ? (d = /* @__PURE__ */ jsxs("div", {
 		className: "flex h-full",
-		children: [o, /* @__PURE__ */ jsxs("div", {
+		children: [l, /* @__PURE__ */ jsxs("div", {
 			className: "flex min-w-0 flex-1 flex-col",
-			children: [s, /* @__PURE__ */ jsx("div", {
+			children: [u, /* @__PURE__ */ jsx("div", {
 				className: "flex-1 overflow-hidden p-3 pt-2",
 				children: /* @__PURE__ */ jsx(FileContentViewer, {
-					selectedFile: a.selectedFile,
-					content: a.fileContent,
-					isLoading: a.isContentLoading,
+					selectedFile: s.selectedFile,
+					content: s.fileContent,
+					isLoading: s.isContentLoading,
 					className: "h-full"
 				})
 			})]
 		})]
-	}), i[3] = a.fileContent, i[4] = a.isContentLoading, i[5] = a.selectedFile, i[6] = p) : p = i[6], p;
+	}), o[3] = s.fileContent, o[4] = s.isContentLoading, o[5] = s.selectedFile, o[6] = d) : d = o[6], d;
 }
 function FileExplorerPanel(e) {
-	let l = c(26), { variant: u, featureId: d, title: f, description: m, workspaceId: h } = e, { closePanel: g, panelSize: _, setPanelSize: v, environments: y } = useWorkbenchLayout(), b = useFeatureConfig(d), x;
-	l[0] === b?.config?.environments ? x = l[1] : (x = b?.config?.environments ?? [], l[0] = b?.config?.environments, l[1] = x);
-	let S = x, C = y?.[0]?.slotId ?? "", w;
-	l[2] !== S || l[3] !== C ? (w = S.length === 0 || S.includes(C), l[2] = S, l[3] = C, l[4] = w) : w = l[4];
-	let T = w;
-	if (!T) {
-		let e;
-		l[5] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx(Files, { className: "h-4 w-4" }), l[5] = e) : e = l[5];
-		let i;
-		l[6] === Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ jsx("div", {
-			className: "flex flex-1 items-center justify-center p-4",
-			children: /* @__PURE__ */ jsx("p", {
-				className: "text-muted-foreground text-sm",
-				children: "File explorer is not available for this environment."
-			})
-		}), l[6] = i) : i = l[6];
-		let a;
-		return l[7] !== g || l[8] !== m || l[9] !== _ || l[10] !== v || l[11] !== f ? (a = /* @__PURE__ */ jsx(SidebarPanel, {
-			icon: e,
-			title: f,
-			description: m,
-			size: _,
-			onSizeChange: v,
-			onClose: g,
-			children: i
-		}), l[7] = g, l[8] = m, l[9] = _, l[10] = v, l[11] = f, l[12] = a) : a = l[12], a;
-	}
-	let E;
-	l[13] === Symbol.for("react.memo_cache_sentinel") ? (E = /* @__PURE__ */ jsx(Files, { className: "h-4 w-4" }), l[13] = E) : E = l[13];
-	let D;
-	l[14] === Symbol.for("react.memo_cache_sentinel") ? (D = /* @__PURE__ */ jsx(FileExplorerContent, {}), l[14] = D) : D = l[14];
-	let O;
-	l[15] !== T || l[16] !== u || l[17] !== h ? (O = /* @__PURE__ */ jsx(FileExplorerProvider, {
-		variant: u,
-		workspaceId: h,
-		enabled: T,
-		children: D
-	}), l[15] = T, l[16] = u, l[17] = h, l[18] = O) : O = l[18];
-	let k;
-	return l[19] !== g || l[20] !== m || l[21] !== _ || l[22] !== v || l[23] !== O || l[24] !== f ? (k = /* @__PURE__ */ jsx(SidebarPanel, {
-		icon: E,
-		title: f,
-		description: m,
-		size: _,
-		onSizeChange: v,
-		onClose: g,
-		children: O
-	}), l[19] = g, l[20] = m, l[21] = _, l[22] = v, l[23] = O, l[24] = f, l[25] = k) : k = l[25], k;
+	let f = c(24), { variant: p, featureId: m, title: h, description: g, workspaceId: _ } = e, { closePanel: v, panelSize: y, setPanelSize: b, environments: x, selectedSlotId: S } = useWorkbenchLayout(), C = useFeatureConfig(m), w;
+	f[0] === C?.config?.environments ? w = f[1] : (w = C?.config?.environments ?? [], f[0] = C?.config?.environments, f[1] = w);
+	let T = w, E;
+	f[2] !== x || f[3] !== S ? (E = x?.find((e) => e.slotId === S), f[2] = x, f[3] = S, f[4] = E) : E = f[4];
+	let D = E, O;
+	f[5] !== T || f[6] !== S ? (O = T.length === 0 || T.includes(S), f[5] = T, f[6] = S, f[7] = O) : O = f[7];
+	let k = O, A = !D || D.status === "running", j = k && A, M;
+	f[8] === Symbol.for("react.memo_cache_sentinel") ? (M = /* @__PURE__ */ jsx(Files, { className: "h-4 w-4" }), f[8] = M) : M = f[8];
+	let N;
+	f[9] === Symbol.for("react.memo_cache_sentinel") ? (N = /* @__PURE__ */ jsx(EnvironmentSelector, {}), f[9] = N) : N = f[9];
+	let P;
+	f[10] !== k || f[11] !== j || f[12] !== A || f[13] !== S || f[14] !== p || f[15] !== _ ? (P = k ? A ? /* @__PURE__ */ jsx(FileExplorerProvider, {
+		variant: p,
+		workspaceId: _,
+		slotId: S || void 0,
+		enabled: j,
+		children: /* @__PURE__ */ jsx(FileExplorerContent, {})
+	}) : /* @__PURE__ */ jsx("div", {
+		className: "flex flex-1 items-center justify-center p-4",
+		children: /* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground text-sm",
+			children: "This environment is not available (stopped)."
+		})
+	}) : /* @__PURE__ */ jsx("div", {
+		className: "flex flex-1 items-center justify-center p-4",
+		children: /* @__PURE__ */ jsx("p", {
+			className: "text-muted-foreground text-sm",
+			children: "File explorer is not available for this environment."
+		})
+	}), f[10] = k, f[11] = j, f[12] = A, f[13] = S, f[14] = p, f[15] = _, f[16] = P) : P = f[16];
+	let F;
+	return f[17] !== v || f[18] !== g || f[19] !== y || f[20] !== b || f[21] !== P || f[22] !== h ? (F = /* @__PURE__ */ jsxs(SidebarPanel, {
+		icon: M,
+		title: h,
+		description: g,
+		size: y,
+		onSizeChange: b,
+		onClose: v,
+		children: [N, P]
+	}), f[17] = v, f[18] = g, f[19] = y, f[20] = b, f[21] = P, f[22] = h, f[23] = F) : F = f[23], F;
 }
 function LocalFileExplorerPanel(e) {
-	let i = c(2), { workspaceId: a } = e, o;
-	return i[0] === a ? o = i[1] : (o = /* @__PURE__ */ jsx(FileExplorerPanel, {
+	let o = c(2), { workspaceId: s } = e, l;
+	return o[0] === s ? l = o[1] : (l = /* @__PURE__ */ jsx(FileExplorerPanel, {
 		variant: "local",
 		featureId: "localFileExplorer",
 		title: "Files",
 		description: "Browse and view local project files.",
-		workspaceId: a
-	}), i[0] = a, i[1] = o), o;
+		workspaceId: s
+	}), o[0] = s, o[1] = l), l;
 }
 function RemoteFileExplorerPanel(e) {
-	let i = c(2), { workspaceId: a } = e, o;
-	return i[0] === a ? o = i[1] : (o = /* @__PURE__ */ jsx(FileExplorerPanel, {
+	let o = c(2), { workspaceId: s } = e, l;
+	return o[0] === s ? l = o[1] : (l = /* @__PURE__ */ jsx(FileExplorerPanel, {
 		variant: "remote",
 		featureId: "remoteFileExplorer",
 		title: "Remote Files",
 		description: "Browse and view files on the remote workspace.",
-		workspaceId: a
-	}), i[0] = a, i[1] = o), o;
+		workspaceId: s
+	}), o[0] = s, o[1] = l), l;
 }
 export { LocalFileExplorerPanel, RemoteFileExplorerPanel };

package/dist/features/file-explorer/hooks/useFileExplorer.js

@@ -14,38 +14,42 @@ function fileTreeKey(e, n, r) {
 		...r ? [r] : []
 	];
 }
-function useFileTree(i, o, s) {
-	let l = c(12), u = s === void 0 ? !0 : s, d = useLoopstackClient(), f;
-	l[0] !== d.envKey || l[1] !== i || l[2] !== o ? (f = fileTreeKey(d.envKey, i, o), l[0] = d.envKey, l[1] = i, l[2] = o, l[3] = f) : f = l[3];
-	let p;
-	l[4] !== d.http || l[5] !== i || l[6] !== o ? (p = () => d.http.get(`${explorerPath(i, o)}/tree`), l[4] = d.http, l[5] = i, l[6] = o, l[7] = p) : p = l[7];
-	let m = !!o && u, h;
-	return l[8] !== f || l[9] !== p || l[10] !== m ? (h = {
-		queryKey: f,
-		queryFn: p,
-		enabled: m,
+function useFileTree(i, o, s, l) {
+	let u = c(14), d = l === void 0 ? !0 : l, f = useLoopstackClient(), p;
+	u[0] !== f.envKey || u[1] !== s || u[2] !== i || u[3] !== o ? (p = [...fileTreeKey(f.envKey, i, o), s ?? ""], u[0] = f.envKey, u[1] = s, u[2] = i, u[3] = o, u[4] = p) : p = u[4];
+	let m;
+	u[5] !== f.http || u[6] !== s || u[7] !== i || u[8] !== o ? (m = () => f.http.get(`${explorerPath(i, o)}/tree`, s ? { slotId: s } : void 0), u[5] = f.http, u[6] = s, u[7] = i, u[8] = o, u[9] = m) : m = u[9];
+	let h = !!o && d, g;
+	return u[10] !== p || u[11] !== m || u[12] !== h ? (g = {
+		queryKey: p,
+		queryFn: m,
+		enabled: h,
 		staleTime: 3e4,
 		retry: !1
-	}, l[8] = f, l[9] = p, l[10] = m, l[11] = h) : h = l[11], useQuery(h);
+	}, u[10] = p, u[11] = m, u[12] = h, u[13] = g) : g = u[13], useQuery(g);
 }
-function useFileContent(i, a, o, s) {
-	let l = c(14), u = s === void 0 ? !0 : s, d = useLoopstackClient(), f;
-	l[0] !== d.envKey || l[1] !== o || l[2] !== i || l[3] !== a ? (f = [
+function useFileContent(i, a, o, s, l) {
+	let u = c(16), d = l === void 0 ? !0 : l, f = useLoopstackClient(), p = s ?? "", m;
+	u[0] !== f.envKey || u[1] !== o || u[2] !== p || u[3] !== i || u[4] !== a ? (m = [
 		"file-explorer-content",
-		d.envKey,
+		f.envKey,
 		i,
 		a,
-		o
-	], l[0] = d.envKey, l[1] = o, l[2] = i, l[3] = a, l[4] = f) : f = l[4];
-	let p;
-	l[5] !== d.http || l[6] !== o || l[7] !== i || l[8] !== a ? (p = () => d.http.get(`${explorerPath(i, a)}/read`, { path: o }), l[5] = d.http, l[6] = o, l[7] = i, l[8] = a, l[9] = p) : p = l[9];
-	let m = !!a && !!o && u, h;
-	return l[10] !== f || l[11] !== p || l[12] !== m ? (h = {
-		queryKey: f,
-		queryFn: p,
-		enabled: m,
+		o,
+		p
+	], u[0] = f.envKey, u[1] = o, u[2] = p, u[3] = i, u[4] = a, u[5] = m) : m = u[5];
+	let h;
+	u[6] !== f.http || u[7] !== o || u[8] !== s || u[9] !== i || u[10] !== a ? (h = () => f.http.get(`${explorerPath(i, a)}/read`, {
+		path: o,
+		...s ? { slotId: s } : {}
+	}), u[6] = f.http, u[7] = o, u[8] = s, u[9] = i, u[10] = a, u[11] = h) : h = u[11];
+	let g = !!a && !!o && d, _;
+	return u[12] !== m || u[13] !== h || u[14] !== g ? (_ = {
+		queryKey: m,
+		queryFn: h,
+		enabled: g,
 		staleTime: 15e3,
 		retry: !1
-	}, l[10] = f, l[11] = p, l[12] = m, l[13] = h) : h = l[13], useQuery(h);
+	}, u[12] = m, u[13] = h, u[14] = g, u[15] = _) : _ = u[15], useQuery(_);
 }
 export { fileTreeKey, useFileContent, useFileTree };