@uniqueli/openwork 0.2.4 → 0.4.0

package/out/renderer/assets/{index-Be3u7LN6.js → index-CloINEXy.js}

@@ -12813,10 +12813,20 @@ const Pencil = createLucideIcon("Pencil", [
   ],
   ["path", { d: "m15 5 4 4", key: "1mk7zo" }]
 ]);
+const Plug = createLucideIcon("Plug", [
+  ["path", { d: "M12 22v-5", key: "1ega77" }],
+  ["path", { d: "M9 8V2", key: "14iosj" }],
+  ["path", { d: "M15 8V2", key: "18g5xt" }],
+  ["path", { d: "M18 8v5a4 4 0 0 1-4 4h-4a4 4 0 0 1-4-4V8Z", key: "osxo6l" }]
+]);
 const Plus = createLucideIcon("Plus", [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "M12 5v14", key: "s699le" }]
 ]);
+const Power = createLucideIcon("Power", [
+  ["path", { d: "M12 2v10", key: "mnfbl" }],
+  ["path", { d: "M18.4 6.6a9 9 0 1 1-12.77.04", key: "obofu9" }]
+]);
 const RotateCw = createLucideIcon("RotateCw", [
   ["path", { d: "M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8", key: "1p45f6" }],
   ["path", { d: "M21 3v5h-5", key: "1q7to0" }]
@@ -17995,6 +18005,13 @@ function convertToV1FromResponses(message) {
         };
         continue;
       } else if (_isContentBlock(toolOutput, "image_generation_call")) {
+        if (_isString(toolOutput.result)) yield {
+          type: "image",
+          mimeType: "image/png",
+          data: toolOutput.result,
+          id: _isString(toolOutput.id) ? toolOutput.id : void 0,
+          metadata: { status: _isString(toolOutput.status) ? toolOutput.status : void 0 }
+        };
         yield {
           type: "non_standard",
           value: toolOutput
@@ -18238,8 +18255,8 @@ const DEFAULT_MERGE_IGNORE_KEYS = [
 ];
 function _mergeDicts(left, right, options) {
   const ignoreKeys = options?.ignoreKeys ?? DEFAULT_MERGE_IGNORE_KEYS;
-  if (left === void 0 && right === void 0) return void 0;
-  if (left === void 0 || right === void 0) return left ?? right;
+  if (left == null && right == null) return void 0;
+  if (left == null || right == null) return left ?? right;
   const merged = { ...left };
   for (const [key2, value] of Object.entries(right)) if (merged[key2] == null) merged[key2] = value;
   else if (value == null) continue;
@@ -18264,8 +18281,8 @@ function _mergeDicts(left, right, options) {
   return merged;
 }
 function _mergeLists(left, right, options) {
-  if (left === void 0 && right === void 0) return void 0;
-  else if (left === void 0 || right === void 0) return left || right;
+  if (left == null && right == null) return void 0;
+  else if (left == null || right == null) return left || right;
   else {
     const merged = [...left];
     for (const item of right) if (typeof item === "object" && item !== null && "index" in item && typeof item.index === "number") {
@@ -18284,8 +18301,8 @@ function _mergeLists(left, right, options) {
   }
 }
 function _mergeObj(left, right, options) {
-  if (left === void 0 && right === void 0) return void 0;
-  if (left === void 0 || right === void 0) return left ?? right;
+  if (left == null && right == null) return void 0;
+  if (left == null || right == null) return left ?? right;
   else if (typeof left !== typeof right) throw new Error(`Cannot merge objects of different types.
 Left ${typeof left}
 Right ${typeof right}`);
@@ -30375,7 +30392,7 @@ var CallbackManager = class CallbackManager2 extends BaseCallbackManager {
       callbackManager = callbackManager.copy(Array.isArray(localHandlers) ? localHandlers.map(ensureHandler) : localHandlers?.handlers, false);
     }
     const verboseEnabled = getEnvironmentVariable$2("LANGCHAIN_VERBOSE") === "true" || options?.verbose;
-    const tracingV2Enabled = LangChainTracer.getTraceableRunTree()?.tracingEnabled || isTracingEnabled();
+    const tracingV2Enabled = LangChainTracer.getTraceableRunTree()?.tracingEnabled ?? isTracingEnabled();
     const tracingEnabled = tracingV2Enabled || (getEnvironmentVariable$2("LANGCHAIN_TRACING") ?? false);
     if (verboseEnabled || tracingEnabled) {
       if (!callbackManager) callbackManager = new CallbackManager2();
@@ -31950,7 +31967,9 @@ const defaultFailedAttemptHandler = (error) => {
   if (typeof error !== "object" || error === null) return;
   if ("message" in error && typeof error.message === "string" && (error.message.startsWith("Cancel") || error.message.startsWith("AbortError")) || "name" in error && typeof error.name === "string" && error.name === "AbortError") throw error;
   if ("code" in error && typeof error.code === "string" && error.code === "ECONNABORTED") throw error;
-  const status = "response" in error && typeof error.response === "object" && error.response !== null && "status" in error.response && typeof error.response.status === "number" ? error.response.status : void 0;
+  const responseStatus = "response" in error && typeof error.response === "object" && error.response !== null && "status" in error.response && typeof error.response.status === "number" ? error.response.status : void 0;
+  const directStatus = "status" in error && typeof error.status === "number" ? error.status : void 0;
+  const status = responseStatus ?? directStatus;
   if (status && STATUS_NO_RETRY$1.includes(+status)) throw error;
   const code2 = "error" in error && typeof error.error === "object" && error.error !== null && "code" in error.error && typeof error.error.code === "string" ? error.error.code : void 0;
   if (code2 === "insufficient_quota") {
@@ -41351,14 +41370,15 @@ var StreamManager = class {
   };
   getMutateFn = (kind, historyValues) => {
     return (update) => {
+      const stateValues = (this.state.values ?? [null, "stream"])[0];
       const prev = {
         ...historyValues,
-        ...(this.state.values ?? [null, "stream"])[0]
+        ...stateValues ?? {}
       };
       const next = typeof update === "function" ? update(prev) : update;
       this.setStreamValues({
         ...prev,
-        ...next
+        ...next ?? {}
       }, kind);
     };
   };
@@ -41395,8 +41415,8 @@ var StreamManager = class {
         if (this.matchEventType("checkpoints", event, data)) options.callbacks.onCheckpointEvent?.(data, { namespace });
         if (this.matchEventType("tasks", event, data)) options.callbacks.onTaskEvent?.(data, { namespace });
         if (this.matchEventType("debug", event, data)) options.callbacks.onDebugEvent?.(data, { namespace });
-        if (event === "values") if ("__interrupt__" in data) this.setStreamValues((prev) => ({
-          ...prev,
+        if (event === "values") if (data != null && typeof data === "object" && "__interrupt__" in data) this.setStreamValues((prev) => ({
+          ...prev ?? {},
           ...data
         }));
         else this.setStreamValues(data);
@@ -41410,7 +41430,7 @@ var StreamManager = class {
           this.setStreamValues((streamValues) => {
             const values$1 = {
               ...options.initialValues,
-              ...streamValues
+              ...streamValues ?? {}
             };
             let messages = options.getMessages(values$1).slice();
             const { chunk, index: index2 } = this.messages.get(messageId, messages.length) ?? {};
@@ -42976,7 +42996,7 @@ var BaseClient = class {
     const [url, init] = this.prepareFetchOptions(path2, options);
     let finalInit = init;
     if (this.onRequest) finalInit = await this.onRequest(url, init);
-    const response = await this.asyncCaller.fetch(url, finalInit);
+    const response = await this.asyncCaller.fetch(url.toString(), finalInit);
     const body2 = (() => {
       if (response.status === 202 || response.status === 204) return;
       return response.json();
@@ -43006,7 +43026,7 @@ var BaseClient = class {
         json: isReconnect ? void 0 : config2.json
       });
       if (this.onRequest != null) init = await this.onRequest(url, init);
-      const response = await this.asyncCaller.fetch(url, init);
+      const response = await this.asyncCaller.fetch(url.toString(), init);
       if (!isReconnect && config2.onInitialResponse) await config2.onInitialResponse(response);
       return {
         response,
@@ -43973,7 +43993,7 @@ var UiClient = class UiClient2 extends BaseClient {
         json: { name: agentName }
       });
       if (this.onRequest != null) init = await this.onRequest(url, init);
-      return (await this.asyncCaller.fetch(url, init)).text();
+      return (await this.asyncCaller.fetch(url.toString(), init)).text();
     });
   }
 };
@@ -44038,6 +44058,13 @@ function unique(array) {
 function findLast(array, predicate) {
   for (let i2 = array.length - 1; i2 >= 0; i2 -= 1) if (predicate(array[i2])) return array[i2];
 }
+async function* filterStream(stream, filter) {
+  while (true) {
+    const { value, done } = await stream.next();
+    if (done) return value;
+    if (filter(value)) yield value;
+  }
+}
 function getBranchSequence(history) {
   const nodeIds = /* @__PURE__ */ new Set();
   const childrenMap = {};
@@ -44497,11 +44524,12 @@ function useStreamLGP(options) {
     };
     await stream.start(async (signal) => {
       threadIdStreamingRef.current = threadId;
-      return client2.runs.joinStream(threadId, runId, {
+      const stream$1 = client2.runs.joinStream(threadId, runId, {
         signal,
         lastEventId,
         streamMode: joinOptions?.streamMode
       });
+      return joinOptions?.filter != null ? filterStream(stream$1, joinOptions.filter) : stream$1;
     }, {
       getMessages,
       setMessages,
@@ -76278,7 +76306,14 @@ function TabbedPanel({ threadId, showTabBar = true }) {
     ) })
   ] });
 }
-function Switch({ checked = false, onCheckedChange, disabled = false, className, onClick, ...props }) {
+function Switch({
+  checked = false,
+  onCheckedChange,
+  disabled = false,
+  className,
+  onClick,
+  ...props
+}) {
   const handleClick = (e) => {
     onClick?.(e);
     if (!disabled) {
@@ -76611,19 +76646,20 @@ function CreateSkillDialog({ open, onClose, onCreate }) {
   };
   const currentTemplate = SKILL_TEMPLATES.find((t) => t.id === selectedTemplate);
   if (!open) return null;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-full max-w-3xl mx-4 bg-[#1A1A1D] rounded-lg shadow-xl border border-white/10", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between px-6 py-4 border-b border-white/5", children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-full max-w-2xl bg-[#1A1A1D] rounded-lg shadow-xl border border-white/10 flex flex-col max-h-[90vh]", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between px-6 py-4 border-b border-white/5 flex-shrink-0", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-lg font-semibold text-white", children: "Create Custom Skill" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "button",
+      /* @__PURE__ */ jsxRuntimeExports.jsx("button", { onClick: onClose, className: "text-gray-400 hover:text-white transition-colors", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "path",
         {
-          onClick: onClose,
-          className: "text-gray-400 hover:text-white transition-colors",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: 2,
+          d: "M6 18L18 6M6 6l12 12"
         }
-      )
+      ) }) })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 px-6 py-3 border-b border-white/5", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 px-6 py-3 border-b border-white/5 flex-shrink-0", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "button",
         {
@@ -76643,7 +76679,7 @@ function CreateSkillDialog({ open, onClose, onCreate }) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: handleSubmit, className: "p-6 space-y-4", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: handleSubmit, className: "p-6 space-y-4 overflow-y-auto flex-1", children: [
       mode === "template" && /* Template Selection */
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-sm font-medium text-gray-300 mb-2", children: "Choose Template" }),
@@ -76749,7 +76785,7 @@ function CreateSkillDialog({ open, onClose, onCreate }) {
         ),
         /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-1 text-xs text-gray-500", children: "This prompt will be loaded when the agent activates this skill, providing specialized knowledge and instructions." })
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end gap-3 pt-4 border-t border-white/5", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end gap-3 pt-4 border-t border-white/5 flex-shrink-0", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           "button",
           {
@@ -76780,7 +76816,13 @@ const categoryColors = {
   system: "bg-orange-500/10 text-orange-500 border-orange-500/20",
   custom: "bg-cyan-500/10 text-cyan-500 border-cyan-500/20"
 };
-function SkillDetailDialog({ skill, open, onClose, onToggle, onDelete }) {
+function SkillDetailDialog({
+  skill,
+  open,
+  onClose,
+  onToggle,
+  onDelete
+}) {
   if (!open) return null;
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-full max-w-3xl mx-4 max-h-[80vh] bg-[#1A1A1D] rounded-lg shadow-xl border border-white/10 flex flex-col", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start justify-between px-6 py-4 border-b border-white/5", children: [
@@ -76803,7 +76845,15 @@ function SkillDetailDialog({ skill, open, onClose, onToggle, onDelete }) {
         {
           onClick: onClose,
           className: "ml-4 text-gray-400 hover:text-white transition-colors",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "path",
+            {
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              strokeWidth: 2,
+              d: "M6 18L18 6M6 6l12 12"
+            }
+          ) })
         }
       )
     ] }),
@@ -77053,6 +77103,639 @@ function SkillsPanel(_props) {
     )
   ] });
 }
+const TRANSPORT_TYPES = [
+  { value: "stdio", label: "STDIO", description: "标准输入/输出 (本地进程)" },
+  { value: "sse", label: "SSE", description: "服务器发送事件 (HTTP端点)" }
+];
+const CATEGORIES = [
+  { value: "filesystem", label: "文件系统", description: "文件操作工具" },
+  { value: "database", label: "数据库", description: "数据库访问工具" },
+  { value: "api", label: "API", description: "外部API集成" },
+  { value: "development", label: "开发", description: "开发工具" },
+  { value: "productivity", label: "生产力", description: "生产力工具" },
+  { value: "custom", label: "自定义", description: "其他工具" }
+];
+function CreateMCPServerDialog({ open, onClose, onCreated }) {
+  const [formData, setFormData] = reactExports.useState({
+    id: "",
+    name: "",
+    type: "stdio",
+    command: "",
+    args: "",
+    url: "",
+    description: "",
+    category: "custom",
+    enabled: true,
+    env: {}
+  });
+  const [envVars, setEnvVars] = reactExports.useState([{ key: "", value: "" }]);
+  const [errors, setErrors] = reactExports.useState({});
+  const [testing, setTesting] = reactExports.useState(false);
+  const [testResult, setTestResult] = reactExports.useState(null);
+  const handleEnvVarChange = (index2, field, value) => {
+    const newEnvVars = [...envVars];
+    newEnvVars[index2][field] = value;
+    setEnvVars(newEnvVars);
+    const env2 = {};
+    newEnvVars.forEach((envVar) => {
+      if (envVar.key.trim()) {
+        env2[envVar.key.trim()] = envVar.value;
+      }
+    });
+    setFormData({ ...formData, env: env2 });
+  };
+  const addEnvVar = () => {
+    setEnvVars([...envVars, { key: "", value: "" }]);
+  };
+  const removeEnvVar = (index2) => {
+    const newEnvVars = envVars.filter((_2, i2) => i2 !== index2);
+    setEnvVars(newEnvVars);
+    const env2 = {};
+    newEnvVars.forEach((envVar) => {
+      if (envVar.key.trim()) {
+        env2[envVar.key.trim()] = envVar.value;
+      }
+    });
+    setFormData({ ...formData, env: env2 });
+  };
+  if (!open) return null;
+  const validateForm = () => {
+    const newErrors = {};
+    if (!formData.id.trim()) {
+      newErrors.id = "ID不能为空";
+    } else if (!/^[a-z0-9-]+$/.test(formData.id)) {
+      newErrors.id = "ID只能包含小写字母、数字和连字符";
+    }
+    if (!formData.name.trim()) {
+      newErrors.name = "名称不能为空";
+    }
+    if (formData.type === "stdio" && !formData.command.trim()) {
+      newErrors.command = "STDIO类型需要命令";
+    }
+    if (formData.type === "sse") {
+      try {
+        new URL(formData.url);
+      } catch {
+        newErrors.url = "请输入有效的URL";
+      }
+    }
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  };
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (!validateForm()) return;
+    try {
+      const argsArray = formData.args.split(" ").map((arg) => arg.trim()).filter(Boolean);
+      const result = await window.api.mcp.create({
+        id: formData.id.trim(),
+        name: formData.name.trim(),
+        type: formData.type,
+        command: formData.type === "stdio" ? formData.command.trim() : void 0,
+        args: formData.type === "stdio" && argsArray.length > 0 ? argsArray : void 0,
+        url: formData.type === "sse" ? formData.url.trim() : void 0,
+        description: formData.description.trim() || void 0,
+        category: formData.category,
+        enabled: formData.enabled,
+        env: Object.keys(formData.env).length > 0 ? formData.env : void 0
+      });
+      if (result.success) {
+        onCreated();
+        onClose();
+      } else {
+        setErrors({ id: result.error || "创建失败" });
+      }
+    } catch (error) {
+      console.error("[CreateMCPServerDialog] Create error:", error);
+      setErrors({ id: "创建失败，请重试" });
+    }
+  };
+  const handleTest = async () => {
+    if (formData.type === "stdio" && !formData.command.trim()) {
+      setErrors({ command: "请先输入命令" });
+      return;
+    }
+    if (formData.type === "sse" && !formData.url.trim()) {
+      setErrors({ url: "请先输入URL" });
+      return;
+    }
+    setTesting(true);
+    setTestResult(null);
+    try {
+      const argsArray = formData.args.split(" ").map((arg) => arg.trim()).filter(Boolean);
+      const result = await window.api.mcp.test({
+        type: formData.type,
+        command: formData.type === "stdio" ? formData.command.trim() : void 0,
+        args: formData.type === "stdio" && argsArray.length > 0 ? argsArray : void 0,
+        url: formData.type === "sse" ? formData.url.trim() : void 0,
+        env: Object.keys(formData.env).length > 0 ? formData.env : void 0
+      });
+      setTestResult({
+        success: result.success,
+        message: result.success ? `连接成功！发现 ${result.tools || 0} 个工具` : result.error || "连接失败",
+        tools: result.tools
+      });
+    } catch (error) {
+      setTestResult({
+        success: false,
+        message: error instanceof Error ? error.message : "测试失败"
+      });
+    } finally {
+      setTesting(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-full max-w-2xl bg-[#1A1A1D] rounded-lg shadow-xl border border-white/10 flex flex-col max-h-[90vh]", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between px-6 py-4 border-b border-white/5 flex-shrink-0", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-lg font-semibold text-white", children: "添加MCP服务器" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("button", { onClick: onClose, className: "text-gray-400 hover:text-white transition-colors", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "path",
+        {
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: 2,
+          d: "M6 18L18 6M6 6l12 12"
+        }
+      ) }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: handleSubmit, className: "p-6 space-y-4 overflow-y-auto flex-1", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "block text-sm font-medium text-gray-300 mb-2", children: [
+          "传输类型 ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-500", children: "*" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-2 gap-2", children: TRANSPORT_TYPES.map((type) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => setFormData({ ...formData, type: type.value }),
+            className: `px-3 py-2 text-left text-sm rounded-md transition-colors ${formData.type === type.value ? "bg-blue-500/20 text-blue-400 border border-blue-500/50" : "bg-white/5 text-gray-400 border border-white/10 hover:bg-white/10"}`,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: type.label }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs opacity-75", children: type.description })
+            ]
+          },
+          type.value
+        )) })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "block text-sm font-medium text-gray-300 mb-1", children: [
+          "服务器ID ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-500", children: "*" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            type: "text",
+            value: formData.id,
+            onChange: (e) => setFormData({ ...formData, id: e.target.value }),
+            placeholder: "例如: filesystem-server",
+            className: "w-full px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500",
+            required: true
+          }
+        ),
+        errors.id && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-status-critical mt-1", children: errors.id }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-500 mt-1", children: "唯一标识符，只能包含小写字母、数字和连字符" })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "block text-sm font-medium text-gray-300 mb-1", children: [
+          "显示名称 ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-500", children: "*" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            type: "text",
+            value: formData.name,
+            onChange: (e) => setFormData({ ...formData, name: e.target.value }),
+            placeholder: "例如: 文件系统服务器",
+            className: "w-full px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500",
+            required: true
+          }
+        ),
+        errors.name && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-status-critical mt-1", children: errors.name })
+      ] }),
+      formData.type === "stdio" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "block text-sm font-medium text-gray-300 mb-1", children: [
+          "命令 ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-500", children: "*" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            type: "text",
+            value: formData.command,
+            onChange: (e) => setFormData({ ...formData, command: e.target.value }),
+            placeholder: "例如: npx",
+            className: "w-full px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500",
+            required: formData.type === "stdio"
+          }
+        ),
+        errors.command && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-status-critical mt-1", children: errors.command })
+      ] }),
+      formData.type === "stdio" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-sm font-medium text-gray-300 mb-1", children: "命令参数" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            type: "text",
+            value: formData.args,
+            onChange: (e) => setFormData({ ...formData, args: e.target.value }),
+            placeholder: "例如: @modelcontextprotocol/server-filesystem /path/to/dir",
+            className: "w-full px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-500 mt-1", children: "多个参数用空格分隔" })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-sm font-medium text-gray-300 mb-2", children: "环境变量" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-2", children: envVars.map((envVar, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "input",
+            {
+              type: "text",
+              value: envVar.key,
+              onChange: (e) => handleEnvVarChange(index2, "key", e.target.value),
+              placeholder: "变量名 (如: YAPI_BASE_URL)",
+              className: "flex-1 px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "input",
+            {
+              type: "text",
+              value: envVar.value,
+              onChange: (e) => handleEnvVarChange(index2, "value", e.target.value),
+              placeholder: "值 (不要包含引号)",
+              className: "flex-1 px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500"
+            }
+          ),
+          envVars.length > 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => removeEnvVar(index2),
+              className: "px-2 py-1 text-status-critical hover:bg-status-critical/20 rounded-md transition-colors",
+              title: "删除",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+            }
+          )
+        ] }, index2)) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: addEnvVar,
+            className: "mt-2 text-xs text-blue-400 hover:text-blue-300 transition-colors",
+            children: "+ 添加环境变量"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-gray-500 mt-1", children: "可选，用于传递敏感信息或配置参数。直接输入值即可，不要包含引号或JSON格式" })
+      ] }),
+      formData.type === "sse" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "block text-sm font-medium text-gray-300 mb-1", children: [
+          "服务器URL ",
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-500", children: "*" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            type: "text",
+            value: formData.url,
+            onChange: (e) => setFormData({ ...formData, url: e.target.value }),
+            placeholder: "例如: http://localhost:3000/sse",
+            className: "w-full px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500",
+            required: formData.type === "sse"
+          }
+        ),
+        errors.url && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-status-critical mt-1", children: errors.url })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-sm font-medium text-gray-300 mb-1", children: "描述" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            type: "text",
+            value: formData.description,
+            onChange: (e) => setFormData({ ...formData, description: e.target.value }),
+            placeholder: "可选的服务器描述",
+            className: "w-full px-3 py-2 text-sm text-white placeholder-gray-500 bg-white/5 border border-white/10 rounded-md focus:outline-none focus:border-blue-500"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-sm font-medium text-gray-300 mb-2", children: "分类" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-3 gap-2", children: CATEGORIES.map((cat) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => setFormData({ ...formData, category: cat.value }),
+            className: `px-3 py-2 text-left text-sm rounded-md transition-colors ${formData.category === cat.value ? "bg-blue-500/20 text-blue-400 border border-blue-500/50" : "bg-white/5 text-gray-400 border border-white/10 hover:bg-white/10"}`,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: cat.label }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs opacity-75", children: cat.description })
+            ]
+          },
+          cat.value
+        )) })
+      ] }),
+      testResult && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "div",
+        {
+          className: `p-3 rounded-md text-sm ${testResult.success ? "bg-status-nominal/20 text-status-nominal border border-status-nominal/50" : "bg-status-critical/20 text-status-critical border border-status-critical/50"}`,
+          children: testResult.message
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end gap-3 px-6 py-4 border-t border-white/5 flex-shrink-0", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Button,
+        {
+          type: "button",
+          variant: "ghost",
+          onClick: handleTest,
+          disabled: testing,
+          className: "text-xs",
+          children: testing ? "测试中..." : "测试连接"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", variant: "ghost", onClick: onClose, children: "取消" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", onClick: handleSubmit, children: "创建服务器" })
+    ] })
+  ] }) });
+}
+function MCPPanel() {
+  const [servers, setServers] = reactExports.useState([]);
+  const [loading, setLoading] = reactExports.useState(true);
+  const [showCreateDialog, setShowCreateDialog] = reactExports.useState(false);
+  reactExports.useEffect(() => {
+    loadServers();
+  }, []);
+  reactExports.useEffect(() => {
+    const interval = setInterval(async () => {
+      const result = await window.api.mcp.getAllStates();
+      if (result.success && result.states) {
+        const stateMap = /* @__PURE__ */ new Map();
+        result.states.forEach((state) => {
+          stateMap.set(state.serverId, state);
+        });
+        setServers(
+          (prev) => prev.map((server) => {
+            const state = stateMap.get(server.id);
+            return {
+              ...server,
+              connectionStatus: state?.status,
+              toolCount: state?.tools?.length || 0
+            };
+          })
+        );
+      }
+    }, 2e3);
+    return () => clearInterval(interval);
+  }, []);
+  async function loadServers() {
+    setLoading(true);
+    try {
+      const result = await window.api.mcp.list();
+      if (result.success && result.servers) {
+        const statesResult = await window.api.mcp.getAllStates();
+        const stateMap = /* @__PURE__ */ new Map();
+        if (statesResult.success && statesResult.states) {
+          statesResult.states.forEach((state) => {
+            stateMap.set(state.serverId, state);
+          });
+        }
+        setServers(
+          result.servers.map((server) => ({
+            ...server,
+            connectionStatus: stateMap.get(server.id)?.status,
+            toolCount: stateMap.get(server.id)?.tools?.length || 0
+          }))
+        );
+      }
+    } catch (error) {
+      console.error("[MCPPanel] Failed to load servers:", error);
+    } finally {
+      setLoading(false);
+    }
+  }
+  async function handleToggleServer(serverId, currentEnabled) {
+    console.log("[MCPPanel] Toggling server:", serverId, "from", currentEnabled, "to", !currentEnabled);
+    try {
+      const result = await window.api.mcp.toggle(serverId, !currentEnabled);
+      console.log("[MCPPanel] Toggle result:", result);
+      if (result.success) {
+        setServers(
+          (prev) => prev.map(
+            (s2) => s2.id === serverId ? { ...s2, enabled: !currentEnabled } : s2
+          )
+        );
+        await loadServers();
+      } else {
+        alert(`切换失败: ${result.error}`);
+      }
+    } catch (error) {
+      console.error("[MCPPanel] Failed to toggle server:", error);
+      alert(`切换失败: ${error instanceof Error ? error.message : "未知错误"}`);
+    }
+  }
+  async function handleDeleteServer(serverId) {
+    if (!confirm("确定要删除这个MCP服务器吗?")) return;
+    console.log("[MCPPanel] Deleting server:", serverId);
+    try {
+      const result = await window.api.mcp.delete(serverId);
+      console.log("[MCPPanel] Delete result:", result);
+      if (result.success) {
+        setServers((prev) => prev.filter((s2) => s2.id !== serverId));
+        await loadServers();
+      } else {
+        alert(`删除失败: ${result.error}`);
+      }
+    } catch (error) {
+      console.error("[MCPPanel] Failed to delete server:", error);
+      alert(`删除失败: ${error instanceof Error ? error.message : "未知错误"}`);
+    }
+  }
+  async function handleConnect(serverId) {
+    console.log("[MCPPanel] Connecting to server:", serverId, "type:", typeof serverId);
+    try {
+      setServers(
+        (prev) => prev.map(
+          (s2) => s2.id === serverId ? { ...s2, connectionStatus: "connecting" } : s2
+        )
+      );
+      console.log("[MCPPanel] Calling window.api.mcp.connect with:", serverId);
+      const result = await window.api.mcp.connect(serverId);
+      console.log("[MCPPanel] Connect result:", result);
+      if (result.success) {
+        await loadServers();
+      } else {
+        alert(`连接失败: ${result.error}`);
+        await loadServers();
+      }
+    } catch (error) {
+      console.error("[MCPPanel] Failed to connect:", error);
+      alert(`连接失败: ${error instanceof Error ? error.message : "未知错误"}`);
+      await loadServers();
+    }
+  }
+  async function handleDisconnect(serverId) {
+    console.log("[MCPPanel] Disconnecting from server:", serverId);
+    try {
+      const result = await window.api.mcp.disconnect(serverId);
+      console.log("[MCPPanel] Disconnect result:", result);
+      if (result.success) {
+        setServers(
+          (prev) => prev.map(
+            (s2) => s2.id === serverId ? { ...s2, connectionStatus: "disconnected", toolCount: 0 } : s2
+          )
+        );
+        await loadServers();
+      } else {
+        alert(`断开连接失败: ${result.error}`);
+      }
+    } catch (error) {
+      console.error("[MCPPanel] Failed to disconnect:", error);
+      alert(`断开连接失败: ${error instanceof Error ? error.message : "未知错误"}`);
+    }
+  }
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-40", children: /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-5 animate-spin text-muted-foreground" }) });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between px-3 py-2 border-b border-border/50 bg-background/30", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+        servers.filter((s2) => s2.enabled).length,
+        " / ",
+        servers.length,
+        " 启用"
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: () => setShowCreateDialog(true),
+          className: "h-5 px-1.5 text-[10px]",
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Plus, { className: "size-3" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-1", children: "添加" })
+          ]
+        }
+      )
+    ] }),
+    servers.length === 0 ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center text-center text-sm text-muted-foreground py-8 px-4 flex-1", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Plug, { className: "size-8 mb-2 opacity-50" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "没有MCP服务器" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs mt-1", children: '点击"添加"配置服务器' })
+    ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "py-2 overflow-auto flex-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-3 space-y-2", children: servers.map((server) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ServerCard,
+      {
+        server,
+        onToggle: handleToggleServer,
+        onDelete: handleDeleteServer,
+        onConnect: handleConnect,
+        onDisconnect: handleDisconnect
+      },
+      server.id
+    )) }) }),
+    showCreateDialog && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      CreateMCPServerDialog,
+      {
+        open: showCreateDialog,
+        onClose: () => setShowCreateDialog(false),
+        onCreated: loadServers
+      }
+    )
+  ] });
+}
+function ServerCard({ server, onToggle, onDelete, onConnect, onDisconnect }) {
+  const getStatusIcon = () => {
+    if (!server.enabled) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Circle, { className: "size-3 text-muted-foreground" });
+    }
+    switch (server.connectionStatus) {
+      case "connected":
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleCheck, { className: "size-3 text-status-nominal" });
+      case "connecting":
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-3 animate-spin text-status-info" });
+      case "error":
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleX, { className: "size-3 text-status-critical" });
+      default:
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(Circle, { className: "size-3 text-muted-foreground" });
+    }
+  };
+  const getStatusText = () => {
+    if (!server.enabled) return "已禁用";
+    switch (server.connectionStatus) {
+      case "connected":
+        return "已连接";
+      case "connecting":
+        return "连接中";
+      case "error":
+        return "错误";
+      default:
+        return "未连接";
+    }
+  };
+  const getTransportTypeLabel = () => {
+    return server.type === "stdio" ? "STDIO" : "SSE";
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 rounded-sm border border-border bg-background/50 hover:bg-background transition-colors", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
+      getStatusIcon(),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 text-sm font-medium truncate", children: server.name }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "outline", className: "text-[9px] px-1 py-0 h-4", children: getTransportTypeLabel() })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs text-muted-foreground mb-2 space-y-0.5", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "状态:" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: server.connectionStatus === "connected" ? "text-status-nominal" : "", children: getStatusText() })
+      ] }),
+      server.connectionStatus === "connected" && server.toolCount !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "工具:" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: server.toolCount })
+      ] }),
+      server.description && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-[10px] truncate", title: server.description, children: server.description })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1 mt-2", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: () => onToggle(server.id, server.enabled),
+          className: `h-6 px-2 text-[10px] flex-1 ${server.enabled ? "text-status-nominal hover:text-status-nominal" : ""}`,
+          title: server.enabled ? "禁用" : "启用",
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Power, { className: "size-3" })
+        }
+      ),
+      server.enabled && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: () => server.connectionStatus === "connected" ? onDisconnect(server.id) : onConnect(server.id),
+          className: "h-6 px-2 text-[10px] flex-1",
+          disabled: server.connectionStatus === "connecting",
+          title: server.connectionStatus === "connected" ? "断开" : "连接",
+          children: server.connectionStatus === "connecting" ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-3 animate-spin" }) : server.connectionStatus === "connected" ? /* @__PURE__ */ jsxRuntimeExports.jsx(CircleX, { className: "size-3" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Plug, { className: "size-3" })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: () => onDelete(server.id),
+          className: "h-6 px-2 text-[10px] text-status-critical hover:text-status-critical",
+          title: "删除",
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-3" })
+        }
+      )
+    ] })
+  ] });
+}
 const HEADER_HEIGHT = 40;
 const HANDLE_HEIGHT = 6;
 const MIN_CONTENT_HEIGHT = 60;
@@ -77131,31 +77814,34 @@ function RightPanel() {
   const [filesOpen, setFilesOpen] = reactExports.useState(true);
   const [agentsOpen, setAgentsOpen] = reactExports.useState(true);
   const [skillsOpen, setSkillsOpen] = reactExports.useState(false);
+  const [mcpOpen, setMcpOpen] = reactExports.useState(false);
   const [tasksHeight, setTasksHeight] = reactExports.useState(null);
   const [filesHeight, setFilesHeight] = reactExports.useState(null);
   const [agentsHeight, setAgentsHeight] = reactExports.useState(null);
   const [skillsHeight, setSkillsHeight] = reactExports.useState(null);
+  const [mcpHeight, setMcpHeight] = reactExports.useState(null);
   const dragStartHeights = reactExports.useRef(null);
   const getAvailableContentHeight = reactExports.useCallback(() => {
     if (!containerRef.current) return 0;
     const totalHeight = containerRef.current.clientHeight;
-    let used = HEADER_HEIGHT * 4;
-    const openPanels = [tasksOpen, filesOpen, agentsOpen, skillsOpen].filter(Boolean).length;
+    let used = HEADER_HEIGHT * 5;
+    const openPanels = [tasksOpen, filesOpen, agentsOpen, skillsOpen, mcpOpen].filter(Boolean).length;
     used += HANDLE_HEIGHT * (openPanels - 1);
     return Math.max(0, totalHeight - used);
-  }, [tasksOpen, filesOpen, agentsOpen, skillsOpen]);
+  }, [tasksOpen, filesOpen, agentsOpen, skillsOpen, mcpOpen]);
   const getContentHeights = reactExports.useCallback(() => {
     const available = getAvailableContentHeight();
-    const openCount = [tasksOpen, filesOpen, agentsOpen, skillsOpen].filter(Boolean).length;
+    const openCount = [tasksOpen, filesOpen, agentsOpen, skillsOpen, mcpOpen].filter(Boolean).length;
     if (openCount === 0) {
-      return { tasks: 0, files: 0, agents: 0, skills: 0 };
+      return { tasks: 0, files: 0, agents: 0, skills: 0, mcp: 0 };
     }
     const defaultHeight = available / openCount;
     return {
       tasks: tasksOpen ? tasksHeight ?? defaultHeight : 0,
       files: filesOpen ? filesHeight ?? defaultHeight : 0,
       agents: agentsOpen ? agentsHeight ?? defaultHeight : 0,
-      skills: skillsOpen ? skillsHeight ?? defaultHeight : 0
+      skills: skillsOpen ? skillsHeight ?? defaultHeight : 0,
+      mcp: mcpOpen ? mcpHeight ?? defaultHeight : 0
     };
   }, [
     getAvailableContentHeight,
@@ -77163,10 +77849,12 @@ function RightPanel() {
     filesOpen,
     agentsOpen,
     skillsOpen,
+    mcpOpen,
     tasksHeight,
     filesHeight,
     agentsHeight,
-    skillsHeight
+    skillsHeight,
+    mcpHeight
   ]);
   const handleTasksResize = reactExports.useCallback(
     (totalDelta) => {
@@ -77215,7 +77903,15 @@ function RightPanel() {
         else if (nextPanel === "skills") setSkillsOpen(false);
       }
     },
-    [getContentHeights, getAvailableContentHeight, filesOpen, agentsOpen, skillsOpen, agentsHeight, skillsHeight]
+    [
+      getContentHeights,
+      getAvailableContentHeight,
+      filesOpen,
+      agentsOpen,
+      skillsOpen,
+      agentsHeight,
+      skillsHeight
+    ]
   );
   const handleFilesResize = reactExports.useCallback(
     (totalDelta) => {
@@ -77270,38 +77966,86 @@ function RightPanel() {
       }
       const start = dragStartHeights.current;
       const available = getAvailableContentHeight();
-      const tasksH = tasksOpen ? tasksHeight ?? available / 4 : 0;
-      const filesH = filesOpen ? filesHeight ?? available / 4 : 0;
+      const tasksH = tasksOpen ? tasksHeight ?? available / 5 : 0;
+      const filesH = filesOpen ? filesHeight ?? available / 5 : 0;
       const aboveHeight = tasksH + filesH;
-      const maxForAgentsAndSkills = available - aboveHeight;
+      let nextPanel = null;
+      if (skillsOpen) nextPanel = "skills";
+      else if (mcpOpen) nextPanel = "mcp";
+      if (!nextPanel) return;
+      const maxForAgentsAndNext = available - aboveHeight;
       let newAgentsHeight = start.agents + totalDelta;
-      let newSkillsHeight = start.skills - totalDelta;
+      let newNextHeight = start[nextPanel] - totalDelta;
       if (newAgentsHeight < MIN_CONTENT_HEIGHT) {
         newAgentsHeight = MIN_CONTENT_HEIGHT;
-        newSkillsHeight = start.skills + (start.agents - MIN_CONTENT_HEIGHT);
+        newNextHeight = start[nextPanel] + (start.agents - MIN_CONTENT_HEIGHT);
       }
-      if (newSkillsHeight < MIN_CONTENT_HEIGHT) {
-        newSkillsHeight = MIN_CONTENT_HEIGHT;
-        newAgentsHeight = start.agents + (start.skills - MIN_CONTENT_HEIGHT);
+      if (newNextHeight < MIN_CONTENT_HEIGHT) {
+        newNextHeight = MIN_CONTENT_HEIGHT;
+        newAgentsHeight = start.agents + (start[nextPanel] - MIN_CONTENT_HEIGHT);
       }
-      if (newAgentsHeight + newSkillsHeight > maxForAgentsAndSkills) {
-        const excess = newAgentsHeight + newSkillsHeight - maxForAgentsAndSkills;
+      if (newAgentsHeight + newNextHeight > maxForAgentsAndNext) {
+        const excess = newAgentsHeight + newNextHeight - maxForAgentsAndNext;
         if (totalDelta > 0) {
-          newSkillsHeight = Math.max(MIN_CONTENT_HEIGHT, newSkillsHeight - excess);
+          newNextHeight = Math.max(MIN_CONTENT_HEIGHT, newNextHeight - excess);
         } else {
           newAgentsHeight = Math.max(MIN_CONTENT_HEIGHT, newAgentsHeight - excess);
         }
       }
       setAgentsHeight(newAgentsHeight);
-      setSkillsHeight(newSkillsHeight);
+      if (nextPanel === "skills") setSkillsHeight(newNextHeight);
+      else if (nextPanel === "mcp") setMcpHeight(newNextHeight);
       if (newAgentsHeight < COLLAPSE_THRESHOLD) {
         setAgentsOpen(false);
       }
+      if (newNextHeight < COLLAPSE_THRESHOLD) {
+        if (nextPanel === "skills") setSkillsOpen(false);
+        else if (nextPanel === "mcp") setMcpOpen(false);
+      }
+    },
+    [getContentHeights, getAvailableContentHeight, tasksOpen, filesOpen, tasksHeight, filesHeight, skillsOpen, mcpOpen]
+  );
+  const handleSkillsResize = reactExports.useCallback(
+    (totalDelta) => {
+      if (!dragStartHeights.current) {
+        const heights2 = getContentHeights();
+        dragStartHeights.current = { ...heights2 };
+      }
+      const start = dragStartHeights.current;
+      const available = getAvailableContentHeight();
+      const tasksH = tasksOpen ? tasksHeight ?? available / 5 : 0;
+      const filesH = filesOpen ? filesHeight ?? available / 5 : 0;
+      const agentsH = agentsOpen ? agentsHeight ?? available / 5 : 0;
+      const aboveHeight = tasksH + filesH + agentsH;
+      const maxForSkillsAndMcp = available - aboveHeight;
+      let newSkillsHeight = start.skills + totalDelta;
+      let newMcpHeight = start.mcp - totalDelta;
+      if (newSkillsHeight < MIN_CONTENT_HEIGHT) {
+        newSkillsHeight = MIN_CONTENT_HEIGHT;
+        newMcpHeight = start.mcp + (start.skills - MIN_CONTENT_HEIGHT);
+      }
+      if (newMcpHeight < MIN_CONTENT_HEIGHT) {
+        newMcpHeight = MIN_CONTENT_HEIGHT;
+        newSkillsHeight = start.skills + (start.mcp - MIN_CONTENT_HEIGHT);
+      }
+      if (newSkillsHeight + newMcpHeight > maxForSkillsAndMcp) {
+        const excess = newSkillsHeight + newMcpHeight - maxForSkillsAndMcp;
+        if (totalDelta > 0) {
+          newMcpHeight = Math.max(MIN_CONTENT_HEIGHT, newMcpHeight - excess);
+        } else {
+          newSkillsHeight = Math.max(MIN_CONTENT_HEIGHT, newSkillsHeight - excess);
+        }
+      }
+      setSkillsHeight(newSkillsHeight);
+      setMcpHeight(newMcpHeight);
       if (newSkillsHeight < COLLAPSE_THRESHOLD) {
         setSkillsOpen(false);
       }
+      if (newMcpHeight < COLLAPSE_THRESHOLD) {
+        setMcpOpen(false);
+      }
     },
-    [getContentHeights, getAvailableContentHeight, tasksOpen, filesOpen, tasksHeight, filesHeight]
+    [getContentHeights, getAvailableContentHeight, tasksOpen, filesOpen, agentsOpen, tasksHeight, filesHeight, agentsHeight]
   );
   reactExports.useEffect(() => {
     const handleMouseUp = () => {
@@ -77315,8 +78059,9 @@ function RightPanel() {
     setFilesHeight(null);
     setAgentsHeight(null);
     setSkillsHeight(null);
-  }, [tasksOpen, filesOpen, agentsOpen, skillsOpen]);
-  const [heights, setHeights] = reactExports.useState({ tasks: 0, files: 0, agents: 0, skills: 0 });
+    setMcpHeight(null);
+  }, [tasksOpen, filesOpen, agentsOpen, skillsOpen, mcpOpen]);
+  const [heights, setHeights] = reactExports.useState({ tasks: 0, files: 0, agents: 0, skills: 0, mcp: 0 });
   reactExports.useEffect(() => {
     setHeights(getContentHeights());
   }, [getContentHeights]);
@@ -77367,8 +78112,8 @@ function RightPanel() {
           ),
           agentsOpen && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "overflow-auto", style: { height: heights.agents }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(AgentsContent, {}) })
         ] }),
-        agentsOpen && skillsOpen && /* @__PURE__ */ jsxRuntimeExports.jsx(ResizeHandle$1, { onDrag: handleAgentsResize }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col shrink-0", children: [
+        agentsOpen && (skillsOpen || mcpOpen) && /* @__PURE__ */ jsxRuntimeExports.jsx(ResizeHandle$1, { onDrag: handleAgentsResize }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col shrink-0 border-b border-border", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             SectionHeader,
             {
@@ -77379,6 +78124,19 @@ function RightPanel() {
             }
           ),
           skillsOpen && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "overflow-auto", style: { height: heights.skills }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(SkillsContent, {}) })
+        ] }),
+        skillsOpen && mcpOpen && /* @__PURE__ */ jsxRuntimeExports.jsx(ResizeHandle$1, { onDrag: handleSkillsResize }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col shrink-0", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            SectionHeader,
+            {
+              title: "MCP",
+              icon: Plug,
+              isOpen: mcpOpen,
+              onToggle: () => setMcpOpen((prev) => !prev)
+            }
+          ),
+          mcpOpen && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "overflow-auto", style: { height: heights.mcp }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(MCPContent, {}) })
         ] })
       ]
     }
@@ -77803,6 +78561,9 @@ function AgentsContent() {
 function SkillsContent() {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(SkillsPanel, {});
 }
+function MCPContent() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(MCPPanel, {});
+}
 function formatSize(bytes) {
   if (bytes < 1024) return `${bytes}B`;
   if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}KB`;
@@ -78201,7 +78962,7 @@ function App() {
         },
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-name", children: "OPENWORK" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-version", children: "0.2.4" })
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-version", children: "0.4.0" })
         ]
       }
     ),