import { jsxs as s, jsx as e } from "react/jsx-runtime";
import { Link as c } from "react-router-dom";
import { Package as d, Database as b, Code as f, Terminal as m, Wrench as N, Server as w, Settings as p, Globe as y, Download as S, Monitor as C, Check as u, AlertTriangle as k, ArrowRight as h, ExternalLink as q, CheckCircle as T, Copy as I } from "lucide-react";
import { useState as v } from "react";
import { useTranslation as g } from "react-i18next";
function a({ code: t }) {
  const [o, i] = v(!1);
  return /* @__PURE__ */ s("div", { className: "relative group", children: [
    /* @__PURE__ */ e("pre", { className: "bg-[var(--bg-tertiary)] p-4 rounded-lg text-sm overflow-x-auto", children: /* @__PURE__ */ e("code", { children: t }) }),
    /* @__PURE__ */ e(
      "button",
      {
        onClick: async () => {
          await navigator.clipboard.writeText(t), i(!0), setTimeout(() => i(!1), 2e3);
        },
        className: "absolute top-2 right-2 p-2 rounded bg-[var(--bg-secondary)] opacity-0 group-hover:opacity-100 transition-opacity",
        title: "Copier",
        children: o ? /* @__PURE__ */ e(T, { className: "w-4 h-4 text-green-500" }) : /* @__PURE__ */ e(I, { className: "w-4 h-4" })
      }
    )
  ] });
}
function P({ name: t, version: o, description: i, url: n, required: r, note: l }) {
  const { t: x } = g("docs");
  return /* @__PURE__ */ s(
    "a",
    {
      href: n,
      target: "_blank",
      rel: "noopener noreferrer",
      className: "flex items-start gap-3 p-4 bg-[var(--bg-primary)] rounded-lg border border-[var(--border-color)] hover:border-[var(--color-primary-400)] hover:shadow-md transition-all group",
      children: [
        /* @__PURE__ */ e("div", { className: `w-2 h-2 rounded-full mt-2 flex-shrink-0 ${r ? "bg-red-500" : "bg-gray-400"}` }),
        /* @__PURE__ */ s("div", { className: "flex-1 min-w-0", children: [
          /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
            /* @__PURE__ */ e("span", { className: "font-semibold text-[var(--text-primary)] group-hover:text-[var(--color-primary-600)]", children: t }),
            o && /* @__PURE__ */ e("span", { className: "px-1.5 py-0.5 text-xs rounded bg-[var(--bg-tertiary)] text-[var(--text-tertiary)]", children: o }),
            /* @__PURE__ */ e(q, { className: "w-3 h-3 text-[var(--text-tertiary)] opacity-0 group-hover:opacity-100 transition-opacity" })
          ] }),
          /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-0.5", children: i }),
          l && /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-tertiary)] mt-1 italic", children: l })
        ] }),
        r && /* @__PURE__ */ e("span", { className: "px-2 py-0.5 text-xs rounded bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400 flex-shrink-0", children: x("developer.installation.toolBadges.required") })
      ]
    }
  );
}
function D() {
  const { t } = g("docs"), [o, i] = v("tools"), n = [
    {
      title: t("developer.installation.toolCategories.runtimeSdk.title"),
      icon: d,
      color: "text-blue-500",
      tools: [
        {
          name: ".NET SDK",
          version: "10.0+",
          description: "SDK pour compiler et executer le backend ASP.NET Core",
          url: "https://dotnet.microsoft.com/download/dotnet/10.0",
          required: !0
        },
        {
          name: "Node.js",
          version: "LTS 22+",
          description: "Runtime JavaScript pour le frontend React et les outils npm",
          url: "https://nodejs.org/",
          required: !0,
          note: "npm est inclus avec Node.js"
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.database.title"),
      icon: b,
      color: "text-orange-500",
      tools: [
        {
          name: "SQL Server",
          version: "2019+",
          description: "Systeme de gestion de base de donnees relationnelle",
          url: "https://www.microsoft.com/sql-server/sql-server-downloads",
          required: !0,
          note: "Express edition gratuite suffisante pour le dev"
        },
        {
          name: "SQL Server Management Studio",
          version: "SSMS 20+",
          description: "Interface graphique pour administrer SQL Server",
          url: "https://learn.microsoft.com/sql/ssms/download-sql-server-management-studio-ssms",
          required: !1,
          note: "Recommande pour visualiser les donnees"
        },
        {
          name: "Azure Data Studio",
          description: "Alternative moderne et legere a SSMS, multi-plateforme",
          url: "https://learn.microsoft.com/sql/azure-data-studio/download-azure-data-studio",
          required: !1
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.ide.title"),
      icon: f,
      color: "text-purple-500",
      tools: [
        {
          name: "Visual Studio 2022",
          version: "Community+",
          description: "IDE complet pour le developpement .NET avec debugger integre",
          url: "https://visualstudio.microsoft.com/downloads/",
          required: !1,
          note: 'Workload "ASP.NET and web development" requis'
        },
        {
          name: "Visual Studio Code",
          description: "Editeur leger et extensible, ideal pour le frontend React",
          url: "https://code.visualstudio.com/",
          required: !0
        },
        {
          name: "JetBrains Rider",
          description: "Alternative premium a Visual Studio avec support .NET + React",
          url: "https://www.jetbrains.com/rider/",
          required: !1
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.versionControl.title"),
      icon: m,
      color: "text-green-500",
      tools: [
        {
          name: "Git",
          version: "2.40+",
          description: "Systeme de controle de version distribue",
          url: "https://git-scm.com/downloads",
          required: !0
        },
        {
          name: "GitHub Desktop",
          description: "Interface graphique pour Git, simplifie les operations courantes",
          url: "https://desktop.github.com/",
          required: !1
        },
        {
          name: "Git Extensions",
          description: "Outil visuel pour Git avec historique graphique",
          url: "https://gitextensions.github.io/",
          required: !1
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.smartstackTools.title"),
      icon: d,
      color: "text-rose-500",
      tools: [
        {
          name: "@atlashub/smartstack-cli",
          version: "1.14+",
          description: "Toolkit Claude Code avec GitFlow, APEX, EF Core, Business Analysis",
          url: "https://www.npmjs.com/package/@atlashub/smartstack-cli",
          required: !0,
          note: "npm install -g @atlashub/smartstack-cli && smartstack install"
        },
        {
          name: "@atlashub/smartstack-mcp",
          version: "1.15+",
          description: "Serveur MCP pour validation, scaffolding, migrations",
          url: "https://www.npmjs.com/package/@atlashub/smartstack-mcp",
          required: !0,
          note: "npm install -g @atlashub/smartstack-mcp"
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.developmentTools.title"),
      icon: N,
      color: "text-amber-500",
      tools: [
        {
          name: "Claude Code CLI",
          description: "Assistant IA pour le developpement avec commandes automatisees",
          url: "https://docs.anthropic.com/en/docs/claude-code",
          required: !0,
          note: "Indispensable pour les commandes /gitflow, /efcore, etc."
        },
        {
          name: "Postman",
          description: "Client API pour tester les endpoints REST",
          url: "https://www.postman.com/downloads/",
          required: !1
        },
        {
          name: "Docker Desktop",
          description: "Conteneurisation pour environnements isoles",
          url: "https://www.docker.com/products/docker-desktop/",
          required: !1,
          note: "Utile pour SQL Server sur macOS/Linux"
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.claudeCodeDependencies.title"),
      icon: m,
      color: "text-violet-500",
      tools: [
        {
          name: "Node.js (pour Claude Code)",
          version: "18+",
          description: "Runtime necessaire pour executer Claude Code CLI",
          url: "https://nodejs.org/",
          required: !0,
          note: "Claude Code necessite Node.js 18 ou superieur"
        },
        {
          name: "npm ou pnpm",
          description: "Gestionnaire de paquets pour installer Claude Code globalement",
          url: "https://www.npmjs.com/",
          required: !0,
          note: "npm install -g @anthropic-ai/claude-code"
        },
        {
          name: "Cle API Anthropic",
          description: "Cle d'authentification pour utiliser Claude Code",
          url: "https://console.anthropic.com/settings/keys",
          required: !0,
          note: "Creer un compte Anthropic et generer une cle API"
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.mcpServers.title"),
      icon: w,
      color: "text-pink-500",
      tools: [
        {
          name: "SmartStack MCP",
          version: "1.15+",
          description: "Validation conventions, scaffolding, migrations, tests SmartStack",
          url: "https://www.npmjs.com/package/@atlashub/smartstack-mcp",
          required: !0,
          note: "claude mcp add smartstack -- npx @atlashub/smartstack-mcp"
        },
        {
          name: "Context7 MCP",
          description: "Acces a la documentation technique en temps reel (React, .NET, etc.)",
          url: "https://github.com/upstash/context7",
          required: !0,
          note: "Fournit la documentation a jour des frameworks"
        },
        {
          name: "Filesystem MCP",
          description: "Acces securise au systeme de fichiers local",
          url: "https://github.com/anthropics/mcp-servers/tree/main/src/filesystem",
          required: !1,
          note: "Inclus par defaut avec Claude Code"
        },
        {
          name: "GitHub MCP",
          description: "Integration avec GitHub pour issues, PRs et repositories",
          url: "https://github.com/anthropics/mcp-servers/tree/main/src/github",
          required: !1,
          note: "Necessite un token GitHub personnel"
        },
        {
          name: "PostgreSQL MCP",
          description: "Connexion directe aux bases PostgreSQL",
          url: "https://github.com/anthropics/mcp-servers/tree/main/src/postgres",
          required: !1
        },
        {
          name: "Brave Search MCP",
          description: "Recherche web via Brave Search API",
          url: "https://github.com/anthropics/mcp-servers/tree/main/src/brave-search",
          required: !1,
          note: "Necessite une cle API Brave Search"
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.vsCodeExtensions.title"),
      icon: p,
      color: "text-cyan-500",
      tools: [
        {
          name: "C# Dev Kit",
          description: "Support complet du langage C# avec IntelliSense",
          url: "https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csdevkit",
          required: !0
        },
        {
          name: "ESLint",
          description: "Linter JavaScript/TypeScript pour detecter les erreurs",
          url: "https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint",
          required: !0
        },
        {
          name: "Prettier",
          description: "Formateur de code automatique",
          url: "https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode",
          required: !1
        },
        {
          name: "Tailwind CSS IntelliSense",
          description: "Autocompletion pour les classes Tailwind",
          url: "https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss",
          required: !1
        },
        {
          name: "REST Client",
          description: "Tester les API directement dans VS Code",
          url: "https://marketplace.visualstudio.com/items?itemName=humao.rest-client",
          required: !1
        },
        {
          name: "GitLens",
          description: "Visualisation avancee de l'historique Git",
          url: "https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens",
          required: !1
        }
      ]
    },
    {
      title: t("developer.installation.toolCategories.browsers.title"),
      icon: y,
      color: "text-indigo-500",
      tools: [
        {
          name: "Google Chrome",
          description: "Navigateur avec DevTools puissants pour le debug frontend",
          url: "https://www.google.com/chrome/",
          required: !0
        },
        {
          name: "React Developer Tools",
          description: "Extension Chrome pour debugger les composants React",
          url: "https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi",
          required: !1
        },
        {
          name: "Firefox Developer Edition",
          description: "Alternative avec outils de dev avances",
          url: "https://www.mozilla.org/firefox/developer/",
          required: !1
        }
      ]
    }
  ];
  return /* @__PURE__ */ s("div", { className: "space-y-8", children: [
    /* @__PURE__ */ s("div", { className: "flex items-center gap-2 text-sm text-[var(--text-secondary)]", children: [
      /* @__PURE__ */ e(c, { to: "/system/docs", className: "hover:text-[var(--color-primary-600)]", children: t("developer.installation.breadcrumb.documentation") }),
      /* @__PURE__ */ e("span", { children: "/" }),
      /* @__PURE__ */ e(c, { to: "/system/docs/developer", className: "hover:text-[var(--color-primary-600)]", children: t("developer.installation.breadcrumb.developer") }),
      /* @__PURE__ */ e("span", { children: "/" }),
      /* @__PURE__ */ e("span", { children: t("developer.installation.breadcrumb.installation") })
    ] }),
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ s("h1", { className: "text-3xl font-bold mb-4 flex items-center gap-3", children: [
        /* @__PURE__ */ e(S, { className: "w-8 h-8 text-[var(--color-primary-600)]" }),
        t("developer.installation.header.title")
      ] }),
      /* @__PURE__ */ e("p", { className: "text-lg text-[var(--text-secondary)]", children: t("developer.installation.header.description") })
    ] }),
    /* @__PURE__ */ s("div", { className: "flex gap-2 p-1 bg-[var(--bg-secondary)] rounded-lg w-fit", children: [
      /* @__PURE__ */ s(
        "button",
        {
          onClick: () => i("tools"),
          className: `px-4 py-2 rounded-md font-medium transition-colors ${o === "tools" ? "bg-[var(--color-primary-600)] text-white" : "text-[var(--text-secondary)] hover:bg-[var(--bg-hover)]"}`,
          children: [
            /* @__PURE__ */ e(C, { className: "w-4 h-4 inline-block mr-2" }),
            t("developer.installation.tabs.tools")
          ]
        }
      ),
      /* @__PURE__ */ s(
        "button",
        {
          onClick: () => i("setup"),
          className: `px-4 py-2 rounded-md font-medium transition-colors ${o === "setup" ? "bg-[var(--color-primary-600)] text-white" : "text-[var(--text-secondary)] hover:bg-[var(--bg-hover)]"}`,
          children: [
            /* @__PURE__ */ e(p, { className: "w-4 h-4 inline-block mr-2" }),
            t("developer.installation.tabs.setup")
          ]
        }
      )
    ] }),
    o === "tools" && /* @__PURE__ */ s("div", { className: "space-y-8", children: [
      /* @__PURE__ */ s("div", { className: "flex items-center gap-6 text-sm", children: [
        /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ e("div", { className: "w-2 h-2 rounded-full bg-red-500" }),
          /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)]", children: t("developer.installation.legend.required") })
        ] }),
        /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ e("div", { className: "w-2 h-2 rounded-full bg-gray-400" }),
          /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)]", children: t("developer.installation.legend.optional") })
        ] })
      ] }),
      n.map((r) => /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-3", children: [
          /* @__PURE__ */ e(r.icon, { className: `w-5 h-5 ${r.color}` }),
          r.title
        ] }),
        /* @__PURE__ */ e("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-3", children: r.tools.map((l) => /* @__PURE__ */ e(P, { ...l }, l.name)) })
      ] }, r.title)),
      /* @__PURE__ */ s("section", { className: "card p-6 bg-gradient-to-r from-[var(--info-bg)] to-transparent border-[var(--info-border)]", children: [
        /* @__PURE__ */ e("h2", { className: "text-xl font-semibold mb-4", children: t("developer.installation.quickInstall.title") }),
        /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mb-4", children: t("developer.installation.quickInstall.description") }),
        /* @__PURE__ */ e(a, { code: `# Installer les outils essentiels
winget install Microsoft.DotNet.SDK.10 --accept-package-agreements
winget install OpenJS.NodeJS.LTS
winget install Git.Git
winget install Microsoft.VisualStudioCode
winget install Microsoft.SQLServer.2022.Express
winget install Microsoft.SQLServerManagementStudio` })
      ] })
    ] }),
    o === "setup" && /* @__PURE__ */ s("div", { className: "space-y-6", children: [
      /* @__PURE__ */ s("section", { className: "card p-6 border-2 border-[var(--color-primary-400)]", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-sm", children: "0" }),
          t("developer.installation.steps.step0.title")
        ] }),
        /* @__PURE__ */ s("p", { className: "text-[var(--text-secondary)] mb-4", children: [
          "SmartStack CLI et MCP sont ",
          /* @__PURE__ */ e("strong", { children: "requis" }),
          " pour utiliser les commandes Claude Code (/gitflow, /efcore, /apex, etc.)."
        ] }),
        /* @__PURE__ */ e("h4", { className: "font-medium mb-2", children: t("developer.installation.steps.step0.subtitle1") }),
        /* @__PURE__ */ e(a, { code: `# SmartStack CLI - Commandes et workflows Claude Code
npm install -g @atlashub/smartstack-cli

# SmartStack MCP - Serveur MCP pour validation et scaffolding
npm install -g @atlashub/smartstack-mcp

# Context7 MCP - Documentation technique en temps reel (optionnel mais recommande)
npm install -g @upstash/context7-mcp` }),
        /* @__PURE__ */ e("h4", { className: "font-medium mt-6 mb-2", children: t("developer.installation.steps.step0.subtitle2") }),
        /* @__PURE__ */ e(a, { code: `# Installer les commandes, agents et hooks
smartstack install

# Verifier l'installation
smartstack status --verbose

# Diagnostic complet
smartstack doctor` }),
        /* @__PURE__ */ e("h4", { className: "font-medium mt-6 mb-2", children: t("developer.installation.steps.step0.subtitle3") }),
        /* @__PURE__ */ e(a, { code: `# SmartStack MCP
claude mcp add smartstack -- npx @atlashub/smartstack-mcp

# Context7 MCP (documentation)
claude mcp add context7 -- npx @upstash/context7-mcp

# Verifier les MCP actifs
claude mcp list` }),
        /* @__PURE__ */ s("div", { className: "mt-4 p-4 bg-[var(--info-bg)] text-[var(--info-text)] rounded-lg flex items-start gap-2", children: [
          /* @__PURE__ */ e(u, { className: "w-5 h-5 flex-shrink-0 mt-0.5" }),
          /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: t("developer.installation.steps.step0.verification") } })
        ] })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-sm", children: "1" }),
          t("developer.installation.steps.step1.title")
        ] }),
        /* @__PURE__ */ e(a, { code: `git clone https://github.com/votre-org/SmartStack.app.git
cd SmartStack.app` })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-sm", children: "2" }),
          t("developer.installation.steps.step2.title")
        ] }),
        /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-4", children: t("developer.installation.steps.step2.subtitle") }),
        /* @__PURE__ */ e("h4", { className: "font-medium mb-2", children: t("developer.installation.steps.step2.configFile") }),
        /* @__PURE__ */ e(
          a,
          {
            code: `{
  "ConnectionStrings": {
    "DefaultConnection": "Server=localhost;Database=SmartStack;Trusted_Connection=True;TrustServerCertificate=True;"
  }
}`
          }
        ),
        /* @__PURE__ */ s("div", { className: "mt-4 p-4 bg-[var(--warning-bg)] text-[var(--warning-text)] rounded-lg flex items-start gap-2", children: [
          /* @__PURE__ */ e(k, { className: "w-5 h-5 flex-shrink-0 mt-0.5" }),
          /* @__PURE__ */ s("div", { children: [
            /* @__PURE__ */ e("strong", { children: "Important:" }),
            " ",
            t("developer.installation.steps.step2.warning")
          ] })
        ] })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-sm", children: "3" }),
          t("developer.installation.steps.step3.title")
        ] }),
        /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-4", children: t("developer.installation.steps.step3.subtitle") }),
        /* @__PURE__ */ e(a, { code: "/efcore:db-deploy" }),
        /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-4", children: t("developer.installation.steps.step3.manual") }),
        /* @__PURE__ */ e(a, { code: "dotnet ef database update -p src/SmartStack.Infrastructure -s src/SmartStack.Api" })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-sm", children: "4" }),
          t("developer.installation.steps.step4.title")
        ] }),
        /* @__PURE__ */ e(a, { code: `cd src/SmartStack.Api
dotnet run` }),
        /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-4", children: t("developer.installation.steps.step4.subtitle") }),
        /* @__PURE__ */ s("ul", { className: "mt-2 text-sm space-y-1", children: [
          /* @__PURE__ */ s("li", { children: [
            /* @__PURE__ */ e("code", { className: "px-1 bg-[var(--bg-secondary)] rounded", children: "http://localhost:5142" }),
            " (",
            t("developer.installation.steps.step4.http"),
            ")"
          ] }),
          /* @__PURE__ */ s("li", { children: [
            /* @__PURE__ */ e("code", { className: "px-1 bg-[var(--bg-secondary)] rounded", children: "https://localhost:7055" }),
            " (",
            t("developer.installation.steps.step4.https"),
            ")"
          ] })
        ] })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-[var(--color-primary-600)] text-white flex items-center justify-center text-sm", children: "5" }),
          t("developer.installation.steps.step5.title")
        ] }),
        /* @__PURE__ */ e(a, { code: `cd web/smartstack-web
npm install
npm run dev` }),
        /* @__PURE__ */ s("p", { className: "text-sm text-[var(--text-secondary)] mt-4", children: [
          t("developer.installation.steps.step5.subtitle"),
          " ",
          /* @__PURE__ */ e("code", { className: "px-1 bg-[var(--bg-secondary)] rounded", children: "http://localhost:5173" })
        ] })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6 bg-gradient-to-r from-[var(--success-bg)] to-transparent border-[var(--success-border)]", children: [
        /* @__PURE__ */ s("h2", { className: "text-xl font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e("span", { className: "w-8 h-8 rounded-full bg-green-600 text-white flex items-center justify-center text-sm", children: "6" }),
          t("developer.installation.steps.step6.title")
        ] }),
        /* @__PURE__ */ e("ul", { className: "space-y-2", children: t("developer.installation.steps.step6.checks", { returnObjects: !0 }).map((r) => /* @__PURE__ */ s("li", { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ e(u, { className: "w-4 h-4 text-green-500" }),
          /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: r } })
        ] }, r)) })
      ] }),
      /* @__PURE__ */ s("section", { className: "card p-6", children: [
        /* @__PURE__ */ e("h2", { className: "text-xl font-semibold mb-4", children: t("developer.installation.troubleshooting.title") }),
        /* @__PURE__ */ s("div", { className: "space-y-4", children: [
          /* @__PURE__ */ s("div", { className: "p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("h4", { className: "font-medium", children: t("developer.installation.troubleshooting.issues.sqlServerError.title") }),
            /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-1", children: t("developer.installation.troubleshooting.issues.sqlServerError.description") })
          ] }),
          /* @__PURE__ */ s("div", { className: "p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("h4", { className: "font-medium", children: t("developer.installation.troubleshooting.issues.portInUse.title") }),
            /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-1", children: t("developer.installation.troubleshooting.issues.portInUse.description") })
          ] }),
          /* @__PURE__ */ s("div", { className: "p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("h4", { className: "font-medium", children: t("developer.installation.troubleshooting.issues.corsError.title") }),
            /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-1", children: t("developer.installation.troubleshooting.issues.corsError.description") })
          ] }),
          /* @__PURE__ */ s("div", { className: "p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("h4", { className: "font-medium", children: t("developer.installation.troubleshooting.issues.npmError.title") }),
            /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)] mt-1", children: t("developer.installation.troubleshooting.issues.npmError.description") })
          ] })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ s("div", { className: "flex justify-between pt-6 border-t border-[var(--border-color)]", children: [
      /* @__PURE__ */ s(
        c,
        {
          to: "/system/docs/developer/infrastructure",
          className: "flex items-center gap-2 text-[var(--text-secondary)] hover:text-[var(--color-primary-600)]",
          children: [
            /* @__PURE__ */ e(h, { className: "w-4 h-4 rotate-180" }),
            t("developer.installation.navigation.previous")
          ]
        }
      ),
      /* @__PURE__ */ s(
        c,
        {
          to: "/system/docs/developer/commands",
          className: "flex items-center gap-2 text-[var(--color-primary-600)] hover:underline",
          children: [
            t("developer.installation.navigation.next"),
            /* @__PURE__ */ e(h, { className: "w-4 h-4" })
          ]
        }
      )
    ] })
  ] });
}
export {
  D as InstallationPage
};
//# sourceMappingURL=InstallationPage-CXKmzZuN.js.map
