@mcpjam/inspector 0.2.1 → 0.2.3

package/client/dist/assets/{OAuthCallback-xP3tGoWq.js → OAuthCallback-CfsBsNUt.js}

@@ -1,4 +1,4 @@
-import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-1_BV85UY.js";
+import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-CHsLKjnG.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthCallback = ({ onConnect }) => {
   const { toast } = useToast();

package/client/dist/assets/{OAuthDebugCallback-CV6g5aop.js → OAuthDebugCallback-DuorYCq_.js}

@@ -1,4 +1,4 @@
-import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-1_BV85UY.js";
+import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-CHsLKjnG.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthDebugCallback = ({ onConnect }) => {
   reactExports.useEffect(() => {

package/client/dist/assets/{index-C9Kqkwaq.css → index-C5Ywrn22.css}

@@ -1627,6 +1627,9 @@ video {
 .rounded {
   border-radius: 0.25rem;
 }
+.rounded-2xl {
+  border-radius: 1rem;
+}
 .rounded-full {
   border-radius: 9999px;
 }
@@ -1897,11 +1900,21 @@ video {
   --tw-gradient-to: hsl(var(--background) / 0) var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
+.from-blue-600 {
+  --tw-gradient-from: #2563eb var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(37 99 235 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
 .from-card\/95 {
   --tw-gradient-from: hsl(var(--card) / 0.95) var(--tw-gradient-from-position);
   --tw-gradient-to: hsl(var(--card) / 0) var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
+.from-gray-700 {
+  --tw-gradient-from: #374151 var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(55 65 81 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
 .from-muted\/20 {
   --tw-gradient-from: hsl(var(--muted) / 0.2) var(--tw-gradient-from-position);
   --tw-gradient-to: hsl(var(--muted) / 0) var(--tw-gradient-to-position);
@@ -1970,12 +1983,18 @@ video {
 .to-background\/60 {
   --tw-gradient-to: hsl(var(--background) / 0.6) var(--tw-gradient-to-position);
 }
+.to-blue-700 {
+  --tw-gradient-to: #1d4ed8 var(--tw-gradient-to-position);
+}
 .to-card\/95 {
   --tw-gradient-to: hsl(var(--card) / 0.95) var(--tw-gradient-to-position);
 }
 .to-gray-100 {
   --tw-gradient-to: #f3f4f6 var(--tw-gradient-to-position);
 }
+.to-gray-900 {
+  --tw-gradient-to: #111827 var(--tw-gradient-to-position);
+}
 .to-muted\/20 {
   --tw-gradient-to: hsl(var(--muted) / 0.2) var(--tw-gradient-to-position);
 }
@@ -2106,6 +2125,9 @@ video {
 .pb-1\.5 {
   padding-bottom: 0.375rem;
 }
+.pb-4 {
+  padding-bottom: 1rem;
+}
 .pl-2 {
   padding-left: 0.5rem;
 }
@@ -2620,6 +2642,11 @@ h1 {
   color: rgb(148 163 184 / var(--tw-text-opacity, 1));
 }
 
+.hover\:-translate-y-0\.5:hover {
+  --tw-translate-y: -0.125rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .hover\:border-\[\#646cff\]:hover {
   --tw-border-opacity: 1;
   border-color: rgb(100 108 255 / var(--tw-border-opacity, 1));
@@ -2724,6 +2751,11 @@ h1 {
   background-color: rgb(241 245 249 / 0.5);
 }
 
+.hover\:bg-slate-200:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));
+}
+
 .hover\:bg-slate-50:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));
@@ -2738,6 +2770,12 @@ h1 {
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
 
+.hover\:from-blue-700:hover {
+  --tw-gradient-from: #1d4ed8 var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(29 78 216 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
 .hover\:from-muted\/30:hover {
   --tw-gradient-from: hsl(var(--muted) / 0.3) var(--tw-gradient-from-position);
   --tw-gradient-to: hsl(var(--muted) / 0) var(--tw-gradient-to-position);
@@ -2755,6 +2793,10 @@ h1 {
   --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--muted) / 0.4) var(--tw-gradient-via-position), var(--tw-gradient-to);
 }
 
+.hover\:to-blue-800:hover {
+  --tw-gradient-to: #1e40af var(--tw-gradient-to-position);
+}
+
 .hover\:to-muted\/30:hover {
   --tw-gradient-to: hsl(var(--muted) / 0.3) var(--tw-gradient-to-position);
 }
@@ -3533,6 +3575,16 @@ h1 {
   background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));
 }
 
+.dark\:hover\:bg-slate-600:hover:is(.dark *) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(71 85 105 / var(--tw-bg-opacity, 1));
+}
+
+.dark\:hover\:bg-slate-700:hover:is(.dark *) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(51 65 85 / var(--tw-bg-opacity, 1));
+}
+
 .dark\:hover\:bg-slate-700\/30:hover:is(.dark *) {
   background-color: rgb(51 65 85 / 0.3);
 }

package/client/dist/assets/{index-1_BV85UY.js → index-CHsLKjnG.js}

@@ -1,4 +1,4 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/OAuthCallback-xP3tGoWq.js","assets/oauthUtils-DTcoXpSP.js","assets/OAuthDebugCallback-CV6g5aop.js"])))=>i.map(i=>d[i]);
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/OAuthCallback-CfsBsNUt.js","assets/oauthUtils-DTcoXpSP.js","assets/OAuthDebugCallback-DuorYCq_.js"])))=>i.map(i=>d[i]);
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
@@ -16321,6 +16321,22 @@ const FolderTree = createLucideIcon("FolderTree", [
   ["path", { d: "M3 5a2 2 0 0 0 2 2h3", key: "f2jnh7" }],
   ["path", { d: "M3 3v13a2 2 0 0 0 2 2h3", key: "k8epm1" }]
 ]);
+/**
+ * @license lucide-react v0.447.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Github = createLucideIcon("Github", [
+  [
+    "path",
+    {
+      d: "M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4",
+      key: "tonef"
+    }
+  ],
+  ["path", { d: "M9 18c-4.51 2-5-2-7-2", key: "9comsn" }]
+]);
 /**
  * @license lucide-react v0.447.0 - ISC
  *
@@ -28609,7 +28625,7 @@ const useTheme = () => {
     [theme, setThemeWithSideEffect]
   );
 };
-const version$1 = "0.2.1";
+const version$1 = "0.2.3";
 var [createTooltipContext, createTooltipScope] = createContextScope("Tooltip", [
   createPopperScope
 ]);
@@ -30349,6 +30365,61 @@ const ClientFormSection = ({
     ] })
   ] }) });
 };
+const StarGitHubModal = ({
+  isOpen,
+  onClose
+}) => {
+  if (!isOpen) return null;
+  const handleStarClick = () => {
+    window.open("https://github.com/MCPJam/inspector", "_blank");
+    onClose();
+  };
+  const handleDismiss = () => {
+    onClose();
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50 p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-white dark:bg-slate-800 rounded-2xl shadow-2xl max-w-md w-full mx-4 border border-slate-200 dark:border-slate-700", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between p-6 border-b border-slate-200 dark:border-slate-700", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-3", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-10 h-10 bg-gradient-to-br from-gray-700 to-gray-900 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Github, { className: "w-5 h-5 text-white" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-xl font-semibold text-slate-900 dark:text-slate-100", children: "Support us!" })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "button",
+        {
+          onClick: handleDismiss,
+          className: "p-1 rounded-lg hover:bg-slate-100 dark:hover:bg-slate-700 transition-colors",
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(X$1, { className: "w-5 h-5 text-slate-500 dark:text-slate-400" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-6", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-slate-600 dark:text-slate-300 text-center mb-6 leading-relaxed", children: "If you like the inspector, please consider giving the GitHub project a star!" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col sm:flex-row gap-3", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            onClick: handleStarClick,
+            className: "flex-1 bg-gradient-to-r from-blue-600 to-blue-700 hover:from-blue-700 hover:to-blue-800 text-white rounded-lg px-4 py-3 font-medium transition-all duration-200 flex items-center justify-center space-x-2 shadow-lg hover:shadow-xl transform hover:-translate-y-0.5",
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Star, { className: "w-4 h-4 fill-current" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Star on GitHub" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ExternalLink, { className: "w-4 h-4" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            onClick: handleDismiss,
+            className: "flex-1 bg-slate-100 dark:bg-slate-700 hover:bg-slate-200 dark:hover:bg-slate-600 text-slate-700 dark:text-slate-300 rounded-lg px-4 py-3 font-medium transition-colors",
+            children: "Maybe later"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-6 pb-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400 text-center", children: "This message won't appear again once dismissed" }) })
+  ] }) });
+};
 const SERVER_CONFIGS_STORAGE_KEY = "mcpServerConfigs_v1";
 const SELECTED_SERVER_STORAGE_KEY = "selectedServerName_v1";
 const serializeServerConfigs = (configs) => {
@@ -40809,7 +40880,7 @@ Anthropic.Models = Models2;
 Anthropic.Beta = Beta;
 const { HUMAN_PROMPT, AI_PROMPT } = Anthropic;
 const readline = {};
-const version = "0.2.1";
+const version = "0.2.3";
 const packageJson = {
   version
 };
@@ -43444,6 +43515,7 @@ const App = () => {
     return hash || "tools";
   });
   const [isSidebarExpanded, setIsSidebarExpanded] = reactExports.useState(true);
+  const [showStarModal, setShowStarModal] = reactExports.useState(false);
   reactExports.useEffect(() => {
     const handleHashChange = () => {
       const hash = window.location.hash.slice(1);
@@ -43454,6 +43526,20 @@ const App = () => {
     window.addEventListener("hashchange", handleHashChange);
     return () => window.removeEventListener("hashchange", handleHashChange);
   }, []);
+  reactExports.useEffect(() => {
+    const hasSeenStarModal = localStorage.getItem("hasSeenStarModal");
+    if (hasSeenStarModal) {
+      return;
+    }
+    const timer = setTimeout(() => {
+      setShowStarModal(true);
+    }, 15e3);
+    return () => clearTimeout(timer);
+  }, []);
+  const handleCloseStarModal = () => {
+    setShowStarModal(false);
+    localStorage.setItem("hasSeenStarModal", "true");
+  };
   const onStdErrNotification = reactExports.useCallback(
     (notification) => {
       mcpOperations.setStdErrNotifications((prev) => [...prev, notification]);
@@ -43808,7 +43894,7 @@ const App = () => {
   }, []);
   if (window.location.pathname === "/oauth/callback") {
     const OAuthCallback = React.lazy(
-      () => __vitePreload(() => import("./OAuthCallback-xP3tGoWq.js"), true ? __vite__mapDeps([0,1]) : void 0)
+      () => __vitePreload(() => import("./OAuthCallback-CfsBsNUt.js"), true ? __vite__mapDeps([0,1]) : void 0)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       reactExports.Suspense,
@@ -43823,7 +43909,7 @@ const App = () => {
   }
   if (window.location.pathname === "/oauth/callback/debug") {
     const OAuthDebugCallback = React.lazy(
-      () => __vitePreload(() => import("./OAuthDebugCallback-CV6g5aop.js"), true ? __vite__mapDeps([2,1]) : void 0)
+      () => __vitePreload(() => import("./OAuthDebugCallback-DuorYCq_.js"), true ? __vite__mapDeps([2,1]) : void 0)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       reactExports.Suspense,
@@ -44089,58 +44175,55 @@ const App = () => {
             }
           );
         case "settings":
-          return /* @__PURE__ */ jsxRuntimeExports.jsx(
-            SettingsTab,
-            {
-              onApiKeyChange: handleApiKeyChange,
-              disabled: connectionStatus !== "connected" && connectionStatus !== "disconnected"
-            }
-          );
+          return /* @__PURE__ */ jsxRuntimeExports.jsx(SettingsTab, { onApiKeyChange: handleApiKeyChange });
         default:
           return null;
       }
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 flex flex-col overflow-auto p-6", children: !connectionState.mcpAgent || (currentClient == null ? void 0 : currentClient.connectionStatus) !== "connected" ? renderServerNotConnected() : serverHasNoCapabilities ? renderServerNoCapabilities() : renderCurrentPage() });
   };
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(McpClientContext.Provider, { value: currentClient, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "h-screen bg-gradient-to-br from-slate-50/50 to-slate-100/50 dark:from-slate-900/50 dark:to-slate-800/50 flex overflow-hidden app-container", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Sidebar,
-      {
-        mcpAgent: connectionState.mcpAgent,
-        selectedServerName: serverState.selectedServerName,
-        onServerSelect: serverState.setSelectedServerName,
-        onRemoveServer: handleRemoveServer,
-        onConnectServer: connectionState.connectServer,
-        onDisconnectServer: connectionState.disconnectServer,
-        onCreateClient: serverState.handleCreateClient,
-        onEditClient: handleEditClient,
-        updateTrigger: connectionState.sidebarUpdateTrigger,
-        isExpanded: isSidebarExpanded,
-        onToggleExpanded: () => setIsSidebarExpanded(!isSidebarExpanded)
-      }
-    ),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex flex-col overflow-hidden", children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(McpClientContext.Provider, { value: currentClient, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "h-screen bg-gradient-to-br from-slate-50/50 to-slate-100/50 dark:from-slate-900/50 dark:to-slate-800/50 flex overflow-hidden app-container", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Tabs,
+        Sidebar,
         {
-          currentPage,
-          onPageChange: setCurrentPage,
-          serverCapabilities,
-          pendingSampleRequests: mcpOperations.pendingSampleRequests,
-          shouldDisableAll: !connectionState.mcpAgent
+          mcpAgent: connectionState.mcpAgent,
+          selectedServerName: serverState.selectedServerName,
+          onServerSelect: serverState.setSelectedServerName,
+          onRemoveServer: handleRemoveServer,
+          onConnectServer: connectionState.connectServer,
+          onDisconnectServer: connectionState.disconnectServer,
+          onCreateClient: serverState.handleCreateClient,
+          onEditClient: handleEditClient,
+          updateTrigger: connectionState.sidebarUpdateTrigger,
+          isExpanded: isSidebarExpanded,
+          onToggleExpanded: () => setIsSidebarExpanded(!isSidebarExpanded)
         }
       ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 flex flex-col overflow-hidden overflow-y-auto", children: renderTabs() }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        HistoryAndNotifications,
-        {
-          requestHistory,
-          toolResult: mcpOperations.toolResult,
-          onClearHistory: mcpOperations.clearRequestHistory
-        }
-      )
-    ] })
-  ] }) });
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex flex-col overflow-hidden", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Tabs,
+          {
+            currentPage,
+            onPageChange: setCurrentPage,
+            serverCapabilities,
+            pendingSampleRequests: mcpOperations.pendingSampleRequests,
+            shouldDisableAll: !connectionState.mcpAgent
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 flex flex-col overflow-hidden overflow-y-auto", children: renderTabs() }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          HistoryAndNotifications,
+          {
+            requestHistory,
+            toolResult: mcpOperations.toolResult,
+            onClearHistory: mcpOperations.clearRequestHistory
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(StarGitHubModal, { isOpen: showStarModal, onClose: handleCloseStarModal })
+  ] });
 };
 clientExports.createRoot(document.getElementById("root")).render(
   /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.StrictMode, { children: [

package/client/dist/index.html

@@ -5,8 +5,8 @@
     <link rel="icon" type="image/svg+xml" href="/mcp_jam.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>MCPJam Inspector</title>
-    <script type="module" crossorigin src="/assets/index-1_BV85UY.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-C9Kqkwaq.css">
+    <script type="module" crossorigin src="/assets/index-CHsLKjnG.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-C5Ywrn22.css">
   </head>
   <body>
     <div id="root"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mcpjam/inspector",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "MCPJam inspector",
   "license": "Apache-2.0",
   "author": "MCPJam (https://mcpjam.com)",