@contractspec/bundle.library 0.0.0-canary-20260206014742

package/dist/components/docs/guides/GuideContractTypesPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuideContractTypesPage.js","names":[],"sources":["../../../../src/components/docs/guides/GuideContractTypesPage.tsx"],"sourcesContent":["import { CodeBlock } from '@contractspec/lib.design-system';\nimport Link from '@contractspec/lib.ui-link';\nimport { ChevronRight, Layers, Zap, Shield, Globe } from 'lucide-react';\nimport { StudioPrompt } from '../shared/StudioPrompt';\n\nconst contractTypes = [\n  {\n    name: 'Operations',\n    factory: 'defineCommand / defineQuery',\n    description:\n      'API endpoints with input/output schemas, validation, and policy.',\n    icon: Zap,\n    color: 'text-blue-400',\n  },\n  {\n    name: 'Events',\n    factory: 'defineEvent',\n    description: 'Domain events with typed payloads and PII handling.',\n    icon: Layers,\n    color: 'text-green-400',\n  },\n  {\n    name: 'Capabilities',\n    factory: 'defineCapability',\n    description: 'Feature groupings that link operations, events, and UIs.',\n    icon: Shield,\n    color: 'text-purple-400',\n  },\n  {\n    name: 'Presentations',\n    factory: 'definePresentation',\n    description:\n      'UI specifications for rendering data and handling interactions.',\n    icon: Globe,\n    color: 'text-orange-400',\n  },\n];\n\nexport function GuideContractTypesPage() {\n  return (\n    <div className=\"space-y-8\">\n      <div className=\"space-y-3\">\n        <h1 className=\"text-4xl font-bold\">Contract Types Overview</h1>\n        <p className=\"text-muted-foreground text-lg\">\n          Learn about the different contract types in ContractSpec and when to\n          use each one for spec-first development.\n        </p>\n      </div>\n\n      <div className=\"card-subtle space-y-4 p-6\">\n        <h2 className=\"text-2xl font-bold\">Core Contract Types</h2>\n        <div className=\"grid gap-3 md:grid-cols-2\">\n          {contractTypes.map((type) => (\n            <div\n              key={type.name}\n              className=\"flex items-start gap-3 rounded-lg border border-white/10 p-4\"\n            >\n              <type.icon className={type.color} size={20} />\n              <div className=\"space-y-1\">\n                <h3 className=\"font-semibold\">{type.name}</h3>\n                <p className=\"text-muted-foreground text-xs\">\n                  {type.description}\n                </p>\n                <code className=\"text-xs text-violet-400\">{type.factory}</code>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n\n      {/* Operations Section */}\n      <div className=\"space-y-6\">\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">\n            1) Operations (Commands & Queries)\n          </h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Operations are the backbone of your API. Commands mutate state,\n            queries read state. Both have typed input/output schemas.\n          </p>\n          <CodeBlock\n            language=\"typescript\"\n            filename=\"src/contracts/user.operation.ts\"\n            code={`import { defineCommand, defineQuery } from \"@contractspec/lib.contracts\";\nimport { SchemaModel, ScalarTypeEnum } from \"@contractspec/lib.schema\";\n\n// Command: Mutates state (creates a user)\nexport const CreateUserCommand = defineCommand({\n  meta: {\n    key: \"user.create\",\n    version: \"1.0.0\",\n    description: \"Create a new user account\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\", \"auth\"],\n  },\n  io: {\n    input: new SchemaModel({\n      name: \"CreateUserInput\",\n      fields: {\n        email: { type: ScalarTypeEnum.Email(), isOptional: false },\n        name: { type: ScalarTypeEnum.NonEmptyString(), isOptional: false },\n      },\n    }),\n    output: new SchemaModel({\n      name: \"CreateUserOutput\",\n      fields: {\n        id: { type: ScalarTypeEnum.UUID(), isOptional: false },\n        email: { type: ScalarTypeEnum.Email(), isOptional: false },\n      },\n    }),\n    errors: {\n      EMAIL_EXISTS: {\n        description: \"Email already registered\",\n        http: 409,\n        when: \"User with this email already exists\",\n      },\n    },\n  },\n  policy: { auth: \"admin\" },\n});\n\n// Query: Reads state (gets user by ID)\nexport const GetUserQuery = defineQuery({\n  meta: {\n    key: \"user.get\",\n    version: \"1.0.0\",\n    description: \"Get user by ID\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\"],\n  },\n  io: {\n    input: new SchemaModel({\n      name: \"GetUserInput\",\n      fields: {\n        id: { type: ScalarTypeEnum.UUID(), isOptional: false },\n      },\n    }),\n    output: new SchemaModel({\n      name: \"GetUserOutput\",\n      fields: {\n        id: { type: ScalarTypeEnum.UUID(), isOptional: false },\n        email: { type: ScalarTypeEnum.Email(), isOptional: false },\n        name: { type: ScalarTypeEnum.String(), isOptional: false },\n      },\n    }),\n  },\n  policy: { auth: \"user\" },\n});`}\n          />\n        </div>\n\n        {/* Events Section */}\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">2) Events</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Events represent domain occurrences. They have typed payloads with\n            PII field marking for compliance.\n          </p>\n          <CodeBlock\n            language=\"typescript\"\n            filename=\"src/contracts/user.event.ts\"\n            code={`import { defineEvent } from \"@contractspec/lib.contracts\";\nimport { SchemaModel, ScalarTypeEnum } from \"@contractspec/lib.schema\";\n\nexport const UserCreatedEvent = defineEvent({\n  meta: {\n    key: \"user.created\",\n    version: \"1.0.0\",\n    description: \"Emitted when a new user is created\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\", \"auth\"],\n  },\n  // Mark PII fields for redaction in logs/exports\n  pii: [\"email\"],\n  payload: new SchemaModel({\n    name: \"UserCreatedPayload\",\n    fields: {\n      userId: { type: ScalarTypeEnum.UUID(), isOptional: false },\n      email: { type: ScalarTypeEnum.Email(), isOptional: false },\n      createdAt: { type: ScalarTypeEnum.DateTime(), isOptional: false },\n    },\n  }),\n});\n\nexport const UserDeletedEvent = defineEvent({\n  meta: {\n    key: \"user.deleted\",\n    version: \"1.0.0\",\n    description: \"Emitted when a user is deleted\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\"],\n  },\n  payload: new SchemaModel({\n    name: \"UserDeletedPayload\",\n    fields: {\n      userId: { type: ScalarTypeEnum.UUID(), isOptional: false },\n      deletedAt: { type: ScalarTypeEnum.DateTime(), isOptional: false },\n      reason: { type: ScalarTypeEnum.String(), isOptional: true },\n    },\n  }),\n});`}\n          />\n        </div>\n\n        {/* Capabilities Section */}\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">3) Capabilities</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Capabilities group related operations, events, and presentations.\n            They define feature boundaries and dependencies.\n          </p>\n          <CodeBlock\n            language=\"typescript\"\n            filename=\"src/contracts/user-management.capability.ts\"\n            code={`import { defineCapability } from \"@contractspec/lib.contracts\";\n\nexport const UserManagementCapability = defineCapability({\n  meta: {\n    key: \"user.management\",\n    version: \"1.0.0\",\n    description: \"User account management features\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\", \"core\"],\n    kind: \"api\",\n  },\n  // Operations/events this capability provides\n  provides: [\n    { surface: \"operation\", key: \"user.create\", version: \"1.0.0\" },\n    { surface: \"operation\", key: \"user.get\", version: \"1.0.0\" },\n    { surface: \"operation\", key: \"user.delete\", version: \"1.0.0\" },\n    { surface: \"event\", key: \"user.created\", version: \"1.0.0\" },\n    { surface: \"event\", key: \"user.deleted\", version: \"1.0.0\" },\n  ],\n  // Dependencies on other capabilities\n  requires: [\n    { key: \"auth.core\", reason: \"Needs authentication for user operations\" },\n  ],\n});\n\n// Capabilities can extend other capabilities\nexport const AdminUserCapability = defineCapability({\n  meta: {\n    key: \"user.admin\",\n    version: \"1.0.0\",\n    description: \"Admin-only user management features\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\", \"admin\"],\n    kind: \"api\",\n  },\n  // Inherit from base capability\n  extends: { key: \"user.management\", version: \"1.0.0\" },\n  provides: [\n    { surface: \"operation\", key: \"user.ban\", version: \"1.0.0\" },\n    { surface: \"operation\", key: \"user.impersonate\", version: \"1.0.0\" },\n  ],\n});`}\n          />\n        </div>\n\n        {/* Presentations Section */}\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">4) Presentations</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Presentations define UI specifications. They link to capabilities\n            and specify how data should be displayed.\n          </p>\n          <CodeBlock\n            language=\"typescript\"\n            filename=\"src/contracts/user-list.presentation.ts\"\n            code={`import { definePresentation } from \"@contractspec/lib.contracts\";\n\nexport const UserListPresentation = definePresentation({\n  meta: {\n    key: \"users.list\",\n    version: \"1.0.0\",\n    description: \"Display a list of users with search and pagination\",\n    stability: \"stable\",\n    owners: [\"platform.core\"],\n    tags: [\"users\", \"ui\"],\n  },\n  // Link to capability that provides data\n  capability: { key: \"user.management\", version: \"1.0.0\" },\n  // UI specifications\n  config: {\n    title: \"Users\",\n    layout: \"table\",\n    columns: [\"name\", \"email\", \"createdAt\", \"status\"],\n    actions: [\"view\", \"edit\", \"delete\"],\n    pagination: { defaultPageSize: 25 },\n    search: { fields: [\"name\", \"email\"] },\n  },\n});`}\n          />\n        </div>\n\n        {/* Additional Types Section */}\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">5) Additional Contract Types</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            ContractSpec provides specialized contracts for different concerns:\n          </p>\n          <div className=\"grid gap-4 md:grid-cols-2\">\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Policy</h3>\n              <code className=\"text-xs text-violet-400\">definePolicy</code>\n              <p className=\"text-muted-foreground text-xs\">\n                RBAC/ABAC rules, rate limits, and access control.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Workflow</h3>\n              <code className=\"text-xs text-violet-400\">defineWorkflow</code>\n              <p className=\"text-muted-foreground text-xs\">\n                Multi-step processes with states, transitions, and SLAs.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Translation</h3>\n              <code className=\"text-xs text-violet-400\">defineTranslation</code>\n              <p className=\"text-muted-foreground text-xs\">\n                i18n messages with ICU format and locale fallbacks.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Integration</h3>\n              <code className=\"text-xs text-violet-400\">defineIntegration</code>\n              <p className=\"text-muted-foreground text-xs\">\n                External service connections and API adapters.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Form</h3>\n              <code className=\"text-xs text-violet-400\">defineFormSpec</code>\n              <p className=\"text-muted-foreground text-xs\">\n                Form definitions with fields, validation, and layouts.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Data View</h3>\n              <code className=\"text-xs text-violet-400\">defineDataView</code>\n              <p className=\"text-muted-foreground text-xs\">\n                Read-only data projections and aggregations.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Feature</h3>\n              <code className=\"text-xs text-violet-400\">defineFeature</code>\n              <p className=\"text-muted-foreground text-xs\">\n                Feature flags and progressive rollout configurations.\n              </p>\n            </div>\n            <div className=\"card-subtle space-y-2 p-4\">\n              <h3 className=\"font-semibold\">Test</h3>\n              <code className=\"text-xs text-violet-400\">defineTestSpec</code>\n              <p className=\"text-muted-foreground text-xs\">\n                Contract-driven test scenarios and fixtures.\n              </p>\n            </div>\n          </div>\n        </div>\n\n        {/* Registry Section */}\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">6) Registering Contracts</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Each contract type has a registry for lookup and validation.\n          </p>\n          <CodeBlock\n            language=\"typescript\"\n            filename=\"src/contracts/registry.ts\"\n            code={`import {\n  OperationSpecRegistry,\n  installOp,\n} from \"@contractspec/lib.contracts/operations\";\nimport { EventRegistry } from \"@contractspec/lib.contracts\";\nimport { CapabilityRegistry } from \"@contractspec/lib.contracts/capabilities\";\n\n// Import your contracts\nimport { CreateUserCommand, GetUserQuery } from \"./user.operation\";\nimport { UserCreatedEvent } from \"./user.event\";\nimport { UserManagementCapability } from \"./user-management.capability\";\n\n// Create registries\nexport const operationRegistry = new OperationSpecRegistry();\nexport const eventRegistry = new EventRegistry();\nexport const capabilityRegistry = new CapabilityRegistry();\n\n// Register operations with handlers\ninstallOp(operationRegistry, CreateUserCommand, async (input) => {\n  // Your implementation here\n  return { id: \"uuid\", email: input.email };\n});\n\ninstallOp(operationRegistry, GetUserQuery, async (input) => {\n  // Your implementation here\n  return { id: input.id, email: \"user@example.com\", name: \"User\" };\n});\n\n// Register events and capabilities\neventRegistry.register(UserCreatedEvent);\ncapabilityRegistry.register(UserManagementCapability);`}\n          />\n        </div>\n\n        <div className=\"card-subtle space-y-3 p-6\">\n          <h3 className=\"text-lg font-semibold\">\n            Contract Type Decision Guide\n          </h3>\n          <table className=\"w-full text-sm\">\n            <thead>\n              <tr className=\"border-b border-white/10\">\n                <th className=\"py-2 text-left\">When you need...</th>\n                <th className=\"py-2 text-left\">Use this contract</th>\n              </tr>\n            </thead>\n            <tbody className=\"text-muted-foreground\">\n              <tr className=\"border-b border-white/5\">\n                <td className=\"py-2\">An API endpoint that changes data</td>\n                <td className=\"py-2\">\n                  <code>defineCommand</code>\n                </td>\n              </tr>\n              <tr className=\"border-b border-white/5\">\n                <td className=\"py-2\">An API endpoint that reads data</td>\n                <td className=\"py-2\">\n                  <code>defineQuery</code>\n                </td>\n              </tr>\n              <tr className=\"border-b border-white/5\">\n                <td className=\"py-2\">\n                  Async notification of something that happened\n                </td>\n                <td className=\"py-2\">\n                  <code>defineEvent</code>\n                </td>\n              </tr>\n              <tr className=\"border-b border-white/5\">\n                <td className=\"py-2\">Group related specs under a feature</td>\n                <td className=\"py-2\">\n                  <code>defineCapability</code>\n                </td>\n              </tr>\n              <tr className=\"border-b border-white/5\">\n                <td className=\"py-2\">Define UI rendering specifications</td>\n                <td className=\"py-2\">\n                  <code>definePresentation</code>\n                </td>\n              </tr>\n              <tr className=\"border-b border-white/5\">\n                <td className=\"py-2\">Access control and rate limiting</td>\n                <td className=\"py-2\">\n                  <code>definePolicy</code>\n                </td>\n              </tr>\n              <tr>\n                <td className=\"py-2\">Multi-step business processes</td>\n                <td className=\"py-2\">\n                  <code>defineWorkflow</code>\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n\n        <StudioPrompt\n          title=\"Want visual contract design?\"\n          body=\"Studio provides a visual editor for creating and managing contracts with team collaboration and version control.\"\n        />\n      </div>\n\n      <div className=\"flex items-center gap-4 pt-4\">\n        <Link href=\"/docs/guides/nextjs-one-endpoint\" className=\"btn-primary\">\n          Next: Add your first endpoint <ChevronRight size={16} />\n        </Link>\n        <Link href=\"/docs/guides\" className=\"btn-ghost\">\n          Back to guides\n        </Link>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAKA,MAAM,gBAAgB;CACpB;EACE,MAAM;EACN,SAAS;EACT,aACE;EACF,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,SAAS;EACT,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,SAAS;EACT,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,SAAS;EACT,aACE;EACF,MAAM;EACN,OAAO;EACR;CACF;AAED,SAAgB,yBAAyB;AACvC,QACE,qBAAC;EAAI,WAAU;;GACb,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eAAqB;MAA4B,EAC/D,oBAAC;KAAE,WAAU;eAAgC;MAGzC;KACA;GAEN,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eAAqB;MAAwB,EAC3D,oBAAC;KAAI,WAAU;eACZ,cAAc,KAAK,SAClB,qBAAC;MAEC,WAAU;iBAEV,oBAAC,KAAK;OAAK,WAAW,KAAK;OAAO,MAAM;QAAM,EAC9C,qBAAC;OAAI,WAAU;;QACb,oBAAC;SAAG,WAAU;mBAAiB,KAAK;UAAU;QAC9C,oBAAC;SAAE,WAAU;mBACV,KAAK;UACJ;QACJ,oBAAC;SAAK,WAAU;mBAA2B,KAAK;UAAe;;QAC3D;QAVD,KAAK,KAWN,CACN;MACE;KACF;GAGN,qBAAC;IAAI,WAAU;;KACb,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAE9B;OACL,oBAAC;QAAE,WAAU;kBAAgC;SAGzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAmEN;;OACE;KAGN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAc;OACjD,oBAAC;QAAE,WAAU;kBAAgC;SAGzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SA0CN;;OACE;KAGN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAoB;OACvD,oBAAC;QAAE,WAAU;kBAAgC;SAGzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SA4CN;;OACE;KAGN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAqB;OACxD,oBAAC;QAAE,WAAU;kBAAgC;SAGzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;;;;;;;;;;;;;;;;;;;;SAuBN;;OACE;KAGN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAiC;OACpE,oBAAC;QAAE,WAAU;kBAAgC;SAEzC;OACJ,qBAAC;QAAI,WAAU;;SACb,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAW;WACzC,oBAAC;YAAK,WAAU;sBAA0B;aAAmB;WAC7D,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAa;WAC3C,oBAAC;YAAK,WAAU;sBAA0B;aAAqB;WAC/D,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAgB;WAC9C,oBAAC;YAAK,WAAU;sBAA0B;aAAwB;WAClE,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAgB;WAC9C,oBAAC;YAAK,WAAU;sBAA0B;aAAwB;WAClE,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAS;WACvC,oBAAC;YAAK,WAAU;sBAA0B;aAAqB;WAC/D,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAc;WAC5C,oBAAC;YAAK,WAAU;sBAA0B;aAAqB;WAC/D,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAY;WAC1C,oBAAC;YAAK,WAAU;sBAA0B;aAAoB;WAC9D,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;SACN,qBAAC;UAAI,WAAU;;WACb,oBAAC;YAAG,WAAU;sBAAgB;aAAS;WACvC,oBAAC;YAAK,WAAU;sBAA0B;aAAqB;WAC/D,oBAAC;YAAE,WAAU;sBAAgC;aAEzC;;WACA;;SACF;;OACF;KAGN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAA6B;OAChE,oBAAC;QAAE,WAAU;kBAAgC;SAEzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SA+BN;;OACE;KAEN,qBAAC;MAAI,WAAU;iBACb,oBAAC;OAAG,WAAU;iBAAwB;QAEjC,EACL,qBAAC;OAAM,WAAU;kBACf,oBAAC,qBACC,qBAAC;QAAG,WAAU;mBACZ,oBAAC;SAAG,WAAU;mBAAiB;UAAqB,EACpD,oBAAC;SAAG,WAAU;mBAAiB;UAAsB;SAClD,GACC,EACR,qBAAC;QAAM,WAAU;;SACf,qBAAC;UAAG,WAAU;qBACZ,oBAAC;WAAG,WAAU;qBAAO;YAAsC,EAC3D,oBAAC;WAAG,WAAU;qBACZ,oBAAC,oBAAK,kBAAoB;YACvB;WACF;SACL,qBAAC;UAAG,WAAU;qBACZ,oBAAC;WAAG,WAAU;qBAAO;YAAoC,EACzD,oBAAC;WAAG,WAAU;qBACZ,oBAAC,oBAAK,gBAAkB;YACrB;WACF;SACL,qBAAC;UAAG,WAAU;qBACZ,oBAAC;WAAG,WAAU;qBAAO;YAEhB,EACL,oBAAC;WAAG,WAAU;qBACZ,oBAAC,oBAAK,gBAAkB;YACrB;WACF;SACL,qBAAC;UAAG,WAAU;qBACZ,oBAAC;WAAG,WAAU;qBAAO;YAAwC,EAC7D,oBAAC;WAAG,WAAU;qBACZ,oBAAC,oBAAK,qBAAuB;YAC1B;WACF;SACL,qBAAC;UAAG,WAAU;qBACZ,oBAAC;WAAG,WAAU;qBAAO;YAAuC,EAC5D,oBAAC;WAAG,WAAU;qBACZ,oBAAC,oBAAK,uBAAyB;YAC5B;WACF;SACL,qBAAC;UAAG,WAAU;qBACZ,oBAAC;WAAG,WAAU;qBAAO;YAAqC,EAC1D,oBAAC;WAAG,WAAU;qBACZ,oBAAC,oBAAK,iBAAmB;YACtB;WACF;SACL,qBAAC,mBACC,oBAAC;UAAG,WAAU;oBAAO;WAAkC,EACvD,oBAAC;UAAG,WAAU;oBACZ,oBAAC,oBAAK,mBAAqB;WACxB,IACF;;SACC;QACF;OACJ;KAEN,oBAAC;MACC,OAAM;MACN,MAAK;OACL;;KACE;GAEN,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAK,MAAK;KAAmC,WAAU;gBAAc,kCACtC,oBAAC,gBAAa,MAAM,KAAM;MACnD,EACP,oBAAC;KAAK,MAAK;KAAe,WAAU;eAAY;MAEzC;KACH;;GACF"}

package/dist/components/docs/guides/GuideDocsPipelinePage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/guides/GuideDocsPipelinePage.d.ts
+declare function GuideDocsPipelinePage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { GuideDocsPipelinePage };
+//# sourceMappingURL=GuideDocsPipelinePage.d.ts.map

package/dist/components/docs/guides/GuideDocsPipelinePage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuideDocsPipelinePage.d.ts","names":[],"sources":["../../../../src/components/docs/guides/GuideDocsPipelinePage.tsx"],"mappings":";;;iBAKgB,qBAAA,CAAA,GAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/guides/GuideDocsPipelinePage.js

@@ -0,0 +1,166 @@
+import { StudioPrompt } from "../shared/StudioPrompt.js";
+import { ChevronRight } from "lucide-react";
+import { CodeBlock } from "@contractspec/lib.design-system";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "@contractspec/lib.ui-link";
+
+//#region src/components/docs/guides/GuideDocsPipelinePage.tsx
+function GuideDocsPipelinePage() {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-8",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-3",
+				children: [/* @__PURE__ */ jsx("h1", {
+					className: "text-4xl font-bold",
+					children: "Build the docs pipeline"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground text-lg",
+					children: "Generate reference docs, chunk the index, and wire the docs pages the same way this repo does."
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "card-subtle space-y-4 p-6",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "text-2xl font-bold",
+					children: "What you'll build"
+				}), /* @__PURE__ */ jsxs("ul", {
+					className: "text-muted-foreground space-y-2 text-sm",
+					children: [
+						/* @__PURE__ */ jsx("li", { children: "Generated Markdown and a chunked index manifest." }),
+						/* @__PURE__ */ jsx("li", { children: "Reference routes powered by the docs loader." }),
+						/* @__PURE__ */ jsx("li", { children: "Versioned outputs you can publish per release." })
+					]
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-6",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ jsx("h2", {
+								className: "text-2xl font-bold",
+								children: "1) Generate contract docs"
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "bash",
+								filename: "generate-contract-docs",
+								code: `contractspec generate`
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground text-sm",
+								children: [
+									"Expected output: Markdown in ",
+									/* @__PURE__ */ jsx("code", { children: "generated/docs" }),
+									"."
+								]
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ jsx("h2", {
+								className: "text-2xl font-bold",
+								children: "2) Build the docs index"
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "bash",
+								filename: "docs-generate",
+								code: `bun docs:generate
+# versioned output
+bun docs:generate -- --version v1.0.0`
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground text-sm",
+								children: [
+									"This writes ",
+									/* @__PURE__ */ jsx("code", { children: "docs-index.manifest.json" }),
+									" and chunked",
+									/* @__PURE__ */ jsx("code", { children: "docs-index.*.json" }),
+									" files in the generated docs bundle."
+								]
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ jsx("h2", {
+								className: "text-2xl font-bold",
+								children: "3) Wire reference routes"
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "tsx",
+								filename: "docs-reference-route",
+								code: `import { notFound } from "next/navigation";
+import {
+  DocsReferenceIndexPage,
+  DocsReferencePage,
+  getGeneratedDocById,
+  listGeneratedDocs,
+} from "@contractspec/bundle.library";
+
+export async function generateStaticParams() {
+  const docs = await listGeneratedDocs();
+  return docs.map((doc) => ({ slug: doc.id.split("/") }));
+}
+
+export default async function Page({ params }: { params: { slug?: string[] } }) {
+  const slug = params.slug?.join("/") ?? "";
+  const doc = await getGeneratedDocById(slug);
+  if (!doc) notFound();
+  return <DocsReferencePage entry={doc.entry} content={doc.content} />;
+}`
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground text-sm",
+								children: [
+									"Use the index page on ",
+									/* @__PURE__ */ jsx("code", { children: "/docs/reference" }),
+									" to render the searchable list."
+								]
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "card-subtle space-y-3 p-6",
+						children: [/* @__PURE__ */ jsx("h3", {
+							className: "text-lg font-semibold",
+							children: "Repo reference"
+						}), /* @__PURE__ */ jsxs("p", {
+							className: "text-muted-foreground text-sm",
+							children: [
+								"This repo wires docs under",
+								" ",
+								/* @__PURE__ */ jsx("code", { children: "packages/apps/web-landing/src/app/docs/reference" }),
+								"."
+							]
+						})]
+					}),
+					/* @__PURE__ */ jsx(StudioPrompt, {
+						title: "Need hosted docs releases?",
+						body: "Studio can publish versioned docs bundles with approvals and audit trails."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-4 pt-4",
+				children: [/* @__PURE__ */ jsxs(Link, {
+					href: "/docs/guides/ci-contract-diff-gating",
+					className: "btn-primary",
+					children: ["Next: CI gating ", /* @__PURE__ */ jsx(ChevronRight, { size: 16 })]
+				}), /* @__PURE__ */ jsx(Link, {
+					href: "/docs/guides",
+					className: "btn-ghost",
+					children: "Back to guides"
+				})]
+			})
+		]
+	});
+}
+
+//#endregion
+export { GuideDocsPipelinePage };
+//# sourceMappingURL=GuideDocsPipelinePage.js.map

package/dist/components/docs/guides/GuideDocsPipelinePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuideDocsPipelinePage.js","names":[],"sources":["../../../../src/components/docs/guides/GuideDocsPipelinePage.tsx"],"sourcesContent":["import { CodeBlock } from '@contractspec/lib.design-system';\nimport Link from '@contractspec/lib.ui-link';\nimport { ChevronRight } from 'lucide-react';\nimport { StudioPrompt } from '../shared/StudioPrompt';\n\nexport function GuideDocsPipelinePage() {\n  return (\n    <div className=\"space-y-8\">\n      <div className=\"space-y-3\">\n        <h1 className=\"text-4xl font-bold\">Build the docs pipeline</h1>\n        <p className=\"text-muted-foreground text-lg\">\n          Generate reference docs, chunk the index, and wire the docs pages the\n          same way this repo does.\n        </p>\n      </div>\n\n      <div className=\"card-subtle space-y-4 p-6\">\n        <h2 className=\"text-2xl font-bold\">What you'll build</h2>\n        <ul className=\"text-muted-foreground space-y-2 text-sm\">\n          <li>Generated Markdown and a chunked index manifest.</li>\n          <li>Reference routes powered by the docs loader.</li>\n          <li>Versioned outputs you can publish per release.</li>\n        </ul>\n      </div>\n\n      <div className=\"space-y-6\">\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">1) Generate contract docs</h2>\n          <CodeBlock\n            language=\"bash\"\n            filename=\"generate-contract-docs\"\n            code={`contractspec generate`}\n          />\n          <p className=\"text-muted-foreground text-sm\">\n            Expected output: Markdown in <code>generated/docs</code>.\n          </p>\n        </div>\n\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">2) Build the docs index</h2>\n          <CodeBlock\n            language=\"bash\"\n            filename=\"docs-generate\"\n            code={`bun docs:generate\n# versioned output\nbun docs:generate -- --version v1.0.0`}\n          />\n          <p className=\"text-muted-foreground text-sm\">\n            This writes <code>docs-index.manifest.json</code> and chunked\n            <code>docs-index.*.json</code> files in the generated docs bundle.\n          </p>\n        </div>\n\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">3) Wire reference routes</h2>\n          <CodeBlock\n            language=\"tsx\"\n            filename=\"docs-reference-route\"\n            code={`import { notFound } from \"next/navigation\";\nimport {\n  DocsReferenceIndexPage,\n  DocsReferencePage,\n  getGeneratedDocById,\n  listGeneratedDocs,\n} from \"@contractspec/bundle.library\";\n\nexport async function generateStaticParams() {\n  const docs = await listGeneratedDocs();\n  return docs.map((doc) => ({ slug: doc.id.split(\"/\") }));\n}\n\nexport default async function Page({ params }: { params: { slug?: string[] } }) {\n  const slug = params.slug?.join(\"/\") ?? \"\";\n  const doc = await getGeneratedDocById(slug);\n  if (!doc) notFound();\n  return <DocsReferencePage entry={doc.entry} content={doc.content} />;\n}`}\n          />\n          <p className=\"text-muted-foreground text-sm\">\n            Use the index page on <code>/docs/reference</code> to render the\n            searchable list.\n          </p>\n        </div>\n\n        <div className=\"card-subtle space-y-3 p-6\">\n          <h3 className=\"text-lg font-semibold\">Repo reference</h3>\n          <p className=\"text-muted-foreground text-sm\">\n            This repo wires docs under{' '}\n            <code>packages/apps/web-landing/src/app/docs/reference</code>.\n          </p>\n        </div>\n\n        <StudioPrompt\n          title=\"Need hosted docs releases?\"\n          body=\"Studio can publish versioned docs bundles with approvals and audit trails.\"\n        />\n      </div>\n\n      <div className=\"flex items-center gap-4 pt-4\">\n        <Link\n          href=\"/docs/guides/ci-contract-diff-gating\"\n          className=\"btn-primary\"\n        >\n          Next: CI gating <ChevronRight size={16} />\n        </Link>\n        <Link href=\"/docs/guides\" className=\"btn-ghost\">\n          Back to guides\n        </Link>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAKA,SAAgB,wBAAwB;AACtC,QACE,qBAAC;EAAI,WAAU;;GACb,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eAAqB;MAA4B,EAC/D,oBAAC;KAAE,WAAU;eAAgC;MAGzC;KACA;GAEN,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eAAqB;MAAsB,EACzD,qBAAC;KAAG,WAAU;;MACZ,oBAAC,kBAAG,qDAAqD;MACzD,oBAAC,kBAAG,iDAAiD;MACrD,oBAAC,kBAAG,mDAAmD;;MACpD;KACD;GAEN,qBAAC;IAAI,WAAU;;KACb,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAA8B;OACjE,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;SACN;OACF,qBAAC;QAAE,WAAU;;SAAgC;SACd,oBAAC,oBAAK,mBAAqB;;;SACtD;;OACA;KAEN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAA4B;OAC/D,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;SAGN;OACF,qBAAC;QAAE,WAAU;;SAAgC;SAC/B,oBAAC,oBAAK,6BAA+B;;SACjD,oBAAC,oBAAK,sBAAwB;;;SAC5B;;OACA;KAEN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAA6B;OAChE,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;;;;;;;;;;;;;;;;SAmBN;OACF,qBAAC;QAAE,WAAU;;SAAgC;SACrB,oBAAC,oBAAK,oBAAsB;;;SAEhD;;OACA;KAEN,qBAAC;MAAI,WAAU;iBACb,oBAAC;OAAG,WAAU;iBAAwB;QAAmB,EACzD,qBAAC;OAAE,WAAU;;QAAgC;QAChB;QAC3B,oBAAC,oBAAK,qDAAuD;;;QAC3D;OACA;KAEN,oBAAC;MACC,OAAM;MACN,MAAK;OACL;;KACE;GAEN,qBAAC;IAAI,WAAU;eACb,qBAAC;KACC,MAAK;KACL,WAAU;gBACX,oBACiB,oBAAC,gBAAa,MAAM,KAAM;MACrC,EACP,oBAAC;KAAK,MAAK;KAAe,WAAU;eAAY;MAEzC;KACH;;GACF"}

package/dist/components/docs/guides/GuideGenerateDocsClientsSchemasPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/guides/GuideGenerateDocsClientsSchemasPage.d.ts
+declare function GuideGenerateDocsClientsSchemasPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { GuideGenerateDocsClientsSchemasPage };
+//# sourceMappingURL=GuideGenerateDocsClientsSchemasPage.d.ts.map

package/dist/components/docs/guides/GuideGenerateDocsClientsSchemasPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuideGenerateDocsClientsSchemasPage.d.ts","names":[],"sources":["../../../../src/components/docs/guides/GuideGenerateDocsClientsSchemasPage.tsx"],"mappings":";;;iBAKgB,mCAAA,CAAA,GAAmC,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/guides/GuideGenerateDocsClientsSchemasPage.js

@@ -0,0 +1,159 @@
+import { StudioPrompt } from "../shared/StudioPrompt.js";
+import { ChevronRight } from "lucide-react";
+import { CodeBlock } from "@contractspec/lib.design-system";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "@contractspec/lib.ui-link";
+
+//#region src/components/docs/guides/GuideGenerateDocsClientsSchemasPage.tsx
+function GuideGenerateDocsClientsSchemasPage() {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-8",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-3",
+				children: [/* @__PURE__ */ jsx("h1", {
+					className: "text-4xl font-bold",
+					children: "Generate docs + client schemas"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground text-lg",
+					children: "Generate docs and OpenAPI output from ContractSpec operations to power SDKs, docs sites, and tooling."
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "card-subtle space-y-4 p-6",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "text-2xl font-bold",
+					children: "What you'll build"
+				}), /* @__PURE__ */ jsxs("ul", {
+					className: "text-muted-foreground space-y-2 text-sm",
+					children: [
+						/* @__PURE__ */ jsx("li", { children: "Export docs from your specs." }),
+						/* @__PURE__ */ jsx("li", { children: "Emit OpenAPI 3.1 for client SDK generation." }),
+						/* @__PURE__ */ jsx("li", { children: "Keep outputs deterministic with CI validation." })
+					]
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-6",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ jsx("h2", {
+								className: "text-2xl font-bold",
+								children: "1) Generate docs"
+							}),
+							/* @__PURE__ */ jsx("p", {
+								className: "text-muted-foreground text-sm",
+								children: "Use the generator to emit docs from your contracts."
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "bash",
+								filename: "generate-docs",
+								code: `contractspec generate`
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground text-sm",
+								children: [
+									"Expected output: ",
+									/* @__PURE__ */ jsx("code", { children: "Generate X doc files in generated/docs" }),
+									"."
+								]
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ jsx("h2", {
+								className: "text-2xl font-bold",
+								children: "2) Export OpenAPI"
+							}),
+							/* @__PURE__ */ jsx("p", {
+								className: "text-muted-foreground text-sm",
+								children: "Export an OpenAPI document from your registry module."
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "bash",
+								filename: "openapi-export",
+								code: `contractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json`
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground text-sm",
+								children: [
+									"Expected output:",
+									" ",
+									/* @__PURE__ */ jsx("code", { children: "OpenAPI written to .../generated/openapi.json" }),
+									"."
+								]
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ jsx("h2", {
+								className: "text-2xl font-bold",
+								children: "3) Validate specs"
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "bash",
+								filename: "validate-specs",
+								code: `contractspec validate`
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground text-sm",
+								children: [
+									"Expected output: ",
+									/* @__PURE__ */ jsx("code", { children: "Validation passed" }),
+									"."
+								]
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "card-subtle space-y-3 p-6",
+						children: [
+							/* @__PURE__ */ jsx("h3", {
+								className: "text-lg font-semibold",
+								children: "Example package"
+							}),
+							/* @__PURE__ */ jsx("p", {
+								className: "text-muted-foreground text-sm",
+								children: "The Integration Hub example provides a full registry of operations and is a good source for OpenAPI exports."
+							}),
+							/* @__PURE__ */ jsx(CodeBlock, {
+								language: "bash",
+								filename: "integration-hub-example",
+								code: `contractspec examples show integration-hub
+
+# openapi export against your registry module
+contractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json`
+							})
+						]
+					}),
+					/* @__PURE__ */ jsx(StudioPrompt, {
+						title: "Want managed schema releases?",
+						body: "Studio can publish OpenAPI, SDKs, and release notes automatically with approvals."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-4 pt-4",
+				children: [/* @__PURE__ */ jsxs(Link, {
+					href: "/docs/guides/docs-generation-pipeline",
+					className: "btn-primary",
+					children: ["Next: Docs pipeline ", /* @__PURE__ */ jsx(ChevronRight, { size: 16 })]
+				}), /* @__PURE__ */ jsx(Link, {
+					href: "/docs/guides",
+					className: "btn-ghost",
+					children: "Back to guides"
+				})]
+			})
+		]
+	});
+}
+
+//#endregion
+export { GuideGenerateDocsClientsSchemasPage };
+//# sourceMappingURL=GuideGenerateDocsClientsSchemasPage.js.map

package/dist/components/docs/guides/GuideGenerateDocsClientsSchemasPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuideGenerateDocsClientsSchemasPage.js","names":[],"sources":["../../../../src/components/docs/guides/GuideGenerateDocsClientsSchemasPage.tsx"],"sourcesContent":["import { CodeBlock } from '@contractspec/lib.design-system';\nimport Link from '@contractspec/lib.ui-link';\nimport { ChevronRight } from 'lucide-react';\nimport { StudioPrompt } from '../shared/StudioPrompt';\n\nexport function GuideGenerateDocsClientsSchemasPage() {\n  return (\n    <div className=\"space-y-8\">\n      <div className=\"space-y-3\">\n        <h1 className=\"text-4xl font-bold\">Generate docs + client schemas</h1>\n        <p className=\"text-muted-foreground text-lg\">\n          Generate docs and OpenAPI output from ContractSpec operations to power\n          SDKs, docs sites, and tooling.\n        </p>\n      </div>\n\n      <div className=\"card-subtle space-y-4 p-6\">\n        <h2 className=\"text-2xl font-bold\">What you'll build</h2>\n        <ul className=\"text-muted-foreground space-y-2 text-sm\">\n          <li>Export docs from your specs.</li>\n          <li>Emit OpenAPI 3.1 for client SDK generation.</li>\n          <li>Keep outputs deterministic with CI validation.</li>\n        </ul>\n      </div>\n\n      <div className=\"space-y-6\">\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">1) Generate docs</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Use the generator to emit docs from your contracts.\n          </p>\n          <CodeBlock\n            language=\"bash\"\n            filename=\"generate-docs\"\n            code={`contractspec generate`}\n          />\n          <p className=\"text-muted-foreground text-sm\">\n            Expected output: <code>Generate X doc files in generated/docs</code>\n            .\n          </p>\n        </div>\n\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">2) Export OpenAPI</h2>\n          <p className=\"text-muted-foreground text-sm\">\n            Export an OpenAPI document from your registry module.\n          </p>\n          <CodeBlock\n            language=\"bash\"\n            filename=\"openapi-export\"\n            code={`contractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json`}\n          />\n          <p className=\"text-muted-foreground text-sm\">\n            Expected output:{' '}\n            <code>OpenAPI written to .../generated/openapi.json</code>.\n          </p>\n        </div>\n\n        <div className=\"space-y-3\">\n          <h2 className=\"text-2xl font-bold\">3) Validate specs</h2>\n          <CodeBlock\n            language=\"bash\"\n            filename=\"validate-specs\"\n            code={`contractspec validate`}\n          />\n          <p className=\"text-muted-foreground text-sm\">\n            Expected output: <code>Validation passed</code>.\n          </p>\n        </div>\n\n        <div className=\"card-subtle space-y-3 p-6\">\n          <h3 className=\"text-lg font-semibold\">Example package</h3>\n          <p className=\"text-muted-foreground text-sm\">\n            The Integration Hub example provides a full registry of operations\n            and is a good source for OpenAPI exports.\n          </p>\n          <CodeBlock\n            language=\"bash\"\n            filename=\"integration-hub-example\"\n            code={`contractspec examples show integration-hub\n\n# openapi export against your registry module\ncontractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json`}\n          />\n        </div>\n\n        <StudioPrompt\n          title=\"Want managed schema releases?\"\n          body=\"Studio can publish OpenAPI, SDKs, and release notes automatically with approvals.\"\n        />\n      </div>\n\n      <div className=\"flex items-center gap-4 pt-4\">\n        <Link\n          href=\"/docs/guides/docs-generation-pipeline\"\n          className=\"btn-primary\"\n        >\n          Next: Docs pipeline <ChevronRight size={16} />\n        </Link>\n        <Link href=\"/docs/guides\" className=\"btn-ghost\">\n          Back to guides\n        </Link>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAKA,SAAgB,sCAAsC;AACpD,QACE,qBAAC;EAAI,WAAU;;GACb,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eAAqB;MAAmC,EACtE,oBAAC;KAAE,WAAU;eAAgC;MAGzC;KACA;GAEN,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAG,WAAU;eAAqB;MAAsB,EACzD,qBAAC;KAAG,WAAU;;MACZ,oBAAC,kBAAG,iCAAiC;MACrC,oBAAC,kBAAG,gDAAgD;MACpD,oBAAC,kBAAG,mDAAmD;;MACpD;KACD;GAEN,qBAAC;IAAI,WAAU;;KACb,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAqB;OACxD,oBAAC;QAAE,WAAU;kBAAgC;SAEzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;SACN;OACF,qBAAC;QAAE,WAAU;;SAAgC;SAC1B,oBAAC,oBAAK,2CAA6C;;;SAElE;;OACA;KAEN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAsB;OACzD,oBAAC;QAAE,WAAU;kBAAgC;SAEzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;SACN;OACF,qBAAC;QAAE,WAAU;;SAAgC;SAC1B;SACjB,oBAAC,oBAAK,kDAAoD;;;SACxD;;OACA;KAEN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAqB;SAAsB;OACzD,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;SACN;OACF,qBAAC;QAAE,WAAU;;SAAgC;SAC1B,oBAAC,oBAAK,sBAAwB;;;SAC7C;;OACA;KAEN,qBAAC;MAAI,WAAU;;OACb,oBAAC;QAAG,WAAU;kBAAwB;SAAoB;OAC1D,oBAAC;QAAE,WAAU;kBAAgC;SAGzC;OACJ,oBAAC;QACC,UAAS;QACT,UAAS;QACT,MAAM;;;;SAIN;;OACE;KAEN,oBAAC;MACC,OAAM;MACN,MAAK;OACL;;KACE;GAEN,qBAAC;IAAI,WAAU;eACb,qBAAC;KACC,MAAK;KACL,WAAU;gBACX,wBACqB,oBAAC,gBAAa,MAAM,KAAM;MACzC,EACP,oBAAC;KAAK,MAAK;KAAe,WAAU;eAAY;MAEzC;KACH;;GACF"}

package/dist/components/docs/guides/GuideImportExistingCodebasesPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/guides/GuideImportExistingCodebasesPage.d.ts
+declare function GuideImportExistingCodebasesPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { GuideImportExistingCodebasesPage };
+//# sourceMappingURL=GuideImportExistingCodebasesPage.d.ts.map

package/dist/components/docs/guides/GuideImportExistingCodebasesPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuideImportExistingCodebasesPage.d.ts","names":[],"sources":["../../../../src/components/docs/guides/GuideImportExistingCodebasesPage.tsx"],"mappings":";;;iBAiDgB,gCAAA,CAAA,GAAgC,kBAAA,CAAA,GAAA,CAAA,OAAA"}