// @bun
// src/components/docs/intent/SpecDrivenDevelopmentPage.tsx
import { specDrivenDevelopmentBrief } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
import { SeoOptimizer } from "@contractspec/lib.content-gen/seo";
import { CodeBlock } from "@contractspec/lib.design-system";
import Link from "@contractspec/lib.ui-link";
import { ChevronRight } from "lucide-react";
import { jsx, jsxs } from "react/jsx-runtime";
var metadata = new SeoOptimizer().optimize(specDrivenDevelopmentBrief);
function SpecDrivenDevelopmentPage() {
  return /* @__PURE__ */ jsxs("div", {
    className: "space-y-8",
    children: [
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-3",
        children: [
          /* @__PURE__ */ jsx("h1", {
            className: "text-4xl font-bold",
            children: specDrivenDevelopmentBrief.title
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground text-lg",
            children: specDrivenDevelopmentBrief.summary
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "card-subtle space-y-4 p-6",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "Why Spec-driven?"
          }),
          /* @__PURE__ */ jsx("ul", {
            className: "text-muted-foreground space-y-2 text-sm",
            children: specDrivenDevelopmentBrief.problems.map((problem, index) => /* @__PURE__ */ jsx("li", {
              children: problem
            }, index))
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "card-subtle space-y-4 p-6",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "Benefits"
          }),
          /* @__PURE__ */ jsx("ul", {
            className: "text-muted-foreground space-y-2 text-sm",
            children: specDrivenDevelopmentBrief.solutions.map((solution, index) => /* @__PURE__ */ jsx("li", {
              children: solution
            }, index))
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-6",
        children: [
          /* @__PURE__ */ jsxs("div", {
            className: "space-y-3",
            children: [
              /* @__PURE__ */ jsx("h2", {
                className: "text-2xl font-bold",
                children: "Feature Specification Example"
              }),
              /* @__PURE__ */ jsx("p", {
                className: "text-muted-foreground text-sm",
                children: "Define a complete feature with operations, events, and data models."
              }),
              /* @__PURE__ */ jsx(CodeBlock, {
                language: "typescript",
                filename: "src/contracts/user-management.feature.ts",
                code: `import { defineFeature } from '@contractspec/lib.contracts-spec/features';
import { defineOperation } from '@contractspec/lib.contracts-spec/operations';
import { defineEvent } from '@contractspec/lib.contracts-spec/events';
import { SchemaModel, ScalarTypeEnum } from '@contractspec/lib.schema';

export const UserManagementFeature = defineFeature({
  goal: 'Complete user management system with CRUD operations',
  context: 'Handles user lifecycle from creation to deletion with proper authorization',
  operations: {
    createUser: defineOperation({
      goal: 'Create a new user account',
      input: new SchemaModel({
        type: 'object',
        properties: {
          email: { type: 'string', format: 'email', required: true },
          name: { type: 'string', minLength: 1, required: true },
        },
      }),
      output: new SchemaModel({
        type: 'object',
        properties: {
          id: { type: 'string', required: true },
          email: { type: 'string', required: true },
          name: { type: 'string', required: true },
        },
      }),
    }),
    updateUser: defineOperation({
      goal: 'Update existing user information',
      input: new SchemaModel({
        type: 'object',
        properties: {
          name: { type: 'string', minLength: 1 },
        },
      }),
      output: new SchemaModel({
        type: 'object',
        properties: {
          id: { type: 'string', required: true },
          email: { type: 'string', required: true },
          name: { type: 'string', required: true },
        },
      }),
    }),
  },
  events: {
    userCreated: defineEvent({
      goal: 'Emit when a new user is created',
      payload: new SchemaModel({
        type: 'object',
        properties: {
          userId: { type: 'string', required: true },
          email: { type: 'string', required: true },
        },
      }),
    }),
    userUpdated: defineEvent({
      goal: 'Emit when user information changes',
      payload: new SchemaModel({
        type: 'object',
        properties: {
          userId: { type: 'string', required: true },
          changes: { type: 'array', items: { type: 'string' }, required: true },
        },
      }),
    }),
  },
  metadata: {
    name: 'user-management',
    version: '1.0.0',
    description: 'Complete user management with operations and events',
  },
});`
              })
            ]
          }),
          /* @__PURE__ */ jsxs("div", {
            className: "space-y-3",
            children: [
              /* @__PURE__ */ jsx("h2", {
                className: "text-2xl font-bold",
                children: "Generate Type-safe Implementations"
              }),
              /* @__PURE__ */ jsx("p", {
                className: "text-muted-foreground text-sm",
                children: "Generate validation, types, and API handlers from your feature."
              }),
              /* @__PURE__ */ jsx(CodeBlock, {
                language: "bash",
                filename: "generate-from-feature",
                code: `contractspec generate \\
  --input ./src/contracts/user-management.feature.ts \\
  --output ./generated/user-management`
              })
            ]
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "flex items-center gap-4 pt-4",
        children: [
          /* @__PURE__ */ jsxs(Link, {
            href: "/docs/guides/spec-validation-and-typing",
            className: "btn-primary",
            children: [
              "Type Safety Guide ",
              /* @__PURE__ */ jsx(ChevronRight, {
                size: 16
              })
            ]
          }),
          /* @__PURE__ */ jsx(Link, {
            href: "/docs/intent/deterministic-codegen",
            className: "btn-ghost",
            children: "Deterministic Codegen"
          })
        ]
      })
    ]
  });
}
export {
  metadata,
  SpecDrivenDevelopmentPage
};
