// @bun
// src/components/docs/guides/GuidesIndexPage.tsx
import { CodeBlock } from "@contractspec/lib.design-system";
import Link from "@contractspec/lib.ui-link";
import { ArrowRight, BookOpen, CheckCircle2 } from "lucide-react";
import { jsx, jsxs } from "react/jsx-runtime";
var guides = [
  {
    title: "Contract types overview",
    description: "Learn about the different contract types and when to use each one.",
    href: "/docs/guides/contract-types",
    time: "15 min"
  },
  {
    title: "Next.js: one endpoint",
    description: "Add ContractSpec to an existing Next.js app by wiring one operation end-to-end.",
    href: "/docs/guides/nextjs-one-endpoint",
    time: "25 min"
  },
  {
    title: "Import existing codebases",
    description: "Convert your existing API endpoints into ContractSpec contracts for fast onboarding.",
    href: "/docs/guides/import-existing-codebases",
    time: "20 min"
  },
  {
    title: "Spec-driven validation + typing",
    description: "Define operations with SchemaModel, generate types, and enforce validation without rewrites.",
    href: "/docs/guides/spec-validation-and-typing",
    time: "20 min"
  },
  {
    title: "Generate docs + client schemas",
    description: "Export docs and OpenAPI for client SDKs and tooling from your specs.",
    href: "/docs/guides/generate-docs-clients-schemas",
    time: "20 min"
  },
  {
    title: "Docs pipeline",
    description: "Wire generated docs into a reference site with a chunked index.",
    href: "/docs/guides/docs-generation-pipeline",
    time: "20 min"
  },
  {
    title: "CI gating with deterministic diffs",
    description: "Add ContractSpec CI checks to gate breaking changes and drift.",
    href: "/docs/guides/ci-contract-diff-gating",
    time: "15 min"
  }
];
function GuidesIndexPage() {
  return /* @__PURE__ */ jsxs("div", {
    className: "space-y-10",
    children: [
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-3",
        children: [
          /* @__PURE__ */ jsx("h1", {
            className: "text-4xl font-bold",
            children: "Guides"
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground text-lg",
            children: "Hands-on guides with commands, expected output, and CI-verified example packages."
          })
        ]
      }),
      /* @__PURE__ */ jsx("div", {
        className: "grid gap-4 md:grid-cols-2",
        children: guides.map((guide) => /* @__PURE__ */ jsxs(Link, {
          href: guide.href,
          className: "card-subtle group space-y-3 p-6 transition-colors hover:border-violet-500/50",
          children: [
            /* @__PURE__ */ jsxs("div", {
              className: "flex items-center justify-between",
              children: [
                /* @__PURE__ */ jsx("h2", {
                  className: "text-xl font-semibold transition-colors group-hover:text-violet-400",
                  children: guide.title
                }),
                /* @__PURE__ */ jsx(ArrowRight, {
                  className: "text-violet-400",
                  size: 18
                })
              ]
            }),
            /* @__PURE__ */ jsx("p", {
              className: "text-muted-foreground text-sm",
              children: guide.description
            }),
            /* @__PURE__ */ jsxs("div", {
              className: "text-muted-foreground flex items-center gap-2 text-xs",
              children: [
                /* @__PURE__ */ jsx(CheckCircle2, {
                  size: 14
                }),
                /* @__PURE__ */ jsxs("span", {
                  children: [
                    "Target time: ",
                    guide.time
                  ]
                })
              ]
            })
          ]
        }, guide.href))
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "card-subtle space-y-4 p-6",
        children: [
          /* @__PURE__ */ jsxs("div", {
            className: "flex items-center gap-2 text-sm font-semibold tracking-[0.2em] text-violet-400 uppercase",
            children: [
              /* @__PURE__ */ jsx(BookOpen, {
                size: 16
              }),
              "How to use the guides"
            ]
          }),
          /* @__PURE__ */ jsxs("ul", {
            className: "text-muted-foreground space-y-2 text-sm",
            children: [
              /* @__PURE__ */ jsx("li", {
                children: "Run each guide in a fresh branch or sandbox workspace."
              }),
              /* @__PURE__ */ jsx("li", {
                children: "Use the linked example package to validate end-to-end."
              }),
              /* @__PURE__ */ jsx("li", {
                children: "Keep the commands as written to match CI expectations."
              })
            ]
          }),
          /* @__PURE__ */ jsx(CodeBlock, {
            language: "bash",
            filename: "guides-quickstart",
            code: `# list all examples
contractspec examples list

# validate example packages in this repo
contractspec examples validate --repo-root .`
          })
        ]
      })
    ]
  });
}
export {
  GuidesIndexPage
};
