@modelcontextprotocol/inspector 0.18.0 → 0.19.0

package/client/dist/assets/{index-Dw52pmVD.js → index-3HVc23AL.js}

@@ -16404,7 +16404,7 @@ object({
   token_type_hint: string().optional()
 }).strip();
 const name = "@modelcontextprotocol/inspector-client";
-const version$1 = "0.18.0";
+const version$1 = "0.19.0";
 const packageJson = {
   name,
   version: version$1
@@ -16460,6 +16460,12 @@ const DEFAULT_INSPECTOR_CONFIG = {
     description: "Session token for authenticating with the MCP Proxy Server (displayed in proxy console on startup)",
     value: "",
     is_session_item: true
+  },
+  MCP_TASK_TTL: {
+    label: "Task TTL",
+    description: "Default Time-to-Live (TTL) in milliseconds for newly created tasks",
+    value: 6e4,
+    is_session_item: false
   }
 };
 const META_PREFIX_LABEL_REGEX = /^[a-z](?:[a-z\d-]*[a-z\d])?$/i;
@@ -17344,15 +17350,18 @@ class InspectorOAuthClientProvider {
     return [.../* @__PURE__ */ new Set([this.redirectUrl, this.debugRedirectUrl])];
   }
   get clientMetadata() {
-    return {
+    const metadata2 = {
       redirect_uris: this.redirect_uris,
       token_endpoint_auth_method: "none",
       grant_types: ["authorization_code", "refresh_token"],
       response_types: ["code"],
       client_name: "MCP Inspector",
-      client_uri: "https://github.com/modelcontextprotocol/inspector",
-      scope: this.scope ?? ""
+      client_uri: "https://github.com/modelcontextprotocol/inspector"
     };
+    if (this.scope) {
+      metadata2.scope = this.scope;
+    }
+    return metadata2;
   }
   state() {
     return generateOAuthState();
@@ -41010,7 +41019,9 @@ class Client extends Protocol {
           }
           return taskValidationResult.data;
         }
-        const validationResult = safeParse(CreateMessageResultSchema, result);
+        const hasTools = params.tools || params.toolChoice;
+        const resultSchema = hasTools ? CreateMessageResultWithToolsSchema : CreateMessageResultSchema;
+        const validationResult = safeParse(resultSchema, result);
         if (!validationResult.success) {
           const errorMessage = validationResult.error instanceof Error ? validationResult.error.message : String(validationResult.error);
           throw new McpError(ErrorCode.InvalidParams, `Invalid sampling result: ${errorMessage}`);
@@ -42350,6 +42361,9 @@ const getMCPProxyAuthToken = (config2) => {
     header: "X-MCP-Proxy-Auth"
   };
 };
+const getMCPTaskTtl = (config2) => {
+  return config2.MCP_TASK_TTL.value;
+};
 const getInitialTransportType = () => {
   const param = getSearchParam("transport");
   if (param === "stdio" || param === "sse" || param === "streamable-http") {
@@ -42467,6 +42481,7 @@ function useConnection({
     null
   );
   const [serverImplementation, setServerImplementation] = reactExports.useState(null);
+  const receiverTasksRef = reactExports.useRef(/* @__PURE__ */ new Map());
   reactExports.useEffect(() => {
     if (!oauthClientId) {
       clearClientInformationFromSessionStorage({
@@ -42641,7 +42656,7 @@ function useConnection({
     }
   };
   const is401Error = (error) => {
-    return error instanceof SseError && error.code === 401 || error instanceof Error && error.message.includes("401") || error instanceof Error && error.message.includes("Unauthorized");
+    return error instanceof SseError && error.code === 401 || error instanceof StreamableHTTPError && error.code === 401 || error instanceof Error && error.message.includes("401") || error instanceof Error && error.message.includes("Unauthorized") || error instanceof Error && error.message.includes("Missing Authorization header");
   };
   const isProxyAuthError = (error) => {
     return error instanceof Error && error.message.includes("Authentication required. Use the session token");
@@ -42661,11 +42676,20 @@ function useConnection({
       }
       saveScopeToSessionStorage(sseUrl, scope2);
       const serverAuthProvider = new InspectorOAuthClientProvider(sseUrl);
-      const result = await auth(serverAuthProvider, {
-        serverUrl: sseUrl,
-        scope: scope2
-      });
-      return result === "AUTHORIZED";
+      try {
+        const result = await auth(serverAuthProvider, {
+          serverUrl: sseUrl,
+          scope: scope2
+        });
+        return result === "AUTHORIZED";
+      } catch (authError) {
+        toast2({
+          title: "OAuth Authentication Failed",
+          description: authError instanceof Error ? authError.message : String(authError),
+          variant: "destructive"
+        });
+        return false;
+      }
     }
     return false;
   };
@@ -42686,6 +42710,16 @@ function useConnection({
         elicitation: {},
         roots: {
           listChanged: true
+        },
+        tasks: {
+          list: {},
+          cancel: {},
+          ...onPendingRequest || onElicitationRequest ? {
+            requests: {
+              ...onPendingRequest ? { sampling: { createMessage: {} } } : void 0,
+              ...onElicitationRequest ? { elicitation: { create: {} } } : void 0
+            }
+          } : void 0
         }
       }
     };
@@ -42761,6 +42795,7 @@ function useConnection({
             requestHeaders["Accept"] = "text/event-stream";
             requestHeaders["content-type"] = "application/json";
             transportOptions = {
+              authProvider: serverAuthProvider,
               fetch: async (url2, init) => {
                 const response = await fetch(url2, {
                   ...init,
@@ -42776,6 +42811,7 @@ function useConnection({
             break;
           case "streamable-http":
             transportOptions = {
+              authProvider: serverAuthProvider,
               fetch: async (url2, init) => {
                 requestHeaders["Accept"] = "text/event-stream, application/json";
                 requestHeaders["Content-Type"] = "application/json";
@@ -42844,6 +42880,7 @@ function useConnection({
               );
             }
             transportOptions = {
+              authProvider: serverAuthProvider,
               eventSourceInit: {
                 fetch: (url2, init) => fetch(url2, {
                   ...init,
@@ -42860,6 +42897,7 @@ function useConnection({
             mcpProxyServerUrl = new URL(`${getMCPProxyAddress(config2)}/mcp`);
             mcpProxyServerUrl.searchParams.append("url", sseUrl);
             transportOptions = {
+              authProvider: serverAuthProvider,
               eventSourceInit: {
                 fetch: (url2, init) => fetch(url2, {
                   ...init,
@@ -42889,7 +42927,8 @@ function useConnection({
           ResourceUpdatedNotificationSchema,
           ResourceListChangedNotificationSchema,
           ToolListChangedNotificationSchema,
-          PromptListChangedNotificationSchema
+          PromptListChangedNotificationSchema,
+          TaskStatusNotificationSchema
         ].forEach((notificationSchema) => {
           client2.setNotificationHandler(notificationSchema, onNotification);
         });
@@ -42949,11 +42988,170 @@ function useConnection({
       }
       setServerCapabilities(capabilities ?? null);
       setCompletionsSupported(capabilities?.completions !== void 0);
+      const nowIso = () => (/* @__PURE__ */ new Date()).toISOString();
+      const makeTaskId = () => {
+        const cryptoAny = globalThis.crypto;
+        return cryptoAny?.randomUUID?.() ?? `task_${Date.now()}_${Math.random().toString(16).slice(2)}`;
+      };
+      const emitTaskStatus = async (task) => {
+        try {
+          const notification = {
+            method: "notifications/tasks/status",
+            params: task
+          };
+          await client2.notification(notification);
+          pushHistory(notification);
+        } catch (e) {
+          console.warn("Failed to send notifications/tasks/status", e);
+        }
+      };
+      const upsertReceiverTask = async (task) => {
+        const record2 = receiverTasksRef.current.get(task.taskId);
+        if (record2) {
+          receiverTasksRef.current.set(task.taskId, { ...record2, task });
+        }
+        await emitTaskStatus(task);
+      };
+      const createReceiverTask = (opts) => {
+        const taskId = makeTaskId();
+        const createdAt = nowIso();
+        const ttl = opts.ttl ?? getMCPTaskTtl(config2);
+        let resolvePayload = () => void 0;
+        let rejectPayload = () => void 0;
+        const payloadPromise = new Promise((resolve2, reject) => {
+          resolvePayload = resolve2;
+          rejectPayload = reject;
+        });
+        const task = {
+          taskId,
+          status: opts.initialStatus,
+          ttl,
+          createdAt,
+          lastUpdatedAt: createdAt,
+          ...opts.pollInterval !== void 0 ? { pollInterval: opts.pollInterval } : void 0,
+          ...opts.statusMessage ? { statusMessage: opts.statusMessage } : {}
+        };
+        const record2 = {
+          task,
+          payloadPromise,
+          resolvePayload,
+          rejectPayload
+        };
+        if (ttl !== null && ttl > 0) {
+          record2.cleanupTimeoutId = setTimeout(() => {
+            receiverTasksRef.current.delete(taskId);
+          }, ttl);
+        }
+        receiverTasksRef.current.set(taskId, record2);
+        void emitTaskStatus(task);
+        return record2;
+      };
+      client2.setRequestHandler(ListTasksRequestSchema, async () => {
+        return {
+          tasks: Array.from(receiverTasksRef.current.values()).map(
+            (r2) => r2.task
+          )
+        };
+      });
+      client2.setRequestHandler(GetTaskRequestSchema, async (request) => {
+        const record2 = receiverTasksRef.current.get(request.params.taskId);
+        if (!record2) {
+          throw new McpError(
+            ErrorCode.InvalidParams,
+            `Unknown taskId: ${request.params.taskId}`
+          );
+        }
+        return record2.task;
+      });
+      client2.setRequestHandler(GetTaskPayloadRequestSchema, async (request) => {
+        const record2 = receiverTasksRef.current.get(request.params.taskId);
+        if (!record2) {
+          throw new McpError(
+            ErrorCode.InvalidParams,
+            `Unknown taskId: ${request.params.taskId}`
+          );
+        }
+        return await record2.payloadPromise;
+      });
+      client2.setRequestHandler(CancelTaskRequestSchema, async (request) => {
+        const record2 = receiverTasksRef.current.get(request.params.taskId);
+        if (!record2) {
+          throw new McpError(
+            ErrorCode.InvalidParams,
+            `Unknown taskId: ${request.params.taskId}`
+          );
+        }
+        const terminalStatuses = [
+          "completed",
+          "failed",
+          "cancelled"
+        ];
+        if (!terminalStatuses.includes(record2.task.status)) {
+          const updated = {
+            ...record2.task,
+            status: "cancelled",
+            lastUpdatedAt: nowIso(),
+            statusMessage: "Cancelled"
+          };
+          receiverTasksRef.current.set(request.params.taskId, {
+            ...record2,
+            task: updated
+          });
+          record2.rejectPayload(
+            new McpError(ErrorCode.InternalError, "Task was cancelled")
+          );
+          await emitTaskStatus(updated);
+        }
+        return receiverTasksRef.current.get(request.params.taskId).task;
+      });
       if (onPendingRequest) {
         client2.setRequestHandler(CreateMessageRequestSchema, (request) => {
-          return new Promise((resolve2, reject) => {
-            onPendingRequest(request, resolve2, reject);
+          const taskSpec = request.params?.task;
+          if (!taskSpec) {
+            return new Promise((resolve2, reject) => {
+              onPendingRequest(request, resolve2, reject);
+            });
+          }
+          const record2 = createReceiverTask({
+            ttl: taskSpec.ttl,
+            initialStatus: "input_required",
+            statusMessage: "Awaiting user input"
           });
+          void (async () => {
+            try {
+              const payload = await new Promise((resolve2, reject) => {
+                onPendingRequest(request, resolve2, reject);
+              });
+              record2.resolvePayload(payload);
+              const updated = {
+                ...record2.task,
+                status: "completed",
+                lastUpdatedAt: nowIso()
+              };
+              receiverTasksRef.current.set(record2.task.taskId, {
+                ...record2,
+                task: updated
+              });
+              await upsertReceiverTask(updated);
+            } catch (e) {
+              record2.rejectPayload(e);
+              const updated = {
+                ...record2.task,
+                status: "failed",
+                lastUpdatedAt: nowIso(),
+                statusMessage: e instanceof Error ? e.message : "Task failed"
+              };
+              receiverTasksRef.current.set(record2.task.taskId, {
+                ...record2,
+                task: updated
+              });
+              await upsertReceiverTask(updated);
+            }
+          })();
+          const createTaskResult = {
+            task: record2.task
+          };
+          return createTaskResult;
         });
       }
       if (getRoots) {
@@ -42961,6 +43159,56 @@ function useConnection({
           return { roots: getRoots() };
         });
       }
+      if (onElicitationRequest) {
+        client2.setRequestHandler(ElicitRequestSchema, (request) => {
+          const taskSpec = request.params?.task;
+          if (!taskSpec) {
+            return new Promise((resolve2) => {
+              onElicitationRequest(request, resolve2);
+            });
+          }
+          const record2 = createReceiverTask({
+            ttl: taskSpec.ttl,
+            initialStatus: "input_required",
+            statusMessage: "Awaiting user input"
+          });
+          void (async () => {
+            try {
+              const payload = await new Promise((resolve2) => {
+                onElicitationRequest(request, resolve2);
+              });
+              record2.resolvePayload(payload);
+              const updated = {
+                ...record2.task,
+                status: "completed",
+                lastUpdatedAt: nowIso()
+              };
+              receiverTasksRef.current.set(record2.task.taskId, {
+                ...record2,
+                task: updated
+              });
+              await upsertReceiverTask(updated);
+            } catch (e) {
+              record2.rejectPayload(e);
+              const updated = {
+                ...record2.task,
+                status: "failed",
+                lastUpdatedAt: nowIso(),
+                statusMessage: e instanceof Error ? e.message : "Task failed"
+              };
+              receiverTasksRef.current.set(record2.task.taskId, {
+                ...record2,
+                task: updated
+              });
+              await upsertReceiverTask(updated);
+            }
+          })();
+          const createTaskResult = {
+            task: record2.task
+          };
+          return createTaskResult;
+        });
+      }
       if (capabilities?.logging && defaultLoggingLevel) {
         lastRequest = "logging/setLevel";
         await client2.setLoggingLevel(defaultLoggingLevel);
@@ -42975,13 +43223,6 @@ function useConnection({
         );
         lastRequest = "";
       }
-      if (onElicitationRequest) {
-        client2.setRequestHandler(ElicitRequestSchema, async (request) => {
-          return new Promise((resolve2) => {
-            onElicitationRequest(request, resolve2);
-          });
-        });
-      }
       setMcpClient(client2);
       setConnectionStatus("connected");
     } catch (e) {
@@ -42991,12 +43232,42 @@ function useConnection({
           description: `Server declares logging capability but doesn't implement method: "${lastRequest}"`,
           variant: "destructive"
         });
+      } else {
+        toast2({
+          title: "Connection error",
+          description: `Connection failed: "${e}"`,
+          variant: "destructive"
+        });
       }
       console.error(e);
       setConnectionStatus("error");
     }
   };
+  const cancelTask = async (taskId) => {
+    return makeRequest(
+      {
+        method: "tasks/cancel",
+        params: { taskId }
+      },
+      CancelTaskResultSchema
+    );
+  };
+  const listTasks = async (cursor) => {
+    return makeRequest(
+      {
+        method: "tasks/list",
+        params: { cursor }
+      },
+      ListTasksResultSchema
+    );
+  };
   const disconnect = async () => {
+    receiverTasksRef.current.forEach((record2) => {
+      if (record2.cleanupTimeoutId) {
+        clearTimeout(record2.cleanupTimeoutId);
+      }
+    });
+    receiverTasksRef.current.clear();
     if (transportType === "streamable-http")
       await clientTransport.terminateSession();
     await mcpClient?.close();
@@ -43022,6 +43293,8 @@ function useConnection({
     requestHistory,
     clearRequestHistory,
     makeRequest,
+    cancelTask,
+    listTasks,
     sendNotification,
     handleCompletion,
     completionsSupported,
@@ -43766,7 +44039,7 @@ const createLucideIcon = (iconName, iconNode) => {
   Component.displayName = toPascalCase(iconName);
   return Component;
 };
-const __iconNode$A = [
+const __iconNode$F = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   [
     "path",
@@ -43776,8 +44049,8 @@ const __iconNode$A = [
     }
   ]
 ];
-const Bell = createLucideIcon("bell", __iconNode$A);
-const __iconNode$z = [
+const Bell = createLucideIcon("bell", __iconNode$F);
+const __iconNode$E = [
   ["path", { d: "m8 2 1.88 1.88", key: "fmnt4t" }],
   ["path", { d: "M14.12 3.88 16 2", key: "qol33r" }],
   ["path", { d: "M9 7.13v-1a3.003 3.003 0 1 1 6 0v1", key: "d7y7pr" }],
@@ -43796,56 +44069,72 @@ const __iconNode$z = [
   ["path", { d: "M22 13h-4", key: "1jl80f" }],
   ["path", { d: "M17.2 17c2.1.1 3.8 1.9 3.8 4", key: "k3fwyw" }]
 ];
-const Bug = createLucideIcon("bug", __iconNode$z);
-const __iconNode$y = [
+const Bug = createLucideIcon("bug", __iconNode$E);
+const __iconNode$D = [
   ["path", { d: "M18 6 7 17l-5-5", key: "116fxf" }],
   ["path", { d: "m22 10-7.5 7.5L13 16", key: "ke71qq" }]
 ];
-const CheckCheck = createLucideIcon("check-check", __iconNode$y);
-const __iconNode$x = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$x);
-const __iconNode$w = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$w);
-const __iconNode$v = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$v);
-const __iconNode$u = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
-const ChevronUp = createLucideIcon("chevron-up", __iconNode$u);
-const __iconNode$t = [
+const CheckCheck = createLucideIcon("check-check", __iconNode$D);
+const __iconNode$C = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$C);
+const __iconNode$B = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$B);
+const __iconNode$A = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$A);
+const __iconNode$z = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
+const ChevronUp = createLucideIcon("chevron-up", __iconNode$z);
+const __iconNode$y = [
   ["path", { d: "m7 15 5 5 5-5", key: "1hf1tw" }],
   ["path", { d: "m7 9 5-5 5 5", key: "sgt6xg" }]
 ];
-const ChevronsUpDown = createLucideIcon("chevrons-up-down", __iconNode$t);
-const __iconNode$s = [
+const ChevronsUpDown = createLucideIcon("chevrons-up-down", __iconNode$y);
+const __iconNode$x = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
   ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$s);
-const __iconNode$r = [
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$x);
+const __iconNode$w = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
 ];
-const CircleCheck = createLucideIcon("circle-check", __iconNode$r);
-const __iconNode$q = [
+const CircleCheck = createLucideIcon("circle-check", __iconNode$w);
+const __iconNode$v = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["polygon", { points: "10 8 16 12 10 16 10 8", key: "1cimsy" }]
+];
+const CirclePlay = createLucideIcon("circle-play", __iconNode$v);
+const __iconNode$u = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3", key: "1u773s" }],
   ["path", { d: "M12 17h.01", key: "p32p05" }]
 ];
-const CircleQuestionMark = createLucideIcon("circle-question-mark", __iconNode$q);
-const __iconNode$p = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
-const Circle = createLucideIcon("circle", __iconNode$p);
-const __iconNode$o = [
+const CircleQuestionMark = createLucideIcon("circle-question-mark", __iconNode$u);
+const __iconNode$t = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["path", { d: "m15 9-6 6", key: "1uzhvr" }],
+  ["path", { d: "m9 9 6 6", key: "z0biqf" }]
+];
+const CircleX = createLucideIcon("circle-x", __iconNode$t);
+const __iconNode$s = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
+const Circle = createLucideIcon("circle", __iconNode$s);
+const __iconNode$r = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["polyline", { points: "12 6 12 12 16 14", key: "68esgv" }]
+];
+const Clock = createLucideIcon("clock", __iconNode$r);
+const __iconNode$q = [
   ["rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2", key: "17jyea" }],
   ["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2", key: "zix9uf" }]
 ];
-const Copy = createLucideIcon("copy", __iconNode$o);
-const __iconNode$n = [
+const Copy = createLucideIcon("copy", __iconNode$q);
+const __iconNode$p = [
   ["path", { d: "M15 3h6v6", key: "1q9fwt" }],
   ["path", { d: "M10 14 21 3", key: "gplh6r" }],
   ["path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6", key: "a6xqqp" }]
 ];
-const ExternalLink = createLucideIcon("external-link", __iconNode$n);
-const __iconNode$m = [
+const ExternalLink = createLucideIcon("external-link", __iconNode$p);
+const __iconNode$o = [
   [
     "path",
     {
@@ -43863,8 +44152,8 @@ const __iconNode$m = [
   ],
   ["path", { d: "m2 2 20 20", key: "1ooewy" }]
 ];
-const EyeOff = createLucideIcon("eye-off", __iconNode$m);
-const __iconNode$l = [
+const EyeOff = createLucideIcon("eye-off", __iconNode$o);
+const __iconNode$n = [
   [
     "path",
     {
@@ -43874,22 +44163,22 @@ const __iconNode$l = [
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
 ];
-const Eye = createLucideIcon("eye", __iconNode$l);
-const __iconNode$k = [
+const Eye = createLucideIcon("eye", __iconNode$n);
+const __iconNode$m = [
   ["path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z", key: "1rqfz7" }],
   ["path", { d: "M14 2v4a2 2 0 0 0 2 2h4", key: "tnqrlb" }],
   ["path", { d: "M10 9H8", key: "b1mrlr" }],
   ["path", { d: "M16 13H8", key: "t4e002" }],
   ["path", { d: "M16 17H8", key: "z1uh3a" }]
 ];
-const FileText = createLucideIcon("file-text", __iconNode$k);
-const __iconNode$j = [
+const FileText = createLucideIcon("file-text", __iconNode$m);
+const __iconNode$l = [
   ["path", { d: "M20 7h-3a2 2 0 0 1-2-2V2", key: "x099mo" }],
   ["path", { d: "M9 18a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7l4 4v10a2 2 0 0 1-2 2Z", key: "18t6ie" }],
   ["path", { d: "M3 7.6v12.8A1.6 1.6 0 0 0 4.6 22h9.8", key: "1nja0z" }]
 ];
-const Files = createLucideIcon("files", __iconNode$j);
-const __iconNode$i = [
+const Files = createLucideIcon("files", __iconNode$l);
+const __iconNode$k = [
   [
     "path",
     {
@@ -43907,8 +44196,8 @@ const __iconNode$i = [
   ["path", { d: "M3 5a2 2 0 0 0 2 2h3", key: "f2jnh7" }],
   ["path", { d: "M3 3v13a2 2 0 0 0 2 2h3", key: "k8epm1" }]
 ];
-const FolderTree = createLucideIcon("folder-tree", __iconNode$i);
-const __iconNode$h = [
+const FolderTree = createLucideIcon("folder-tree", __iconNode$k);
+const __iconNode$j = [
   [
     "path",
     {
@@ -43918,8 +44207,8 @@ const __iconNode$h = [
   ],
   ["path", { d: "M9 18c-4.51 2-5-2-7-2", key: "9comsn" }]
 ];
-const Github = createLucideIcon("github", __iconNode$h);
-const __iconNode$g = [
+const Github = createLucideIcon("github", __iconNode$j);
+const __iconNode$i = [
   ["path", { d: "m15 12-8.373 8.373a1 1 0 1 1-3-3L12 9", key: "eefl8a" }],
   ["path", { d: "m18 15 4-4", key: "16gjal" }],
   [
@@ -43930,36 +44219,44 @@ const __iconNode$g = [
     }
   ]
 ];
-const Hammer = createLucideIcon("hammer", __iconNode$g);
-const __iconNode$f = [
+const Hammer = createLucideIcon("hammer", __iconNode$i);
+const __iconNode$h = [
   ["line", { x1: "4", x2: "20", y1: "9", y2: "9", key: "4lhtct" }],
   ["line", { x1: "4", x2: "20", y1: "15", y2: "15", key: "vyu0kd" }],
   ["line", { x1: "10", x2: "8", y1: "3", y2: "21", key: "1ggp8o" }],
   ["line", { x1: "16", x2: "14", y1: "3", y2: "21", key: "weycgp" }]
 ];
-const Hash = createLucideIcon("hash", __iconNode$f);
-const __iconNode$e = [
+const Hash = createLucideIcon("hash", __iconNode$h);
+const __iconNode$g = [
   ["path", { d: "m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4", key: "g0fldk" }],
   ["path", { d: "m21 2-9.6 9.6", key: "1j0ho8" }],
   ["circle", { cx: "7.5", cy: "15.5", r: "5.5", key: "yqb3hr" }]
 ];
-const Key = createLucideIcon("key", __iconNode$e);
-const __iconNode$d = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
-const LoaderCircle = createLucideIcon("loader-circle", __iconNode$d);
-const __iconNode$c = [
+const Key = createLucideIcon("key", __iconNode$g);
+const __iconNode$f = [
+  ["rect", { x: "3", y: "5", width: "6", height: "6", rx: "1", key: "1defrl" }],
+  ["path", { d: "m3 17 2 2 4-4", key: "1jhpwq" }],
+  ["path", { d: "M13 6h8", key: "15sg57" }],
+  ["path", { d: "M13 12h8", key: "h98zly" }],
+  ["path", { d: "M13 18h8", key: "oe0vm4" }]
+];
+const ListTodo = createLucideIcon("list-todo", __iconNode$f);
+const __iconNode$e = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
+const LoaderCircle = createLucideIcon("loader-circle", __iconNode$e);
+const __iconNode$d = [
   ["path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z", key: "1lielz" }]
 ];
-const MessageSquare = createLucideIcon("message-square", __iconNode$c);
-const __iconNode$b = [["path", { d: "M5 12h14", key: "1ays0h" }]];
-const Minus = createLucideIcon("minus", __iconNode$b);
-const __iconNode$a = [["polygon", { points: "6 3 20 12 6 21 6 3", key: "1oa8hb" }]];
-const Play = createLucideIcon("play", __iconNode$a);
-const __iconNode$9 = [
+const MessageSquare = createLucideIcon("message-square", __iconNode$d);
+const __iconNode$c = [["path", { d: "M5 12h14", key: "1ays0h" }]];
+const Minus = createLucideIcon("minus", __iconNode$c);
+const __iconNode$b = [["polygon", { points: "6 3 20 12 6 21 6 3", key: "1oa8hb" }]];
+const Play = createLucideIcon("play", __iconNode$b);
+const __iconNode$a = [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "M12 5v14", key: "s699le" }]
 ];
-const Plus = createLucideIcon("plus", __iconNode$9);
-const __iconNode$8 = [
+const Plus = createLucideIcon("plus", __iconNode$a);
+const __iconNode$9 = [
   ["path", { d: "M21 8L18.74 5.74A9.75 9.75 0 0 0 12 3C11 3 10.03 3.16 9.13 3.47", key: "1krf6h" }],
   ["path", { d: "M8 16H3v5", key: "1cv678" }],
   ["path", { d: "M3 12C3 9.51 4 7.26 5.64 5.64", key: "ruvoct" }],
@@ -43968,20 +44265,20 @@ const __iconNode$8 = [
   ["path", { d: "M21 3v5h-5", key: "1q7to0" }],
   ["path", { d: "M22 22 2 2", key: "1r8tn9" }]
 ];
-const RefreshCwOff = createLucideIcon("refresh-cw-off", __iconNode$8);
-const __iconNode$7 = [
+const RefreshCwOff = createLucideIcon("refresh-cw-off", __iconNode$9);
+const __iconNode$8 = [
   ["path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8", key: "v9h5vc" }],
   ["path", { d: "M21 3v5h-5", key: "1q7to0" }],
   ["path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16", key: "3uifl3" }],
   ["path", { d: "M8 16H3v5", key: "1cv678" }]
 ];
-const RefreshCw = createLucideIcon("refresh-cw", __iconNode$7);
-const __iconNode$6 = [
+const RefreshCw = createLucideIcon("refresh-cw", __iconNode$8);
+const __iconNode$7 = [
   ["path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8", key: "1357e3" }],
   ["path", { d: "M3 3v5h5", key: "1xhq8a" }]
 ];
-const RotateCcw = createLucideIcon("rotate-ccw", __iconNode$6);
-const __iconNode$5 = [
+const RotateCcw = createLucideIcon("rotate-ccw", __iconNode$7);
+const __iconNode$6 = [
   [
     "path",
     {
@@ -43992,13 +44289,13 @@ const __iconNode$5 = [
   ["path", { d: "M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7", key: "1ydtos" }],
   ["path", { d: "M7 3v4a1 1 0 0 0 1 1h7", key: "t51u73" }]
 ];
-const Save = createLucideIcon("save", __iconNode$5);
-const __iconNode$4 = [
+const Save = createLucideIcon("save", __iconNode$6);
+const __iconNode$5 = [
   ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
 ];
-const Search = createLucideIcon("search", __iconNode$4);
-const __iconNode$3 = [
+const Search = createLucideIcon("search", __iconNode$5);
+const __iconNode$4 = [
   [
     "path",
     {
@@ -44008,15 +44305,15 @@ const __iconNode$3 = [
   ],
   ["path", { d: "m21.854 2.147-10.94 10.939", key: "12cjpa" }]
 ];
-const Send = createLucideIcon("send", __iconNode$3);
-const __iconNode$2 = [
+const Send = createLucideIcon("send", __iconNode$4);
+const __iconNode$3 = [
   ["rect", { width: "20", height: "8", x: "2", y: "2", rx: "2", ry: "2", key: "ngkwjq" }],
   ["rect", { width: "20", height: "8", x: "2", y: "14", rx: "2", ry: "2", key: "iecqi9" }],
   ["line", { x1: "6", x2: "6.01", y1: "6", y2: "6", key: "16zg32" }],
   ["line", { x1: "6", x2: "6.01", y1: "18", y2: "18", key: "nzw8ys" }]
 ];
-const Server = createLucideIcon("server", __iconNode$2);
-const __iconNode$1 = [
+const Server = createLucideIcon("server", __iconNode$3);
+const __iconNode$2 = [
   [
     "path",
     {
@@ -44026,15 +44323,27 @@ const __iconNode$1 = [
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
 ];
-const Settings = createLucideIcon("settings", __iconNode$1);
-const __iconNode = [
+const Settings = createLucideIcon("settings", __iconNode$2);
+const __iconNode$1 = [
   ["path", { d: "M3 6h18", key: "d0wm0j" }],
   ["path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6", key: "4alrt4" }],
   ["path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2", key: "v07s0e" }],
   ["line", { x1: "10", x2: "10", y1: "11", y2: "17", key: "1uufr5" }],
   ["line", { x1: "14", x2: "14", y1: "11", y2: "17", key: "xtxkd" }]
 ];
-const Trash2 = createLucideIcon("trash-2", __iconNode);
+const Trash2 = createLucideIcon("trash-2", __iconNode$1);
+const __iconNode = [
+  [
+    "path",
+    {
+      d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",
+      key: "wmoenq"
+    }
+  ],
+  ["path", { d: "M12 9v4", key: "juzpu7" }],
+  ["path", { d: "M12 17h.01", key: "p32p05" }]
+];
+const TriangleAlert = createLucideIcon("triangle-alert", __iconNode);
 const OAuthStepDetails = ({
   label,
   isComplete,
@@ -50193,7 +50502,7 @@ class UriTemplate {
     const name2 = part.name;
     switch (part.operator) {
       case "":
-        pattern2 = part.exploded ? "([^/]+(?:,[^/]+)*)" : "([^/,]+)";
+        pattern2 = part.exploded ? "([^/,]+(?:,[^/,]+)*)" : "([^/,]+)";
         break;
       case "+":
       case "#":
@@ -50203,7 +50512,7 @@ class UriTemplate {
         pattern2 = "\\.([^/,]+)";
         break;
       case "/":
-        pattern2 = "/" + (part.exploded ? "([^/]+(?:,[^/]+)*)" : "([^/,]+)");
+        pattern2 = "/" + (part.exploded ? "([^/,]+(?:,[^/,]+)*)" : "([^/,]+)");
         break;
       default:
         pattern2 = "([^/]+)";
@@ -52388,7 +52697,8 @@ Prism.languages.webmanifest = Prism.languages.json;
 const JsonEditor = ({
   value,
   onChange,
-  error: externalError
+  error: externalError,
+  placeholder
 }) => {
   const [editorContent, setEditorContent] = reactExports.useState(value || "");
   const [internalError, setInternalError] = reactExports.useState(
@@ -52415,6 +52725,7 @@ const JsonEditor = ({
             onValueChange: handleEditorChange,
             highlight: (code2) => Prism$1.highlight(code2, Prism$1.languages.json, "json"),
             padding: 10,
+            placeholder,
             style: {
               fontFamily: '"Fira code", "Fira Mono", monospace',
               fontSize: 14,
@@ -52999,7 +53310,8 @@ const DynamicJsonForm = reactExports.forwardRef(
             setRawJsonValue(newValue);
             debouncedUpdateParent(newValue);
           },
-          error: jsonError
+          error: jsonError,
+          placeholder: schema.description
         }
       ) : (
         // If schema type is object but value is not an object or is empty, and we have actual JSON data,
@@ -54535,7 +54847,7 @@ const useTheme = () => {
     [theme, setThemeWithSideEffect]
   );
 };
-const version = "0.18.0";
+const version = "0.19.0";
 var SLOTTABLE_IDENTIFIER = /* @__PURE__ */ Symbol("radix.slottable");
 // @__NO_SIDE_EFFECTS__
 function createSlottable(ownerName) {
@@ -56544,7 +56856,8 @@ const ToolResults = ({
   toolResult,
   selectedTool,
   resourceContent,
-  onReadResource
+  onReadResource,
+  isPollingTask
 }) => {
   if (!toolResult) return null;
   if ("content" in toolResult) {
@@ -56559,6 +56872,10 @@ const ToolResults = ({
     }
     const structuredResult = parsedResult.data;
     const isError = structuredResult.isError ?? false;
+    const relatedTask = structuredResult._meta?.["io.modelcontextprotocol/related-task"];
+    const isTaskRunning = isPollingTask || !!relatedTask && structuredResult.content.some(
+      (c) => c.type === "text" && (c.text?.includes("Polling") || c.text?.includes("Task status"))
+    );
     let validationResult = null;
     const toolHasOutputSchema = selectedTool && hasOutputSchema(selectedTool.name);
     if (toolHasOutputSchema) {
@@ -56585,7 +56902,7 @@ const ToolResults = ({
       /* @__PURE__ */ jsxRuntimeExports.jsxs("h4", { className: "font-semibold mb-2", children: [
         "Tool Result:",
         " ",
-        isError ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-600 font-semibold", children: "Error" }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-green-600 font-semibold", children: "Success" })
+        isError ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-600 font-semibold", children: "Error" }) : isTaskRunning ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-yellow-600 font-semibold", children: "Task Running" }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-green-600 font-semibold", children: "Success" })
       ] }),
       structuredResult.structuredContent && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-4", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("h5", { className: "font-semibold mb-2 text-sm", children: "Structured Content:" }),
@@ -56676,12 +56993,14 @@ const ToolsTab = ({
   selectedTool,
   setSelectedTool,
   toolResult,
+  isPollingTask,
   nextCursor,
   error,
   resourceContent,
   onReadResource
 }) => {
   const [params, setParams] = reactExports.useState({});
+  const [runAsTask, setRunAsTask] = reactExports.useState(false);
   const [isToolRunning, setIsToolRunning] = reactExports.useState(false);
   const [isOutputSchemaExpanded, setIsOutputSchemaExpanded] = reactExports.useState(false);
   const [isMetadataExpanded, setIsMetadataExpanded] = reactExports.useState(false);
@@ -56715,6 +57034,7 @@ const ToolsTab = ({
       ];
     });
     setParams(Object.fromEntries(params2));
+    setRunAsTask(false);
     setHasValidationErrors(false);
     formRefs.current = {};
   }, [selectedTool]);
@@ -56739,6 +57059,7 @@ const ToolsTab = ({
         clearItems: () => {
           clearTools();
           setSelectedTool(null);
+          setRunAsTask(false);
         },
         setSelectedItem: setSelectedTool,
         renderItem: (tool) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start w-full gap-2", children: [
@@ -57128,6 +57449,24 @@ const ToolsTab = ({
             }
           )
         ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Checkbox,
+            {
+              id: "run-as-task",
+              checked: runAsTask,
+              onCheckedChange: (checked) => setRunAsTask(checked)
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Label$1,
+            {
+              htmlFor: "run-as-task",
+              className: "text-sm font-medium text-gray-700 dark:text-gray-300 cursor-pointer",
+              children: "Run as task"
+            }
+          )
+        ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Button,
           {
@@ -57145,16 +57484,17 @@ const ToolsTab = ({
                 await callTool(
                   selectedTool.name,
                   params,
-                  Object.keys(metadata2).length ? metadata2 : void 0
+                  Object.keys(metadata2).length ? metadata2 : void 0,
+                  runAsTask
                 );
               } finally {
                 setIsToolRunning(false);
               }
             },
-            disabled: isToolRunning || hasValidationErrors || hasReservedMetadataEntry || hasInvalidMetaPrefixEntry || hasInvalidMetaNameEntry,
-            children: isToolRunning ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+            disabled: isToolRunning || isPollingTask || hasValidationErrors || hasReservedMetadataEntry || hasInvalidMetaPrefixEntry || hasInvalidMetaNameEntry,
+            children: isToolRunning || isPollingTask ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "w-4 h-4 mr-2 animate-spin" }),
-              "Running..."
+              isPollingTask ? "Polling Task..." : "Running..."
             ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx(Send, { className: "w-4 h-4 mr-2" }),
               "Run Tool"
@@ -57190,13 +57530,168 @@ const ToolsTab = ({
             toolResult,
             selectedTool,
             resourceContent,
-            onReadResource
+            onReadResource,
+            isPollingTask
           }
         )
       ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Alert, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(AlertDescription, { children: "Select a tool from the list to view its details and run it" }) }) })
     ] })
   ] }) });
 };
+const TaskStatusIcon = ({ status }) => {
+  switch (status) {
+    case "working":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "h-4 w-4 animate-pulse text-blue-500" });
+    case "input_required":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "h-4 w-4 text-yellow-500" });
+    case "completed":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheck, { className: "h-4 w-4 text-green-500" });
+    case "failed":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleX, { className: "h-4 w-4 text-red-500" });
+    case "cancelled":
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleX, { className: "h-4 w-4 text-gray-500" });
+    default:
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(CirclePlay, { className: "h-4 w-4" });
+  }
+};
+const TasksTab = ({
+  tasks,
+  listTasks,
+  clearTasks,
+  cancelTask,
+  selectedTask,
+  setSelectedTask,
+  error,
+  nextCursor
+}) => {
+  const [isCancelling, setIsCancelling] = reactExports.useState(null);
+  const displayedTask = selectedTask ? tasks.find((t) => t.taskId === selectedTask.taskId) || selectedTask : null;
+  const handleCancel = async (taskId) => {
+    setIsCancelling(taskId);
+    try {
+      await cancelTask(taskId);
+    } finally {
+      setIsCancelling(null);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "tasks", className: "flex-1 overflow-hidden p-0 m-0", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-full overflow-hidden p-4 gap-4", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-1/3", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ListPane,
+      {
+        title: "Tasks",
+        items: tasks,
+        setSelectedItem: setSelectedTask,
+        listItems: listTasks,
+        clearItems: clearTasks,
+        buttonText: nextCursor ? "List More Tasks" : "List Tasks",
+        isButtonDisabled: !nextCursor && tasks.length > 0,
+        renderItem: (task) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 overflow-hidden w-full", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(TaskStatusIcon, { status: task.status }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col overflow-hidden", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate font-medium", children: task.taskId }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "truncate text-xs text-muted-foreground", children: [
+              task.status,
+              " -",
+              " ",
+              new Date(task.lastUpdatedAt).toLocaleString()
+            ] })
+          ] })
+        ] })
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 overflow-y-auto p-4 bg-background border border-border rounded-lg", children: [
+      error && /* @__PURE__ */ jsxRuntimeExports.jsxs(Alert, { variant: "destructive", className: "mb-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AlertTitle, { children: "Error" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AlertDescription, { children: error })
+      ] }),
+      displayedTask ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between border-b pb-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-2xl font-bold tracking-tight", children: "Task Details" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-muted-foreground", children: [
+              "ID: ",
+              displayedTask.taskId
+            ] })
+          ] }),
+          (displayedTask.status === "working" || displayedTask.status === "input_required") && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            Button,
+            {
+              variant: "destructive",
+              size: "sm",
+              "aria-label": `Cancel task ${displayedTask.taskId}`,
+              onClick: () => handleCancel(displayedTask.taskId),
+              disabled: isCancelling === displayedTask.taskId,
+              children: [
+                isCancelling === displayedTask.taskId ? /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(CircleX, { className: "mr-2 h-4 w-4" }),
+                "Cancel Task"
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-lg border p-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium text-muted-foreground", children: "Status" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-1 flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(TaskStatusIcon, { status: displayedTask.status }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "span",
+                {
+                  className: cn(
+                    "font-semibold capitalize",
+                    displayedTask.status === "working" && "text-blue-500",
+                    displayedTask.status === "completed" && "text-green-500",
+                    displayedTask.status === "failed" && "text-red-500",
+                    displayedTask.status === "cancelled" && "text-gray-500",
+                    displayedTask.status === "input_required" && "text-yellow-500"
+                  ),
+                  children: displayedTask.status.replace("_", " ")
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-lg border p-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium text-muted-foreground", children: "Last Updated" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-1 font-medium", children: new Date(displayedTask.lastUpdatedAt).toLocaleString() })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-lg border p-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium text-muted-foreground", children: "Created At" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-1 font-medium", children: new Date(displayedTask.createdAt).toLocaleString() })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-lg border p-3", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium text-muted-foreground", children: "TTL" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-1 font-medium", children: displayedTask.ttl === null ? "Infinite" : `${displayedTask.ttl}ms` })
+          ] })
+        ] }),
+        displayedTask.statusMessage && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-lg border p-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium text-muted-foreground", children: "Status Message" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-1 whitespace-pre-wrap", children: displayedTask.statusMessage })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold", children: "Full Task Object" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxRuntimeExports.jsx(JsonView, { data: displayedTask }) })
+        ] })
+      ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex h-full items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "mx-auto mb-4 h-12 w-12 opacity-20" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-medium", children: "No Task Selected" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: "Select a task from the list to view its details." }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            className: "mt-4",
+            onClick: listTasks,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(RefreshCw, { className: "mr-2 h-4 w-4" }),
+              "Refresh Tasks"
+            ]
+          }
+        )
+      ] }) })
+    ] })
+  ] }) });
+};
 const ElicitationRequest = ({
   request,
   onResolve
@@ -57449,11 +57944,13 @@ const App = () => {
   const [prompts, setPrompts] = reactExports.useState([]);
   const [promptContent, setPromptContent] = reactExports.useState("");
   const [tools, setTools] = reactExports.useState([]);
+  const [tasks, setTasks] = reactExports.useState([]);
   const [toolResult, setToolResult] = reactExports.useState(null);
   const [errors2, setErrors] = reactExports.useState({
     resources: null,
     prompts: null,
-    tools: null
+    tools: null,
+    tasks: null
   });
   const [command, setCommand] = reactExports.useState(getInitialCommand);
   const [args, setArgs] = reactExports.useState(getInitialArgs);
@@ -57545,10 +58042,13 @@ const App = () => {
   const [resourceSubscriptions, setResourceSubscriptions] = reactExports.useState(/* @__PURE__ */ new Set());
   const [selectedPrompt, setSelectedPrompt] = reactExports.useState(null);
   const [selectedTool, setSelectedTool] = reactExports.useState(null);
+  const [selectedTask, setSelectedTask] = reactExports.useState(null);
+  const [isPollingTask, setIsPollingTask] = reactExports.useState(false);
   const [nextResourceCursor, setNextResourceCursor] = reactExports.useState();
   const [nextResourceTemplateCursor, setNextResourceTemplateCursor] = reactExports.useState();
   const [nextPromptCursor, setNextPromptCursor] = reactExports.useState();
   const [nextToolCursor, setNextToolCursor] = reactExports.useState();
+  const [nextTaskCursor, setNextTaskCursor] = reactExports.useState();
   const progressTokenRef = reactExports.useRef(0);
   const [activeTab, setActiveTab] = reactExports.useState(() => {
     const hash = window.location.hash.slice(1);
@@ -57560,12 +58060,37 @@ const App = () => {
   reactExports.useEffect(() => {
     currentTabRef.current = activeTab;
   }, [activeTab]);
+  const navigateToOriginatingTab = (originatingTab) => {
+    if (!originatingTab) return;
+    const validTabs = [
+      ...serverCapabilities?.resources ? ["resources"] : [],
+      ...serverCapabilities?.prompts ? ["prompts"] : [],
+      ...serverCapabilities?.tools ? ["tools"] : [],
+      ...serverCapabilities?.tasks ? ["tasks"] : [],
+      "ping",
+      "sampling",
+      "elicitations",
+      "roots",
+      "auth"
+    ];
+    if (!validTabs.includes(originatingTab)) return;
+    setActiveTab(originatingTab);
+    window.location.hash = originatingTab;
+    setTimeout(() => {
+      setActiveTab(originatingTab);
+      window.location.hash = originatingTab;
+    }, 100);
+  };
   const { height: historyPaneHeight, handleDragStart } = useDraggablePane(300);
   const {
     width: sidebarWidth,
     isDragging: isSidebarDragging,
     handleDragStart: handleSidebarDragStart
   } = useDraggableSidebar(320);
+  const selectedTaskRef = reactExports.useRef(null);
+  reactExports.useEffect(() => {
+    selectedTaskRef.current = selectedTask;
+  }, [selectedTask]);
   const {
     connectionStatus,
     serverCapabilities,
@@ -57574,6 +58099,8 @@ const App = () => {
     requestHistory,
     clearRequestHistory,
     makeRequest,
+    cancelTask: cancelMcpTask,
+    listTasks: listMcpTasks,
     sendNotification,
     handleCompletion,
     completionsSupported,
@@ -57593,12 +58120,38 @@ const App = () => {
     connectionType,
     onNotification: (notification) => {
       setNotifications((prev) => [...prev, notification]);
+      if (notification.method === "notifications/tasks/list_changed") {
+        void listTasks();
+      }
+      if (notification.method === "notifications/tasks/status") {
+        const task = notification.params;
+        setTasks((prev) => {
+          const exists = prev.some((t) => t.taskId === task.taskId);
+          if (exists) {
+            return prev.map((t) => t.taskId === task.taskId ? task : t);
+          } else {
+            return [task, ...prev];
+          }
+        });
+        if (selectedTaskRef.current?.taskId === task.taskId) {
+          setSelectedTask(task);
+        }
+      }
     },
     onPendingRequest: (request, resolve2, reject) => {
+      const currentTab = lastToolCallOriginTabRef.current;
       setPendingSampleRequests((prev) => [
         ...prev,
-        { id: nextRequestId.current++, request, resolve: resolve2, reject }
+        {
+          id: nextRequestId.current++,
+          request,
+          originatingTab: currentTab,
+          resolve: resolve2,
+          reject
+        }
       ]);
+      setActiveTab("sampling");
+      window.location.hash = "sampling";
     },
     onElicitationRequest: (request, resolve2) => {
       const currentTab = lastToolCallOriginTabRef.current;
@@ -57632,6 +58185,7 @@ const App = () => {
         ...serverCapabilities?.resources ? ["resources"] : [],
         ...serverCapabilities?.prompts ? ["prompts"] : [],
         ...serverCapabilities?.tools ? ["tools"] : [],
+        ...serverCapabilities?.tasks ? ["tasks"] : [],
         "ping",
         "sampling",
         "elicitations",
@@ -57640,12 +58194,17 @@ const App = () => {
       ];
       const isValidTab = validTabs.includes(hash);
       if (!isValidTab) {
-        const defaultTab = serverCapabilities?.resources ? "resources" : serverCapabilities?.prompts ? "prompts" : serverCapabilities?.tools ? "tools" : "ping";
+        const defaultTab = serverCapabilities?.resources ? "resources" : serverCapabilities?.prompts ? "prompts" : serverCapabilities?.tools ? "tools" : serverCapabilities?.tasks ? "tasks" : "ping";
         setActiveTab(defaultTab);
         window.location.hash = defaultTab;
       }
     }
   }, [serverCapabilities]);
+  reactExports.useEffect(() => {
+    if (mcpClient && activeTab === "tasks") {
+      void listTasks();
+    }
+  }, [mcpClient, activeTab]);
   reactExports.useEffect(() => {
     localStorage.setItem("lastCommand", command);
   }, [command]);
@@ -57820,7 +58379,7 @@ const App = () => {
   }, [roots]);
   reactExports.useEffect(() => {
     if (mcpClient && !window.location.hash) {
-      const defaultTab = serverCapabilities?.resources ? "resources" : serverCapabilities?.prompts ? "prompts" : serverCapabilities?.tools ? "tools" : "ping";
+      const defaultTab = serverCapabilities?.resources ? "resources" : serverCapabilities?.prompts ? "prompts" : serverCapabilities?.tools ? "tools" : serverCapabilities?.tasks ? "tasks" : "ping";
       window.location.hash = defaultTab;
     } else if (!mcpClient && window.location.hash) {
       window.history.replaceState(
@@ -57844,6 +58403,7 @@ const App = () => {
     setPendingSampleRequests((prev) => {
       const request = prev.find((r2) => r2.id === id2);
       request?.resolve(result);
+      navigateToOriginatingTab(request?.originatingTab);
       return prev.filter((r2) => r2.id !== id2);
     });
   };
@@ -57851,6 +58411,7 @@ const App = () => {
     setPendingSampleRequests((prev) => {
       const request = prev.find((r2) => r2.id === id2);
       request?.reject(new Error("Sampling request rejected"));
+      navigateToOriginatingTab(request?.originatingTab);
       return prev.filter((r2) => r2.id !== id2);
     });
   };
@@ -57865,6 +58426,7 @@ const App = () => {
             ...serverCapabilities?.resources ? ["resources"] : [],
             ...serverCapabilities?.prompts ? ["prompts"] : [],
             ...serverCapabilities?.tools ? ["tools"] : [],
+            ...serverCapabilities?.tasks ? ["tasks"] : [],
             "ping",
             "sampling",
             "elicitations",
@@ -58015,7 +58577,7 @@ const App = () => {
     setNextToolCursor(response.nextCursor);
     cacheToolOutputSchemas(response.tools);
   };
-  const callTool = async (name2, params, toolMetadata) => {
+  const callTool = async (name2, params, toolMetadata, runAsTask) => {
     lastToolCallOriginTabRef.current = currentTabRef.current;
     try {
       const tool = tools.find((t) => t.name === name2);
@@ -58027,19 +58589,119 @@ const App = () => {
         ...toolMetadata
         // Tool-specific metadata
       };
-      const response = await sendMCPRequest(
-        {
-          method: "tools/call",
-          params: {
-            name: name2,
-            arguments: cleanedParams,
-            _meta: mergedMetadata
+      const request = {
+        method: "tools/call",
+        params: {
+          name: name2,
+          arguments: cleanedParams,
+          _meta: mergedMetadata
+        }
+      };
+      if (runAsTask) {
+        request.params = {
+          ...request.params,
+          task: {
+            ttl: getMCPTaskTtl(config2)
           }
-        },
+        };
+      }
+      const response = await sendMCPRequest(
+        request,
         CompatibilityCallToolResultSchema,
         "tools"
       );
-      setToolResult(response);
+      const isTaskResult = (res) => !!res && typeof res === "object" && "task" in res && !!res.task && typeof res.task === "object" && "taskId" in res.task;
+      if (runAsTask && isTaskResult(response)) {
+        const taskId = response.task.taskId;
+        const pollInterval = response.task.pollInterval;
+        setIsPollingTask(true);
+        const initialResponseMeta = response && typeof response === "object" && "_meta" in response ? response._meta ?? {} : void 0;
+        setToolResult({
+          content: [
+            {
+              type: "text",
+              text: `Task created: ${taskId}. Polling for status...`
+            }
+          ],
+          _meta: {
+            ...initialResponseMeta || {},
+            "io.modelcontextprotocol/related-task": { taskId }
+          }
+        });
+        let taskCompleted = false;
+        while (!taskCompleted) {
+          try {
+            await new Promise((resolve2) => setTimeout(resolve2, pollInterval));
+            const taskStatus = await sendMCPRequest(
+              {
+                method: "tasks/get",
+                params: { taskId }
+              },
+              GetTaskResultSchema
+            );
+            if (taskStatus.status === "completed" || taskStatus.status === "failed" || taskStatus.status === "cancelled") {
+              taskCompleted = true;
+              console.log(
+                `Polling complete for task ${taskId}: ${taskStatus.status}`
+              );
+              if (taskStatus.status === "completed") {
+                console.log(`Fetching result for task ${taskId}`);
+                const result = await sendMCPRequest(
+                  {
+                    method: "tasks/result",
+                    params: { taskId }
+                  },
+                  CompatibilityCallToolResultSchema
+                );
+                console.log(`Result received for task ${taskId}:`, result);
+                setToolResult(result);
+                void listTasks();
+              } else {
+                setToolResult({
+                  content: [
+                    {
+                      type: "text",
+                      text: `Task ${taskStatus.status}: ${taskStatus.statusMessage || "No additional information"}`
+                    }
+                  ],
+                  isError: true
+                });
+                void listTasks();
+              }
+            } else {
+              const pollingResponseMeta = response && typeof response === "object" && "_meta" in response ? response._meta ?? {} : void 0;
+              setToolResult({
+                content: [
+                  {
+                    type: "text",
+                    text: `Task status: ${taskStatus.status}${taskStatus.statusMessage ? ` - ${taskStatus.statusMessage}` : ""}. Polling...`
+                  }
+                ],
+                _meta: {
+                  ...pollingResponseMeta || {},
+                  "io.modelcontextprotocol/related-task": { taskId }
+                }
+              });
+              void listTasks();
+            }
+          } catch (pollingError) {
+            console.error("Error polling task status:", pollingError);
+            setToolResult({
+              content: [
+                {
+                  type: "text",
+                  text: `Error polling task status: ${pollingError instanceof Error ? pollingError.message : String(pollingError)}`
+                }
+              ],
+              isError: true
+            });
+            taskCompleted = true;
+          }
+        }
+        setIsPollingTask(false);
+      } else {
+        setToolResult(response);
+      }
       setErrors((prev) => ({ ...prev, tools: null }));
     } catch (e) {
       const toolResult2 = {
@@ -58055,6 +58717,34 @@ const App = () => {
       setErrors((prev) => ({ ...prev, tools: null }));
     }
   };
+  const listTasks = reactExports.useCallback(async () => {
+    try {
+      const response = await listMcpTasks(nextTaskCursor);
+      setTasks(response.tasks);
+      setNextTaskCursor(response.nextCursor);
+      setErrors((prev) => ({ ...prev, tasks: null }));
+    } catch (e) {
+      setErrors((prev) => ({
+        ...prev,
+        tasks: e.message ?? String(e)
+      }));
+    }
+  }, [listMcpTasks, nextTaskCursor]);
+  const cancelTask = async (taskId) => {
+    try {
+      const response = await cancelMcpTask(taskId);
+      setTasks((prev) => prev.map((t) => t.taskId === taskId ? response : t));
+      if (selectedTask?.taskId === taskId) {
+        setSelectedTask(response);
+      }
+      clearError("tasks");
+    } catch (e) {
+      setErrors((prev) => ({
+        ...prev,
+        tasks: e.message ?? String(e)
+      }));
+    }
+  };
   const handleRootsChange = async () => {
     await sendNotification({ method: "notifications/roots/list_changed" });
   };
@@ -58082,13 +58772,13 @@ const App = () => {
   ) });
   if (window.location.pathname === "/oauth/callback") {
     const OAuthCallback = React.lazy(
-      () => __vitePreload(() => import("./OAuthCallback-CXY8DEIM.js"), true ? [] : void 0)
+      () => __vitePreload(() => import("./OAuthCallback-C7u-W3fG.js"), true ? [] : void 0)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(OAuthCallback, { onConnect: onOAuthConnect }) });
   }
   if (window.location.pathname === "/oauth/callback/debug") {
     const OAuthDebugCallback = React.lazy(
-      () => __vitePreload(() => import("./OAuthDebugCallback-zr6INHin.js"), true ? [] : void 0)
+      () => __vitePreload(() => import("./OAuthDebugCallback-CJZOHlWo.js"), true ? [] : void 0)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(OAuthDebugCallback, { onConnect: onOAuthDebugConnect }) });
   }
@@ -58204,6 +58894,17 @@ const App = () => {
                   ]
                 }
               ),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                TabsTrigger,
+                {
+                  value: "tasks",
+                  disabled: !serverCapabilities?.tasks,
+                  children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx(ListTodo, { className: "w-4 h-4 mr-2" }),
+                    "Tasks"
+                  ]
+                }
+              ),
               /* @__PURE__ */ jsxRuntimeExports.jsxs(TabsTrigger, { value: "ping", children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx(Bell, { className: "w-4 h-4 mr-2" }),
                 "Ping"
@@ -58337,10 +59038,10 @@ const App = () => {
                     setNextToolCursor(void 0);
                     cacheToolOutputSchemas([]);
                   },
-                  callTool: async (name2, params, metadata22) => {
+                  callTool: async (name2, params, metadata22, runAsTask) => {
                     clearError("tools");
                     setToolResult(null);
-                    await callTool(name2, params, metadata22);
+                    await callTool(name2, params, metadata22, runAsTask);
                   },
                   selectedTool,
                   setSelectedTool: (tool) => {
@@ -58349,6 +59050,7 @@ const App = () => {
                     setToolResult(null);
                   },
                   toolResult,
+                  isPollingTask,
                   nextCursor: nextToolCursor,
                   error: errors2.tools,
                   resourceContent: resourceContentMap,
@@ -58358,6 +59060,28 @@ const App = () => {
                   }
                 }
               ),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                TasksTab,
+                {
+                  tasks,
+                  listTasks: () => {
+                    clearError("tasks");
+                    listTasks();
+                  },
+                  clearTasks: () => {
+                    setTasks([]);
+                    setNextTaskCursor(void 0);
+                  },
+                  cancelTask,
+                  selectedTask,
+                  setSelectedTask: (task) => {
+                    clearError("tasks");
+                    setSelectedTask(task);
+                  },
+                  error: errors2.tasks,
+                  nextCursor: nextTaskCursor
+                }
+              ),
               /* @__PURE__ */ jsxRuntimeExports.jsx(ConsoleTab, {}),
               /* @__PURE__ */ jsxRuntimeExports.jsx(
                 PingTab,