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

package/dist/cdn/SamplingTab-6u5s845G.js

@@ -0,0 +1,658 @@
+import { s as e, t } from "./react-BIs9pQ3H.js";
+import { t as n } from "./jsx-runtime-CIxvMpEo.js";
+import { a as r, n as i, r as a, sr as o, t as s } from "./input-BLxOA7V-.js";
+import { t as c } from "./label-CBvG613A.js";
+import { a as l, i as u, n as d, r as f, t as p } from "./select-BZ_IoKxg.js";
+import { a as m, i as h, r as g, t as _ } from "./browser-CbQIH4w2.js";
+import { a as v, t as y } from "./JSONDisplay-D3RcyO9z.js";
+import { a as b, i as ee, n as x, o as S, r as C, t as te } from "./shared-uMiV6Fx1.js";
+import { t as w } from "./hash-BVQnWi7q.js";
+import { t as T } from "./loader-circle-BLy9A_pp.js";
+import { t as E } from "./maximize-2-CH5Lq90B.js";
+import { t as D } from "./sparkles-BntO2rDR.js";
+import { t as O } from "./trash-2-RwpJY5SL.js";
+import { t as k } from "./x-C3vRQIYu.js";
+import { t as A } from "./not-found-BcNNsTjS.js";
+import { u as j } from "./cfWorker-Bxcs9rNe.js";
+import "./react-yUi9mVK4.js";
+import { n as M } from "./dist-DjXr_YO3.js";
+import { n as N } from "./InspectorContext-DzXtgyTx.js";
+import { a as P } from "./dist-mRDqCgKU.js";
+import { t as F } from "./useConfig-CwxZ6Quj.js";
+import { t as I } from "./textarea-Bj-CT7hC.js";
+//#region src/client/components/sampling/SamplingRequestsList.tsx
+var L = /* @__PURE__ */ e(t(), 1), R = n();
+function z({ requests: e, selectedRequest: t, onRequestSelect: n, focusedIndex: r, formatRelativeTime: i }) {
+	return e.length === 0 ? /* @__PURE__ */ (0, R.jsx)("div", {
+		className: "flex flex-1 flex-col items-center justify-center p-4 text-center",
+		children: /* @__PURE__ */ (0, R.jsx)(A, {
+			vertical: !0,
+			noBorder: !0,
+			message: "No sampling requests"
+		})
+	}) : /* @__PURE__ */ (0, R.jsx)("div", { children: e.map((e, a) => {
+		let o = e.request.params?.messages?.length || 0, s = e.request.params?.maxTokens;
+		return /* @__PURE__ */ (0, R.jsx)(C, {
+			id: `sampling-request-${e.id}`,
+			isSelected: t?.id === e.id,
+			isFocused: r === a,
+			title: /* @__PURE__ */ (0, R.jsxs)("span", {
+				className: "flex items-center gap-3",
+				children: [e.serverName, /* @__PURE__ */ (0, R.jsx)("span", { className: "size-1.5 block rounded-full bg-orange-500" })]
+			}),
+			description: (() => {
+				let t = i(e.timestamp), n = [];
+				return o > 0 && n.push(`${o} message${o > 1 ? "s" : ""}`), s && n.push(`max ${s} tokens`), t + (n.length > 0 ? ` | ${n.join(", ")}` : "");
+			})(),
+			onClick: () => n(e)
+		}, e.id);
+	}) });
+}
+//#endregion
+//#region src/client/components/sampling/useSamplingLLM.ts
+function B({ llmConfig: e }) {
+	return {
+		generateResponse: (0, L.useCallback)(async ({ request: t }) => {
+			if (!e) throw Error("LLM config is not available");
+			let n = t.params || {}, r = n.maxTokens, i = n.temperature, a = n.messages || [];
+			if (a.length === 0) throw Error("No messages found in sampling request");
+			let o = [];
+			for (let e of a) {
+				if (!e || !e.role) continue;
+				let t = Array.isArray(e.content) ? e.content[0] : e.content;
+				t && t.type === "text" && t.text && (e.role === "user" || e.role === "assistant") && o.push({
+					role: e.role,
+					content: t.text
+				});
+			}
+			if (o.length === 0) throw Error("No valid messages could be converted. Please ensure messages have 'text' content type.");
+			return {
+				role: "assistant",
+				content: {
+					type: "text",
+					text: await P({
+						config: {
+							provider: e.provider,
+							model: e.model,
+							apiKey: e.apiKey,
+							temperature: i ?? e.temperature,
+							maxTokens: r,
+							baseUrl: e.baseUrl
+						},
+						messages: o
+					})
+				},
+				model: e.model,
+				stopReason: "endTurn"
+			};
+		}, [e]),
+		isAvailable: e !== null
+	};
+}
+//#endregion
+//#region src/client/components/sampling/SamplingRequestDisplay.tsx
+function V({ request: t, onApprove: n, onReject: g, onClose: _, previewMode: b, onTogglePreview: ee, isCopied: x, onCopy: S, onDownload: C, onFullscreen: te, llmConfig: w }) {
+	let [O, A] = (0, L.useState)("manual"), [N, P] = (0, L.useState)("stub-model"), [F, z] = (0, L.useState)("endTurn"), [V, H] = (0, L.useState)("assistant"), [U, W] = (0, L.useState)("text"), [G, K] = (0, L.useState)("positive"), [q, J] = (0, L.useState)(""), [Y, X] = (0, L.useState)("image/png"), [Z, ne] = (0, L.useState)(!1), [re, Q] = (0, L.useState)(null), { generateResponse: ie, isAvailable: $ } = B({ llmConfig: w });
+	(0, L.useEffect)(() => {
+		t && (P(O === "llm" && w?.model ? w.model : "stub-model"), z("endTurn"), H("assistant"), W("text"), K("positive"), J(""), X("image/png"), Q(null));
+	}, [t?.id]), (0, L.useEffect)(() => {
+		O === "llm" && w?.model && P(w.model);
+	}, [O, w?.model]);
+	let ae = async () => {
+		if (!t || !$) {
+			console.log("[SamplingRequestDisplay] Cannot generate:", {
+				hasRequest: !!t,
+				isAvailable: $
+			});
+			return;
+		}
+		console.log("[SamplingRequestDisplay] Starting LLM generation:", {
+			requestId: t.id,
+			llmConfig: w
+		}), ne(!0), Q(null);
+		try {
+			let e = await ie({ request: t.request });
+			console.log("[SamplingRequestDisplay] LLM generation result:", {
+				result: e,
+				model: e.model,
+				stopReason: e.stopReason,
+				role: e.role,
+				contentIsArray: Array.isArray(e.content),
+				content: e.content
+			}), P(e.model || w?.model || "stub-model"), z(e.stopReason || "endTurn"), H(e.role || "assistant");
+			let n = Array.isArray(e.content) ? e.content[0] : e.content;
+			console.log("[SamplingRequestDisplay] Setting content:", {
+				contentType: n.type,
+				hasText: "text" in n,
+				text: "text" in n ? n.text : void 0
+			}), n.type === "text" ? (W("text"), K(n.text || ""), console.log("[SamplingRequestDisplay] Set text content:", n.text)) : n.type === "image" && (W("image"), J(n.data || ""), X(n.mimeType || "image/png"), console.log("[SamplingRequestDisplay] Set image content")), console.log("[SamplingRequestDisplay] Form state after update:", {
+				model: N,
+				stopReason: F,
+				role: V,
+				contentType: U,
+				textContent: G
+			});
+		} catch (e) {
+			console.error("[SamplingRequestDisplay] LLM generation error:", e);
+			let t = e instanceof Error ? e.message : "Failed to generate response";
+			Q(t), M.error("LLM Generation Failed", { description: t });
+		} finally {
+			ne(!1), console.log("[SamplingRequestDisplay] Generation complete");
+		}
+	}, oe = (0, L.useMemo)(() => {
+		let e = {
+			model: N,
+			stopReason: F,
+			role: V,
+			content: { type: U }
+		};
+		return U === "text" ? e.content.text = G : U === "image" && (e.content.data = q, e.content.mimeType = Y), e;
+	}, [
+		N,
+		F,
+		V,
+		U,
+		G,
+		q,
+		Y
+	]);
+	return t ? /* @__PURE__ */ (0, R.jsxs)("div", {
+		className: "flex flex-col h-full",
+		children: [
+			/* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex items-center justify-between p-4 border-b dark:border-zinc-700",
+				children: [/* @__PURE__ */ (0, R.jsxs)("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ (0, R.jsx)("h3", {
+						className: "font-medium text-gray-900 dark:text-gray-100",
+						children: t.serverName
+					}), /* @__PURE__ */ (0, R.jsx)("span", {
+						className: "text-sm text-gray-500 dark:text-gray-400",
+						children: new Date(t.timestamp).toLocaleString()
+					})]
+				}), /* @__PURE__ */ (0, R.jsxs)("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ (0, R.jsxs)(i, { children: [/* @__PURE__ */ (0, R.jsx)(r, {
+							render: /* @__PURE__ */ (0, R.jsx)(o, {
+								variant: "ghost",
+								size: "sm",
+								onClick: S,
+								className: "h-8 w-8 p-0",
+								children: x ? /* @__PURE__ */ (0, R.jsx)(m, { className: "h-4 w-4 text-green-600" }) : /* @__PURE__ */ (0, R.jsx)(h, { className: "h-4 w-4" })
+							}),
+							nativeButton: !0
+						}), /* @__PURE__ */ (0, R.jsx)(a, { children: "Copy request" })] }),
+						/* @__PURE__ */ (0, R.jsxs)(i, { children: [/* @__PURE__ */ (0, R.jsx)(r, {
+							render: /* @__PURE__ */ (0, R.jsx)(o, {
+								variant: "ghost",
+								size: "sm",
+								onClick: C,
+								className: "h-8 w-8 p-0",
+								children: /* @__PURE__ */ (0, R.jsx)(v, { className: "h-4 w-4" })
+							}),
+							nativeButton: !0
+						}), /* @__PURE__ */ (0, R.jsx)(a, { children: "Download request" })] }),
+						/* @__PURE__ */ (0, R.jsxs)(i, { children: [/* @__PURE__ */ (0, R.jsx)(r, {
+							render: /* @__PURE__ */ (0, R.jsx)(o, {
+								variant: "ghost",
+								size: "sm",
+								onClick: te,
+								className: "h-8 w-8 p-0",
+								children: /* @__PURE__ */ (0, R.jsx)(E, { className: "h-4 w-4" })
+							}),
+							nativeButton: !0
+						}), /* @__PURE__ */ (0, R.jsx)(a, { children: "Fullscreen" })] }),
+						/* @__PURE__ */ (0, R.jsx)(o, {
+							variant: "ghost",
+							size: "sm",
+							onClick: _,
+							className: "h-8 w-8 p-0",
+							children: /* @__PURE__ */ (0, R.jsx)(k, { className: "h-4 w-4" })
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex-1 overflow-y-auto p-4 space-y-6",
+				children: [/* @__PURE__ */ (0, R.jsxs)("div", {
+					className: "space-y-2",
+					children: [/* @__PURE__ */ (0, R.jsx)("h4", {
+						className: "text-sm font-semibold text-gray-900 dark:text-gray-100",
+						children: "Request"
+					}), /* @__PURE__ */ (0, R.jsx)("div", {
+						className: "bg-muted rounded-lg p-3 max-h-64 overflow-auto",
+						children: /* @__PURE__ */ (0, R.jsx)(y, { data: t.request })
+					})]
+				}), /* @__PURE__ */ (0, R.jsxs)("div", {
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "flex items-center justify-between",
+							children: [/* @__PURE__ */ (0, R.jsx)("h4", {
+								className: "text-sm font-semibold text-gray-900 dark:text-gray-100",
+								children: "Response"
+							}), /* @__PURE__ */ (0, R.jsxs)("div", {
+								className: "flex items-center gap-2",
+								children: [/* @__PURE__ */ (0, R.jsx)(c, {
+									htmlFor: `responseMode-${t.id}`,
+									className: "text-xs text-gray-500 dark:text-gray-400",
+									children: "Mode:"
+								}), /* @__PURE__ */ (0, R.jsxs)(p, {
+									value: O,
+									onValueChange: (e) => A(e),
+									children: [/* @__PURE__ */ (0, R.jsx)(u, {
+										id: `responseMode-${t.id}`,
+										className: "w-32 h-8 text-xs",
+										"data-testid": "sampling-response-mode-select",
+										children: /* @__PURE__ */ (0, R.jsx)(l, {})
+									}), /* @__PURE__ */ (0, R.jsxs)(d, { children: [/* @__PURE__ */ (0, R.jsx)(f, {
+										value: "manual",
+										"data-testid": "sampling-response-mode-manual",
+										children: "Manual"
+									}), /* @__PURE__ */ (0, R.jsx)(f, {
+										value: "llm",
+										"data-testid": "sampling-response-mode-llm",
+										children: "LLM"
+									})] })]
+								})]
+							})]
+						}),
+						O === "llm" && /* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2 p-3 bg-muted rounded-lg",
+							children: [$ ? /* @__PURE__ */ (0, R.jsxs)("div", {
+								className: "flex items-center gap-2",
+								children: [/* @__PURE__ */ (0, R.jsx)(o, {
+									onClick: ae,
+									disabled: Z,
+									size: "sm",
+									className: "flex items-center gap-2",
+									"data-testid": "sampling-generate-llm-button",
+									children: Z ? /* @__PURE__ */ (0, R.jsxs)("span", {
+										"data-testid": "sampling-generating",
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ (0, R.jsx)(T, { className: "h-4 w-4 animate-spin" }), "Generating..."]
+									}) : /* @__PURE__ */ (0, R.jsxs)(R.Fragment, { children: [/* @__PURE__ */ (0, R.jsx)(D, { className: "h-4 w-4" }), "Generate with LLM"] })
+								}), /* @__PURE__ */ (0, R.jsxs)("span", {
+									className: "text-xs text-gray-500 dark:text-gray-400",
+									children: [
+										"Using ",
+										w?.provider,
+										" (",
+										w?.model,
+										")"
+									]
+								})]
+							}) : /* @__PURE__ */ (0, R.jsx)("div", {
+								className: "text-xs text-gray-500 dark:text-gray-400",
+								children: "LLM not configured. Please configure LLM in the Chat tab."
+							}), re && /* @__PURE__ */ (0, R.jsx)("div", {
+								className: "text-xs text-red-600 dark:text-red-400",
+								"data-testid": "sampling-generation-error",
+								children: re
+							})]
+						}),
+						/* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `model-${t.id}`,
+								children: "Model"
+							}), /* @__PURE__ */ (0, R.jsx)(s, {
+								id: `model-${t.id}`,
+								value: N,
+								onChange: (e) => P(e.target.value),
+								placeholder: "stub-model",
+								disabled: O === "llm" && Z,
+								"data-testid": "sampling-model-input"
+							})]
+						}),
+						/* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `stopReason-${t.id}`,
+								children: "Stop Reason"
+							}), /* @__PURE__ */ (0, R.jsx)(s, {
+								id: `stopReason-${t.id}`,
+								value: F,
+								onChange: (e) => z(e.target.value),
+								placeholder: "endTurn",
+								disabled: O === "llm" && Z,
+								"data-testid": "sampling-stop-reason-input"
+							})]
+						}),
+						/* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `role-${t.id}`,
+								children: "Role"
+							}), /* @__PURE__ */ (0, R.jsxs)(p, {
+								value: V,
+								onValueChange: (e) => H(e),
+								disabled: O === "llm" && Z,
+								children: [/* @__PURE__ */ (0, R.jsx)(u, {
+									id: `role-${t.id}`,
+									"data-testid": "sampling-role-select",
+									children: /* @__PURE__ */ (0, R.jsx)(l, {})
+								}), /* @__PURE__ */ (0, R.jsxs)(d, { children: [/* @__PURE__ */ (0, R.jsx)(f, {
+									value: "assistant",
+									children: "assistant"
+								}), /* @__PURE__ */ (0, R.jsx)(f, {
+									value: "user",
+									children: "user"
+								})] })]
+							})]
+						}),
+						/* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `contentType-${t.id}`,
+								children: "Content Type"
+							}), /* @__PURE__ */ (0, R.jsxs)(p, {
+								value: U,
+								onValueChange: (e) => W(e),
+								disabled: O === "llm" && Z,
+								children: [/* @__PURE__ */ (0, R.jsx)(u, {
+									id: `contentType-${t.id}`,
+									"data-testid": "sampling-content-type-select",
+									children: /* @__PURE__ */ (0, R.jsx)(l, {})
+								}), /* @__PURE__ */ (0, R.jsxs)(d, { children: [/* @__PURE__ */ (0, R.jsx)(f, {
+									value: "text",
+									children: "text"
+								}), /* @__PURE__ */ (0, R.jsx)(f, {
+									value: "image",
+									children: "image"
+								})] })]
+							})]
+						}),
+						U === "text" && /* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `text-${t.id}`,
+								children: "Text Content"
+							}), /* @__PURE__ */ (0, R.jsx)(I, {
+								id: `text-${t.id}`,
+								value: G,
+								onChange: (e) => K(e.target.value),
+								placeholder: "Enter response text...",
+								rows: 6,
+								disabled: O === "llm" && Z,
+								"data-testid": "sampling-text-content"
+							})]
+						}),
+						U === "image" && /* @__PURE__ */ (0, R.jsxs)(R.Fragment, { children: [/* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `imageData-${t.id}`,
+								children: "Base64 Image Data"
+							}), /* @__PURE__ */ (0, R.jsx)(I, {
+								id: `imageData-${t.id}`,
+								value: q,
+								onChange: (e) => J(e.target.value),
+								placeholder: "Base64 encoded image data...",
+								rows: 4,
+								disabled: O === "llm" && Z
+							})]
+						}), /* @__PURE__ */ (0, R.jsxs)("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ (0, R.jsx)(c, {
+								htmlFor: `mimeType-${t.id}`,
+								children: "MIME Type"
+							}), /* @__PURE__ */ (0, R.jsx)(s, {
+								id: `mimeType-${t.id}`,
+								value: Y,
+								onChange: (e) => X(e.target.value),
+								placeholder: "image/png",
+								disabled: O === "llm" && Z
+							})]
+						})] })
+					]
+				})]
+			}),
+			/* @__PURE__ */ (0, R.jsxs)("div", {
+				className: "flex gap-2 p-4 border-t dark:border-zinc-700",
+				children: [/* @__PURE__ */ (0, R.jsx)(o, {
+					onClick: () => {
+						if (!t) return;
+						let r = j.CreateMessageResult["~standard"].validate(oe);
+						if (r.issues) {
+							M.error("Invalid response", { description: `Validation failed: ${r.issues.map((e) => e.message).join(", ")}` });
+							return;
+						}
+						n(t.id, r.value), _(), import("./react-BIs9pQ3H.js").then((t) => /* @__PURE__ */ e(t.t(), 1)).then((e) => {
+							let n = M(e.createElement("div", { className: "space-y-3" }, e.createElement("div", null, e.createElement("strong", null, "Sampling Response Sent"), e.createElement("p", { className: "text-sm text-muted-foreground mt-1" }, "The tool will continue executing.")), e.createElement("div", { className: "flex gap-2" }, e.createElement("button", {
+								"data-testid": "sampling-view-tool-result",
+								className: "px-3 py-1.5 text-xs font-medium rounded-md bg-primary text-primary-foreground hover:bg-primary/90",
+								onClick: () => {
+									let e = new globalThis.CustomEvent("navigate-to-tool-result", { detail: { toolName: t.toolName } });
+									window.dispatchEvent(e), M.dismiss(n);
+								}
+							}, "View Tool Result"))), { duration: 5e3 });
+						});
+					},
+					className: "flex-1",
+					disabled: O === "llm" && Z,
+					"data-testid": "sampling-approve-button",
+					children: "Approve"
+				}), /* @__PURE__ */ (0, R.jsx)(o, {
+					onClick: () => {
+						t && (g(t.id, "User rejected sampling request"), _());
+					},
+					variant: "outline",
+					className: "flex-1",
+					disabled: O === "llm" && Z,
+					"data-testid": "sampling-reject-button",
+					children: "Reject"
+				})]
+			})
+		]
+	}) : /* @__PURE__ */ (0, R.jsx)("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",
+			children: "Select a sampling request to view details"
+		})
+	});
+}
+//#endregion
+//#region src/client/components/SamplingTab.tsx
+function H({ pendingRequests: e, onApprove: t, onReject: n, serverId: r, isConnected: i, mcpServerUrl: a }) {
+	let { selectedSamplingRequestId: o, setSelectedSamplingRequestId: s } = N(), { llmConfig: c } = F({ mcpServerUrl: a }), [l, u] = (0, L.useState)(null), [d, f] = (0, L.useState)(""), [p, m] = (0, L.useState)(-1), [h, v] = (0, L.useState)(!0), [y, C] = (0, L.useState)(!1), [T, E] = (0, L.useState)(!0), [D, k] = (0, L.useState)(!1), A = (0, L.useRef)(null), j = (0, L.useRef)(null), M = (0, L.useRef)(null), P = (0, L.useRef)(!1);
+	(0, L.useEffect)(() => {
+		if (console.log("[SamplingTab] Auto-selection check:", {
+			selectedSamplingRequestId: o,
+			pendingRequestsCount: e.length,
+			currentSelectedId: l?.id
+		}), o && e.length > 0) {
+			let t = e.find((e) => e.id === o);
+			console.log("[SamplingTab] Found request for auto-selection:", !!t, t?.id), t && (console.log("[SamplingTab] Auto-selecting request:", t.id), s(null), u(t), setTimeout(() => {
+				let e = document.getElementById(`sampling-request-${t.id}`);
+				console.log("[SamplingTab] Scrolling to element:", !!e), e && e.scrollIntoView({
+					behavior: "smooth",
+					block: "nearest"
+				});
+			}, 100));
+		}
+	}, [
+		o,
+		e,
+		s
+	]), (0, L.useEffect)(() => {
+		let t = (t) => {
+			let n = t.detail.requestId;
+			console.log("[SamplingTab] Custom navigate event received:", n);
+			let r = e.find((e) => e.id === n);
+			r && (console.log("[SamplingTab] Selecting request from event:", n), u(r), setTimeout(() => {
+				let e = document.getElementById(`sampling-request-${n}`);
+				e && e.scrollIntoView({
+					behavior: "smooth",
+					block: "nearest"
+				});
+			}, 200));
+		};
+		return window.addEventListener("navigate-to-sampling", t), () => window.removeEventListener("navigate-to-sampling", t);
+	}, [e]), (0, L.useEffect)(() => {
+		h && e.length > 0 && A.current && !P.current && (A.current.scrollTop = 0);
+	}, [e.length, h]), (0, L.useEffect)(() => {
+		let e = A.current;
+		if (!e) return;
+		let t = () => {
+			e.scrollTop > 0 && (P.current = !0, v(!1));
+		};
+		return e.addEventListener("scroll", t), () => e.removeEventListener("scroll", t);
+	}, []), (0, L.useEffect)(() => {
+		e.length === 0 && (P.current = !1, v(!0));
+	}, [e.length]), (0, L.useEffect)(() => {
+		y && M.current && M.current.focus();
+	}, [y]);
+	let I = (0, L.useCallback)(() => {
+		d.trim() || C(!1);
+	}, [d]), B = (0, L.useMemo)(() => {
+		if (!d.trim()) return e;
+		let t = d.toLowerCase();
+		return e.filter((e) => e.serverName.toLowerCase().includes(t) || JSON.stringify(e.request || {}).toLowerCase().includes(t));
+	}, [e, d]);
+	(0, L.useEffect)(() => {
+		m(-1);
+	}, [d]), (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 = B;
+			if (e.key === "ArrowDown") e.preventDefault(), m((e) => {
+				let t = e + 1;
+				return t >= n.length ? 0 : t;
+			});
+			else if (e.key === "ArrowUp") e.preventDefault(), m((e) => {
+				let t = e - 1;
+				return t < 0 ? n.length - 1 : t;
+			});
+			else if (e.key === "Enter" && p >= 0) {
+				e.preventDefault();
+				let t = B[p];
+				t && H(t);
+			}
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [p, B]), (0, L.useEffect)(() => {
+		if (p >= 0) {
+			let e = `sampling-request-${B[p]?.id}`, t = document.getElementById(e);
+			t && t.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest"
+			});
+		}
+	}, [p, B]);
+	let H = (0, L.useCallback)((e) => {
+		u(e);
+	}, []), U = (0, L.useCallback)(() => {
+		window.confirm("Are you sure you want to reject all sampling requests? This cannot be undone.") && (e.forEach((e) => {
+			n(e.id, "User rejected all requests");
+		}), u(null));
+	}, [e, n]), W = (0, L.useCallback)(async () => {
+		if (l) try {
+			await _(JSON.stringify({
+				id: l.id,
+				serverName: l.serverName,
+				timestamp: l.timestamp,
+				request: l.request
+			}, null, 2)), k(!0), setTimeout(() => k(!1), 2e3);
+		} catch (e) {
+			console.error("[SamplingTab] Failed to copy request:", e);
+		}
+	}, [l]), G = (0, L.useCallback)(() => {
+		if (l) try {
+			let e = new globalThis.Blob([JSON.stringify({
+				id: l.id,
+				serverName: l.serverName,
+				timestamp: l.timestamp,
+				request: l.request
+			}, null, 2)], { type: "application/json" }), t = URL.createObjectURL(e), n = document.createElement("a");
+			n.href = t, n.download = `sampling-request-${Date.now()}.json`, document.body.appendChild(n), n.click(), document.body.removeChild(n), URL.revokeObjectURL(t);
+		} catch (e) {
+			console.error("[SamplingTab] Failed to download request:", e);
+		}
+	}, [l]), K = (0, L.useCallback)(async () => {
+		if (j.current) try {
+			document.fullscreenElement ? await document.exitFullscreen() : await j.current.requestFullscreen();
+		} catch (e) {
+			console.error("[SamplingTab] Failed to toggle fullscreen:", e);
+		}
+	}, []);
+	return i ? /* @__PURE__ */ (0, R.jsxs)(S, {
+		orientation: "horizontal",
+		className: "h-full",
+		children: [
+			/* @__PURE__ */ (0, R.jsx)(b, {
+				defaultSize: 40,
+				minSize: 30,
+				children: /* @__PURE__ */ (0, R.jsx)(S, {
+					orientation: "vertical",
+					className: "h-full border-r dark:border-zinc-700",
+					children: /* @__PURE__ */ (0, R.jsx)(b, {
+						defaultSize: 75,
+						minSize: 30,
+						className: "h-full overflow-hidden",
+						children: /* @__PURE__ */ (0, R.jsx)(x, {
+							scrollRef: A,
+							children: (t) => /* @__PURE__ */ (0, R.jsxs)(R.Fragment, { children: [/* @__PURE__ */ (0, R.jsx)(te, {
+								isScrolled: t,
+								title: "Sampling",
+								icon: w,
+								count: B.length,
+								isSearchExpanded: y,
+								searchQuery: d,
+								searchPlaceholder: "Search requests...",
+								onSearchExpand: () => C(!0),
+								onSearchChange: f,
+								onSearchBlur: I,
+								bulkAction: {
+									icon: O,
+									label: "Reject all",
+									onClick: U,
+									disabled: e.length === 0
+								},
+								searchInputRef: M
+							}), /* @__PURE__ */ (0, R.jsx)(z, {
+								requests: B,
+								selectedRequest: l,
+								onRequestSelect: H,
+								focusedIndex: p,
+								formatRelativeTime: g
+							})] })
+						})
+					})
+				})
+			}),
+			/* @__PURE__ */ (0, R.jsx)(ee, {}),
+			/* @__PURE__ */ (0, R.jsx)(b, {
+				defaultSize: 60,
+				minSize: 40,
+				children: /* @__PURE__ */ (0, R.jsx)("div", {
+					ref: j,
+					className: "h-full bg-white dark:bg-zinc-900",
+					children: /* @__PURE__ */ (0, R.jsx)(V, {
+						request: l,
+						onApprove: t,
+						onReject: n,
+						onClose: () => u(null),
+						previewMode: T,
+						onTogglePreview: () => E(!T),
+						isCopied: D,
+						onCopy: W,
+						onDownload: G,
+						onFullscreen: K,
+						llmConfig: c
+					})
+				})
+			})
+		]
+	}) : /* @__PURE__ */ (0, R.jsxs)("div", {
+		className: "flex flex-col items-center justify-center h-full p-4 text-center",
+		children: [/* @__PURE__ */ (0, R.jsx)(w, { 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: "Not connected to server"
+		})]
+	});
+}
+//#endregion
+export { H as SamplingTab };