@contractspec/bundle.library 3.7.5 → 3.7.7

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

@@ -208,11 +208,11 @@ function ContractFirstApiPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx("h1", {
-            className: "text-4xl font-bold",
+            className: "font-bold text-4xl",
             children: contractFirstApiBrief2.title
           }),
           /* @__PURE__ */ jsx("p", {
-            className: "text-muted-foreground text-lg",
+            className: "text-lg text-muted-foreground",
             children: contractFirstApiBrief2.summary
           })
         ]
@@ -221,11 +221,11 @@ function ContractFirstApiPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Problems Solved"
           }),
           /* @__PURE__ */ jsx("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: contractFirstApiBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx("li", {
               children: problem
             }, index))
@@ -236,11 +236,11 @@ function ContractFirstApiPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx("h2", {
-            className: "text-2xl font-bold",
+            className: "font-bold text-2xl",
             children: "Solutions"
           }),
           /* @__PURE__ */ jsx("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
+            className: "space-y-2 text-muted-foreground text-sm",
             children: contractFirstApiBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx("li", {
               children: solution
             }, index))
@@ -254,7 +254,7 @@ function ContractFirstApiPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "Quick Start"
               }),
               /* @__PURE__ */ jsx("p", {
@@ -306,7 +306,7 @@ export const CreateUserOperation = defineOperation({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "Generate OpenAPI"
               }),
               /* @__PURE__ */ jsx("p", {
@@ -348,15 +348,15 @@ export const CreateUserOperation = defineOperation({
   });
 }
 
-// src/components/docs/intent/SpecDrivenDevelopmentPage.tsx
-import { specDrivenDevelopmentBrief as specDrivenDevelopmentBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+// src/components/docs/intent/DeterministicCodegenPage.tsx
+import { deterministicCodegenBrief as deterministicCodegenBrief2 } 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 { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var metadata2 = new SeoOptimizer2().optimize(specDrivenDevelopmentBrief2);
-function SpecDrivenDevelopmentPage() {
+var metadata2 = new SeoOptimizer2().optimize(deterministicCodegenBrief2);
+function DeterministicCodegenPage() {
   return /* @__PURE__ */ jsxs2("div", {
     className: "space-y-8",
     children: [
@@ -364,12 +364,12 @@ function SpecDrivenDevelopmentPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx2("h1", {
-            className: "text-4xl font-bold",
-            children: specDrivenDevelopmentBrief2.title
+            className: "font-bold text-4xl",
+            children: deterministicCodegenBrief2.title
           }),
           /* @__PURE__ */ jsx2("p", {
-            className: "text-muted-foreground text-lg",
-            children: specDrivenDevelopmentBrief2.summary
+            className: "text-lg text-muted-foreground",
+            children: deterministicCodegenBrief2.summary
           })
         ]
       }),
@@ -377,12 +377,12 @@ function SpecDrivenDevelopmentPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx2("h2", {
-            className: "text-2xl font-bold",
-            children: "Why Spec-driven?"
+            className: "font-bold text-2xl",
+            children: "Regeneration Challenges"
           }),
           /* @__PURE__ */ jsx2("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: specDrivenDevelopmentBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx2("li", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: deterministicCodegenBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx2("li", {
               children: problem
             }, index))
           })
@@ -392,12 +392,12 @@ function SpecDrivenDevelopmentPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx2("h2", {
-            className: "text-2xl font-bold",
-            children: "Benefits"
+            className: "font-bold text-2xl",
+            children: "Deterministic Solutions"
           }),
           /* @__PURE__ */ jsx2("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: specDrivenDevelopmentBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx2("li", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: deterministicCodegenBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx2("li", {
               children: solution
             }, index))
           })
@@ -410,208 +410,14 @@ function SpecDrivenDevelopmentPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx2("h2", {
-                className: "text-2xl font-bold",
-                children: "Feature Specification Example"
-              }),
-              /* @__PURE__ */ jsx2("p", {
-                className: "text-muted-foreground text-sm",
-                children: "Define a complete feature with operations, events, and data models."
-              }),
-              /* @__PURE__ */ jsx2(CodeBlock2, {
-                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__ */ jsxs2("div", {
-            className: "space-y-3",
-            children: [
-              /* @__PURE__ */ jsx2("h2", {
-                className: "text-2xl font-bold",
-                children: "Generate Type-safe Implementations"
-              }),
-              /* @__PURE__ */ jsx2("p", {
-                className: "text-muted-foreground text-sm",
-                children: "Generate validation, types, and API handlers from your feature."
-              }),
-              /* @__PURE__ */ jsx2(CodeBlock2, {
-                language: "bash",
-                filename: "generate-from-feature",
-                code: `contractspec generate \\
-  --input ./src/contracts/user-management.feature.ts \\
-  --output ./generated/user-management`
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs2("div", {
-        className: "flex items-center gap-4 pt-4",
-        children: [
-          /* @__PURE__ */ jsxs2(Link2, {
-            href: "/docs/guides/spec-validation-and-typing",
-            className: "btn-primary",
-            children: [
-              "Type Safety Guide ",
-              /* @__PURE__ */ jsx2(ChevronRight2, {
-                size: 16
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsx2(Link2, {
-            href: "/docs/intent/deterministic-codegen",
-            className: "btn-ghost",
-            children: "Deterministic Codegen"
-          })
-        ]
-      })
-    ]
-  });
-}
-
-// 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 { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var metadata3 = new SeoOptimizer3().optimize(deterministicCodegenBrief2);
-function DeterministicCodegenPage() {
-  return /* @__PURE__ */ jsxs3("div", {
-    className: "space-y-8",
-    children: [
-      /* @__PURE__ */ jsxs3("div", {
-        className: "space-y-3",
-        children: [
-          /* @__PURE__ */ jsx3("h1", {
-            className: "text-4xl font-bold",
-            children: deterministicCodegenBrief2.title
-          }),
-          /* @__PURE__ */ jsx3("p", {
-            className: "text-muted-foreground text-lg",
-            children: deterministicCodegenBrief2.summary
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs3("div", {
-        className: "card-subtle space-y-4 p-6",
-        children: [
-          /* @__PURE__ */ jsx3("h2", {
-            className: "text-2xl font-bold",
-            children: "Regeneration Challenges"
-          }),
-          /* @__PURE__ */ jsx3("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: deterministicCodegenBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx3("li", {
-              children: problem
-            }, index))
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs3("div", {
-        className: "card-subtle space-y-4 p-6",
-        children: [
-          /* @__PURE__ */ jsx3("h2", {
-            className: "text-2xl font-bold",
-            children: "Deterministic Solutions"
-          }),
-          /* @__PURE__ */ jsx3("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: deterministicCodegenBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx3("li", {
-              children: solution
-            }, index))
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs3("div", {
-        className: "space-y-6",
-        children: [
-          /* @__PURE__ */ jsxs3("div", {
-            className: "space-y-3",
-            children: [
-              /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+                className: "font-bold text-2xl",
                 children: "Protected Zones"
               }),
-              /* @__PURE__ */ jsx3("p", {
+              /* @__PURE__ */ jsx2("p", {
                 className: "text-muted-foreground text-sm",
                 children: "Separate generated code from hand-written business logic with clear boundaries."
               }),
-              /* @__PURE__ */ jsx3(CodeBlock3, {
+              /* @__PURE__ */ jsx2(CodeBlock2, {
                 language: "typescript",
                 filename: "src/handlers/user-handlers.ts",
                 code: `// Hand-written business logic (protected from regeneration)
@@ -655,18 +461,18 @@ export const createUserHandler = wrapOperationHandler(
               })
             ]
           }),
-          /* @__PURE__ */ jsxs3("div", {
+          /* @__PURE__ */ jsxs2("div", {
             className: "space-y-3",
             children: [
-              /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+              /* @__PURE__ */ jsx2("h2", {
+                className: "font-bold text-2xl",
                 children: "Incremental Regeneration"
               }),
-              /* @__PURE__ */ jsx3("p", {
+              /* @__PURE__ */ jsx2("p", {
                 className: "text-muted-foreground text-sm",
                 children: "Regenerate only what changed while preserving custom logic."
               }),
-              /* @__PURE__ */ jsx3(CodeBlock3, {
+              /* @__PURE__ */ jsx2(CodeBlock2, {
                 language: "bash",
                 filename: "incremental-regen",
                 code: `contractspec generate \\
@@ -677,18 +483,18 @@ export const createUserHandler = wrapOperationHandler(
               })
             ]
           }),
-          /* @__PURE__ */ jsxs3("div", {
+          /* @__PURE__ */ jsxs2("div", {
             className: "space-y-3",
             children: [
-              /* @__PURE__ */ jsx3("h2", {
-                className: "text-2xl font-bold",
+              /* @__PURE__ */ jsx2("h2", {
+                className: "font-bold text-2xl",
                 children: "Conflict Detection"
               }),
-              /* @__PURE__ */ jsx3("p", {
+              /* @__PURE__ */ jsx2("p", {
                 className: "text-muted-foreground text-sm",
                 children: "Automatically detect and report conflicts during regeneration."
               }),
-              /* @__PURE__ */ jsx3(CodeBlock3, {
+              /* @__PURE__ */ jsx2(CodeBlock2, {
                 language: "bash",
                 filename: "check-conflicts",
                 code: `contractspec generate \\
@@ -699,20 +505,20 @@ export const createUserHandler = wrapOperationHandler(
           })
         ]
       }),
-      /* @__PURE__ */ jsxs3("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsxs3(Link3, {
+          /* @__PURE__ */ jsxs2(Link2, {
             href: "/docs/guides/generate-docs-clients-schemas",
             className: "btn-primary",
             children: [
               "Client Generation ",
-              /* @__PURE__ */ jsx3(ChevronRight3, {
+              /* @__PURE__ */ jsx2(ChevronRight2, {
                 size: 16
               })
             ]
           }),
-          /* @__PURE__ */ jsx3(Link3, {
+          /* @__PURE__ */ jsx2(Link2, {
             href: "/docs/intent/schema-validation-typescript",
             className: "btn-ghost",
             children: "Type Safety"
@@ -723,232 +529,394 @@ export const createUserHandler = wrapOperationHandler(
   });
 }
 
-// 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 { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var metadata4 = new SeoOptimizer4().optimize(schemaValidationTypescriptBrief2);
-function SchemaValidationTypescriptPage() {
-  return /* @__PURE__ */ jsxs4("div", {
+// src/components/docs/intent/GenerateClientFromSchemaPage.tsx
+import { generateClientFromSchemaBrief as generateClientFromSchemaBrief2 } 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 { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var metadata3 = new SeoOptimizer3().optimize(generateClientFromSchemaBrief2);
+function GenerateClientFromSchemaPage() {
+  return /* @__PURE__ */ jsxs3("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-3",
         children: [
-          /* @__PURE__ */ jsx4("h1", {
-            className: "text-4xl font-bold",
-            children: schemaValidationTypescriptBrief2.title
+          /* @__PURE__ */ jsx3("h1", {
+            className: "font-bold text-4xl",
+            children: generateClientFromSchemaBrief2.title
           }),
-          /* @__PURE__ */ jsx4("p", {
-            className: "text-muted-foreground text-lg",
-            children: schemaValidationTypescriptBrief2.summary
+          /* @__PURE__ */ jsx3("p", {
+            className: "text-lg text-muted-foreground",
+            children: generateClientFromSchemaBrief2.summary
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "card-subtle space-y-4 p-6",
         children: [
-          /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
-            children: "Validation Pain Points"
+          /* @__PURE__ */ jsx3("h2", {
+            className: "font-bold text-2xl",
+            children: "Client Development Problems"
           }),
-          /* @__PURE__ */ jsx4("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: schemaValidationTypescriptBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx4("li", {
+          /* @__PURE__ */ jsx3("ul", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: generateClientFromSchemaBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx3("li", {
               children: problem
             }, index))
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "card-subtle space-y-4 p-6",
         children: [
-          /* @__PURE__ */ jsx4("h2", {
-            className: "text-2xl font-bold",
-            children: "Type-safe Solutions"
+          /* @__PURE__ */ jsx3("h2", {
+            className: "font-bold text-2xl",
+            children: "Automated Solutions"
           }),
-          /* @__PURE__ */ jsx4("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: schemaValidationTypescriptBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx4("li", {
+          /* @__PURE__ */ jsx3("ul", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: generateClientFromSchemaBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx3("li", {
               children: solution
             }, index))
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "space-y-6",
         children: [
-          /* @__PURE__ */ jsxs4("div", {
+          /* @__PURE__ */ jsxs3("div", {
             className: "space-y-3",
             children: [
-              /* @__PURE__ */ jsx4("h2", {
-                className: "text-2xl font-bold",
-                children: "Contract Schema"
+              /* @__PURE__ */ jsx3("h2", {
+                className: "font-bold text-2xl",
+                children: "Contract Definition"
               }),
-              /* @__PURE__ */ jsx4("p", {
+              /* @__PURE__ */ jsx3("p", {
                 className: "text-muted-foreground text-sm",
-                children: "Define data models with automatic TypeScript generation."
+                children: "Define your API contract once, generate clients for any language."
               }),
-              /* @__PURE__ */ jsx4(CodeBlock4, {
+              /* @__PURE__ */ jsx3(CodeBlock3, {
                 language: "typescript",
-                filename: "src/contracts/user.schema.ts",
-                code: `import { SchemaModel, ScalarTypeEnum } from '@contractspec/lib.schema';
+                filename: "src/contracts/api.contract.ts",
+                code: `import { defineContract } from '@contractspec/lib.contracts-spec';
+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',
+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 },
+            },
+          },
+        },
+      }),
     },
-    createdAt: {
-      type: 'string',
-      format: 'date-time',
-      required: true,
-      description: 'Account creation timestamp',
+    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 },
+        },
+      }),
     },
   },
-  required: ['id', 'email', 'name', 'createdAt'],
   metadata: {
-    name: 'User',
-    description: 'User account information',
+    description: 'User management API with authentication',
+    tags: ['users', 'authentication'],
   },
 });`
               })
             ]
           }),
-          /* @__PURE__ */ jsxs4("div", {
+          /* @__PURE__ */ jsxs3("div", {
             className: "space-y-3",
             children: [
-              /* @__PURE__ */ jsx4("h2", {
-                className: "text-2xl font-bold",
-                children: "Generated Types"
+              /* @__PURE__ */ jsx3("h2", {
+                className: "font-bold text-2xl",
+                children: "Generate Multiple Clients"
               }),
-              /* @__PURE__ */ jsx4("p", {
+              /* @__PURE__ */ jsx3("p", {
                 className: "text-muted-foreground text-sm",
-                children: "TypeScript types are automatically generated with proper validation."
+                children: "Generate type-safe clients for any language from the same contract."
               }),
-              /* @__PURE__ */ jsx4(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;
-}
+              /* @__PURE__ */ jsx3(CodeBlock3, {
+                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
 
-// 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(),
+# 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`
+              })
+            ]
+          }),
+          /* @__PURE__ */ jsxs3("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsx3("h2", {
+                className: "font-bold text-2xl",
+                children: "Generated Client Examples"
+              }),
+              /* @__PURE__ */ jsx3("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Each generated client is fully type-safe and idiomatic."
+              }),
+              /* @__PURE__ */ jsxs3("div", {
+                className: "space-y-4",
+                children: [
+                  /* @__PURE__ */ jsxs3("div", {
+                    className: "card-subtle p-4",
+                    children: [
+                      /* @__PURE__ */ jsx3("h4", {
+                        className: "font-semibold text-lg",
+                        children: "TypeScript Client"
+                      }),
+                      /* @__PURE__ */ jsx3(CodeBlock3, {
+                        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,
 });
 
-// Generated validation utilities
-export function validateUser(data: unknown): User {
-  return UserSchemaZod.parse(data);
-}
+// Type-safe method calls
+const users = await client.getUsers({
+  page: 1,
+  limit: 10,
+});
 
-export function isUser(data: unknown): data is User {
-  return UserSchemaZod.safeParse(data).success;
+const newUser = await client.createUser({
+  email: 'user@example.com',
+  name: 'John Doe',
+});
+
+// Full type inference
+// users: GetUsersResponse
+// newUser: CreateUserResponse`
+                      })
+                    ]
+                  }),
+                  /* @__PURE__ */ jsxs3("div", {
+                    className: "card-subtle p-4",
+                    children: [
+                      /* @__PURE__ */ jsx3("h4", {
+                        className: "font-semibold text-lg",
+                        children: "Python Client"
+                      }),
+                      /* @__PURE__ */ jsx3(CodeBlock3, {
+                        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`
+                      })
+                    ]
+                  }),
+                  /* @__PURE__ */ jsxs3("div", {
+                    className: "card-subtle p-4",
+                    children: [
+                      /* @__PURE__ */ jsx3("h4", {
+                        className: "font-semibold text-lg",
+                        children: "Go Client"
+                      }),
+                      /* @__PURE__ */ jsx3(CodeBlock3, {
+                        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
 }`
+                      })
+                    ]
+                  })
+                ]
               })
             ]
           }),
-          /* @__PURE__ */ jsxs4("div", {
+          /* @__PURE__ */ jsxs3("div", {
             className: "space-y-3",
             children: [
-              /* @__PURE__ */ jsx4("h2", {
-                className: "text-2xl font-bold",
-                children: "Runtime Validation"
+              /* @__PURE__ */ jsx3("h2", {
+                className: "font-bold text-2xl",
+                children: "Advanced Features"
               }),
-              /* @__PURE__ */ jsx4("p", {
+              /* @__PURE__ */ jsx3("p", {
                 className: "text-muted-foreground text-sm",
-                children: "Use generated validation in your API handlers with zero boilerplate."
+                children: "Generated clients include enterprise-grade features out of the box."
               }),
-              /* @__PURE__ */ jsx4(CodeBlock4, {
+              /* @__PURE__ */ jsx3(CodeBlock3, {
                 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 }
-      );
+                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`
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsxs4("div", {
+      /* @__PURE__ */ jsxs3("div", {
         className: "flex items-center gap-4 pt-4",
         children: [
-          /* @__PURE__ */ jsxs4(Link4, {
-            href: "/docs/guides/spec-validation-and-typing",
+          /* @__PURE__ */ jsxs3(Link3, {
+            href: "/docs/guides/generate-docs-clients-schemas",
             className: "btn-primary",
             children: [
-              "Type Safety Guide ",
-              /* @__PURE__ */ jsx4(ChevronRight4, {
+              "Client Generation Guide ",
+              /* @__PURE__ */ jsx3(ChevronRight3, {
                 size: 16
               })
             ]
           }),
-          /* @__PURE__ */ jsx4(Link4, {
-            href: "/docs/intent/generate-client-from-schema",
+          /* @__PURE__ */ jsx3(Link3, {
+            href: "/docs/intent/contract-first-api",
             className: "btn-ghost",
-            children: "Client Generation"
+            children: "Contract-first API"
           })
         ]
       })
@@ -958,128 +926,128 @@ export async function createUserHandler(request: Request) {
 
 // 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 { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-var metadata5 = new SeoOptimizer5().optimize(openapiAlternativeBrief2);
+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 { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var metadata4 = new SeoOptimizer4().optimize(openapiAlternativeBrief2);
 function OpenapiAlternativePage() {
-  return /* @__PURE__ */ jsxs5("div", {
+  return /* @__PURE__ */ jsxs4("div", {
     className: "space-y-8",
     children: [
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "space-y-3",
         children: [
-          /* @__PURE__ */ jsx5("h1", {
-            className: "text-4xl font-bold",
+          /* @__PURE__ */ jsx4("h1", {
+            className: "font-bold text-4xl",
             children: openapiAlternativeBrief2.title
           }),
-          /* @__PURE__ */ jsx5("p", {
-            className: "text-muted-foreground text-lg",
+          /* @__PURE__ */ jsx4("p", {
+            className: "text-lg text-muted-foreground",
             children: openapiAlternativeBrief2.summary
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "card-subtle space-y-4 p-6",
         children: [
-          /* @__PURE__ */ jsx5("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx4("h2", {
+            className: "font-bold text-2xl",
             children: "OpenAPI Limitations"
           }),
-          /* @__PURE__ */ jsx5("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: openapiAlternativeBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx5("li", {
+          /* @__PURE__ */ jsx4("ul", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: openapiAlternativeBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx4("li", {
               children: problem
             }, index))
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "card-subtle space-y-4 p-6",
         children: [
-          /* @__PURE__ */ jsx5("h2", {
-            className: "text-2xl font-bold",
+          /* @__PURE__ */ jsx4("h2", {
+            className: "font-bold text-2xl",
             children: "ContractSpec Advantages"
           }),
-          /* @__PURE__ */ jsx5("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: openapiAlternativeBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx5("li", {
+          /* @__PURE__ */ jsx4("ul", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: openapiAlternativeBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx4("li", {
               children: solution
             }, index))
           })
         ]
       }),
-      /* @__PURE__ */ jsxs5("div", {
+      /* @__PURE__ */ jsxs4("div", {
         className: "space-y-6",
         children: [
-          /* @__PURE__ */ jsxs5("div", {
+          /* @__PURE__ */ jsxs4("div", {
             className: "space-y-3",
             children: [
-              /* @__PURE__ */ jsx5("h2", {
-                className: "text-2xl font-bold",
+              /* @__PURE__ */ jsx4("h2", {
+                className: "font-bold text-2xl",
                 children: "Comparison: OpenAPI vs ContractSpec"
               }),
-              /* @__PURE__ */ jsx5("p", {
+              /* @__PURE__ */ jsx4("p", {
                 className: "text-muted-foreground text-sm",
                 children: "Key differences between OpenAPI documentation and ContractSpec executable contracts."
               }),
-              /* @__PURE__ */ jsxs5("div", {
+              /* @__PURE__ */ jsxs4("div", {
                 className: "grid gap-6 md:grid-cols-2",
                 children: [
-                  /* @__PURE__ */ jsxs5("div", {
+                  /* @__PURE__ */ jsxs4("div", {
                     className: "card-subtle space-y-3 p-4",
                     children: [
-                      /* @__PURE__ */ jsx5("h3", {
-                        className: "text-lg font-semibold",
+                      /* @__PURE__ */ jsx4("h3", {
+                        className: "font-semibold text-lg",
                         children: "OpenAPI"
                       }),
-                      /* @__PURE__ */ jsxs5("ul", {
-                        className: "text-muted-foreground space-y-1 text-sm",
+                      /* @__PURE__ */ jsxs4("ul", {
+                        className: "space-y-1 text-muted-foreground text-sm",
                         children: [
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Documentation specification only"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• No runtime validation"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Manual code generation"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Type safety requires tools"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Separate schemas from documentation"
                           })
                         ]
                       })
                     ]
                   }),
-                  /* @__PURE__ */ jsxs5("div", {
+                  /* @__PURE__ */ jsxs4("div", {
                     className: "card-subtle space-y-3 p-4",
                     children: [
-                      /* @__PURE__ */ jsx5("h3", {
-                        className: "text-lg font-semibold",
+                      /* @__PURE__ */ jsx4("h3", {
+                        className: "font-semibold text-lg",
                         children: "ContractSpec"
                       }),
-                      /* @__PURE__ */ jsxs5("ul", {
-                        className: "text-muted-foreground space-y-1 text-sm",
+                      /* @__PURE__ */ jsxs4("ul", {
+                        className: "space-y-1 text-muted-foreground text-sm",
                         children: [
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Executable contracts"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Built-in runtime validation"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Automatic code generation"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Type-safe by default"
                           }),
-                          /* @__PURE__ */ jsx5("li", {
+                          /* @__PURE__ */ jsx4("li", {
                             children: "• Unified spec and implementation"
                           })
                         ]
@@ -1090,29 +1058,264 @@ function OpenapiAlternativePage() {
               })
             ]
           }),
+          /* @__PURE__ */ jsxs4("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsx4("h2", {
+                className: "font-bold text-2xl",
+                children: "Export from Contracts"
+              }),
+              /* @__PURE__ */ jsx4("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Generate OpenAPI documentation from ContractSpec for existing tooling."
+              }),
+              /* @__PURE__ */ jsx4(CodeBlock4, {
+                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`
+              })
+            ]
+          }),
+          /* @__PURE__ */ jsxs4("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsx4("h2", {
+                className: "font-bold text-2xl",
+                children: "Beyond Documentation"
+              }),
+              /* @__PURE__ */ jsx4("p", {
+                className: "text-muted-foreground text-sm",
+                children: "ContractSpec provides more than just API documentation."
+              }),
+              /* @__PURE__ */ jsx4(CodeBlock4, {
+                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(),
+};`
+              })
+            ]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs4("div", {
+        className: "flex items-center gap-4 pt-4",
+        children: [
+          /* @__PURE__ */ jsxs4(Link4, {
+            href: "/docs/guides/generate-docs-clients-schemas",
+            className: "btn-primary",
+            children: [
+              "Generate from Contracts ",
+              /* @__PURE__ */ jsx4(ChevronRight4, {
+                size: 16
+              })
+            ]
+          }),
+          /* @__PURE__ */ jsx4(Link4, {
+            href: "/docs/intent/generate-client-from-schema",
+            className: "btn-ghost",
+            children: "Client Generation"
+          })
+        ]
+      })
+    ]
+  });
+}
+
+// src/components/docs/intent/SchemaValidationTypescriptPage.tsx
+import { schemaValidationTypescriptBrief as schemaValidationTypescriptBrief2 } 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 { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var metadata5 = new SeoOptimizer5().optimize(schemaValidationTypescriptBrief2);
+function SchemaValidationTypescriptPage() {
+  return /* @__PURE__ */ jsxs5("div", {
+    className: "space-y-8",
+    children: [
+      /* @__PURE__ */ jsxs5("div", {
+        className: "space-y-3",
+        children: [
+          /* @__PURE__ */ jsx5("h1", {
+            className: "font-bold text-4xl",
+            children: schemaValidationTypescriptBrief2.title
+          }),
+          /* @__PURE__ */ jsx5("p", {
+            className: "text-lg text-muted-foreground",
+            children: schemaValidationTypescriptBrief2.summary
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs5("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsx5("h2", {
+            className: "font-bold text-2xl",
+            children: "Validation Pain Points"
+          }),
+          /* @__PURE__ */ jsx5("ul", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: schemaValidationTypescriptBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx5("li", {
+              children: problem
+            }, index))
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs5("div", {
+        className: "card-subtle space-y-4 p-6",
+        children: [
+          /* @__PURE__ */ jsx5("h2", {
+            className: "font-bold text-2xl",
+            children: "Type-safe Solutions"
+          }),
+          /* @__PURE__ */ jsx5("ul", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: schemaValidationTypescriptBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx5("li", {
+              children: solution
+            }, index))
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs5("div", {
+        className: "space-y-6",
+        children: [
+          /* @__PURE__ */ jsxs5("div", {
+            className: "space-y-3",
+            children: [
+              /* @__PURE__ */ jsx5("h2", {
+                className: "font-bold text-2xl",
+                children: "Contract Schema"
+              }),
+              /* @__PURE__ */ jsx5("p", {
+                className: "text-muted-foreground text-sm",
+                children: "Define data models with automatic TypeScript generation."
+              }),
+              /* @__PURE__ */ jsx5(CodeBlock5, {
+                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',
+  },
+});`
+              })
+            ]
+          }),
           /* @__PURE__ */ jsxs5("div", {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx5("h2", {
-                className: "text-2xl font-bold",
-                children: "Export from Contracts"
+                className: "font-bold text-2xl",
+                children: "Generated Types"
               }),
               /* @__PURE__ */ jsx5("p", {
                 className: "text-muted-foreground text-sm",
-                children: "Generate OpenAPI documentation from ContractSpec for existing tooling."
+                children: "TypeScript types are automatically generated with proper validation."
               }),
               /* @__PURE__ */ jsx5(CodeBlock5, {
-                language: "bash",
-                filename: "export-openapi",
-                code: `# From ContractSpec contracts
-contractspec openapi export \\
-  --registry ./src/contracts/registry.ts \\
-  --format yaml \\
-  --out ./openapi.yaml
+                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;
+}
 
-# Compare: Manual OpenAPI vs Generated
-# Manual: Write OpenAPI by hand, maintain separately
-# Generated: Single source of truth, always in sync`
+// 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;
+}`
               })
             ]
           }),
@@ -1120,47 +1323,45 @@ contractspec openapi export \\
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx5("h2", {
-                className: "text-2xl font-bold",
-                children: "Beyond Documentation"
+                className: "font-bold text-2xl",
+                children: "Runtime Validation"
               }),
               /* @__PURE__ */ jsx5("p", {
                 className: "text-muted-foreground text-sm",
-                children: "ContractSpec provides more than just API documentation."
+                children: "Use generated validation in your API handlers with zero boilerplate."
               }),
               /* @__PURE__ */ jsx5(CodeBlock5, {
                 language: "typescript",
-                filename: "multi-output-example.ts",
-                code: `// One contract, multiple outputs
-import { UserApiContract } from './contracts/user-api.contract';
+                filename: "src/handlers/user-handler.ts",
+                code: `import { validateUser } from '../generated/types/user';
 
-// 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(),
-};`
+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;
+  }
+}`
               })
             ]
           })
@@ -1170,10 +1371,10 @@ export const outputs = {
         className: "flex items-center gap-4 pt-4",
         children: [
           /* @__PURE__ */ jsxs5(Link5, {
-            href: "/docs/guides/generate-docs-clients-schemas",
+            href: "/docs/guides/spec-validation-and-typing",
             className: "btn-primary",
             children: [
-              "Generate from Contracts ",
+              "Type Safety Guide ",
               /* @__PURE__ */ jsx5(ChevronRight5, {
                 size: 16
               })
@@ -1190,15 +1391,15 @@ export const outputs = {
   });
 }
 
-// src/components/docs/intent/GenerateClientFromSchemaPage.tsx
-import { generateClientFromSchemaBrief as generateClientFromSchemaBrief2 } from "@contractspec/bundle.library/components/docs/intent/intent-pages.docblocks";
+// src/components/docs/intent/SpecDrivenDevelopmentPage.tsx
+import { specDrivenDevelopmentBrief as specDrivenDevelopmentBrief2 } 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 { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
-var metadata6 = new SeoOptimizer6().optimize(generateClientFromSchemaBrief2);
-function GenerateClientFromSchemaPage() {
+var metadata6 = new SeoOptimizer6().optimize(specDrivenDevelopmentBrief2);
+function SpecDrivenDevelopmentPage() {
   return /* @__PURE__ */ jsxs6("div", {
     className: "space-y-8",
     children: [
@@ -1206,12 +1407,12 @@ function GenerateClientFromSchemaPage() {
         className: "space-y-3",
         children: [
           /* @__PURE__ */ jsx6("h1", {
-            className: "text-4xl font-bold",
-            children: generateClientFromSchemaBrief2.title
+            className: "font-bold text-4xl",
+            children: specDrivenDevelopmentBrief2.title
           }),
           /* @__PURE__ */ jsx6("p", {
-            className: "text-muted-foreground text-lg",
-            children: generateClientFromSchemaBrief2.summary
+            className: "text-lg text-muted-foreground",
+            children: specDrivenDevelopmentBrief2.summary
           })
         ]
       }),
@@ -1219,12 +1420,12 @@ function GenerateClientFromSchemaPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx6("h2", {
-            className: "text-2xl font-bold",
-            children: "Client Development Problems"
+            className: "font-bold text-2xl",
+            children: "Why Spec-driven?"
           }),
           /* @__PURE__ */ jsx6("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: generateClientFromSchemaBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx6("li", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: specDrivenDevelopmentBrief2.problems.map((problem, index) => /* @__PURE__ */ jsx6("li", {
               children: problem
             }, index))
           })
@@ -1234,12 +1435,12 @@ function GenerateClientFromSchemaPage() {
         className: "card-subtle space-y-4 p-6",
         children: [
           /* @__PURE__ */ jsx6("h2", {
-            className: "text-2xl font-bold",
-            children: "Automated Solutions"
+            className: "font-bold text-2xl",
+            children: "Benefits"
           }),
           /* @__PURE__ */ jsx6("ul", {
-            className: "text-muted-foreground space-y-2 text-sm",
-            children: generateClientFromSchemaBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx6("li", {
+            className: "space-y-2 text-muted-foreground text-sm",
+            children: specDrivenDevelopmentBrief2.solutions.map((solution, index) => /* @__PURE__ */ jsx6("li", {
               children: solution
             }, index))
           })
@@ -1252,64 +1453,27 @@ function GenerateClientFromSchemaPage() {
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
-                children: "Contract Definition"
+                className: "font-bold text-2xl",
+                children: "Feature Specification Example"
               }),
               /* @__PURE__ */ jsx6("p", {
                 className: "text-muted-foreground text-sm",
-                children: "Define your API contract once, generate clients for any language."
+                children: "Define a complete feature with operations, events, and data models."
               }),
               /* @__PURE__ */ jsx6(CodeBlock6, {
                 language: "typescript",
-                filename: "src/contracts/api.contract.ts",
-                code: `import { defineContract } from '@contractspec/lib.contracts-spec';
+                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 ApiContract = defineContract({
-  name: 'MyAPI',
-  version: '1.0.0',
-  baseUrl: 'https://api.example.com',
+export const UserManagementFeature = defineFeature({
+  goal: 'Complete user management system with CRUD operations',
+  context: 'Handles user lifecycle from creation to deletion with proper authorization',
   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',
+    createUser: defineOperation({
+      goal: 'Create a new user account',
       input: new SchemaModel({
         type: 'object',
         properties: {
@@ -1323,14 +1487,53 @@ export const ApiContract = defineContract({
           id: { type: 'string', required: true },
           email: { type: 'string', required: true },
           name: { type: 'string', required: true },
-          createdAt: { type: 'string', format: 'date-time', 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: {
-    description: 'User management API with authentication',
-    tags: ['users', 'authentication'],
+    name: 'user-management',
+    version: '1.0.0',
+    description: 'Complete user management with operations and events',
   },
 });`
               })
@@ -1340,222 +1543,19 @@ export const ApiContract = defineContract({
             className: "space-y-3",
             children: [
               /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
-                children: "Generate Multiple Clients"
+                className: "font-bold text-2xl",
+                children: "Generate Type-safe Implementations"
               }),
               /* @__PURE__ */ jsx6("p", {
                 className: "text-muted-foreground text-sm",
-                children: "Generate type-safe clients for any language from the same contract."
+                children: "Generate validation, types, and API handlers from your feature."
               }),
               /* @__PURE__ */ jsx6(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`
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsxs6("div", {
-            className: "space-y-3",
-            children: [
-              /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
-                children: "Generated Client Examples"
-              }),
-              /* @__PURE__ */ jsx6("p", {
-                className: "text-muted-foreground text-sm",
-                children: "Each generated client is fully type-safe and idiomatic."
-              }),
-              /* @__PURE__ */ jsxs6("div", {
-                className: "space-y-4",
-                children: [
-                  /* @__PURE__ */ jsxs6("div", {
-                    className: "card-subtle p-4",
-                    children: [
-                      /* @__PURE__ */ jsx6("h4", {
-                        className: "text-lg font-semibold",
-                        children: "TypeScript Client"
-                      }),
-                      /* @__PURE__ */ jsx6(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`
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsxs6("div", {
-                    className: "card-subtle p-4",
-                    children: [
-                      /* @__PURE__ */ jsx6("h4", {
-                        className: "text-lg font-semibold",
-                        children: "Python Client"
-                      }),
-                      /* @__PURE__ */ jsx6(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`
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsxs6("div", {
-                    className: "card-subtle p-4",
-                    children: [
-                      /* @__PURE__ */ jsx6("h4", {
-                        className: "text-lg font-semibold",
-                        children: "Go Client"
-                      }),
-                      /* @__PURE__ */ jsx6(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
-}`
-                      })
-                    ]
-                  })
-                ]
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsxs6("div", {
-            className: "space-y-3",
-            children: [
-              /* @__PURE__ */ jsx6("h2", {
-                className: "text-2xl font-bold",
-                children: "Advanced Features"
-              }),
-              /* @__PURE__ */ jsx6("p", {
-                className: "text-muted-foreground text-sm",
-                children: "Generated clients include enterprise-grade features out of the box."
-              }),
-              /* @__PURE__ */ jsx6(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`
+                filename: "generate-from-feature",
+                code: `contractspec generate \\
+  --input ./src/contracts/user-management.feature.ts \\
+  --output ./generated/user-management`
               })
             ]
           })
@@ -1565,19 +1565,19 @@ controller.abort(); // Cancels the request`
         className: "flex items-center gap-4 pt-4",
         children: [
           /* @__PURE__ */ jsxs6(Link6, {
-            href: "/docs/guides/generate-docs-clients-schemas",
+            href: "/docs/guides/spec-validation-and-typing",
             className: "btn-primary",
             children: [
-              "Client Generation Guide ",
+              "Type Safety Guide ",
               /* @__PURE__ */ jsx6(ChevronRight6, {
                 size: 16
               })
             ]
           }),
           /* @__PURE__ */ jsx6(Link6, {
-            href: "/docs/intent/contract-first-api",
+            href: "/docs/intent/deterministic-codegen",
             className: "btn-ghost",
-            children: "Contract-first API"
+            children: "Deterministic Codegen"
           })
         ]
       })