@mcp-use/inspector 12.0.4-canary.0 → 20.0.0-beta.0

package/dist/cdn/ResourcesTab-BczUMFil.js

@@ -0,0 +1,584 @@
+import { s as e, t } from "./react-BIs9pQ3H.js";
+import { t as n } from "./jsx-runtime-CIxvMpEo.js";
+import { Pr as r, f as i, sr as a } from "./input-BLxOA7V-.js";
+import { t as o } from "./AnimatePresence-B4HhIdgq.js";
+import { n as s, r as c, t as l } from "./WidgetWrapper-BJJtLqMb.js";
+import { t as u } from "./brush-B_mKhyxG.js";
+import { a as d, i as f, t as p } from "./browser-CbQIH4w2.js";
+import { n as m, t as h } from "./zap-Mb-pbw2X.js";
+import { t as g } from "./clock-CmUbSx_B.js";
+import { t as _ } from "./code-V_0nf5rg.js";
+import { a as v, t as y } from "./JSONDisplay-D3RcyO9z.js";
+import { t as b } from "./folder-open-B3lu2rG_.js";
+import { a as x, i as S, n as C, o as w, r as T, t as E } from "./shared-uMiV6Fx1.js";
+import { t as D } from "./maximize-BALCV_ep.js";
+import { d as O, t as k } from "./telemetry-Ct6pVkM1.js";
+import { c as A, r as j, s as M } from "./react-yUi9mVK4.js";
+import { t as N } from "./spinner-CWcJhIY_.js";
+import { n as P } from "./InspectorContext-DzXtgyTx.js";
+import { t as F } from "./useConfig-CwxZ6Quj.js";
+import { t as I } from "./useViewHostProps-C7vjco2m.js";
+//#region src/client/components/resources/ResourceResultDisplay.tsx
+var L = /* @__PURE__ */ e(t(), 1), R = n();
+function z(e) {
+	if ("error" in e && e.error && typeof e.error == "string") return e.error;
+	if (!("isError" in e && e.isError)) return null;
+	if ("contents" in e && Array.isArray(e.contents)) {
+		let t = e.contents.filter((e) => "text" in e).map((e) => e.text).filter(Boolean);
+		if (t.length > 0) return t.join("\n");
+	}
+	return "An error occurred";
+}
+function B({ serverId: e, viewId: t, resourceUri: n, toolOutput: r, toolMetadata: i, readResource: a, customProps: o, displayMode: s, onDisplayModeChange: c }) {
+	let u = (0, L.useMemo)(() => ({}), []), d = I({
+		serverId: e,
+		viewId: t,
+		resourceUri: n,
+		toolName: n,
+		toolInput: u,
+		toolOutput: r,
+		toolMetadata: i,
+		readResource: a,
+		displayMode: s,
+		onDisplayModeChange: c
+	});
+	if (!d) return /* @__PURE__ */ (0, R.jsx)(l, {
+		className: "w-full h-full min-h-[240px]",
+		children: /* @__PURE__ */ (0, R.jsx)(N, { className: "size-5" })
+	});
+	let f = s === "inline" ? "w-full h-full flex items-center justify-center relative p-4 min-h-0" : "w-full h-full relative p-4", p = o ? JSON.stringify(o) : "no-custom-props";
+	return /* @__PURE__ */ (0, R.jsx)(l, {
+		className: "w-full h-full min-h-[240px]",
+		children: /* @__PURE__ */ (0, R.jsx)(j, {
+			viewId: t,
+			toolName: n,
+			toolInput: u,
+			toolOutput: r,
+			customProps: o,
+			className: f,
+			...d
+		}, p)
+	});
+}
+function V({ result: e, isLoading: t, previewMode: n, serverId: i, readResource: o, onTogglePreview: c, onCopy: l, onDownload: p, onFullscreen: m, isCopied: b = !1, selectedResource: x, llmConfig: S }) {
+	let [C, w] = (0, L.useState)(null), T = (0, L.useCallback)((e) => {
+		w(e);
+	}, []), [E, O] = (0, L.useState)("inline"), k = e?.result && "contents" in e.result && Array.isArray(e.result.contents) && e.result.contents[0]?._meta || {}, j = {
+		...e?.resourceAnnotations,
+		...k
+	}, P = (0, L.useMemo)(() => {
+		let e = j?.["mcp-use/propsSchema"];
+		if (!e) return [];
+		let t = e.def?.shape;
+		return t ? Object.entries(t).filter(([, e]) => {
+			let t = e?.def?.type ?? e?.type;
+			return t !== "optional" && t !== "default";
+		}).map(([e]) => e) : e.required ?? [];
+	}, [j]), F = A(j) ? "mcp-apps" : null, I = e?.result && "contents" in e.result && Array.isArray(e.result.contents) && e.result.contents.some((e) => M(e.mimeType)), V = j?.ui?.resourceUri || k?.ui?.resourceUri || (I ? e.uri : void 0), H = (F === "mcp-apps" || I) && !!V, U = P.length > 0 && !C;
+	if (t) return /* @__PURE__ */ (0, R.jsx)("div", {
+		className: "flex absolute left-0 top-0 items-center justify-center w-full h-full",
+		children: /* @__PURE__ */ (0, R.jsx)(N, { className: "size-5" })
+	});
+	if (!e) return /* @__PURE__ */ (0, R.jsxs)("div", {
+		className: "flex flex-col items-center justify-center h-full p-4 text-center",
+		children: [/* @__PURE__ */ (0, R.jsx)("p", {
+			className: "text-gray-500 dark:text-gray-400 mb-2",
+			children: "Select a resource to view its contents"
+		}), /* @__PURE__ */ (0, R.jsx)("p", {
+			className: "text-xs text-gray-400 dark:text-gray-500",
+			children: "Choose a resource from the list to see its data"
+		})]
+	});
+	let W = e.error || (e.result ? z(e.result) : null);
+	return W ? /* @__PURE__ */ (0, R.jsx)("div", {
+		className: "p-4",
+		children: /* @__PURE__ */ (0, R.jsxs)("div", {
+			className: "bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded p-3",
+			children: [/* @__PURE__ */ (0, R.jsx)("p", {
+				className: "text-red-800 dark:text-red-300 font-medium",
+				children: "Error:"
+			}), /* @__PURE__ */ (0, R.jsx)("p", {
+				className: "text-red-700 dark:text-red-400 text-sm",
+				children: W
+			})]
+		})
+	}) : /* @__PURE__ */ (0, R.jsxs)("div", {
+		className: "flex flex-col h-full",
+		children: [/* @__PURE__ */ (0, R.jsxs)("div", {
+			className: "shrink-0 px-4 py-3 border-b border-gray-200 dark:border-zinc-700 flex items-center justify-between",
+			children: [/* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex items-center gap-2",
+				children: [
+					/* @__PURE__ */ (0, R.jsxs)("div", {
+						className: "flex items-center gap-1",
+						children: [/* @__PURE__ */ (0, R.jsx)(g, { className: "h-3 w-3 text-gray-400" }), /* @__PURE__ */ (0, R.jsx)("span", {
+							className: "text-xs text-gray-500 dark:text-gray-400",
+							children: new Date(e.timestamp).toLocaleTimeString()
+						})]
+					}),
+					(() => {
+						let t = e?.duration ?? e.result?.duration ?? e.result?.metrics?.durationMs;
+						return t === void 0 ? null : /* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "flex items-center gap-1",
+							children: [/* @__PURE__ */ (0, R.jsx)(h, { className: "h-3 w-3 text-gray-400" }), /* @__PURE__ */ (0, R.jsxs)("span", {
+								className: "text-xs text-gray-500 dark:text-gray-400",
+								children: [t, "ms"]
+							})]
+						});
+					})(),
+					H && /* @__PURE__ */ (0, R.jsx)(r, {
+						variant: "outline",
+						className: "text-xs bg-green-50 dark:bg-green-900/20 border-none border-green-200 dark:border-green-800/50 text-green-600 dark:text-green-400",
+						children: "MCP Apps"
+					})
+				]
+			}), /* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex items-center gap-1",
+				children: [
+					H && /* @__PURE__ */ (0, R.jsxs)(a, {
+						variant: "ghost",
+						size: "sm",
+						onClick: c,
+						className: n ? "" : "text-purple-600 dark:text-purple-400",
+						children: [n ? /* @__PURE__ */ (0, R.jsx)(_, { className: "h-4 w-4 mr-1" }) : /* @__PURE__ */ (0, R.jsx)(u, { className: "h-4 w-4 mr-1" }), n ? "JSON" : "Preview"]
+					}),
+					/* @__PURE__ */ (0, R.jsx)(a, {
+						variant: "ghost",
+						size: "sm",
+						onClick: l,
+						children: b ? /* @__PURE__ */ (0, R.jsx)(d, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, R.jsx)(f, { className: "h-4 w-4" })
+					}),
+					/* @__PURE__ */ (0, R.jsx)(a, {
+						variant: "ghost",
+						size: "sm",
+						onClick: p,
+						children: /* @__PURE__ */ (0, R.jsx)(v, { className: "h-4 w-4" })
+					}),
+					/* @__PURE__ */ (0, R.jsx)(a, {
+						variant: "ghost",
+						size: "sm",
+						onClick: m,
+						children: /* @__PURE__ */ (0, R.jsx)(D, { className: "h-4 w-4" })
+					})
+				]
+			})]
+		}), /* @__PURE__ */ (0, R.jsx)("div", {
+			className: "flex-1 overflow-y-auto relative",
+			children: H && i && o && V ? n ? /* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex flex-1 h-full relative flex-col min-h-0",
+				"data-testid": "resource-widget-preview",
+				children: [/* @__PURE__ */ (0, R.jsx)("div", {
+					className: "absolute top-2 right-2 z-10 flex items-center gap-2",
+					children: /* @__PURE__ */ (0, R.jsx)(s, {
+						toolCallId: `resource-${e.timestamp}`,
+						displayMode: E,
+						onDisplayModeChange: O,
+						propsContext: "resource",
+						resourceUri: e.uri,
+						resourceAnnotations: j,
+						llmConfig: S || null,
+						resource: x || null,
+						onPropsChange: T,
+						requiredProps: P.length > 0 && !C ? P : void 0
+					})
+				}), U ? /* @__PURE__ */ (0, R.jsx)("div", {
+					className: "flex items-center justify-center w-full h-full min-h-[200px] rounded-xl border-2 border-dashed border-gray-300 dark:border-zinc-600 bg-gray-50 dark:bg-zinc-800/50 m-4",
+					children: /* @__PURE__ */ (0, R.jsx)("p", {
+						className: "text-sm text-gray-500 dark:text-gray-400 text-center px-6",
+						children: "This widget requires props, set or generate them in the props debugger"
+					})
+				}) : /* @__PURE__ */ (0, R.jsx)(B, {
+					serverId: i,
+					viewId: `resource-${e.timestamp}`,
+					resourceUri: V,
+					toolOutput: e.result,
+					toolMetadata: j,
+					readResource: o,
+					customProps: C || void 0,
+					displayMode: E,
+					onDisplayModeChange: O
+				})]
+			}) : /* @__PURE__ */ (0, R.jsx)("div", {
+				className: "px-4 pt-4",
+				"data-testid": "resource-result-json",
+				children: /* @__PURE__ */ (0, R.jsx)(y, {
+					data: e.result,
+					filename: `resource-${e.uri.replace(/[^a-zA-Z0-9]/g, "-")}-mcp-apps-${Date.now()}.json`
+				})
+			}) : /* @__PURE__ */ (0, R.jsx)("div", {
+				className: "px-4 pt-4",
+				"data-testid": "resource-result-json",
+				children: /* @__PURE__ */ (0, R.jsx)(y, {
+					data: e.result,
+					filename: `resource-${e.uri.replace(/[^a-zA-Z0-9]/g, "-")}-${Date.now()}.json`
+				})
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/client/components/resources/ResourcesList.tsx
+function H({ resources: e, selectedResource: t, onResourceSelect: n, focusedIndex: r }) {
+	return e.length === 0 ? /* @__PURE__ */ (0, R.jsxs)("div", {
+		className: "flex flex-1 flex-col items-center justify-center p-4 text-center",
+		children: [/* @__PURE__ */ (0, R.jsx)(c, { className: "h-12 w-12 text-gray-400 dark:text-gray-600 mb-3" }), /* @__PURE__ */ (0, R.jsx)("p", {
+			className: "text-gray-500 dark:text-gray-400",
+			children: "No resources available"
+		})]
+	}) : /* @__PURE__ */ (0, R.jsx)("div", { children: e.map((e, i) => {
+		let a = [e.description, e.mimeType && /* @__PURE__ */ (0, R.jsx)("span", {
+			className: "font-mono",
+			children: e.mimeType
+		}, "mime")].filter(Boolean);
+		return /* @__PURE__ */ (0, R.jsx)(T, {
+			id: `resource-${e.uri}`,
+			"data-testid": `resource-item-${e.name}`,
+			isSelected: t?.uri === e.uri,
+			isFocused: r === i,
+			title: e.name,
+			description: a.length > 0 ? /* @__PURE__ */ (0, R.jsxs)("span", {
+				className: "flex flex-col gap-1",
+				children: [e.description && /* @__PURE__ */ (0, R.jsx)("span", { children: e.description }), e.mimeType && /* @__PURE__ */ (0, R.jsx)("span", {
+					className: "text-xs text-gray-500 dark:text-gray-500 font-mono",
+					children: e.mimeType
+				})]
+			}) : void 0,
+			onClick: () => n(e)
+		}, e.uri);
+	}) });
+}
+//#endregion
+//#region src/client/components/ResourcesTab.tsx
+function U({ ref: e, resources: t, readResource: n, serverId: r, isConnected: s, mcpServerUrl: c, refreshResources: l }) {
+	let [u, d] = (0, L.useState)(!1), [f, h] = (0, L.useState)(null), { selectedResourceUri: g, setSelectedResourceUri: _ } = P(), { llmConfig: v } = F({ mcpServerUrl: c }), [y, T] = (0, L.useState)(null), [D, A] = (0, L.useState)(!1), [j, M] = (0, L.useState)(""), [N] = (0, L.useState)("resources"), [I, z] = (0, L.useState)(!0), [B, U] = (0, L.useState)(!1), [W, G] = (0, L.useState)(-1), [K, q] = (0, L.useState)(!1), J = (0, L.useRef)(null), Y = (0, L.useRef)(null), [ee, te] = (0, L.useState)(!1), [X, Z] = (0, L.useState)("list");
+	(0, L.useEffect)(() => {
+		let e = () => {
+			te(window.innerWidth < 1024);
+		};
+		return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
+	}, []), (0, L.useEffect)(() => {
+		Z(f ? "detail" : "list");
+	}, [f]), (0, L.useImperativeHandle)(e, () => ({
+		focusSearch: () => {
+			U(!0), setTimeout(() => {
+				J.current && J.current.focus();
+			}, 0);
+		},
+		blurSearch: () => {
+			M(""), U(!1), J.current && J.current.blur();
+		}
+	})), (0, L.useEffect)(() => {
+		B && J.current && J.current.focus();
+	}, [B]);
+	let ne = (0, L.useCallback)(() => {
+		j.trim() || U(!1);
+	}, [j]), re = (0, L.useCallback)(async () => {
+		if (l) {
+			d(!0);
+			try {
+				await l();
+			} finally {
+				d(!1);
+			}
+		}
+	}, [l]), Q = (0, L.useMemo)(() => {
+		if (!j) return t;
+		let e = j.toLowerCase();
+		return t.filter((t) => t.name.toLowerCase().includes(e) || t.description?.toLowerCase().includes(e) || t.uri.toLowerCase().includes(e));
+	}, [t, j]), $ = (0, L.useCallback)(async (e) => {
+		if (h(e), s) {
+			A(!0);
+			let t = Date.now();
+			try {
+				let i = await n(e.uri);
+				k(new O({
+					resourceUri: e.uri,
+					serverId: r,
+					success: !0
+				})).catch(() => {}), T({
+					uri: e.uri,
+					result: i,
+					timestamp: t,
+					resourceAnnotations: {
+						...e.annotations,
+						...e._meta || {}
+					}
+				});
+			} catch (n) {
+				k(new O({
+					resourceUri: e.uri,
+					serverId: r,
+					success: !1,
+					error: n instanceof Error ? n.message : "Unknown error"
+				})).catch(() => {}), T({
+					uri: e.uri,
+					result: {
+						contents: [],
+						_meta: {}
+					},
+					error: n instanceof Error ? n.message : "Unknown error",
+					timestamp: t,
+					resourceAnnotations: {
+						...e.annotations,
+						...e._meta || {}
+					}
+				});
+			} finally {
+				A(!1);
+			}
+		}
+	}, [
+		n,
+		r,
+		s
+	]);
+	(0, L.useEffect)(() => {
+		G(-1);
+	}, [j, N]), (0, L.useEffect)(() => {
+		let e = (e) => {
+			let t = e.target;
+			if (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.contentEditable === "true" || e.metaKey || e.ctrlKey || e.altKey) return;
+			let n = Q;
+			if (e.key === "ArrowDown") e.preventDefault(), G((e) => {
+				let t = e + 1;
+				return t >= n.length ? 0 : t;
+			});
+			else if (e.key === "ArrowUp") e.preventDefault(), G((e) => {
+				let t = e - 1;
+				return t < 0 ? n.length - 1 : t;
+			});
+			else if (e.key === "Enter" && W >= 0) {
+				e.preventDefault();
+				let t = Q[W];
+				t && $(t);
+			}
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [
+		W,
+		Q,
+		$
+	]), (0, L.useEffect)(() => {
+		if (W >= 0) {
+			let e = `resource-${Q[W]?.uri}`, t = document.getElementById(e);
+			t && t.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest"
+			});
+		}
+	}, [W, Q]), (0, L.useEffect)(() => {
+		if (g && t.length > 0) {
+			let e = t.find((e) => e.uri === g);
+			fetch("http://127.0.0.1:7371/ingest/4e7482c5-571f-4071-bd09-762c357289f4", {
+				method: "POST",
+				headers: {
+					"Content-Type": "application/json",
+					"X-Debug-Session-Id": "831b88"
+				},
+				body: JSON.stringify({
+					sessionId: "831b88",
+					location: "ResourcesTab.tsx:auto-select",
+					message: "resources auto-select effect",
+					data: {
+						selectedResourceUri: g,
+						resourcesCount: t.length,
+						resourceFound: !!e,
+						willSelect: !!(e && f?.uri !== e.uri),
+						currentSelected: f?.uri ?? null
+					},
+					timestamp: Date.now(),
+					hypothesisId: "H2-compare"
+				})
+			}).catch(() => {}), e && f?.uri !== e.uri && (_(null), setTimeout(() => {
+				$(e);
+				let t = document.getElementById(`resource-${e.uri}`);
+				t && t.scrollIntoView({
+					behavior: "smooth",
+					block: "nearest"
+				});
+			}, 100));
+		}
+	}, [
+		g,
+		t,
+		f,
+		$,
+		_
+	]), (0, L.useEffect)(() => {
+		if (f) {
+			let e = t.find((e) => e.uri === f.uri);
+			e && e !== f && (e.description !== f.description || e.mimeType !== f.mimeType || e.name !== f.name) && h(e);
+		}
+	}, [t, f]);
+	let ie = (0, L.useCallback)(async () => {
+		if (y) try {
+			await p(JSON.stringify(y.result, null, 2)), q(!0), setTimeout(() => q(!1), 2e3);
+		} catch (e) {
+			console.error("[ResourcesTab] Failed to copy result:", e);
+		}
+	}, [y]), ae = (0, L.useCallback)(() => {
+		if (y) try {
+			let e = new globalThis.Blob([JSON.stringify(y.result, null, 2)], { type: "application/json" }), t = URL.createObjectURL(e), n = document.createElement("a");
+			n.href = t, n.download = `resource-${Date.now()}.json`, document.body.appendChild(n), n.click(), document.body.removeChild(n), URL.revokeObjectURL(t);
+		} catch (e) {
+			console.error("[ResourcesTab] Failed to download result:", e);
+		}
+	}, [y]), oe = (0, L.useCallback)(async () => {
+		if (Y.current) try {
+			document.fullscreenElement ? await document.exitFullscreen() : await Y.current.requestFullscreen();
+		} catch (e) {
+			console.error("[ResourcesTab] Failed to toggle fullscreen:", e);
+		}
+	}, []);
+	return ee ? /* @__PURE__ */ (0, R.jsxs)("div", {
+		className: "h-full flex flex-col overflow-hidden relative bg-background",
+		children: [X !== "list" && /* @__PURE__ */ (0, R.jsxs)("div", {
+			className: "flex items-center gap-2 p-2 border-b shrink-0 bg-background z-10",
+			children: [/* @__PURE__ */ (0, R.jsx)(a, {
+				variant: "ghost",
+				size: "sm",
+				onClick: () => {
+					h(null), Z("list");
+				},
+				className: "p-0 h-8 w-8",
+				children: /* @__PURE__ */ (0, R.jsx)(m, { className: "h-4 w-4" })
+			}), /* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex items-center text-sm font-medium",
+				children: [/* @__PURE__ */ (0, R.jsx)("button", {
+					onClick: () => {
+						h(null), Z("list");
+					},
+					className: "text-muted-foreground hover:text-foreground hover:underline cursor-pointer",
+					children: "Resources"
+				}), X === "detail" && /* @__PURE__ */ (0, R.jsxs)(R.Fragment, { children: [/* @__PURE__ */ (0, R.jsx)("span", {
+					className: "mx-2 text-muted-foreground",
+					children: "/"
+				}), /* @__PURE__ */ (0, R.jsx)("span", {
+					className: "text-foreground",
+					children: "Content"
+				})] })]
+			})]
+		}), /* @__PURE__ */ (0, R.jsx)("div", {
+			className: "flex-1 relative overflow-hidden",
+			children: /* @__PURE__ */ (0, R.jsxs)(o, {
+				initial: !1,
+				mode: "popLayout",
+				children: [X === "list" && /* @__PURE__ */ (0, R.jsx)(i.div, {
+					initial: { x: "-100%" },
+					animate: { x: 0 },
+					exit: { x: "-100%" },
+					transition: {
+						type: "spring",
+						stiffness: 300,
+						damping: 30
+					},
+					className: "absolute inset-0 flex flex-col bg-background z-0",
+					children: /* @__PURE__ */ (0, R.jsx)(C, { children: (e) => /* @__PURE__ */ (0, R.jsxs)(R.Fragment, { children: [/* @__PURE__ */ (0, R.jsx)(E, {
+						isScrolled: e,
+						title: "Resources",
+						icon: b,
+						count: Q.length,
+						isSearchExpanded: B,
+						searchQuery: j,
+						searchPlaceholder: "Search resources...",
+						onSearchExpand: () => U(!0),
+						onSearchChange: M,
+						onSearchBlur: ne,
+						searchInputRef: J,
+						onRefresh: l ? re : void 0,
+						isRefreshing: u
+					}), /* @__PURE__ */ (0, R.jsx)(H, {
+						resources: Q,
+						selectedResource: f,
+						onResourceSelect: $,
+						focusedIndex: W
+					})] }) })
+				}, "list"), X === "detail" && /* @__PURE__ */ (0, R.jsx)(i.div, {
+					initial: { x: "100%" },
+					animate: { x: 0 },
+					exit: { x: "100%" },
+					transition: {
+						type: "spring",
+						stiffness: 300,
+						damping: 30
+					},
+					className: "absolute inset-0 bg-white dark:bg-zinc-900 z-10",
+					children: /* @__PURE__ */ (0, R.jsx)("div", {
+						ref: Y,
+						className: "h-full",
+						children: /* @__PURE__ */ (0, R.jsx)(V, {
+							result: y,
+							isLoading: D,
+							previewMode: I,
+							serverId: r,
+							readResource: n,
+							onTogglePreview: () => z(!I),
+							onCopy: ie,
+							onDownload: ae,
+							onFullscreen: oe,
+							isCopied: K,
+							selectedResource: f,
+							llmConfig: v
+						})
+					})
+				}, "detail")]
+			})
+		})]
+	}) : /* @__PURE__ */ (0, R.jsxs)(w, {
+		orientation: "horizontal",
+		className: "h-full",
+		children: [
+			/* @__PURE__ */ (0, R.jsx)(x, {
+				defaultSize: "33%",
+				children: /* @__PURE__ */ (0, R.jsx)("div", {
+					className: "flex h-full flex-col overflow-hidden border-r dark:border-zinc-700",
+					children: /* @__PURE__ */ (0, R.jsx)(C, { children: (e) => /* @__PURE__ */ (0, R.jsxs)(R.Fragment, { children: [/* @__PURE__ */ (0, R.jsx)(E, {
+						isScrolled: e,
+						title: "Resources",
+						icon: b,
+						count: Q.length,
+						isSearchExpanded: B,
+						searchQuery: j,
+						searchPlaceholder: "Search resources...",
+						onSearchExpand: () => U(!0),
+						onSearchChange: M,
+						onSearchBlur: ne,
+						searchInputRef: J,
+						onRefresh: l ? re : void 0,
+						isRefreshing: u
+					}), /* @__PURE__ */ (0, R.jsx)(H, {
+						resources: Q,
+						selectedResource: f,
+						onResourceSelect: $,
+						focusedIndex: W
+					})] }) })
+				})
+			}),
+			/* @__PURE__ */ (0, R.jsx)(S, {}),
+			/* @__PURE__ */ (0, R.jsx)(x, {
+				defaultSize: "67%",
+				children: /* @__PURE__ */ (0, R.jsx)("div", {
+					ref: Y,
+					className: "h-full bg-white dark:bg-zinc-900",
+					children: /* @__PURE__ */ (0, R.jsx)(V, {
+						result: y,
+						isLoading: D,
+						previewMode: I,
+						serverId: r,
+						readResource: n,
+						onTogglePreview: () => z(!I),
+						onCopy: ie,
+						onDownload: ae,
+						onFullscreen: oe,
+						isCopied: K,
+						selectedResource: f,
+						llmConfig: v
+					})
+				})
+			})
+		]
+	});
+}
+U.displayName = "ResourcesTab";
+//#endregion
+export { U as ResourcesTab };