// @bun
// src/components/docs/shared/StudioPrompt.tsx
import Link from "@contractspec/lib.ui-link";
import { jsx, jsxs } from "react/jsx-runtime";
function StudioPrompt({
  title = "Want to turn product signals into spec-first deliverables?",
  body = "ContractSpec Studio ingests evidence from meetings, support, analytics, docs, and code, then compiles decisions into spec diffs and task packs.",
  ctaLabel = "Try Studio",
  href = "https://www.contractspec.studio"
}) {
  return /* @__PURE__ */ jsxs("div", {
    className: "card-subtle space-y-3 p-6",
    children: [
      /* @__PURE__ */ jsx("h3", {
        className: "text-lg font-semibold",
        children: title
      }),
      /* @__PURE__ */ jsx("p", {
        className: "text-muted-foreground text-sm",
        children: body
      }),
      /* @__PURE__ */ jsx(Link, {
        href,
        className: "btn-primary",
        children: ctaLabel
      })
    ]
  });
}

// src/components/docs/guides/GuideSpecValidationTypingPage.tsx
import { CodeBlock } from "@contractspec/lib.design-system";
import Link2 from "@contractspec/lib.ui-link";
import { ChevronRight } from "lucide-react";
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
function GuideSpecValidationTypingPage() {
  return /* @__PURE__ */ jsxs2("div", {
    className: "space-y-8",
    children: [
      /* @__PURE__ */ jsxs2("div", {
        className: "space-y-3",
        children: [
          /* @__PURE__ */ jsx2("h1", {
            className: "text-4xl font-bold",
            children: "Spec-driven validation + typing"
          }),
          /* @__PURE__ */ jsx2("p", {
            className: "text-muted-foreground text-lg",
            children: "Define a single operation with SchemaModel, generate validation, and keep your existing handler logic."
          })
        ]
      }),
      /* @__PURE__ */ jsxs2("div", {
        className: "card-subtle space-y-4 p-6",
        children: [
          /* @__PURE__ */ jsx2("h2", {
            className: "text-2xl font-bold",
            children: "What you'll build"
          }),
          /* @__PURE__ */ jsxs2("ul", {
            className: "text-muted-foreground space-y-2 text-sm",
            children: [
              /* @__PURE__ */ jsx2("li", {
                children: "One command spec with explicit input/output models."
              }),
              /* @__PURE__ */ jsx2("li", {
                children: "Validation + typing without rewriting your service layer."
              }),
              /* @__PURE__ */ jsx2("li", {
                children: "Clear acceptance scenarios for regression safety."
              })
            ]
          })
        ]
      }),
      /* @__PURE__ */ jsxs2("div", {
        className: "space-y-6",
        children: [
          /* @__PURE__ */ jsxs2("div", {
            className: "space-y-3",
            children: [
              /* @__PURE__ */ jsx2("h2", {
                className: "text-2xl font-bold",
                children: "1) Define the spec"
              }),
              /* @__PURE__ */ jsxs2("p", {
                className: "text-muted-foreground text-sm",
                children: [
                  "Create ",
                  /* @__PURE__ */ jsx2("code", {
                    children: "src/contracts/contact-create.operation.ts"
                  }),
                  ":"
                ]
              }),
              /* @__PURE__ */ jsx2(CodeBlock, {
                language: "typescript",
                filename: "src/contracts/contact-create.operation.ts",
                code: `import { defineCommand } from "@contractspec/lib.contracts-spec/operations";
import { SchemaModel, ScalarTypeEnum } from "@contractspec/lib.schema";

const ContactInput = new SchemaModel({
  name: "ContactInput",
  fields: {
    email: { type: ScalarTypeEnum.Email(), isOptional: false },
    firstName: { type: ScalarTypeEnum.NonEmptyString(), isOptional: false },
    lastName: { type: ScalarTypeEnum.NonEmptyString(), isOptional: false },
  },
});

const ContactOutput = new SchemaModel({
  name: "ContactOutput",
  fields: {
    id: { type: ScalarTypeEnum.String(), isOptional: false },
    email: { type: ScalarTypeEnum.Email(), isOptional: false },
    createdAt: { type: ScalarTypeEnum.DateTime(), isOptional: false },
  },
});

export const ContactCreateCommand = defineCommand({
  meta: {
    key: "contact.create",
    version: "1.0.0",
    description: "Create a CRM contact",
    owners: ["@sales"],
    tags: ["crm", "contacts"],
  },
  io: {
    input: ContactInput,
    output: ContactOutput,
  },
  policy: {
    auth: "user",
  },
  acceptance: {
    scenarios: [
      {
        key: "create-contact",
        given: ["User is authenticated"],
        when: ["ContactCreateCommand executes"],
        then: ["Contact is persisted", "Email is validated"],
      },
    ],
  },
});`
              })
            ]
          }),
          /* @__PURE__ */ jsxs2("div", {
            className: "space-y-3",
            children: [
              /* @__PURE__ */ jsx2("h2", {
                className: "text-2xl font-bold",
                children: "2) Wire the handler"
              }),
              /* @__PURE__ */ jsx2("p", {
                className: "text-muted-foreground text-sm",
                children: "Keep your existing code. Just ensure the handler returns the output shape defined above."
              }),
              /* @__PURE__ */ jsx2(CodeBlock, {
                language: "typescript",
                filename: "src/handlers/contact-create.ts",
                code: `import { ContactCreateCommand } from "@/contracts/contact-create.operation";
 
 export async function handleContactCreate(
   input: (typeof ContactCreateCommand)["io"]["input"],
   ctx: { userId: string }
 ) {
   // Your existing persistence logic
   return {
     id: "contact_123",
     email: input.email,
     createdAt: new Date().toISOString(),
   };
 }`
              })
            ]
          }),
          /* @__PURE__ */ jsxs2("div", {
            className: "space-y-3",
            children: [
              /* @__PURE__ */ jsx2("h2", {
                className: "text-2xl font-bold",
                children: "3) Validate"
              }),
              /* @__PURE__ */ jsx2(CodeBlock, {
                language: "bash",
                filename: "spec-validation",
                code: `contractspec validate src/contracts/contact-create.operation.ts`
              }),
              /* @__PURE__ */ jsxs2("p", {
                className: "text-muted-foreground text-sm",
                children: [
                  "Expected output: ",
                  /* @__PURE__ */ jsx2("code", {
                    children: "Validation passed"
                  }),
                  "."
                ]
              })
            ]
          }),
          /* @__PURE__ */ jsxs2("div", {
            className: "card-subtle space-y-3 p-6",
            children: [
              /* @__PURE__ */ jsx2("h3", {
                className: "text-lg font-semibold",
                children: "Example package"
              }),
              /* @__PURE__ */ jsx2("p", {
                className: "text-muted-foreground text-sm",
                children: "The CRM Pipeline example includes real specs, handlers, and presentations for contact + deal flows."
              }),
              /* @__PURE__ */ jsx2(CodeBlock, {
                language: "bash",
                filename: "crm-example",
                code: `# Build + validate the CRM pipeline example
cd packages/examples/crm-pipeline
bun install
bun run build
bun run validate`
              })
            ]
          }),
          /* @__PURE__ */ jsx2(StudioPrompt, {
            title: "Need validation tied to real outcomes?",
            body: "Studio links checks to evidence, focus decisions, and post-release verification so specs evolve with product truth."
          })
        ]
      }),
      /* @__PURE__ */ jsxs2("div", {
        className: "flex items-center gap-4 pt-4",
        children: [
          /* @__PURE__ */ jsxs2(Link2, {
            href: "/docs/guides/generate-docs-clients-schemas",
            className: "btn-primary",
            children: [
              "Next: Generate docs + clients ",
              /* @__PURE__ */ jsx2(ChevronRight, {
                size: 16
              })
            ]
          }),
          /* @__PURE__ */ jsx2(Link2, {
            href: "/docs/guides",
            className: "btn-ghost",
            children: "Back to guides"
          })
        ]
      })
    ]
  });
}
export {
  GuideSpecValidationTypingPage
};
