@oro.ad/nuxt-claude-devtools 1.2.0 → 1.5.0

package/dist/runtime/shared/composables/useShare.js

@@ -0,0 +1,214 @@
+import { computed, ref } from "vue";
+import {
+  STORAGE_KEY_NICKNAME,
+  STORAGE_KEY_USER_ID,
+  URL_PARAM_SHARE,
+  URL_PARAM_SHARE_NICKNAME
+} from "../constants.js";
+function defaultGetUrlParam(param) {
+  if (typeof window === "undefined") return null;
+  const params = new URLSearchParams(window.location.search);
+  return params.get(param);
+}
+function defaultGetBaseUrl() {
+  if (typeof window === "undefined") return "";
+  return window.location.origin;
+}
+export function useShare(options = {}) {
+  const {
+    getUrlParam = defaultGetUrlParam,
+    getBaseUrl = defaultGetBaseUrl,
+    log = () => {
+    }
+  } = options;
+  const userId = ref(null);
+  const nickname = ref(null);
+  const users = ref([]);
+  const showNicknameModal = ref(false);
+  const nicknameError = ref(null);
+  const isShareMode = computed(() => users.value.length > 1);
+  const wasInvited = ref(false);
+  const sharingActiveOnServer = ref(false);
+  const nicknameFromUrl = ref(false);
+  function generateId() {
+    return Math.random().toString(36).substring(2, 10);
+  }
+  function getUserIdFromUrl() {
+    return getUrlParam(URL_PARAM_SHARE);
+  }
+  function getNicknameFromUrl() {
+    return getUrlParam(URL_PARAM_SHARE_NICKNAME);
+  }
+  function cleanShareParamsFromUrl() {
+    if (typeof window === "undefined") return;
+    if (window.location.search.includes(URL_PARAM_SHARE) || window.location.search.includes(URL_PARAM_SHARE_NICKNAME)) {
+      const url = new URL(window.location.href);
+      url.searchParams.delete(URL_PARAM_SHARE);
+      url.searchParams.delete(URL_PARAM_SHARE_NICKNAME);
+      window.history.replaceState({}, "", url.toString());
+    }
+  }
+  function initShare() {
+    if (typeof window === "undefined") return;
+    const urlUserId = getUserIdFromUrl();
+    const urlNickname = getNicknameFromUrl();
+    log("initShare", { urlUserId, urlNickname });
+    if (urlUserId) {
+      userId.value = urlUserId;
+      wasInvited.value = true;
+      localStorage.setItem(STORAGE_KEY_USER_ID, urlUserId);
+    } else {
+      const storedUserId = localStorage.getItem(STORAGE_KEY_USER_ID);
+      if (storedUserId) {
+        userId.value = storedUserId;
+      } else {
+        const newId = generateId();
+        userId.value = newId;
+        localStorage.setItem(STORAGE_KEY_USER_ID, newId);
+      }
+    }
+    if (urlNickname) {
+      nickname.value = urlNickname;
+      localStorage.setItem(STORAGE_KEY_NICKNAME, urlNickname);
+      nicknameFromUrl.value = true;
+    } else {
+      const storedNickname = localStorage.getItem(STORAGE_KEY_NICKNAME);
+      if (storedNickname && storedNickname.trim()) {
+        nickname.value = storedNickname;
+      }
+    }
+    cleanShareParamsFromUrl();
+  }
+  function createShareLink(includeNickname = false) {
+    if (typeof window === "undefined") return "";
+    const inviteeId = generateId();
+    const baseUrl = getBaseUrl();
+    const url = new URL(baseUrl);
+    url.searchParams.set(URL_PARAM_SHARE, inviteeId);
+    if (includeNickname && nickname.value) {
+      url.searchParams.set(URL_PARAM_SHARE_NICKNAME, nickname.value);
+    }
+    return url.toString();
+  }
+  function setNickname(name) {
+    nickname.value = name;
+    nicknameError.value = null;
+    if (typeof window !== "undefined") {
+      localStorage.setItem(STORAGE_KEY_NICKNAME, name);
+    }
+  }
+  function needsNicknameImmediate() {
+    return wasInvited.value && !nickname.value && !nicknameFromUrl.value;
+  }
+  function needsNicknameForMessage() {
+    return sharingActiveOnServer.value && !nickname.value;
+  }
+  function needsNicknameForShare() {
+    return !nickname.value;
+  }
+  function checkSharingStatus(socket) {
+    if (!socket) return;
+    socket.emit("share:is_active");
+  }
+  function syncCredentials(socket) {
+    if (!socket || !userId.value || !nickname.value) return;
+    socket.emit("share:sync", {
+      userId: userId.value,
+      nickname: nickname.value
+    });
+  }
+  function registerUser(socket) {
+    if (!socket || !userId.value || !nickname.value) return;
+    socket.emit("share:register", {
+      userId: userId.value,
+      nickname: nickname.value
+    });
+  }
+  function setupSocketListeners(socket) {
+    socket.on("share:users", (data) => {
+      users.value = data;
+      sharingActiveOnServer.value = data.length > 0;
+    });
+    socket.on("share:is_active", (data) => {
+      sharingActiveOnServer.value = data.active;
+    });
+    socket.on("share:user_joined", (user) => {
+      const existingIndex = users.value.findIndex((u) => u.id === user.id);
+      if (existingIndex >= 0) {
+        users.value[existingIndex] = user;
+      } else {
+        users.value.push(user);
+      }
+    });
+    socket.on("share:registered", (user) => {
+      nickname.value = user.nickname;
+      nicknameError.value = null;
+      showNicknameModal.value = false;
+      if (typeof window !== "undefined") {
+        localStorage.setItem(STORAGE_KEY_NICKNAME, user.nickname);
+      }
+    });
+    socket.on("share:nickname_taken", () => {
+      nicknameError.value = "This nickname is already taken";
+      showNicknameModal.value = true;
+    });
+    socket.on("share:synced", (data) => {
+      if (data.status === "nickname_conflict") {
+        nickname.value = null;
+        if (typeof window !== "undefined") {
+          localStorage.removeItem(STORAGE_KEY_NICKNAME);
+        }
+        nicknameError.value = "Your nickname is already used by another user in this project";
+        showNicknameModal.value = true;
+      } else if (data.user) {
+        nickname.value = data.user.nickname;
+        if (typeof window !== "undefined") {
+          localStorage.setItem(STORAGE_KEY_NICKNAME, data.user.nickname);
+        }
+      }
+    });
+  }
+  function getNicknameById(id) {
+    const user = users.value.find((u) => u.id === id);
+    return user?.nickname || null;
+  }
+  function isOwnMessage(senderId) {
+    if (!senderId || !userId.value) return true;
+    return senderId === userId.value;
+  }
+  async function copyShareLink(includeNickname = false) {
+    const link = createShareLink(includeNickname);
+    try {
+      await navigator.clipboard.writeText(link);
+      return true;
+    } catch {
+      return false;
+    }
+  }
+  return {
+    // State
+    userId,
+    nickname,
+    users,
+    showNicknameModal,
+    nicknameError,
+    isShareMode,
+    wasInvited,
+    sharingActiveOnServer,
+    nicknameFromUrl,
+    // Methods
+    initShare,
+    createShareLink,
+    setNickname,
+    needsNicknameImmediate,
+    needsNicknameForMessage,
+    needsNicknameForShare,
+    checkSharingStatus,
+    syncCredentials,
+    registerUser,
+    setupSocketListeners,
+    getNicknameById,
+    isOwnMessage,
+    copyShareLink
+  };
+}

package/dist/runtime/shared/composables/useVoiceInput.d.ts

@@ -0,0 +1,8 @@
+export declare function useVoiceInput(): {
+    isRecording: import("vue").Ref<boolean, boolean>;
+    isSpeechSupported: import("vue").Ref<boolean, boolean>;
+    initSpeechRecognition: (onResult: (transcript: string) => void) => void;
+    toggleVoiceInput: (onResult: (transcript: string) => void) => void;
+    stopRecording: () => void;
+    cleanup: () => void;
+};

package/dist/runtime/shared/composables/useVoiceInput.js

@@ -0,0 +1,106 @@
+import { ref } from "vue";
+export function useVoiceInput() {
+  const isRecording = ref(false);
+  const speechRecognition = ref(null);
+  const isSpeechSupported = ref(false);
+  const userStopped = ref(false);
+  if (typeof window !== "undefined") {
+    const SpeechRecognitionAPI = window.SpeechRecognition || window.webkitSpeechRecognition;
+    isSpeechSupported.value = !!SpeechRecognitionAPI;
+  }
+  function initSpeechRecognition(onResult) {
+    const SpeechRecognitionAPI = window.SpeechRecognition || window.webkitSpeechRecognition;
+    if (!SpeechRecognitionAPI) {
+      isSpeechSupported.value = false;
+      return;
+    }
+    isSpeechSupported.value = true;
+    const recognition = new SpeechRecognitionAPI();
+    recognition.continuous = true;
+    recognition.interimResults = false;
+    recognition.lang = navigator.language || "en-US";
+    let processedResultCount = 0;
+    recognition.onresult = (event) => {
+      for (let i = event.resultIndex; i < event.results.length; i++) {
+        const result = event.results[i];
+        if (result.isFinal && i >= processedResultCount) {
+          const transcript = result[0].transcript;
+          if (transcript.trim()) {
+            onResult(transcript);
+          }
+          processedResultCount = i + 1;
+        }
+      }
+    };
+    recognition.onerror = (event) => {
+      if (event.error === "no-speech" || event.error === "aborted") {
+        return;
+      }
+      console.error("Speech recognition error:", event.error);
+      isRecording.value = false;
+    };
+    recognition.onend = () => {
+      if (isRecording.value && !userStopped.value) {
+        setTimeout(() => {
+          if (isRecording.value && !userStopped.value && speechRecognition.value) {
+            processedResultCount = 0;
+            try {
+              speechRecognition.value.start();
+            } catch {
+              isRecording.value = false;
+            }
+          }
+        }, 100);
+      } else {
+        isRecording.value = false;
+      }
+    };
+    recognition.onstart = () => {
+      processedResultCount = 0;
+    };
+    speechRecognition.value = recognition;
+  }
+  function toggleVoiceInput(onResult) {
+    if (!speechRecognition.value) {
+      initSpeechRecognition(onResult);
+    }
+    if (!speechRecognition.value) {
+      alert("Speech recognition is not supported in this browser. Try Chrome or Edge.");
+      return;
+    }
+    if (isRecording.value) {
+      userStopped.value = true;
+      speechRecognition.value.stop();
+      isRecording.value = false;
+    } else {
+      userStopped.value = false;
+      try {
+        speechRecognition.value.start();
+        isRecording.value = true;
+      } catch (e) {
+        console.error("Failed to start speech recognition:", e);
+      }
+    }
+  }
+  function stopRecording() {
+    userStopped.value = true;
+    if (isRecording.value && speechRecognition.value) {
+      speechRecognition.value.stop();
+      isRecording.value = false;
+    }
+  }
+  function cleanup() {
+    userStopped.value = true;
+    if (speechRecognition.value && isRecording.value) {
+      speechRecognition.value.stop();
+    }
+  }
+  return {
+    isRecording,
+    isSpeechSupported,
+    initSpeechRecognition,
+    toggleVoiceInput,
+    stopRecording,
+    cleanup
+  };
+}

package/dist/runtime/shared/constants.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Shared constants for Claude DevTools
+ * Used by server, client, and overlay
+ */
+/**
+ * Socket.IO endpoint path for real-time communication
+ */
+export declare const SOCKET_PATH = "/__claude_devtools_socket";
+/**
+ * DevTools UI iframe route
+ */
+export declare const DEVTOOLS_UI_ROUTE = "/__claude-devtools";
+/**
+ * Unique user identifier for collaborative sessions
+ */
+export declare const STORAGE_KEY_USER_ID = "claude-devtools-user-id";
+/**
+ * User's display name for collaborative sessions
+ */
+export declare const STORAGE_KEY_NICKNAME = "claude-devtools-nickname";
+/**
+ * URL parameter for sharing collaborative session links
+ */
+export declare const URL_PARAM_SHARE = "oro_share";
+/**
+ * URL parameter for auto-setting nickname from share link
+ */
+export declare const URL_PARAM_SHARE_NICKNAME = "oro_share_nickname";

package/dist/runtime/shared/constants.js

@@ -0,0 +1,6 @@
+export const SOCKET_PATH = "/__claude_devtools_socket";
+export const DEVTOOLS_UI_ROUTE = "/__claude-devtools";
+export const STORAGE_KEY_USER_ID = "claude-devtools-user-id";
+export const STORAGE_KEY_NICKNAME = "claude-devtools-nickname";
+export const URL_PARAM_SHARE = "oro_share";
+export const URL_PARAM_SHARE_NICKNAME = "oro_share_nickname";

package/dist/runtime/shared/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Shared exports for Claude DevTools
+ * Used by both overlay and potentially external integrations
+ */
+export * from './types.js';
+export * from './constants.js';
+export { useClaudeChat } from './composables/useClaudeChat.js';
+export { useVoiceInput } from './composables/useVoiceInput.js';
+export { useShare } from './composables/useShare.js';

package/dist/runtime/shared/index.js

@@ -0,0 +1,5 @@
+export * from "./types.js";
+export * from "./constants.js";
+export { useClaudeChat } from "./composables/useClaudeChat.js";
+export { useVoiceInput } from "./composables/useVoiceInput.js";
+export { useShare } from "./composables/useShare.js";

package/dist/runtime/shared/types.d.ts

@@ -0,0 +1,84 @@
+/**
+ * Shared types for Claude DevTools
+ * Used by both DevTools client and Overlay
+ */
+export interface ContentBlock {
+    type: 'text' | 'tool_use' | 'tool_result' | 'thinking';
+    text?: string;
+    thinking?: string;
+    id?: string;
+    name?: string;
+    input?: Record<string, unknown>;
+    tool_use_id?: string;
+    content?: string | unknown[];
+    is_error?: boolean;
+}
+export interface Message {
+    id: string;
+    role: 'user' | 'assistant' | 'system';
+    content: string;
+    contentBlocks?: ContentBlock[];
+    timestamp: Date | string;
+    streaming?: boolean;
+    model?: string;
+    senderId?: string;
+    senderNickname?: string;
+    attachments?: MessageAttachment[];
+}
+export interface Conversation {
+    id: string;
+    title?: string;
+    messages: Message[];
+    createdAt: string;
+    updatedAt: string;
+    projectPath: string;
+}
+export interface DocFile {
+    path: string;
+    name: string;
+}
+export interface SlashCommand {
+    name: string;
+    description?: string;
+}
+export interface ShareUser {
+    id: string;
+    nickname: string;
+    joinedAt: string;
+    lastSeen: string;
+}
+export interface MessageContextData {
+    viewport?: {
+        width: number;
+        height: number;
+    };
+    userAgent?: string;
+    routing?: {
+        path: string;
+        fullPath?: string;
+        query?: Record<string, string | string[]>;
+        params?: Record<string, string>;
+        name?: string;
+        pageComponent?: string;
+    };
+    components?: string[];
+}
+export interface ContextChip {
+    id: 'viewport' | 'user-agent' | 'routing';
+    label: string;
+    icon: string;
+    active: boolean;
+}
+export interface ImageAttachment {
+    id: string;
+    filename: string;
+    mimeType: string;
+    data: string;
+    size: number;
+}
+export interface MessageAttachment {
+    type: 'image';
+    path: string;
+    filename: string;
+    mimeType: string;
+}

package/dist/runtime/types.d.ts

@@ -19,6 +19,19 @@ export interface ThinkingBlock {
     thinking: string;
 }
 export type ContentBlock = TextBlock | ToolUseBlock | ToolResultBlock | ThinkingBlock;
+export interface ImageAttachment {
+    id: string;
+    filename: string;
+    mimeType: string;
+    data: string;
+    size: number;
+}
+export interface MessageAttachment {
+    type: 'image';
+    path: string;
+    filename: string;
+    mimeType: string;
+}
 export interface Message {
     id: string;
     role: 'user' | 'assistant' | 'system';
@@ -27,6 +40,9 @@ export interface Message {
     timestamp: Date | string;
     streaming?: boolean;
     model?: string;
+    senderId?: string;
+    senderNickname?: string;
+    attachments?: MessageAttachment[];
 }
 export interface Conversation {
     id: string;

package/dist/types.d.mts

@@ -1,3 +1,3 @@
 export { default } from './module.mjs'
 
-export { type ClaudeOptions, type ModuleOptions } from './module.mjs'
+export { type ClaudeOptions, type ModuleOptions, type OverlayOptions, type PluginsOptions } from './module.mjs'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oro.ad/nuxt-claude-devtools",
-  "version": "1.2.0",
+  "version": "1.5.0",
   "description": "Nuxt DevTools integration for Claude Code AI assistant",
   "license": "GPL-3.0-only",
   "type": "module",
@@ -56,7 +56,8 @@
     "@oro.ad/nuxt-claude-devtools-bc": "^1.0.5",
     "marked": "^17.0.1",
     "sirv": "^3.0.2",
-    "socket.io": "^4.8.1"
+    "socket.io": "^4.8.1",
+    "socket.io-client": "^4.8.1"
   },
   "devDependencies": {
     "@iconify-json/carbon": "^1.2.15",
@@ -69,7 +70,8 @@
     "@nuxtjs/i18n": "^10.2.1",
     "changelogen": "^0.6.2",
     "eslint": "^9.39.2",
-    "nuxt": "^4.2.2"
+    "nuxt": "^4.2.2",
+    "vue-tsc": "^3.2.4"
   },
   "publishConfig": {
     "access": "public"

package/dist/client/_nuxt/BMi2eT6G.js

@@ -1 +0,0 @@
-import{_ as B}from"./bl5iU4Kz.js";import{u as R,a as E,_ as q,b as D,c as H,l as I}from"./BiBLVxWh.js";import{_ as z}from"./DBIw6BGF.js";import{_ as G}from"./CLKqRoht.js";import{g as J,r as p,j as K,k as O,c as r,o as u,a as t,b as s,w as i,d as a,n as Q,l as V,t as v,m as b,v as x,F as S,p as W}from"./nKfsBgPE.js";const X={class:"relative flex flex-col h-screen n-bg-base"},Y={class:"flex items-center justify-between p-4"},Z={class:"flex items-center gap-3"},h={class:"text-xl font-bold flex items-center gap-2"},ee={class:"flex items-center gap-2"},te={class:"flex-1 overflow-auto p-4"},le={class:"space-y-4"},oe={key:0,class:"n-bg-active rounded-lg p-4"},se={key:0,class:"mb-4"},ne={class:"space-y-4"},ae={class:"flex gap-4"},re={class:"flex items-center gap-2"},ue={class:"flex items-center gap-2"},ie={class:"flex items-center gap-2"},de={key:1},me={class:"flex gap-4"},pe={class:"flex items-center gap-2"},ve={class:"flex items-center gap-2"},ce={class:"flex gap-2 pt-2"},fe={key:1,class:"n-bg-active rounded-lg p-4 opacity-50"},ge={key:2,class:"space-y-2"},be={class:"font-bold flex items-center gap-2"},xe={class:"text-sm opacity-70 font-mono"},Ue=J({__name:"mcp",setup(_e){const w=R(),{log:_}=E("mcp"),n=p(null),k=p(!1),c=p(!1),U=p([]),f=p(!1),l=p({name:"",transport:"stdio",command:"",args:"",url:"",scope:"local"}),m=p("");function T(){return w.isActive.value&&w.origin.value?w.origin.value:window.location.origin}function $(){const d=T();_("Connecting to socket at",d),n.value=I(d,{path:"/__claude_devtools_socket",transports:["websocket","polling"],reconnection:!0,reconnectionAttempts:5}),n.value.on("connect",()=>{_("Connected to socket"),k.value=!0,N()}),n.value.on("disconnect",()=>{_("Disconnected from socket"),k.value=!1}),n.value.on("mcp:list",e=>{_("MCP list received",e),U.value=e,c.value=!1}),n.value.on("mcp:added",e=>{e.success?(f.value=!1,M()):m.value=e.error||"Failed to add MCP server"}),n.value.on("mcp:removed",e=>{e.success||alert(`Failed to remove: ${e.error}`)})}function N(){n.value&&(c.value=!0,n.value.emit("mcp:list"))}function M(){l.value={name:"",transport:"stdio",command:"",args:"",url:"",scope:"local"},m.value=""}function L(){if(!l.value.name){m.value="Name is required";return}if(l.value.transport==="stdio"&&!l.value.command){m.value="Command is required for stdio transport";return}if((l.value.transport==="http"||l.value.transport==="sse")&&!l.value.url){m.value="URL is required for HTTP/SSE transport";return}if(n.value){const d=l.value.args.split(" ").map(e=>e.trim()).filter(e=>e.length>0);n.value.emit("mcp:add",{name:l.value.name,transport:l.value.transport,command:l.value.command,args:d,url:l.value.url,scope:l.value.scope})}}function j(d){confirm(`Remove MCP server "${d.name}"?`)&&n.value&&n.value.emit("mcp:remove",{name:d.name})}return K(()=>{$()}),O(()=>{n.value&&n.value.disconnect()}),(d,e)=>{const F=B,y=q,g=D,P=H,C=z,A=G;return u(),r("div",X,[t("div",Y,[t("div",Z,[s(F,{class:"text-sm opacity-50 hover:opacity-100",to:"/"},{default:i(()=>[...e[11]||(e[11]=[a(" ← Chat ",-1)])]),_:1}),t("h1",h,[s(y,{class:"text-blue",icon:"carbon:plug"}),e[12]||(e[12]=a(" MCP Servers ",-1))])]),t("div",ee,[s(g,{disabled:!k.value,n:"blue",onClick:e[0]||(e[0]=o=>f.value=!0)},{default:i(()=>[s(y,{class:"mr-1",icon:"carbon:add"}),e[13]||(e[13]=a(" Add Server ",-1))]),_:1},8,["disabled"]),s(g,{disabled:!k.value||c.value,n:"gray",onClick:N},{default:i(()=>[s(y,{class:Q([{"animate-spin":c.value},"mr-1"]),icon:"carbon:restart"},null,8,["class"]),e[14]||(e[14]=a(" Refresh ",-1))]),_:1},8,["disabled"])])]),t("div",te,[t("div",le,[s(P,{class:"text-sm",icon:"carbon:information",n:"blue"},{default:i(()=>[...e[15]||(e[15]=[a(" Model Context Protocol (MCP) servers extend Claude's capabilities with custom tools and data sources. ",-1)])]),_:1}),f.value?(u(),r("div",oe,[e[29]||(e[29]=t("h3",{class:"font-bold mb-4"}," Add MCP Server ",-1)),m.value?(u(),r("div",se,[s(P,{icon:"carbon:warning",n:"red"},{default:i(()=>[a(v(m.value),1)]),_:1})])):V("",!0),t("div",ne,[t("div",null,[e[16]||(e[16]=t("label",{class:"block text-sm font-medium mb-1"},"Name",-1)),s(C,{modelValue:l.value.name,"onUpdate:modelValue":e[1]||(e[1]=o=>l.value.name=o),class:"w-full",placeholder:"e.g. github, nuxt-ui-remote"},null,8,["modelValue"])]),t("div",null,[e[20]||(e[20]=t("label",{class:"block text-sm font-medium mb-1"},"Transport",-1)),t("div",ae,[t("label",re,[b(t("input",{"onUpdate:modelValue":e[2]||(e[2]=o=>l.value.transport=o),name:"transport",type:"radio",value:"stdio"},null,512),[[x,l.value.transport]]),e[17]||(e[17]=t("span",null,"stdio",-1))]),t("label",ue,[b(t("input",{"onUpdate:modelValue":e[3]||(e[3]=o=>l.value.transport=o),name:"transport",type:"radio",value:"http"},null,512),[[x,l.value.transport]]),e[18]||(e[18]=t("span",null,"HTTP",-1))]),t("label",ie,[b(t("input",{"onUpdate:modelValue":e[4]||(e[4]=o=>l.value.transport=o),name:"transport",type:"radio",value:"sse"},null,512),[[x,l.value.transport]]),e[19]||(e[19]=t("span",null,"SSE",-1))])])]),l.value.transport==="stdio"?(u(),r(S,{key:0},[t("div",null,[e[21]||(e[21]=t("label",{class:"block text-sm font-medium mb-1"},"Command",-1)),s(C,{modelValue:l.value.command,"onUpdate:modelValue":e[5]||(e[5]=o=>l.value.command=o),class:"w-full font-mono",placeholder:"e.g. npx"},null,8,["modelValue"])]),t("div",null,[e[22]||(e[22]=t("label",{class:"block text-sm font-medium mb-1"},"Arguments",-1)),s(C,{modelValue:l.value.args,"onUpdate:modelValue":e[6]||(e[6]=o=>l.value.args=o),class:"w-full font-mono",placeholder:"e.g. -y @modelcontextprotocol/server-github"},null,8,["modelValue"])])],64)):V("",!0),l.value.transport==="http"||l.value.transport==="sse"?(u(),r("div",de,[e[23]||(e[23]=t("label",{class:"block text-sm font-medium mb-1"},"URL",-1)),s(C,{modelValue:l.value.url,"onUpdate:modelValue":e[7]||(e[7]=o=>l.value.url=o),class:"w-full font-mono",placeholder:"e.g. https://ui.nuxt.com/mcp"},null,8,["modelValue"])])):V("",!0),t("div",null,[e[26]||(e[26]=t("label",{class:"block text-sm font-medium mb-1"},"Scope",-1)),t("div",me,[t("label",pe,[b(t("input",{"onUpdate:modelValue":e[8]||(e[8]=o=>l.value.scope=o),name:"scope",type:"radio",value:"local"},null,512),[[x,l.value.scope]]),e[24]||(e[24]=t("span",null,"Local (this project)",-1))]),t("label",ve,[b(t("input",{"onUpdate:modelValue":e[9]||(e[9]=o=>l.value.scope=o),name:"scope",type:"radio",value:"global"},null,512),[[x,l.value.scope]]),e[25]||(e[25]=t("span",null,"User (all projects)",-1))])])]),t("div",ce,[s(g,{n:"green",onClick:L},{default:i(()=>[...e[27]||(e[27]=[a(" Add Server ",-1)])]),_:1}),s(g,{n:"gray",onClick:e[10]||(e[10]=o=>{f.value=!1,M()})},{default:i(()=>[...e[28]||(e[28]=[a(" Cancel ",-1)])]),_:1})])])])):V("",!0),U.value.length===0&&!f.value&&!c.value?(u(),r("div",fe,' No MCP servers configured. Click "Add Server" to get started. ')):(u(),r("div",ge,[(u(!0),r(S,null,W(U.value,o=>(u(),r("div",{key:o.name,class:"n-bg-active rounded-lg p-4 flex items-center justify-between"},[t("div",null,[t("div",be,[a(v(o.name)+" ",1),s(A,{n:o.transport==="stdio"?"gray":"blue",class:"text-xs"},{default:i(()=>[a(v(o.transport),1)]),_:2},1032,["n"]),s(A,{n:o.scope==="local"?"green":"purple",class:"text-xs"},{default:i(()=>[a(v(o.scope),1)]),_:2},1032,["n"])]),t("div",xe,[o.transport==="stdio"?(u(),r(S,{key:0},[a(v(o.command)+" "+v(o.args?.join(" ")),1)],64)):(u(),r(S,{key:1},[a(v(o.url),1)],64))])]),s(g,{n:"red",onClick:ke=>j(o)},{default:i(()=>[s(y,{icon:"carbon:trash-can"})]),_:1},8,["onClick"])]))),128))]))])])])}}});export{Ue as default};