@contractspec/bundle.library 1.11.1 → 1.13.0

package/dist/node/components/docs/intent/index.js

@@ -0,0 +1,1594 @@
+// src/components/docs/intent/intent-pages.docblocks.ts
+var contractFirstApiBrief = {
+  title: "Contract-first API",
+  summary: "Design APIs by writing contracts first, then generate consistent implementations across frameworks.",
+  problems: [
+    "API drift between frontend and backend",
+    "Inconsistent error handling across endpoints",
+    "Documentation becomes outdated quickly",
+    "Manual OpenAPI maintenance is error-prone"
+  ],
+  solutions: [
+    "Single source of truth for API contracts",
+    "Generate OpenAPI and SDKs from contracts",
+    "Type-safe request/response validation",
+    "Always-in-sync documentation"
+  ],
+  audience: {
+    role: "API developers",
+    industry: "Software development",
+    maturity: "scaleup"
+  },
+  callToAction: "Start with a simple operation contract",
+  references: [
+    {
+      label: "Next.js One Endpoint Guide",
+      url: "/docs/guides/nextjs-one-endpoint"
+    },
+    {
+      label: "API Reference",
+      url: "/docs/api"
+    }
+  ]
+};
+var specDrivenDevelopmentBrief = {
+  title: "Spec-driven development",
+  summary: "Build features by writing specifications first, then generate type-safe implementations.",
+  problems: [
+    "Feature requirements are ambiguous",
+    "Frontend and backend implementations diverge",
+    "Testing lacks clear contract definitions",
+    "Code reviews focus on style instead of behavior"
+  ],
+  solutions: [
+    "Executable specifications as single source of truth",
+    "Generate type-safe clients from specs",
+    "Automated contract testing",
+    "Clear behavior contracts for teams"
+  ],
+  audience: {
+    role: "Development teams",
+    industry: "Software engineering",
+    maturity: "enterprise"
+  },
+  callToAction: "Define your first feature spec",
+  references: [
+    {
+      label: "Spec Validation + Typing Guide",
+      url: "/docs/guides/spec-validation-and-typing"
+    },
+    {
+      label: "Core Contracts",
+      url: "/docs/core-contracts"
+    }
+  ]
+};
+var deterministicCodegenBrief = {
+  title: "Deterministic codegen",
+  summary: "Regenerate code from contracts without breaking existing functionality or losing customizations.",
+  problems: [
+    "Generated code conflicts with manual changes",
+    "Regeneration loses custom business logic",
+    "Teams avoid regeneration after customization",
+    "Code migration between versions is risky"
+  ],
+  solutions: [
+    "Clear separation of generated vs hand-written code",
+    "Incremental regeneration with conflict detection",
+    "Protected zones for custom logic",
+    "Automatic migration paths"
+  ],
+  audience: {
+    role: "Platform engineers",
+    industry: "Developer tools",
+    maturity: "scaleup"
+  },
+  callToAction: "Try deterministic regeneration",
+  references: [
+    {
+      label: "Generate Docs + Clients Guide",
+      url: "/docs/guides/generate-docs-clients-schemas"
+    },
+    {
+      label: "CLI Reference",
+      url: "/docs/getting-started/cli"
+    }
+  ]
+};
+var schemaValidationTypescriptBrief = {
+  title: "Schema validation TypeScript",
+  summary: "Generate TypeScript types from contracts and validate data at runtime with zero overhead.",
+  problems: [
+    "Runtime type validation is boilerplate-heavy",
+    "Type definitions drift from schemas",
+    "Validation logic scattered across codebase",
+    "Poor error messages for invalid data"
+  ],
+  solutions: [
+    "Auto-generated TypeScript from contracts",
+    "Zod schemas for runtime validation",
+    "Type-safe validation with clear errors",
+    "Single source of schema truth"
+  ],
+  audience: {
+    role: "TypeScript developers",
+    industry: "Web development",
+    maturity: "early"
+  },
+  callToAction: "Generate typed contracts now",
+  references: [
+    {
+      label: "Type Safety Guide",
+      url: "/docs/guides/spec-validation-and-typing"
+    },
+    {
+      label: "Schema Reference",
+      url: "/docs/schemas"
+    }
+  ]
+};
+var openapiAlternativeBrief = {
+  title: "OpenAPI alternative",
+  summary: "A spec-first approach that goes beyond OpenAPI with executable contracts and code generation.",
+  problems: [
+    "OpenAPI is documentation-only",
+    "No type safety from OpenAPI specs",
+    "Manual SDK generation is complex",
+    "Cannot validate implementations against OpenAPI"
+  ],
+  solutions: [
+    "Executable contracts with validation",
+    "Generate multiple outputs from one spec",
+    "Type-safe by default",
+    "Built-in testing and validation"
+  ],
+  audience: {
+    role: "API architects",
+    industry: "Enterprise software",
+    maturity: "enterprise"
+  },
+  callToAction: "Compare with OpenAPI approach",
+  references: [
+    {
+      label: "Generate OpenAPI from Contracts",
+      url: "/docs/guides/generate-docs-clients-schemas"
+    },
+    {
+      label: "Contract vs OpenAPI",
+      url: "/docs/comparison/openapi"
+    }
+  ]
+};
+var generateClientFromSchemaBrief = {
+  title: "Generate client from schema",
+  summary: "Automatically generate type-safe API clients in any language from your contracts.",
+  problems: [
+    "Writing API clients is repetitive",
+    "Manual clients have type mismatches",
+    "Keeping clients in sync with APIs",
+    "Language-specific client maintenance"
+  ],
+  solutions: [
+    "Generate clients for multiple languages",
+    "Type-safe request/response handling",
+    "Automatic client updates from contracts",
+    "Consistent error handling across languages"
+  ],
+  audience: {
+    role: "Full-stack developers",
+    industry: "Software development",
+    maturity: "scaleup"
+  },
+  callToAction: "Generate your first API client",
+  references: [
+    {
+      label: "Client Generation Guide",
+      url: "/docs/guides/generate-docs-clients-schemas"
+    },
+    {
+      label: "Supported Languages",
+      url: "/docs/integrations"
+    }
+  ]
+};
+
+// src/components/docs/intent/ContractFirstApiPage.tsx
+import { contractFirstApiBrief as contractFirstApiBrief2 } 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 { jsxDEV } from "react/jsx-dev-runtime";
+var metadata = new SeoOptimizer().optimize(contractFirstApiBrief2);
+function ContractFirstApiPage() {
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV("h1", {
+            className: "text-4xl font-bold",
+            children: contractFirstApiBrief2.title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("p", {
+            className: "text-muted-foreground text-lg",
+            children: contractFirstApiBrief2.summary
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV("h2", {
+            className: "text-2xl font-bold",
+            children: "Problems Solved"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: contractFirstApiBrief2.problems.map((problem, index) => /* @__PURE__ */ jsxDEV("li", {
+              children: problem
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV("h2", {
+            className: "text-2xl font-bold",
+            children: "Solutions"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: contractFirstApiBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsxDEV("li", {
+              children: solution
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV("h2", {
+                className: "text-2xl font-bold",
+                children: "Quick Start"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Define your first API contract and generate consistent implementations."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV(CodeBlock, {
+                language: "typescript",
+                filename: "src/contracts/user-create.operation.ts",
+                code: `import { defineOperation } from '@contractspec/lib.contracts/operations';
+import { SchemaModel, ScalarTypeEnum } from '@contractspec/lib.schema';
+
+export const CreateUserOperation = defineOperation({
+  goal: 'Create a new user account with validation',
+  context: 'Used by frontend registration forms and internal admin tools',
+  input: new SchemaModel({
+    type: 'object',
+    properties: {
+      email: {
+        type: 'string',
+        format: 'email',
+        required: true,
+      },
+      password: {
+        type: 'string',
+        minLength: 8,
+        required: true,
+      },
+    },
+  }),
+  output: new SchemaModel({
+    type: 'object',
+    properties: {
+      id: { type: 'string', required: true },
+      email: { type: 'string', required: true },
+      createdAt: { type: 'string', format: 'date-time', required: true },
+    },
+  }),
+  metadata: {
+    name: 'createUser',
+    tags: ['users', 'auth'],
+    description: 'Create a new user account with email and password',
+  },
+});`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV("h2", {
+                className: "text-2xl font-bold",
+                children: "Generate OpenAPI"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Export OpenAPI documentation directly from your contracts."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV(CodeBlock, {
+                language: "bash",
+                filename: "export-openapi",
+                code: `contractspec openapi export \\
+  --registry ./src/contracts/registry.ts \\
+  --out ./openapi.json`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxDEV(Link, {
+            href: "/docs/guides/nextjs-one-endpoint",
+            className: "btn-primary",
+            children: [
+              "Next.js Guide ",
+              /* @__PURE__ */ jsxDEV(ChevronRight, {
+                size: 16
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV(Link, {
+            href: "/docs/intent/spec-driven-development",
+            className: "btn-ghost",
+            children: "Spec-driven Development"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// src/components/docs/intent/SpecDrivenDevelopmentPage.tsx
+import { specDrivenDevelopmentBrief as specDrivenDevelopmentBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+import { SeoOptimizer as SeoOptimizer2 } from "@contractspec/lib.content-gen/seo";
+import { CodeBlock as CodeBlock2 } from "@contractspec/lib.design-system";
+import Link2 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight2 } from "lucide-react";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var metadata2 = new SeoOptimizer2().optimize(specDrivenDevelopmentBrief2);
+function SpecDrivenDevelopmentPage() {
+  return /* @__PURE__ */ jsxDEV2("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxDEV2("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV2("h1", {
+            className: "text-4xl font-bold",
+            children: specDrivenDevelopmentBrief2.title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV2("p", {
+            className: "text-muted-foreground text-lg",
+            children: specDrivenDevelopmentBrief2.summary
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV2("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV2("h2", {
+            className: "text-2xl font-bold",
+            children: "Why Spec-driven?"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV2("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: specDrivenDevelopmentBrief2.problems.map((problem, index) => /* @__PURE__ */ jsxDEV2("li", {
+              children: problem
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV2("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV2("h2", {
+            className: "text-2xl font-bold",
+            children: "Benefits"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV2("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: specDrivenDevelopmentBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsxDEV2("li", {
+              children: solution
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV2("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxDEV2("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV2("h2", {
+                className: "text-2xl font-bold",
+                children: "Feature Specification Example"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Define a complete feature with operations, events, and data models."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2(CodeBlock2, {
+                language: "typescript",
+                filename: "src/contracts/user-management.feature.ts",
+                code: `import { defineFeature } from '@contractspec/lib.contracts/features';
+import { defineOperation } from '@contractspec/lib.contracts/operations';
+import { defineEvent } from '@contractspec/lib.contracts/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',
+  },
+});`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV2("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV2("h2", {
+                className: "text-2xl font-bold",
+                children: "Generate Type-safe Implementations"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Generate validation, types, and API handlers from your feature."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2(CodeBlock2, {
+                language: "bash",
+                filename: "generate-from-feature",
+                code: `contractspec generate \\
+  --input ./src/contracts/user-management.feature.ts \\
+  --output ./generated/user-management`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV2("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxDEV2(Link2, {
+            href: "/docs/guides/spec-validation-and-typing",
+            className: "btn-primary",
+            children: [
+              "Type Safety Guide ",
+              /* @__PURE__ */ jsxDEV2(ChevronRight2, {
+                size: 16
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV2(Link2, {
+            href: "/docs/intent/deterministic-codegen",
+            className: "btn-ghost",
+            children: "Deterministic Codegen"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// src/components/docs/intent/DeterministicCodegenPage.tsx
+import { deterministicCodegenBrief as deterministicCodegenBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+import { SeoOptimizer as SeoOptimizer3 } from "@contractspec/lib.content-gen/seo";
+import { CodeBlock as CodeBlock3 } from "@contractspec/lib.design-system";
+import Link3 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight3 } from "lucide-react";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+var metadata3 = new SeoOptimizer3().optimize(deterministicCodegenBrief2);
+function DeterministicCodegenPage() {
+  return /* @__PURE__ */ jsxDEV3("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxDEV3("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV3("h1", {
+            className: "text-4xl font-bold",
+            children: deterministicCodegenBrief2.title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV3("p", {
+            className: "text-muted-foreground text-lg",
+            children: deterministicCodegenBrief2.summary
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV3("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV3("h2", {
+            className: "text-2xl font-bold",
+            children: "Regeneration Challenges"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV3("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: deterministicCodegenBrief2.problems.map((problem, index) => /* @__PURE__ */ jsxDEV3("li", {
+              children: problem
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV3("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV3("h2", {
+            className: "text-2xl font-bold",
+            children: "Deterministic Solutions"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV3("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: deterministicCodegenBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsxDEV3("li", {
+              children: solution
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV3("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxDEV3("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV3("h2", {
+                className: "text-2xl font-bold",
+                children: "Protected Zones"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Separate generated code from hand-written business logic with clear boundaries."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3(CodeBlock3, {
+                language: "typescript",
+                filename: "src/handlers/user-handlers.ts",
+                code: `// Hand-written business logic (protected from regeneration)
+export class UserService {
+  async createUser(input: CreateUserInput): Promise<CreateUserOutput> {
+    // Custom validation and business rules
+    if (await this.emailExists(input.email)) {
+      throw new Error('Email already exists');
+    }
+    
+    // Persistence logic
+    const user = await this.repository.create({
+      email: input.email,
+      name: input.name,
+      password: await this.hashPassword(input.password),
+    });
+    
+    return {
+      id: user.id,
+      email: user.email,
+      name: user.name,
+      createdAt: user.createdAt.toISOString(),
+    };
+  }
+  
+  private async emailExists(email: string): Promise<boolean> {
+    // Custom business validation
+    return !!(await this.repository.findByEmail(email));
+  }
+}
+
+// Generated handler wrapper (can be regenerated safely)
+export const createUserHandler = wrapOperationHandler(
+  UserService.prototype.createUser,
+  {
+    serviceName: 'UserService',
+    operationName: 'createUser',
+    errorMapper: mapToStandardErrors,
+  }
+);`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV3("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV3("h2", {
+                className: "text-2xl font-bold",
+                children: "Incremental Regeneration"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Regenerate only what changed while preserving custom logic."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3(CodeBlock3, {
+                language: "bash",
+                filename: "incremental-regen",
+                code: `contractspec generate \\
+  --incremental \\
+  --preserve-zones ./src/handlers/*.ts \\
+  --input ./src/contracts/ \\
+  --output ./generated/`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV3("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV3("h2", {
+                className: "text-2xl font-bold",
+                children: "Conflict Detection"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Automatically detect and report conflicts during regeneration."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV3(CodeBlock3, {
+                language: "bash",
+                filename: "check-conflicts",
+                code: `contractspec generate \\
+  --check-conflicts \\
+  --report-conflicts ./conflicts.json`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV3("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxDEV3(Link3, {
+            href: "/docs/guides/generate-docs-clients-schemas",
+            className: "btn-primary",
+            children: [
+              "Client Generation ",
+              /* @__PURE__ */ jsxDEV3(ChevronRight3, {
+                size: 16
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV3(Link3, {
+            href: "/docs/intent/schema-validation-typescript",
+            className: "btn-ghost",
+            children: "Type Safety"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// src/components/docs/intent/SchemaValidationTypescriptPage.tsx
+import { schemaValidationTypescriptBrief as schemaValidationTypescriptBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+import { SeoOptimizer as SeoOptimizer4 } from "@contractspec/lib.content-gen/seo";
+import { CodeBlock as CodeBlock4 } from "@contractspec/lib.design-system";
+import Link4 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight4 } from "lucide-react";
+import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
+var metadata4 = new SeoOptimizer4().optimize(schemaValidationTypescriptBrief2);
+function SchemaValidationTypescriptPage() {
+  return /* @__PURE__ */ jsxDEV4("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxDEV4("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV4("h1", {
+            className: "text-4xl font-bold",
+            children: schemaValidationTypescriptBrief2.title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV4("p", {
+            className: "text-muted-foreground text-lg",
+            children: schemaValidationTypescriptBrief2.summary
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV4("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV4("h2", {
+            className: "text-2xl font-bold",
+            children: "Validation Pain Points"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV4("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: schemaValidationTypescriptBrief2.problems.map((problem, index) => /* @__PURE__ */ jsxDEV4("li", {
+              children: problem
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV4("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV4("h2", {
+            className: "text-2xl font-bold",
+            children: "Type-safe Solutions"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV4("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: schemaValidationTypescriptBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsxDEV4("li", {
+              children: solution
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV4("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxDEV4("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV4("h2", {
+                className: "text-2xl font-bold",
+                children: "Contract Schema"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV4("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Define data models with automatic TypeScript generation."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV4(CodeBlock4, {
+                language: "typescript",
+                filename: "src/contracts/user.schema.ts",
+                code: `import { SchemaModel, ScalarTypeEnum } from '@contractspec/lib.schema';
+
+export const UserSchema = new SchemaModel({
+  type: 'object',
+  properties: {
+    id: {
+      type: 'string',
+      format: 'uuid',
+      required: true,
+      description: 'Unique user identifier',
+    },
+    email: {
+      type: 'string',
+      format: 'email',
+      required: true,
+      description: 'User email address',
+    },
+    name: {
+      type: 'string',
+      minLength: 1,
+      maxLength: 100,
+      required: true,
+      description: 'Display name for the user',
+    },
+    role: {
+      type: 'string',
+      enum: ['user', 'admin', 'moderator'],
+      default: 'user',
+      description: 'User role in the system',
+    },
+    createdAt: {
+      type: 'string',
+      format: 'date-time',
+      required: true,
+      description: 'Account creation timestamp',
+    },
+  },
+  required: ['id', 'email', 'name', 'createdAt'],
+  metadata: {
+    name: 'User',
+    description: 'User account information',
+  },
+});`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV4("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV4("h2", {
+                className: "text-2xl font-bold",
+                children: "Generated Types"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV4("p", {
+                className: "text-muted-foreground text-sm",
+                children: "TypeScript types are automatically generated with proper validation."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV4(CodeBlock4, {
+                language: "typescript",
+                filename: "generated/types/user.ts",
+                code: `// Auto-generated from UserSchema
+export interface User {
+  id: string;
+  email: string;
+  name: string;
+  role: 'user' | 'admin' | 'moderator';
+  createdAt: string;
+}
+
+// Auto-generated Zod schema for runtime validation
+export const UserSchemaZod = z.object({
+  id: z.string().uuid(),
+  email: z.string().email(),
+  name: z.string().min(1).max(100),
+  role: z.enum(['user', 'admin', 'moderator']).default('user'),
+  createdAt: z.string().datetime(),
+});
+
+// Generated validation utilities
+export function validateUser(data: unknown): User {
+  return UserSchemaZod.parse(data);
+}
+
+export function isUser(data: unknown): data is User {
+  return UserSchemaZod.safeParse(data).success;
+}`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV4("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV4("h2", {
+                className: "text-2xl font-bold",
+                children: "Runtime Validation"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV4("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Use generated validation in your API handlers with zero boilerplate."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV4(CodeBlock4, {
+                language: "typescript",
+                filename: "src/handlers/user-handler.ts",
+                code: `import { validateUser } from '../generated/types/user';
+
+export async function createUserHandler(request: Request) {
+  try {
+    const input = validateUser(await request.json());
+    
+    // input is now fully typed as User
+    const user = await db.users.create({
+      data: {
+        ...input,
+        createdAt: new Date().toISOString(),
+      },
+    });
+    
+    return Response.json({ user });
+  } catch (error) {
+    if (error instanceof z.ZodError) {
+      return Response.json(
+        { 
+          error: 'Validation failed',
+          details: error.errors 
+        },
+        { status: 400 }
+      );
+    }
+    
+    throw error;
+  }
+}`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV4("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxDEV4(Link4, {
+            href: "/docs/guides/spec-validation-and-typing",
+            className: "btn-primary",
+            children: [
+              "Type Safety Guide ",
+              /* @__PURE__ */ jsxDEV4(ChevronRight4, {
+                size: 16
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV4(Link4, {
+            href: "/docs/intent/generate-client-from-schema",
+            className: "btn-ghost",
+            children: "Client Generation"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// src/components/docs/intent/OpenapiAlternativePage.tsx
+import { openapiAlternativeBrief as openapiAlternativeBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+import { SeoOptimizer as SeoOptimizer5 } from "@contractspec/lib.content-gen/seo";
+import { CodeBlock as CodeBlock5 } from "@contractspec/lib.design-system";
+import Link5 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight5 } from "lucide-react";
+import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
+var metadata5 = new SeoOptimizer5().optimize(openapiAlternativeBrief2);
+function OpenapiAlternativePage() {
+  return /* @__PURE__ */ jsxDEV5("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxDEV5("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV5("h1", {
+            className: "text-4xl font-bold",
+            children: openapiAlternativeBrief2.title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV5("p", {
+            className: "text-muted-foreground text-lg",
+            children: openapiAlternativeBrief2.summary
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV5("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV5("h2", {
+            className: "text-2xl font-bold",
+            children: "OpenAPI Limitations"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV5("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: openapiAlternativeBrief2.problems.map((problem, index) => /* @__PURE__ */ jsxDEV5("li", {
+              children: problem
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV5("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV5("h2", {
+            className: "text-2xl font-bold",
+            children: "ContractSpec Advantages"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV5("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: openapiAlternativeBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsxDEV5("li", {
+              children: solution
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV5("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxDEV5("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV5("h2", {
+                className: "text-2xl font-bold",
+                children: "Comparison: OpenAPI vs ContractSpec"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV5("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Key differences between OpenAPI documentation and ContractSpec executable contracts."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV5("div", {
+                className: "grid gap-6 md:grid-cols-2",
+                children: [
+                  /* @__PURE__ */ jsxDEV5("div", {
+                    className: "card-subtle space-y-3 p-4",
+                    children: [
+                      /* @__PURE__ */ jsxDEV5("h3", {
+                        className: "text-lg font-semibold",
+                        children: "OpenAPI"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV5("ul", {
+                        className: "text-muted-foreground space-y-1 text-sm",
+                        children: [
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Documentation specification only"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• No runtime validation"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Manual code generation"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Type safety requires tools"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Separate schemas from documentation"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV5("div", {
+                    className: "card-subtle space-y-3 p-4",
+                    children: [
+                      /* @__PURE__ */ jsxDEV5("h3", {
+                        className: "text-lg font-semibold",
+                        children: "ContractSpec"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV5("ul", {
+                        className: "text-muted-foreground space-y-1 text-sm",
+                        children: [
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Executable contracts"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Built-in runtime validation"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Automatic code generation"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Type-safe by default"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV5("li", {
+                            children: "• Unified spec and implementation"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV5("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV5("h2", {
+                className: "text-2xl font-bold",
+                children: "Export from Contracts"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV5("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Generate OpenAPI documentation from ContractSpec for existing tooling."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV5(CodeBlock5, {
+                language: "bash",
+                filename: "export-openapi",
+                code: `# From ContractSpec contracts
+contractspec openapi export \\
+  --registry ./src/contracts/registry.ts \\
+  --format yaml \\
+  --out ./openapi.yaml
+
+# Compare: Manual OpenAPI vs Generated
+# Manual: Write OpenAPI by hand, maintain separately
+# Generated: Single source of truth, always in sync`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV5("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV5("h2", {
+                className: "text-2xl font-bold",
+                children: "Beyond Documentation"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV5("p", {
+                className: "text-muted-foreground text-sm",
+                children: "ContractSpec provides more than just API documentation."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV5(CodeBlock5, {
+                language: "typescript",
+                filename: "multi-output-example.ts",
+                code: `// One contract, multiple outputs
+import { UserApiContract } from './contracts/user-api.contract';
+
+// Generated outputs
+export const outputs = {
+  // API documentation (OpenAPI)
+  openapi: UserApiContract.toOpenAPI(),
+  
+  // Client SDKs (TypeScript, Python, etc.)
+  clients: UserApiContract.generateClients({
+    languages: ['typescript', 'python', 'go'],
+  }),
+  
+  // Database schemas (Prisma, Drizzle)
+  database: UserApiContract.toDatabase({
+    adapter: 'prisma',
+  }),
+  
+  // API handlers (Express, Fastify, Next.js)
+  handlers: UserApiContract.toHandlers({
+    framework: 'express',
+  }),
+  
+  // Validation middleware
+  validation: UserApiContract.toValidation({
+    library: 'zod',
+  }),
+  
+  // Type definitions
+  types: UserApiContract.toTypescript(),
+};`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV5("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxDEV5(Link5, {
+            href: "/docs/guides/generate-docs-clients-schemas",
+            className: "btn-primary",
+            children: [
+              "Generate from Contracts ",
+              /* @__PURE__ */ jsxDEV5(ChevronRight5, {
+                size: 16
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV5(Link5, {
+            href: "/docs/intent/generate-client-from-schema",
+            className: "btn-ghost",
+            children: "Client Generation"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// src/components/docs/intent/GenerateClientFromSchemaPage.tsx
+import { generateClientFromSchemaBrief as generateClientFromSchemaBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+import { SeoOptimizer as SeoOptimizer6 } from "@contractspec/lib.content-gen/seo";
+import { CodeBlock as CodeBlock6 } from "@contractspec/lib.design-system";
+import Link6 from "@contractspec/lib.ui-link";
+import { ChevronRight as ChevronRight6 } from "lucide-react";
+import { jsxDEV as jsxDEV6 } from "react/jsx-dev-runtime";
+var metadata6 = new SeoOptimizer6().optimize(generateClientFromSchemaBrief2);
+function GenerateClientFromSchemaPage() {
+  return /* @__PURE__ */ jsxDEV6("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxDEV6("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV6("h1", {
+            className: "text-4xl font-bold",
+            children: generateClientFromSchemaBrief2.title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV6("p", {
+            className: "text-muted-foreground text-lg",
+            children: generateClientFromSchemaBrief2.summary
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV6("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV6("h2", {
+            className: "text-2xl font-bold",
+            children: "Client Development Problems"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV6("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: generateClientFromSchemaBrief2.problems.map((problem, index) => /* @__PURE__ */ jsxDEV6("li", {
+              children: problem
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV6("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV6("h2", {
+            className: "text-2xl font-bold",
+            children: "Automated Solutions"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV6("ul", {
+            className: "text-muted-foreground space-y-2 text-sm",
+            children: generateClientFromSchemaBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsxDEV6("li", {
+              children: solution
+            }, index, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV6("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxDEV6("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV6("h2", {
+                className: "text-2xl font-bold",
+                children: "Contract Definition"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Define your API contract once, generate clients for any language."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6(CodeBlock6, {
+                language: "typescript",
+                filename: "src/contracts/api.contract.ts",
+                code: `import { defineContract } from '@contractspec/lib.contracts';
+import { SchemaModel, ScalarTypeEnum } from '@contractspec/lib.schema';
+
+export const ApiContract = defineContract({
+  name: 'MyAPI',
+  version: '1.0.0',
+  baseUrl: 'https://api.example.com',
+  operations: {
+    getUsers: {
+      goal: 'Retrieve paginated list of users',
+      method: 'GET',
+      path: '/users',
+      input: new SchemaModel({
+        type: 'object',
+        properties: {
+          page: { type: 'integer', minimum: 1, default: 1 },
+          limit: { type: 'integer', minimum: 1, maximum: 100, default: 20 },
+        },
+      }),
+      output: new SchemaModel({
+        type: 'object',
+        properties: {
+          users: {
+            type: 'array',
+            items: {
+              type: 'object',
+              properties: {
+                id: { type: 'string', required: true },
+                email: { type: 'string', required: true },
+                name: { type: 'string', required: true },
+              },
+            },
+          },
+          pagination: {
+            type: 'object',
+            properties: {
+              page: { type: 'integer', required: true },
+              limit: { type: 'integer', required: true },
+              total: { type: 'integer', required: true },
+            },
+          },
+        },
+      }),
+    },
+    createUser: {
+      goal: 'Create a new user account',
+      method: 'POST',
+      path: '/users',
+      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 },
+          createdAt: { type: 'string', format: 'date-time', required: true },
+        },
+      }),
+    },
+  },
+  metadata: {
+    description: 'User management API with authentication',
+    tags: ['users', 'authentication'],
+  },
+});`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV6("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV6("h2", {
+                className: "text-2xl font-bold",
+                children: "Generate Multiple Clients"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Generate type-safe clients for any language from the same contract."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6(CodeBlock6, {
+                language: "bash",
+                filename: "generate-clients",
+                code: `# Generate all supported language clients
+contractspec generate clients \\
+  --contract ./src/contracts/api.contract.ts \\
+  --output ./generated/clients \\
+  --languages typescript,python,go,java,csharp
+
+# Generate specific language client
+contractspec generate clients \\
+  --contract ./src/contracts/api.contract.ts \\
+  --output ./generated/clients \\
+  --languages typescript \\
+  --format npm-package
+
+# Options
+# --with-types: Include TypeScript definitions
+# --with-tests: Generate client test suites
+# --with-docs: Include client documentation
+# --framework: Use specific HTTP client framework`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV6("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV6("h2", {
+                className: "text-2xl font-bold",
+                children: "Generated Client Examples"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Each generated client is fully type-safe and idiomatic."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6("div", {
+                className: "space-y-4",
+                children: [
+                  /* @__PURE__ */ jsxDEV6("div", {
+                    className: "card-subtle p-4",
+                    children: [
+                      /* @__PURE__ */ jsxDEV6("h4", {
+                        className: "text-lg font-semibold",
+                        children: "TypeScript Client"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV6(CodeBlock6, {
+                        language: "typescript",
+                        filename: "generated/clients/typescript/index.ts",
+                        code: `import { MyAPIClient } from './client';
+
+const client = new MyAPIClient({
+  baseUrl: 'https://api.example.com',
+  apiKey: process.env.API_KEY,
+});
+
+// Type-safe method calls
+const users = await client.getUsers({
+  page: 1,
+  limit: 10,
+});
+
+const newUser = await client.createUser({
+  email: 'user@example.com',
+  name: 'John Doe',
+});
+
+// Full type inference
+// users: GetUsersResponse
+// newUser: CreateUserResponse`
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV6("div", {
+                    className: "card-subtle p-4",
+                    children: [
+                      /* @__PURE__ */ jsxDEV6("h4", {
+                        className: "text-lg font-semibold",
+                        children: "Python Client"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV6(CodeBlock6, {
+                        language: "python",
+                        filename: "generated/clients/python/index.py",
+                        code: `from myapi_client import MyAPIClient
+
+client = MyAPIClient(
+    base_url='https://api.example.com',
+    api_key=os.getenv('API_KEY')
+)
+
+# Type-safe method calls
+users = await client.get_users(
+    page=1,
+    limit=10
+)
+
+new_user = await client.create_user(
+    email='user@example.com',
+    name='John Doe'
+)
+
+# Full type hints
+# users: GetUsersResponse
+# new_user: CreateUserResponse`
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV6("div", {
+                    className: "card-subtle p-4",
+                    children: [
+                      /* @__PURE__ */ jsxDEV6("h4", {
+                        className: "text-lg font-semibold",
+                        children: "Go Client"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV6(CodeBlock6, {
+                        language: "go",
+                        filename: "generated/clients/go/client.go",
+                        code: `package main
+
+import (
+    "context"
+    "myapi_client"
+)
+
+func main() {
+    client := myapi_client.NewMyAPIClient(
+        myapi_client.WithBaseURL("https://api.example.com"),
+        myapi_client.WithAPIKey(os.Getenv("API_KEY")),
+    )
+    
+    // Type-safe method calls
+    users, err := client.GetUsers(&myapi_client.GetUsersParams{
+        Page: 1,
+        Limit: 10,
+    })
+    
+    newUser, err := client.CreateUser(&myapi_client.CreateUserParams{
+        Email: "user@example.com",
+        Name:  "John Doe",
+    })
+    
+    // Full type checking at compile time
+    // users: *GetUsersResponse
+    // newUser: *CreateUserResponse
+}`
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV6("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsxDEV6("h2", {
+                className: "text-2xl font-bold",
+                children: "Advanced Features"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Generated clients include enterprise-grade features out of the box."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6(CodeBlock6, {
+                language: "typescript",
+                filename: "client-features.ts",
+                code: `// Advanced client features
+const client = new MyAPIClient({
+  baseUrl: 'https://api.example.com',
+  apiKey: 'your-api-key',
+  
+  // Retry configuration
+  retryConfig: {
+    maxRetries: 3,
+    backoffMultiplier: 2,
+    maxDelay: 30000,
+  },
+  
+  // Request/Response interceptors
+  interceptors: {
+    request: [(config) => {
+      // Add authentication headers
+      config.headers.Authorization = \`Bearer \${await getAuthToken()}\`;
+      return config;
+    }],
+    response: [(response) => {
+      // Log API calls
+      console.log(\`API Call: \${response.config.method} \${response.config.url}\`);
+      return response;
+    }],
+  },
+  
+  // Error handling
+  errorHandler: (error) => {
+    if (error.status === 401) {
+      // Refresh token and retry
+      return refreshTokenAndRetry(error.originalRequest);
+    }
+    throw error;
+  },
+});
+
+// Automatic request deduplication
+const user1 = client.getUser({ id: '123' });
+const user2 = client.getUser({ id: '123' }); // Uses cached result
+
+// Request cancellation
+const controller = new AbortController();
+const promise = client.getUsers({ page: 1, signal: controller.signal });
+controller.abort(); // Cancels the request`
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV6("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxDEV6(Link6, {
+            href: "/docs/guides/generate-docs-clients-schemas",
+            className: "btn-primary",
+            children: [
+              "Client Generation Guide ",
+              /* @__PURE__ */ jsxDEV6(ChevronRight6, {
+                size: 16
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV6(Link6, {
+            href: "/docs/intent/contract-first-api",
+            className: "btn-ghost",
+            children: "Contract-first API"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  SpecDrivenDevelopmentPage,
+  SchemaValidationTypescriptPage,
+  OpenapiAlternativePage,
+  GenerateClientFromSchemaPage,
+  DeterministicCodegenPage,
+  ContractFirstApiPage
+};