import { jsxs as t, jsx as e } from "react/jsx-runtime";
import { H as i, C as o, a as s, T as r, c as n, K as c } from "../index-sdOMz8GW.js";
import { Settings as a, AlertTriangle as l } from "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
const f = () => /* @__PURE__ */ t("div", { className: "flex flex-col gap-8", children: [
  /* @__PURE__ */ e(
    i,
    {
      title: "Client Configuration",
      description: "Connect the MCP server to your preferred AI assistant. Supports VS Code, Cursor, Claude Desktop, and any MCP-compatible client.",
      icon: /* @__PURE__ */ e("div", { className: "w-16 h-16 sm:w-20 sm:h-20 bg-linear-to-br from-indigo-500 to-blue-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(a, { className: "w-8 h-8 sm:w-10 sm:h-10 text-white" }) })
    }
  ),
  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "VS Code (GitHub Copilot / Continue)", children: [
    /* @__PURE__ */ t(r, { className: "text-sm text-foreground/70 mb-3", children: [
      "Create",
      " ",
      /* @__PURE__ */ e("code", { className: "px-1.5 py-0.5 bg-muted rounded text-xs font-mono", children: ".vscode/mcp.json" }),
      " ",
      "in your project root:"
    ] }),
    /* @__PURE__ */ e(
      n,
      {
        code: `{
  "servers": {
    "tucu-ui": {
      "command": "npx",
      "args": ["@e-burgos/tucu-ui-mcp"],
      "env": {}
    }
  }
}`
      }
    )
  ] }) }),
  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Cursor", children: [
    /* @__PURE__ */ t(r, { className: "text-sm text-foreground/70 mb-3", children: [
      "Create",
      " ",
      /* @__PURE__ */ e("code", { className: "px-1.5 py-0.5 bg-muted rounded text-xs font-mono", children: ".cursor/mcp.json" }),
      " ",
      "in your project root:"
    ] }),
    /* @__PURE__ */ e(
      n,
      {
        code: `{
  "mcpServers": {
    "tucu-ui": {
      "command": "npx",
      "args": ["@e-burgos/tucu-ui-mcp"],
      "env": {}
    }
  }
}`
      }
    )
  ] }) }),
  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Claude Desktop", children: [
    /* @__PURE__ */ e(r, { className: "text-sm text-foreground/70 mb-3", children: "Edit the Claude Desktop config file:" }),
    /* @__PURE__ */ t("div", { className: "mb-3", children: [
      /* @__PURE__ */ e(c, { variant: "outline", className: "text-xs", children: "macOS" }),
      /* @__PURE__ */ e(r, { className: "text-xs text-foreground/50 mt-1 font-mono", children: "~/Library/Application Support/Claude/claude_desktop_config.json" })
    ] }),
    /* @__PURE__ */ t("div", { className: "mb-3", children: [
      /* @__PURE__ */ e(c, { variant: "outline", className: "text-xs", children: "Windows" }),
      /* @__PURE__ */ e(r, { className: "text-xs text-foreground/50 mt-1 font-mono", children: "%APPDATA%\\Claude\\claude_desktop_config.json" })
    ] }),
    /* @__PURE__ */ e(
      n,
      {
        code: `{
  "mcpServers": {
    "tucu-ui": {
      "command": "npx",
      "args": ["@e-burgos/tucu-ui-mcp"],
      "env": {}
    }
  }
}`
      }
    )
  ] }) }),
  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Remote HTTP (Fly.io / Self-hosted)", children: [
    /* @__PURE__ */ e(r, { className: "text-sm text-foreground/70 mb-3", children: "Connect to a remote MCP server instance via HTTP+SSE transport:" }),
    /* @__PURE__ */ e(
      n,
      {
        code: `{
  "servers": {
    "tucu-ui-remote": {
      "url": "https://tucu-ui-mcp.fly.dev/sse",
      "headers": {
        "Authorization": "Bearer YOUR_MCP_API_KEY"
      }
    }
  }
}`
      }
    ),
    /* @__PURE__ */ e("div", { className: "mt-3 p-3 rounded-lg border border-amber-500/20 bg-amber-500/5", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
      /* @__PURE__ */ e(l, { className: "w-4 h-4 text-amber-500" }),
      /* @__PURE__ */ e(r, { className: "text-xs text-amber-600 dark:text-amber-400 font-medium", children: "Always use HTTPS and keep your API key secret. Never commit keys to version control." })
    ] }) })
  ] }) }),
  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Verify Connection", children: [
    /* @__PURE__ */ e(r, { className: "text-sm text-foreground/70 mb-3", children: "After configuring, test the connection by asking your AI assistant:" }),
    /* @__PURE__ */ e(
      n,
      {
        code: `// Ask your AI assistant:
"List all tucu-ui components in the 'form' category"

// If configured correctly, the agent will call:
// Tool: list_components({ category: "form" })
// And return real component data from the MCP server`
      }
    )
  ] }) })
] });
export {
  f as default
};
