@contractspec/bundle.library 3.9.6 → 3.9.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +238 -230
- package/CHANGELOG.md +88 -0
- package/dist/components/docs/DocsIndexPage.js +2 -2
- package/dist/components/docs/docsManifest.js +1 -1
- package/dist/components/docs/getting-started/DataViewTutorialPage.js +40 -4
- package/dist/components/docs/getting-started/index.js +46 -10
- package/dist/components/docs/guides/GuideContractDrivenFormsPage.content.d.ts +3 -0
- package/dist/components/docs/guides/GuideContractDrivenFormsPage.content.js +95 -0
- package/dist/components/docs/guides/GuideContractDrivenFormsPage.d.ts +1 -0
- package/dist/components/docs/guides/GuideContractDrivenFormsPage.js +95 -0
- package/dist/components/docs/guides/GuideSpecValidationTypingPage.js +1 -1
- package/dist/components/docs/guides/GuidesIndexPage.js +2 -2
- package/dist/components/docs/guides/guides.docblocks.js +3 -1
- package/dist/components/docs/guides/index.d.ts +1 -0
- package/dist/components/docs/guides/index.js +139 -44
- package/dist/components/docs/index.js +586 -266
- package/dist/components/docs/libraries/LibrariesApplicationShellPage.content.d.ts +16 -0
- package/dist/components/docs/libraries/LibrariesApplicationShellPage.content.js +148 -0
- package/dist/components/docs/libraries/LibrariesApplicationShellPage.d.ts +1 -0
- package/dist/components/docs/libraries/LibrariesApplicationShellPage.js +148 -0
- package/dist/components/docs/libraries/LibrariesDataViewsPage.js +13 -6
- package/dist/components/docs/libraries/LibrariesDesignSystemPage.js +3 -3
- package/dist/components/docs/libraries/LibrariesOverviewPage.js +1 -1
- package/dist/components/docs/libraries/index.d.ts +1 -0
- package/dist/components/docs/libraries/index.js +217 -64
- package/dist/components/docs/specs/SpecsDataViewsPage.js +37 -1
- package/dist/components/docs/specs/index.js +37 -1
- package/dist/index.js +597 -277
- package/dist/libs/posthog/client.js +1 -1
- package/dist/node/components/docs/DocsIndexPage.js +2 -2
- package/dist/node/components/docs/docsManifest.js +1 -1
- package/dist/node/components/docs/getting-started/DataViewTutorialPage.js +40 -4
- package/dist/node/components/docs/getting-started/index.js +46 -10
- package/dist/node/components/docs/guides/GuideContractDrivenFormsPage.content.js +94 -0
- package/dist/node/components/docs/guides/GuideContractDrivenFormsPage.js +94 -0
- package/dist/node/components/docs/guides/GuideSpecValidationTypingPage.js +1 -1
- package/dist/node/components/docs/guides/GuidesIndexPage.js +2 -2
- package/dist/node/components/docs/guides/guides.docblocks.js +3 -1
- package/dist/node/components/docs/guides/index.js +139 -44
- package/dist/node/components/docs/index.js +586 -266
- package/dist/node/components/docs/libraries/LibrariesApplicationShellPage.content.js +147 -0
- package/dist/node/components/docs/libraries/LibrariesApplicationShellPage.js +147 -0
- package/dist/node/components/docs/libraries/LibrariesDataViewsPage.js +13 -6
- package/dist/node/components/docs/libraries/LibrariesDesignSystemPage.js +3 -3
- package/dist/node/components/docs/libraries/LibrariesOverviewPage.js +1 -1
- package/dist/node/components/docs/libraries/index.js +217 -64
- package/dist/node/components/docs/specs/SpecsDataViewsPage.js +37 -1
- package/dist/node/components/docs/specs/index.js +37 -1
- package/dist/node/index.js +597 -277
- package/dist/node/libs/posthog/client.js +1 -1
- package/package.json +71 -23
- package/src/components/docs/docsManifest.ts +22 -0
- package/src/components/docs/generated/docs-index._common.json +2008 -1699
- package/src/components/docs/generated/docs-index.agent-console.json +377 -377
- package/src/components/docs/generated/docs-index.ai-chat-assistant.json +17 -17
- package/src/components/docs/generated/docs-index.ai-chat.json +105 -105
- package/src/components/docs/generated/docs-index.ai-support-bot.json +9 -9
- package/src/components/docs/generated/docs-index.analytics-dashboard.json +169 -169
- package/src/components/docs/generated/docs-index.app-config.json +137 -137
- package/src/components/docs/generated/docs-index.artisan-knowledge-product.json +17 -17
- package/src/components/docs/generated/docs-index.artisan-payments-stripe.json +33 -33
- package/src/components/docs/generated/docs-index.audit-trail.json +49 -49
- package/src/components/docs/generated/docs-index.calendar-google.json +9 -9
- package/src/components/docs/generated/docs-index.content-generation.json +9 -9
- package/src/components/docs/generated/docs-index.control-plane.json +17 -17
- package/src/components/docs/generated/docs-index.crm-pipeline.json +161 -161
- package/src/components/docs/generated/docs-index.data-grid-showcase.json +25 -25
- package/src/components/docs/generated/docs-index.defineExample.json +9 -9
- package/src/components/docs/generated/docs-index.email-gmail.json +9 -9
- package/src/components/docs/generated/docs-index.feature-flags.json +217 -217
- package/src/components/docs/generated/docs-index.files.json +177 -177
- package/src/components/docs/generated/docs-index.generated.ts +20 -20
- package/src/components/docs/generated/docs-index.harness-lab.json +9 -9
- package/src/components/docs/generated/docs-index.health.json +97 -97
- package/src/components/docs/generated/docs-index.identity-rbac.json +313 -313
- package/src/components/docs/generated/docs-index.in-app-docs.json +9 -9
- package/src/components/docs/generated/docs-index.integration-hub.json +265 -265
- package/src/components/docs/generated/docs-index.integration-posthog.json +9 -9
- package/src/components/docs/generated/docs-index.integration-stripe.json +9 -9
- package/src/components/docs/generated/docs-index.integration-supabase.json +9 -9
- package/src/components/docs/generated/docs-index.jobs.json +137 -137
- package/src/components/docs/generated/docs-index.kb-update-pipeline.json +129 -129
- package/src/components/docs/generated/docs-index.knowledge-canon.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-ambient-coach.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-crm-onboarding.json +49 -49
- package/src/components/docs/generated/docs-index.learning-journey-duo-drills.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-platform-tour.json +49 -49
- package/src/components/docs/generated/docs-index.learning-journey-quest-challenges.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-registry.json +33 -33
- package/src/components/docs/generated/docs-index.learning-journey-studio-onboarding.json +49 -49
- package/src/components/docs/generated/docs-index.learning-journey-ui-coaching.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-ui-gamified.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-ui-onboarding.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey-ui-shared.json +9 -9
- package/src/components/docs/generated/docs-index.learning-journey.json +241 -241
- package/src/components/docs/generated/docs-index.learning-patterns.json +9 -9
- package/src/components/docs/generated/docs-index.lifecycle-cli.json +9 -9
- package/src/components/docs/generated/docs-index.lifecycle-dashboard.json +9 -9
- package/src/components/docs/generated/docs-index.locale-jurisdiction-gate.json +65 -65
- package/src/components/docs/generated/docs-index.marketplace.json +337 -337
- package/src/components/docs/generated/docs-index.meeting-recorder-providers.json +9 -9
- package/src/components/docs/generated/docs-index.meeting-recorder.json +49 -49
- package/src/components/docs/generated/docs-index.messaging-agent-actions.json +17 -17
- package/src/components/docs/generated/docs-index.metrics.json +201 -201
- package/src/components/docs/generated/docs-index.minimal.json +17 -17
- package/src/components/docs/generated/docs-index.mobile-demo-landing.json +41 -41
- package/src/components/docs/generated/docs-index.notifications.json +65 -65
- package/src/components/docs/generated/docs-index.openbanking-powens.json +9 -9
- package/src/components/docs/generated/docs-index.openbanking.json +65 -65
- package/src/components/docs/generated/docs-index.opencode-cli.json +17 -17
- package/src/components/docs/generated/docs-index.personalization.json +9 -9
- package/src/components/docs/generated/docs-index.platform-acp.json +137 -137
- package/src/components/docs/generated/docs-index.platform-agent.json +201 -201
- package/src/components/docs/generated/docs-index.platform-context.json +121 -121
- package/src/components/docs/generated/docs-index.platform-control-plane.json +321 -321
- package/src/components/docs/generated/docs-index.platform-database.json +89 -89
- package/src/components/docs/generated/docs-index.platform-docs.json +161 -161
- package/src/components/docs/generated/docs-index.platform-harness.json +177 -177
- package/src/components/docs/generated/docs-index.platform-integrations.json +329 -329
- package/src/components/docs/generated/docs-index.platform-knowledge.json +57 -57
- package/src/components/docs/generated/docs-index.platform-provider-ranking.json +217 -217
- package/src/components/docs/generated/docs-index.pocket-family-office.json +129 -129
- package/src/components/docs/generated/docs-index.policy-safe-knowledge-assistant.json +9 -9
- package/src/components/docs/generated/docs-index.product-intent.json +9 -9
- package/src/components/docs/generated/docs-index.project-management-sync.json +9 -9
- package/src/components/docs/generated/docs-index.saas-boilerplate.json +209 -209
- package/src/components/docs/generated/docs-index.service-business-os.json +193 -193
- package/src/components/docs/generated/docs-index.team-hub.json +185 -185
- package/src/components/docs/generated/docs-index.unknown.json +521 -521
- package/src/components/docs/generated/docs-index.versioned-knowledge-base.json +81 -81
- package/src/components/docs/generated/docs-index.video-api-showcase.json +33 -33
- package/src/components/docs/generated/docs-index.video-docs-terminal.json +9 -9
- package/src/components/docs/generated/docs-index.video-marketing-clip.json +9 -9
- package/src/components/docs/generated/docs-index.visualization-showcase.json +17 -17
- package/src/components/docs/generated/docs-index.voice-providers.json +9 -9
- package/src/components/docs/generated/docs-index.wealth-snapshot.json +153 -153
- package/src/components/docs/generated/docs-index.workflow-system.json +433 -433
- package/src/components/docs/generated/docs-index.workspace-cli.json +9 -9
- package/src/components/docs/getting-started/DataViewTutorialPage.tsx +40 -1
- package/src/components/docs/guides/GuideContractDrivenFormsPage.content.ts +98 -0
- package/src/components/docs/guides/GuideContractDrivenFormsPage.tsx +143 -0
- package/src/components/docs/guides/GuideSpecValidationTypingPage.tsx +2 -2
- package/src/components/docs/guides/GuidesIndexPage.tsx +7 -0
- package/src/components/docs/guides/guides.docblocks.ts +12 -0
- package/src/components/docs/guides/index.ts +1 -0
- package/src/components/docs/libraries/LibrariesApplicationShellPage.content.ts +170 -0
- package/src/components/docs/libraries/LibrariesApplicationShellPage.tsx +112 -0
- package/src/components/docs/libraries/LibrariesDataViewsPage.tsx +26 -5
- package/src/components/docs/libraries/LibrariesDesignSystemPage.tsx +9 -0
- package/src/components/docs/libraries/LibrariesOverviewPage.tsx +6 -0
- package/src/components/docs/libraries/index.ts +1 -0
- package/src/components/docs/specs/SpecsDataViewsPage.tsx +39 -3
- package/src/libs/posthog/client.ts +11 -9
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
var
|
|
1
|
+
var ue=Object.defineProperty;var he=(o)=>o;function fe(o,R){this[o]=he.bind(null,R)}var ut=(o,R)=>{for(var L in R)ue(o,L,{get:R[L],enumerable:!0,configurable:!0,set:fe.bind(R,L)})};var ht=(o,R)=>()=>(o&&(R=o(o=0)),R);import ge from"@contractspec/lib.ui-link";import{jsx as H,jsxs as ye}from"react/jsx-runtime";function g({title:o="Need the operating layer on top of OSS ContractSpec?",body:R="ContractSpec Studio helps teams turn evidence into proposed spec changes, governed delivery loops, and execution-ready task packs while keeping the open contract system as the source of truth.",ctaLabel:L="See what Studio adds",href:me="https://www.contractspec.studio/docs"}){return ye("div",{className:"card-subtle space-y-3 p-6",children:[H("h3",{className:"font-semibold text-lg",children:o}),H("p",{className:"text-muted-foreground text-sm",children:R}),H(ge,{href:me,className:"btn-primary",children:L})]})}import{CodeBlock as z}from"@contractspec/lib.design-system";import $ from"@contractspec/lib.ui-link";import{ChevronRight as ve}from"lucide-react";import{jsx as p,jsxs as E}from"react/jsx-runtime";function be(){return E("div",{className:"space-y-8",children:[E("div",{className:"space-y-3",children:[p("h1",{className:"font-bold text-4xl",children:"CI gating with deterministic diffs"}),p("p",{className:"text-lg text-muted-foreground",children:"Add ContractSpec CI checks that validate specs, detect drift, and gate breaking changes before merge."})]}),E("div",{className:"card-subtle space-y-4 p-6",children:[p("h2",{className:"font-bold text-2xl",children:"What you'll build"}),E("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[p("li",{children:"CI workflow running ContractSpec validation and drift checks."}),p("li",{children:"Machine-readable output for PR annotations."}),p("li",{children:"Deterministic contract diffs in review."})]})]}),E("div",{className:"space-y-6",children:[E("div",{className:"space-y-3",children:[p("h2",{className:"font-bold text-2xl",children:"1) Add the CI workflow"}),p("p",{className:"text-muted-foreground text-sm",children:"Copy the template from the CLI package."}),p(z,{language:"bash",filename:"ci-copy",code:"cp node_modules/@contractspec/app.cli-contractspec/templates/github-action.yml .github/workflows/contractspec.yml"}),E("p",{className:"text-muted-foreground text-sm",children:["Expected output: new workflow file in ",p("code",{children:".github/workflows"}),"."]})]}),E("div",{className:"space-y-3",children:[p("h2",{className:"font-bold text-2xl",children:"2) Run CI locally"}),p(z,{language:"bash",filename:"ci-local",code:"contractspec ci --format json --check-drift"}),p("p",{className:"text-muted-foreground text-sm",children:"Expected output: JSON summary including pass/fail counts and drift status (if configured)."})]}),E("div",{className:"space-y-3",children:[p("h2",{className:"font-bold text-2xl",children:"3) Add a diff check"}),p("p",{className:"text-muted-foreground text-sm",children:"Use the diff command to inspect breaking changes in PRs."}),p(z,{language:"bash",filename:"ci-diff",code:"contractspec diff src/contracts/spec-v1.ts src/contracts/spec-v2.ts --breaking"}),p("p",{className:"text-muted-foreground text-sm",children:"Expected output: deterministic diff with breaking change hints."})]}),E("div",{className:"card-subtle space-y-3 p-6",children:[p("h3",{className:"font-semibold text-lg",children:"Example package"}),p("p",{className:"text-muted-foreground text-sm",children:"The CRM pipeline example is already wired in the quickstart smoke test. Use it as a CI-ready template."}),p(z,{language:"bash",filename:"crm-ci",code:`cd packages/examples/crm-pipeline
|
|
2
2
|
bun run build
|
|
3
|
-
bun run validate`})]}),
|
|
3
|
+
bun run validate`})]}),p(g,{title:"Need continuous checks tied to outcomes?",body:"Studio closes the loop with post-change verification and learning dividends that improve future decisions."})]}),E("div",{className:"flex items-center gap-4 pt-4",children:[E($,{href:"/docs/guides",className:"btn-primary",children:["Back to guides ",p(ve,{size:16})]}),p($,{href:"/docs",className:"btn-ghost",children:"Docs home"})]})]})}import{CodeBlock as O}from"@contractspec/lib.design-system";import X from"@contractspec/lib.ui-link";import{ChevronRight as Ne}from"lucide-react";import{jsx as r,jsxs as k}from"react/jsx-runtime";var ke=[".contractspec/connect/context-pack.json",".contractspec/connect/plan-packet.json",".contractspec/connect/patch-verdict.json",".contractspec/connect/audit.ndjson",".contractspec/connect/decisions/<decisionId>/",".contractspec/adoption/catalog.json",".contractspec/adoption/overrides.json"];function we(){return k("div",{className:"space-y-8",children:[k("div",{className:"space-y-3",children:[r("h1",{className:"font-bold text-4xl",children:"Use Connect in a repo"}),r("p",{className:"text-lg text-muted-foreground",children:"Put coding-agent edits and shell commands behind task-scoped context, plan compilation, verification, and local review evidence without introducing a second control plane."})]}),k("div",{className:"card-subtle space-y-4 p-6",children:[r("h2",{className:"font-bold text-2xl",children:"What you'll build"}),k("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[r("li",{children:"A workspace-level Connect config in `.contractsrc.json`."}),r("li",{children:"A reuse-first adoption check before new implementation work."}),r("li",{children:"A context and plan flow for one task."}),r("li",{children:"Verified file and shell mutations with local review/replay evidence."})]})]}),k("div",{className:"space-y-6",children:[k("div",{className:"space-y-3",children:[r("h2",{className:"font-bold text-2xl",children:"1) Enable Connect"}),r("p",{className:"text-muted-foreground text-sm",children:"Start by making the safety policy explicit. Protected paths, generated paths, review thresholds, and command rules live in the workspace config, not in editor-specific hooks."}),r(O,{language:"json",filename:".contractsrc.json",code:`{
|
|
4
4
|
"connect": {
|
|
5
5
|
"enabled": true,
|
|
6
6
|
"storage": {
|
|
@@ -49,25 +49,118 @@ bun run validate`})]}),l(v,{title:"Need continuous checks tied to outcomes?",bod
|
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
|
-
}`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: Connect has enough policy to classify writes, commands, drift, and review thresholds deterministically."})]}),
|
|
52
|
+
}`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: Connect has enough policy to classify writes, commands, drift, and review thresholds deterministically."})]}),k("div",{className:"space-y-3",children:[r("h2",{className:"font-bold text-2xl",children:"2) Initialize storage"}),r(O,{language:"bash",filename:"connect-init",code:"contractspec connect init --scope workspace"}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: `.contractsrc.json` is updated if needed and `.contractspec/connect/` is created."})]}),k("div",{className:"space-y-3",children:[r("h2",{className:"font-bold text-2xl",children:"3) Mirror the adoption catalog and resolve reuse first"}),r("p",{className:"text-muted-foreground text-sm",children:"Connect adoption is the reuse-first layer for authoring. Mirror the local catalog, then resolve the best existing surface for the family you are about to touch before you scaffold or invent anything new."}),r(O,{language:"bash",filename:"connect-adoption",code:`contractspec connect adoption sync --json
|
|
53
53
|
|
|
54
54
|
printf '{"goal":"Prefer an existing release helper before adding a new one"}' | \\
|
|
55
|
-
contractspec connect adoption resolve --family sharedLibs --stdin --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: a mirrored local adoption catalog plus a reuse recommendation that can point to an existing workspace package or a ContractSpec surface before the task reaches file mutation."})]}),
|
|
55
|
+
contractspec connect adoption resolve --family sharedLibs --stdin --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: a mirrored local adoption catalog plus a reuse recommendation that can point to an existing workspace package or a ContractSpec surface before the task reaches file mutation."})]}),k("div",{className:"space-y-3",children:[r("h2",{className:"font-bold text-2xl",children:"4) Project context and compile a plan"}),r("p",{className:"text-muted-foreground text-sm",children:"Use the task id as the thread that connects context, plan, verdict, and replay artifacts."}),r(O,{language:"bash",filename:"connect-plan",code:`contractspec connect context \\
|
|
56
56
|
--task docs-connect \\
|
|
57
57
|
--paths packages/libs/contracts-spec/src/control-plane/contracts.ts \\
|
|
58
58
|
--json
|
|
59
59
|
|
|
60
60
|
printf '{"objective":"Document the control-plane contract surface","commands":["bun run typecheck"]}' | \\
|
|
61
|
-
contractspec connect plan --task docs-connect --stdin --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: a `ContextPack` and `PlanPacket` that point back to `controlPlane.intent.submit`, `controlPlane.plan.compile`, and `controlPlane.plan.verify`."})]}),
|
|
61
|
+
contractspec connect plan --task docs-connect --stdin --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: a `ContextPack` and `PlanPacket` that point back to `controlPlane.intent.submit`, `controlPlane.plan.compile`, and `controlPlane.plan.verify`."})]}),k("div",{className:"space-y-3",children:[r("h2",{className:"font-bold text-2xl",children:"5) Verify file and shell mutations"}),r(O,{language:"bash",filename:"connect-verify",code:`printf '{"operation":"edit","path":"packages/libs/contracts-spec/src/control-plane/contracts.ts"}' | \\
|
|
62
62
|
contractspec connect verify --task docs-connect --tool acp.fs.access --stdin --json
|
|
63
63
|
|
|
64
64
|
printf 'bun run typecheck' | \\
|
|
65
|
-
contractspec connect verify --task docs-connect --tool acp.terminal.exec --stdin --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: a `PatchVerdict` with `permit`, `rewrite`, `require_review`, or `deny`, plus a runtime-linked control-plane state when that linkage is available."})]}),
|
|
65
|
+
contractspec connect verify --task docs-connect --tool acp.terminal.exec --stdin --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Expected output: a `PatchVerdict` with `permit`, `rewrite`, `require_review`, or `deny`, plus a runtime-linked control-plane state when that linkage is available."})]}),k("div",{className:"card-subtle space-y-3 p-6",children:[r("h3",{className:"font-semibold text-lg",children:"Artifacts to inspect"}),r("ul",{className:"space-y-2 text-muted-foreground text-sm",children:ke.map((o)=>r("li",{children:r("code",{children:o})},o))})]}),k("div",{className:"space-y-3",children:[r("h2",{className:"font-bold text-2xl",children:"6) Review, replay, and optional Studio sync"}),r(O,{language:"bash",filename:"connect-review-replay",code:`contractspec connect review list --json
|
|
66
66
|
contractspec connect replay <decisionId> --json
|
|
67
67
|
contractspec connect eval <decisionId> --registry ./harness-registry.ts --scenario connect.safe-refactor --json
|
|
68
68
|
|
|
69
69
|
# Optional when Studio review-bridge mode is enabled
|
|
70
|
-
contractspec connect review sync --decision <decisionId> --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Local review packets remain authoritative. Studio sync is an operator convenience layer, not a requirement for baseline OSS safety."})]})]}),
|
|
70
|
+
contractspec connect review sync --decision <decisionId> --json`}),r("p",{className:"text-muted-foreground text-sm",children:"Local review packets remain authoritative. Studio sync is an operator convenience layer, not a requirement for baseline OSS safety."})]})]}),k("div",{className:"flex items-center gap-4 pt-4",children:[k(X,{href:"/docs/specs/connect",className:"btn-primary",children:["Back to Connect spec ",r(Ne,{size:16})]}),r(X,{href:"/docs/architecture/control-plane",className:"btn-ghost",children:"Control-plane runtime"})]})]})}var x=`import {
|
|
71
|
+
defineFormSpec,
|
|
72
|
+
FormRegistry,
|
|
73
|
+
responsiveFormColumns,
|
|
74
|
+
} from "@contractspec/lib.contracts-spec/forms";
|
|
75
|
+
import { fromZod } from "@contractspec/lib.schema";
|
|
76
|
+
import { z } from "zod";
|
|
77
|
+
|
|
78
|
+
const LeadCaptureModel = fromZod(
|
|
79
|
+
z.object({
|
|
80
|
+
fullName: z.string().min(1),
|
|
81
|
+
email: z.string().email(),
|
|
82
|
+
company: z.string().min(1),
|
|
83
|
+
intent: z.enum(["demo", "pricing", "pilot"]),
|
|
84
|
+
notes: z.string().max(1000).optional(),
|
|
85
|
+
newsletter: z.boolean().optional(),
|
|
86
|
+
}),
|
|
87
|
+
{ name: "LeadCaptureModel" },
|
|
88
|
+
);
|
|
89
|
+
|
|
90
|
+
export const LeadCaptureForm = defineFormSpec({
|
|
91
|
+
meta: {
|
|
92
|
+
key: "marketing.lead.form",
|
|
93
|
+
version: "1.0.0",
|
|
94
|
+
title: "Lead capture form",
|
|
95
|
+
description: "Collect qualified OSS and Studio leads.",
|
|
96
|
+
domain: "marketing",
|
|
97
|
+
owners: ["@growth"],
|
|
98
|
+
tags: ["forms", "leads"],
|
|
99
|
+
stability: "experimental",
|
|
100
|
+
},
|
|
101
|
+
model: LeadCaptureModel,
|
|
102
|
+
layout: {
|
|
103
|
+
columns: responsiveFormColumns(2),
|
|
104
|
+
gap: "md",
|
|
105
|
+
flow: {
|
|
106
|
+
kind: "sections",
|
|
107
|
+
sections: [
|
|
108
|
+
{ key: "identity", titleI18n: "Who you are", fieldNames: ["fullName", "email", "company"] },
|
|
109
|
+
{ key: "request", titleI18n: "What you need", fieldNames: ["intent", "notes", "newsletter"] },
|
|
110
|
+
],
|
|
111
|
+
},
|
|
112
|
+
},
|
|
113
|
+
fields: [
|
|
114
|
+
{ kind: "text", name: "fullName", labelI18n: "Full name", required: true, autoComplete: "name" },
|
|
115
|
+
{ kind: "email", name: "email", labelI18n: "Work email", required: true, autoComplete: "email" },
|
|
116
|
+
{ kind: "text", name: "company", labelI18n: "Company", required: true, autoComplete: "organization" },
|
|
117
|
+
{
|
|
118
|
+
kind: "select",
|
|
119
|
+
name: "intent",
|
|
120
|
+
labelI18n: "Primary goal",
|
|
121
|
+
required: true,
|
|
122
|
+
options: [
|
|
123
|
+
{ labelI18n: "Book a demo", value: "demo" },
|
|
124
|
+
{ labelI18n: "Understand pricing", value: "pricing" },
|
|
125
|
+
{ labelI18n: "Plan a pilot", value: "pilot" },
|
|
126
|
+
],
|
|
127
|
+
},
|
|
128
|
+
{ kind: "textarea", name: "notes", labelI18n: "Context", rows: 4, layout: { colSpan: "full" } },
|
|
129
|
+
{ kind: "checkbox", name: "newsletter", labelI18n: "Send product updates" },
|
|
130
|
+
],
|
|
131
|
+
actions: [{ key: "submit", labelI18n: "Send request", op: { name: "lead.create", version: "1.0.0" } }],
|
|
132
|
+
policy: { flags: ["lead-capture"], pii: ["fullName", "email", "company", "notes"] },
|
|
133
|
+
renderHints: { ui: "shadcn", form: "react-hook-form" },
|
|
134
|
+
});
|
|
135
|
+
|
|
136
|
+
export const formRegistry = new FormRegistry().register(LeadCaptureForm);`,j=`"use client";
|
|
137
|
+
|
|
138
|
+
import { formRenderer } from "@contractspec/lib.design-system/renderers/form-contract";
|
|
139
|
+
import { LeadCaptureForm } from "../contracts/forms/lead-capture.form";
|
|
140
|
+
|
|
141
|
+
export function LeadCapturePanel() {
|
|
142
|
+
return formRenderer.render(LeadCaptureForm, {
|
|
143
|
+
defaultValues: { newsletter: true },
|
|
144
|
+
overrides: {
|
|
145
|
+
onSubmitOverride: async (values, actionKey) => {
|
|
146
|
+
await fetch("/api/leads", {
|
|
147
|
+
method: "POST",
|
|
148
|
+
headers: { "content-type": "application/json" },
|
|
149
|
+
body: JSON.stringify({ actionKey, values }),
|
|
150
|
+
});
|
|
151
|
+
},
|
|
152
|
+
},
|
|
153
|
+
});
|
|
154
|
+
}`,ee=`bun add @contractspec/example.form-showcase
|
|
155
|
+
|
|
156
|
+
# Full form-only example docs
|
|
157
|
+
open https://www.contractspec.io/docs/examples/form-showcase
|
|
158
|
+
|
|
159
|
+
# Template catalog filtered to forms
|
|
160
|
+
open https://www.contractspec.io/templates?tag=forms
|
|
161
|
+
|
|
162
|
+
# Sandbox spec preview
|
|
163
|
+
open https://www.contractspec.io/sandbox?template=form-showcase`;import{CodeBlock as M}from"@contractspec/lib.design-system";import{HStack as Ce,VStack as A}from"@contractspec/lib.design-system/layout";import{List as Se,ListItem as V}from"@contractspec/lib.design-system/list";import{Code as te,H1 as Ie,H2 as F,H3 as ae,P as U,Text as W}from"@contractspec/lib.design-system/typography";import q from"@contractspec/lib.ui-link";import{ChevronRight as Ee}from"lucide-react";import{jsx as c,jsxs as b}from"react/jsx-runtime";function Pe(){return b(A,{className:"space-y-8",children:[b(A,{className:"space-y-3",children:[c(Ie,{className:"font-bold text-4xl",children:"Build a contract-driven form"}),c(U,{className:"text-lg text-muted-foreground",children:"Define form data, fields, layout, policy, and submit behavior once, then let your app render from the same ContractSpec surface."})]}),b(A,{className:"card-subtle space-y-4 p-6",children:[c(F,{className:"font-bold text-2xl",children:"What you'll build"}),b(Se,{className:"space-y-2 text-muted-foreground text-sm",children:[c(V,{children:c(W,{children:"A schema-backed FormSpec for a lead capture form."})}),c(V,{children:c(W,{children:"A FormRegistry that exposes the latest version by stable key."})}),c(V,{children:c(W,{children:"A React renderer that keeps UI, validation, and policy aligned."})})]})]}),b(A,{className:"space-y-6",children:[b(A,{className:"space-y-3",children:[c(F,{className:"font-bold text-2xl",children:"1) Define the form spec"}),b(U,{className:"text-muted-foreground text-sm",children:["Create ",c(te,{children:"src/contracts/forms/lead-capture.form.ts"}),":"]}),c(M,{language:"typescript",filename:"src/contracts/forms/lead-capture.form.ts",code:x})]}),b(A,{className:"card-subtle space-y-3 p-6",children:[c(ae,{className:"font-semibold text-lg",children:"Need every form field?"}),b(U,{className:"text-muted-foreground text-sm",children:["Start from the"," ",c(q,{href:"/docs/examples/form-showcase",children:"Form Showcase example"})," ","or the"," ",c(q,{href:"/templates?tag=forms",children:"form template catalog"}),". It is focused only on forms and covers field kinds, section layouts, step layouts, arrays, groups, conditionals, and validation hints."]}),c(M,{language:"bash",filename:"form-showcase-template",code:ee})]}),b(A,{className:"space-y-3",children:[c(F,{className:"font-bold text-2xl",children:"2) Render from the contract"}),c(U,{className:"text-muted-foreground text-sm",children:"Use the shared renderer, or provide your own driver if your app uses a different component library."}),c(M,{language:"tsx",filename:"src/components/LeadCapturePanel.tsx",code:j})]}),b(A,{className:"space-y-3",children:[c(F,{className:"font-bold text-2xl",children:"3) Validate and evolve"}),c(M,{language:"bash",filename:"validate-form",code:"contractspec validate src/contracts/forms/lead-capture.form.ts"}),b(U,{className:"text-muted-foreground text-sm",children:["Expected output: ",c(te,{children:"Validation passed"}),". When the form becomes public contract surface, version changes deliberately instead of editing field meaning in place."]})]}),b(A,{className:"card-subtle space-y-3 p-6",children:[c(ae,{className:"font-semibold text-lg",children:"Repo tutorial"}),c(U,{className:"text-muted-foreground text-sm",children:"The repository guide adds the longer implementation checklist, custom renderer notes, and rollout rules."}),c(M,{language:"bash",filename:"repo-guide",code:"open docs/tutorials/contract-driven-forms.md"})]}),c(g,{title:"Need governed form changes?",body:"Studio can connect form edits to customer evidence, approval packets, and rollout checks before teams regenerate public surfaces."})]}),b(Ce,{className:"flex items-center gap-4 pt-4",children:[b(q,{href:"/docs/guides/generate-docs-clients-schemas",className:"btn-primary",children:[c(W,{children:"Next: Generate docs + clients"}),c(Ee,{size:16})]}),c(q,{href:"/docs/guides",className:"btn-ghost",children:c(W,{children:"Back to guides"})})]})]})}import{CodeBlock as G}from"@contractspec/lib.design-system";import oe from"@contractspec/lib.ui-link";import{ChevronRight as Re,Globe as Ae,Layers as Be,Shield as Te,Zap as Oe}from"lucide-react";import{jsx as t,jsxs as i}from"react/jsx-runtime";var Ue=[{name:"Operations",factory:"defineCommand / defineQuery",description:"API endpoints with input/output schemas, validation, and policy.",icon:Oe,color:"text-blue-400"},{name:"Events",factory:"defineEvent",description:"Domain events with typed payloads and PII handling.",icon:Be,color:"text-green-400"},{name:"Capabilities",factory:"defineCapability",description:"Feature groupings that link operations, events, and UIs.",icon:Te,color:"text-purple-400"},{name:"Presentations",factory:"definePresentation",description:"UI specifications for rendering data and handling interactions.",icon:Ae,color:"text-orange-400"}];function De(){return i("div",{className:"space-y-8",children:[i("div",{className:"space-y-3",children:[t("h1",{className:"font-bold text-4xl",children:"Contract Types Overview"}),t("p",{className:"text-lg text-muted-foreground",children:"Learn about the different contract types in ContractSpec and when to use each one when you are making the system boundary explicit."})]}),i("div",{className:"card-subtle space-y-4 p-6",children:[t("h2",{className:"font-bold text-2xl",children:"Core Contract Types"}),t("div",{className:"grid gap-3 md:grid-cols-2",children:Ue.map((o)=>i("div",{className:"flex items-start gap-3 rounded-lg border border-white/10 p-4",children:[t(o.icon,{className:o.color,size:20}),i("div",{className:"space-y-1",children:[t("h3",{className:"font-semibold",children:o.name}),t("p",{className:"text-muted-foreground text-xs",children:o.description}),t("code",{className:"text-violet-400 text-xs",children:o.factory})]})]},o.name))})]}),i("div",{className:"space-y-6",children:[i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"1) Operations (Commands & Queries)"}),t("p",{className:"text-muted-foreground text-sm",children:"Operations are the backbone of your API. Commands mutate state, queries read state. Both have typed input/output schemas."}),t(G,{language:"typescript",filename:"src/contracts/user.operation.ts",code:`import { defineCommand, defineQuery } from "@contractspec/lib.contracts-spec";
|
|
71
164
|
import { SchemaModel, ScalarTypeEnum } from "@contractspec/lib.schema";
|
|
72
165
|
|
|
73
166
|
// Command: Mutates state (creates a user)
|
|
@@ -133,7 +226,7 @@ export const GetUserQuery = defineQuery({
|
|
|
133
226
|
}),
|
|
134
227
|
},
|
|
135
228
|
policy: { auth: "user" },
|
|
136
|
-
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"2) Events"}),t("p",{className:"text-muted-foreground text-sm",children:"Events represent domain occurrences. They have typed payloads with PII field marking for compliance."}),t(
|
|
229
|
+
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"2) Events"}),t("p",{className:"text-muted-foreground text-sm",children:"Events represent domain occurrences. They have typed payloads with PII field marking for compliance."}),t(G,{language:"typescript",filename:"src/contracts/user.event.ts",code:`import { defineEvent } from "@contractspec/lib.contracts-spec";
|
|
137
230
|
import { SchemaModel, ScalarTypeEnum } from "@contractspec/lib.schema";
|
|
138
231
|
|
|
139
232
|
export const UserCreatedEvent = defineEvent({
|
|
@@ -174,7 +267,7 @@ export const UserDeletedEvent = defineEvent({
|
|
|
174
267
|
reason: { type: ScalarTypeEnum.String(), isOptional: true },
|
|
175
268
|
},
|
|
176
269
|
}),
|
|
177
|
-
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"3) Capabilities"}),t("p",{className:"text-muted-foreground text-sm",children:"Capabilities group related operations, events, and presentations. They define feature boundaries and dependencies."}),t(
|
|
270
|
+
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"3) Capabilities"}),t("p",{className:"text-muted-foreground text-sm",children:"Capabilities group related operations, events, and presentations. They define feature boundaries and dependencies."}),t(G,{language:"typescript",filename:"src/contracts/user-management.capability.ts",code:`import { defineCapability } from "@contractspec/lib.contracts-spec";
|
|
178
271
|
|
|
179
272
|
export const UserManagementCapability = defineCapability({
|
|
180
273
|
meta: {
|
|
@@ -217,7 +310,7 @@ export const AdminUserCapability = defineCapability({
|
|
|
217
310
|
{ surface: "operation", key: "user.ban", version: "1.0.0" },
|
|
218
311
|
{ surface: "operation", key: "user.impersonate", version: "1.0.0" },
|
|
219
312
|
],
|
|
220
|
-
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"4) Presentations"}),t("p",{className:"text-muted-foreground text-sm",children:"Presentations define UI specifications. They link to capabilities and specify how data should be displayed."}),t(
|
|
313
|
+
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"4) Presentations"}),t("p",{className:"text-muted-foreground text-sm",children:"Presentations define UI specifications. They link to capabilities and specify how data should be displayed."}),t(G,{language:"typescript",filename:"src/contracts/user-list.presentation.ts",code:`import { definePresentation } from "@contractspec/lib.contracts-spec";
|
|
221
314
|
|
|
222
315
|
export const UserListPresentation = definePresentation({
|
|
223
316
|
meta: {
|
|
@@ -239,7 +332,7 @@ export const UserListPresentation = definePresentation({
|
|
|
239
332
|
pagination: { defaultPageSize: 25 },
|
|
240
333
|
search: { fields: ["name", "email"] },
|
|
241
334
|
},
|
|
242
|
-
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"5) Additional Contract Types"}),t("p",{className:"text-muted-foreground text-sm",children:"ContractSpec provides specialized contracts for different concerns:"}),i("div",{className:"grid gap-4 md:grid-cols-2",children:[i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Policy"}),t("code",{className:"text-violet-400 text-xs",children:"definePolicy"}),t("p",{className:"text-muted-foreground text-xs",children:"RBAC/ABAC rules, rate limits, and access control."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Workflow"}),t("code",{className:"text-violet-400 text-xs",children:"defineWorkflow"}),t("p",{className:"text-muted-foreground text-xs",children:"Multi-step processes with states, transitions, and SLAs."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Translation"}),t("code",{className:"text-violet-400 text-xs",children:"defineTranslation"}),t("p",{className:"text-muted-foreground text-xs",children:"i18n messages with ICU format and locale fallbacks."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Integration"}),t("code",{className:"text-violet-400 text-xs",children:"defineIntegration"}),t("p",{className:"text-muted-foreground text-xs",children:"External service connections and API adapters."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Form"}),t("code",{className:"text-violet-400 text-xs",children:"defineFormSpec"}),t("p",{className:"text-muted-foreground text-xs",children:"Form definitions with fields, validation, and layouts."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Data View"}),t("code",{className:"text-violet-400 text-xs",children:"defineDataView"}),t("p",{className:"text-muted-foreground text-xs",children:"Read-only data projections and aggregations."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Feature"}),t("code",{className:"text-violet-400 text-xs",children:"defineFeature"}),t("p",{className:"text-muted-foreground text-xs",children:"Feature flags and progressive rollout configurations."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Test"}),t("code",{className:"text-violet-400 text-xs",children:"defineTestSpec"}),t("p",{className:"text-muted-foreground text-xs",children:"Contract-driven test scenarios and fixtures."})]})]})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"6) Registering Contracts"}),t("p",{className:"text-muted-foreground text-sm",children:"Each contract type has a registry for lookup and validation."}),t(
|
|
335
|
+
});`})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"5) Additional Contract Types"}),t("p",{className:"text-muted-foreground text-sm",children:"ContractSpec provides specialized contracts for different concerns:"}),i("div",{className:"grid gap-4 md:grid-cols-2",children:[i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Policy"}),t("code",{className:"text-violet-400 text-xs",children:"definePolicy"}),t("p",{className:"text-muted-foreground text-xs",children:"RBAC/ABAC rules, rate limits, and access control."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Workflow"}),t("code",{className:"text-violet-400 text-xs",children:"defineWorkflow"}),t("p",{className:"text-muted-foreground text-xs",children:"Multi-step processes with states, transitions, and SLAs."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Translation"}),t("code",{className:"text-violet-400 text-xs",children:"defineTranslation"}),t("p",{className:"text-muted-foreground text-xs",children:"i18n messages with ICU format and locale fallbacks."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Integration"}),t("code",{className:"text-violet-400 text-xs",children:"defineIntegration"}),t("p",{className:"text-muted-foreground text-xs",children:"External service connections and API adapters."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Form"}),t("code",{className:"text-violet-400 text-xs",children:"defineFormSpec"}),t("p",{className:"text-muted-foreground text-xs",children:"Form definitions with fields, validation, and layouts."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Data View"}),t("code",{className:"text-violet-400 text-xs",children:"defineDataView"}),t("p",{className:"text-muted-foreground text-xs",children:"Read-only data projections and aggregations."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Feature"}),t("code",{className:"text-violet-400 text-xs",children:"defineFeature"}),t("p",{className:"text-muted-foreground text-xs",children:"Feature flags and progressive rollout configurations."})]}),i("div",{className:"card-subtle space-y-2 p-4",children:[t("h3",{className:"font-semibold",children:"Test"}),t("code",{className:"text-violet-400 text-xs",children:"defineTestSpec"}),t("p",{className:"text-muted-foreground text-xs",children:"Contract-driven test scenarios and fixtures."})]})]})]}),i("div",{className:"space-y-3",children:[t("h2",{className:"font-bold text-2xl",children:"6) Registering Contracts"}),t("p",{className:"text-muted-foreground text-sm",children:"Each contract type has a registry for lookup and validation."}),t(G,{language:"typescript",filename:"src/contracts/registry.ts",code:`import {
|
|
243
336
|
OperationSpecRegistry,
|
|
244
337
|
installOp,
|
|
245
338
|
} from "@contractspec/lib.contracts-spec/operations";
|
|
@@ -269,9 +362,9 @@ installOp(operationRegistry, GetUserQuery, async (input) => {
|
|
|
269
362
|
|
|
270
363
|
// Register events and capabilities
|
|
271
364
|
eventRegistry.register(UserCreatedEvent);
|
|
272
|
-
capabilityRegistry.register(UserManagementCapability);`})]}),i("div",{className:"card-subtle space-y-3 p-6",children:[t("h3",{className:"font-semibold text-lg",children:"Contract Type Decision Guide"}),i("table",{className:"w-full text-sm",children:[t("thead",{children:i("tr",{className:"border-white/10 border-b",children:[t("th",{className:"py-2 text-left",children:"When you need..."}),t("th",{className:"py-2 text-left",children:"Use this contract"})]})}),i("tbody",{className:"text-muted-foreground",children:[i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"An API endpoint that changes data"}),t("td",{className:"py-2",children:t("code",{children:"defineCommand"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"An API endpoint that reads data"}),t("td",{className:"py-2",children:t("code",{children:"defineQuery"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Async notification of something that happened"}),t("td",{className:"py-2",children:t("code",{children:"defineEvent"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Group related specs under a feature"}),t("td",{className:"py-2",children:t("code",{children:"defineCapability"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Define UI rendering specifications"}),t("td",{className:"py-2",children:t("code",{children:"definePresentation"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Access control and rate limiting"}),t("td",{className:"py-2",children:t("code",{children:"definePolicy"})})]}),i("tr",{children:[t("td",{className:"py-2",children:"Multi-step business processes"}),t("td",{className:"py-2",children:t("code",{children:"defineWorkflow"})})]})]})]})]}),t(
|
|
365
|
+
capabilityRegistry.register(UserManagementCapability);`})]}),i("div",{className:"card-subtle space-y-3 p-6",children:[t("h3",{className:"font-semibold text-lg",children:"Contract Type Decision Guide"}),i("table",{className:"w-full text-sm",children:[t("thead",{children:i("tr",{className:"border-white/10 border-b",children:[t("th",{className:"py-2 text-left",children:"When you need..."}),t("th",{className:"py-2 text-left",children:"Use this contract"})]})}),i("tbody",{className:"text-muted-foreground",children:[i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"An API endpoint that changes data"}),t("td",{className:"py-2",children:t("code",{children:"defineCommand"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"An API endpoint that reads data"}),t("td",{className:"py-2",children:t("code",{children:"defineQuery"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Async notification of something that happened"}),t("td",{className:"py-2",children:t("code",{children:"defineEvent"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Group related specs under a feature"}),t("td",{className:"py-2",children:t("code",{children:"defineCapability"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Define UI rendering specifications"}),t("td",{className:"py-2",children:t("code",{children:"definePresentation"})})]}),i("tr",{className:"border-white/5 border-b",children:[t("td",{className:"py-2",children:"Access control and rate limiting"}),t("td",{className:"py-2",children:t("code",{children:"definePolicy"})})]}),i("tr",{children:[t("td",{className:"py-2",children:"Multi-step business processes"}),t("td",{className:"py-2",children:t("code",{children:"defineWorkflow"})})]})]})]})]}),t(g,{title:"Need to decide which contract should change next?",body:"Studio uses evidence and focus constraints to generate decision briefs, patch intents, and execution-ready task packs."})]}),i("div",{className:"flex items-center gap-4 pt-4",children:[i(oe,{href:"/docs/guides/nextjs-one-endpoint",className:"btn-primary",children:["Next: Add your first endpoint ",t(Re,{size:16})]}),t(oe,{href:"/docs/guides",className:"btn-ghost",children:"Back to guides"})]})]})}import{CodeBlock as Y}from"@contractspec/lib.design-system";import ne from"@contractspec/lib.ui-link";import{ChevronRight as Le}from"lucide-react";import{jsx as u,jsxs as N}from"react/jsx-runtime";function Me(){return N("div",{className:"space-y-8",children:[N("div",{className:"space-y-3",children:[u("h1",{className:"font-bold text-4xl",children:"Build the docs pipeline"}),u("p",{className:"text-lg text-muted-foreground",children:"Generate reference docs, chunk the index, and wire the docs pages the same way this repo does."})]}),N("div",{className:"card-subtle space-y-4 p-6",children:[u("h2",{className:"font-bold text-2xl",children:"What you'll build"}),N("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[u("li",{children:"Generated Markdown and a chunked index manifest."}),u("li",{children:"Reference routes powered by the docs loader."}),u("li",{children:"Versioned outputs you can publish per release."})]})]}),N("div",{className:"space-y-6",children:[N("div",{className:"space-y-3",children:[u("h2",{className:"font-bold text-2xl",children:"1) Generate contract docs"}),u(Y,{language:"bash",filename:"generate-contract-docs",code:"contractspec generate"}),N("p",{className:"text-muted-foreground text-sm",children:["Expected output: Markdown in ",u("code",{children:"generated/docs"}),"."]})]}),N("div",{className:"space-y-3",children:[u("h2",{className:"font-bold text-2xl",children:"2) Build the docs index"}),u(Y,{language:"bash",filename:"docs-generate",code:`bun docs:generate
|
|
273
366
|
# versioned output
|
|
274
|
-
bun docs:generate -- --version v1.0.0`}),
|
|
367
|
+
bun docs:generate -- --version v1.0.0`}),N("p",{className:"text-muted-foreground text-sm",children:["This writes ",u("code",{children:"docs-index.manifest.json"})," and chunked",u("code",{children:"docs-index.*.json"})," files in the generated docs bundle."]})]}),N("div",{className:"space-y-3",children:[u("h2",{className:"font-bold text-2xl",children:"3) Wire reference routes"}),u(Y,{language:"tsx",filename:"docs-reference-route",code:`import { notFound } from "next/navigation";
|
|
275
368
|
import {
|
|
276
369
|
DocsReferenceIndexPage,
|
|
277
370
|
DocsReferencePage,
|
|
@@ -289,7 +382,7 @@ export default async function Page({ params }: { params: { slug?: string[] } })
|
|
|
289
382
|
const doc = await getGeneratedDocById(slug);
|
|
290
383
|
if (!doc) notFound();
|
|
291
384
|
return <DocsReferencePage entry={doc.entry} content={doc.content} />;
|
|
292
|
-
}`}),
|
|
385
|
+
}`}),N("p",{className:"text-muted-foreground text-sm",children:["Use the index page on ",u("code",{children:"/docs/reference"})," to render the searchable list."]})]}),N("div",{className:"card-subtle space-y-3 p-6",children:[u("h3",{className:"font-semibold text-lg",children:"Repo reference"}),N("p",{className:"text-muted-foreground text-sm",children:["This repo wires docs under"," ",u("code",{children:"packages/apps/web-landing/src/app/docs/reference"}),"."]})]}),u(g,{title:"Need decision-to-export automation?",body:"Studio exports evidence-backed spec changes and task packs to Linear, Jira, Notion, and GitHub."})]}),N("div",{className:"flex items-center gap-4 pt-4",children:[N(ne,{href:"/docs/guides/ci-contract-diff-gating",className:"btn-primary",children:["Next: CI gating ",u(Le,{size:16})]}),u(ne,{href:"/docs/guides",className:"btn-ghost",children:"Back to guides"})]})]})}import{CodeBlock as J}from"@contractspec/lib.design-system";import re from"@contractspec/lib.ui-link";import{ChevronRight as We}from"lucide-react";import{jsx as d,jsxs as P}from"react/jsx-runtime";function Ge(){return P("div",{className:"space-y-8",children:[P("div",{className:"space-y-3",children:[d("h1",{className:"font-bold text-4xl",children:"Build a first module bundle"}),d("p",{className:"text-lg text-muted-foreground",children:"Define one bundle spec, resolve it for a real route and preference profile, then render the resulting surface plan through the React host layer."})]}),P("div",{className:"card-subtle space-y-4 p-6",children:[d("h2",{className:"font-bold text-2xl",children:"What you'll build"}),P("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[d("li",{children:"One `ModuleBundleSpec` with a route and workbench surface."}),d("li",{children:"One `ResolvedSurfacePlan` from `resolveBundle`."}),d("li",{children:"One React host using `BundleProvider` and `BundleRenderer`."})]})]}),P("div",{className:"space-y-6",children:[P("div",{className:"space-y-3",children:[d("h2",{className:"font-bold text-2xl",children:"1) Define the bundle spec"}),d("p",{className:"text-muted-foreground text-sm",children:"The bundle spec is the durable contract. It owns route selection, surface shape, layouts, data recipes, and verification coverage for all seven preference dimensions."}),d(J,{language:"typescript",filename:"src/bundles/support.workbench.bundle.ts",code:`import { defineModuleBundle } from "@contractspec/lib.surface-runtime/spec/define-module-bundle";
|
|
293
386
|
|
|
294
387
|
export const SupportWorkbenchBundle = defineModuleBundle({
|
|
295
388
|
meta: {
|
|
@@ -331,7 +424,7 @@ export const SupportWorkbenchBundle = defineModuleBundle({
|
|
|
331
424
|
},
|
|
332
425
|
},
|
|
333
426
|
},
|
|
334
|
-
});`}),
|
|
427
|
+
});`}),d("p",{className:"text-muted-foreground text-sm",children:"Expected output: `defineModuleBundle` validates the route, surface, and verification dimensions at runtime."})]}),P("div",{className:"space-y-3",children:[d("h2",{className:"font-bold text-2xl",children:"2) Resolve the plan"}),d("p",{className:"text-muted-foreground text-sm",children:"Resolve against a real route, device, and preference profile. This is where the runtime chooses the surface, layout, bindings, and audit reasons."}),d(J,{language:"typescript",filename:"src/runtime/resolve-support-workbench.ts",code:`import { resolveBundle } from "@contractspec/lib.surface-runtime/runtime/resolve-bundle";
|
|
335
428
|
|
|
336
429
|
export const supportWorkbenchPlan = await resolveBundle(
|
|
337
430
|
SupportWorkbenchBundle,
|
|
@@ -355,7 +448,7 @@ export const supportWorkbenchPlan = await resolveBundle(
|
|
|
355
448
|
},
|
|
356
449
|
capabilities: ["tickets.read", "tickets.update"],
|
|
357
450
|
}
|
|
358
|
-
);`}),
|
|
451
|
+
);`}),d("p",{className:"text-muted-foreground text-sm",children:"Expected output: a `ResolvedSurfacePlan` with `bundleKey`, `surfaceId`, `layoutId`, `bindings`, `adaptation`, and audit reasons."})]}),P("div",{className:"space-y-3",children:[d("h2",{className:"font-bold text-2xl",children:"3) Render the plan"}),d("p",{className:"text-muted-foreground text-sm",children:"The host app renders the resolved plan, not the raw spec. That keeps layout selection, overlays, and AI proposals downstream of the declared bundle contract."}),d(J,{language:"tsx",filename:"src/app/support/SurfaceHost.tsx",code:`import { BundleProvider, BundleRenderer } from "@contractspec/lib.surface-runtime/react";
|
|
359
452
|
|
|
360
453
|
export function SurfaceHost() {
|
|
361
454
|
return (
|
|
@@ -363,10 +456,10 @@ export function SurfaceHost() {
|
|
|
363
456
|
<BundleRenderer assistantSlotId="assistant" />
|
|
364
457
|
</BundleProvider>
|
|
365
458
|
);
|
|
366
|
-
}`}),
|
|
459
|
+
}`}),d("p",{className:"text-muted-foreground text-sm",children:"Expected output: the route renders according to the resolved layout root and slot plan instead of bespoke page assembly."})]}),P("div",{className:"card-subtle space-y-3 p-6",children:[d("h3",{className:"font-semibold text-lg",children:"Verification checks"}),P("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[d("li",{children:"The resolved `surfaceId` matches the route you expected."}),d("li",{children:"The `layoutId` is stable for the active view and preferences."}),d("li",{children:"The plan carries audit reasons and all seven adaptation dimensions."}),d("li",{children:"Assistant or overlay work stays within declared slots."})]})]})]}),P("div",{className:"flex items-center gap-4 pt-4",children:[P(re,{href:"/docs/specs/module-bundles",className:"btn-primary",children:["Back to module bundles ",d(We,{size:16})]}),d(re,{href:"/docs/specs/overlays",className:"btn-ghost",children:"Next: overlays"})]})]})}import{CodeBlock as _}from"@contractspec/lib.design-system";import ie from"@contractspec/lib.ui-link";import{ChevronRight as ze}from"lucide-react";import{jsx as m,jsxs as w}from"react/jsx-runtime";function Fe(){return w("div",{className:"space-y-8",children:[w("div",{className:"space-y-3",children:[m("h1",{className:"font-bold text-4xl",children:"Generate docs + client schemas"}),m("p",{className:"text-lg text-muted-foreground",children:"Generate docs and OpenAPI output from ContractSpec operations to power SDKs, docs sites, and tooling."})]}),w("div",{className:"card-subtle space-y-4 p-6",children:[m("h2",{className:"font-bold text-2xl",children:"What you'll build"}),w("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[m("li",{children:"Export docs from your specs."}),m("li",{children:"Emit OpenAPI 3.1 for client SDK generation."}),m("li",{children:"Keep outputs deterministic with CI validation."})]})]}),w("div",{className:"space-y-6",children:[w("div",{className:"space-y-3",children:[m("h2",{className:"font-bold text-2xl",children:"1) Generate docs"}),m("p",{className:"text-muted-foreground text-sm",children:"Use the generator to emit docs from your contracts."}),m(_,{language:"bash",filename:"generate-docs",code:"contractspec generate"}),w("p",{className:"text-muted-foreground text-sm",children:["Expected output: ",m("code",{children:"Generate X doc files in generated/docs"}),"."]})]}),w("div",{className:"space-y-3",children:[m("h2",{className:"font-bold text-2xl",children:"2) Export OpenAPI"}),m("p",{className:"text-muted-foreground text-sm",children:"Export an OpenAPI document from your registry module."}),m(_,{language:"bash",filename:"openapi-export",code:"contractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json"}),w("p",{className:"text-muted-foreground text-sm",children:["Expected output:"," ",m("code",{children:"OpenAPI written to .../generated/openapi.json"}),"."]})]}),w("div",{className:"space-y-3",children:[m("h2",{className:"font-bold text-2xl",children:"3) Validate specs"}),m(_,{language:"bash",filename:"validate-specs",code:"contractspec validate"}),w("p",{className:"text-muted-foreground text-sm",children:["Expected output: ",m("code",{children:"Validation passed"}),"."]})]}),w("div",{className:"card-subtle space-y-3 p-6",children:[m("h3",{className:"font-semibold text-lg",children:"Example package"}),m("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."}),m(_,{language:"bash",filename:"integration-hub-example",code:`contractspec examples show integration-hub
|
|
367
460
|
|
|
368
461
|
# openapi export against your registry module
|
|
369
|
-
contractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json`})]}),
|
|
462
|
+
contractspec openapi export --registry ./src/contracts/registry.ts --out ./generated/openapi.json`})]}),m(g,{title:"Want exports tied to product decisions?",body:"Studio compiles approved changes into deliverables and pushes them to your execution stack with full evidence context."})]}),w("div",{className:"flex items-center gap-4 pt-4",children:[w(ie,{href:"/docs/guides/docs-generation-pipeline",className:"btn-primary",children:["Next: Docs pipeline ",m(ze,{size:16})]}),m(ie,{href:"/docs/guides",className:"btn-ghost",children:"Back to guides"})]})]})}import{CodeBlock as B}from"@contractspec/lib.design-system";import ce from"@contractspec/lib.ui-link";import{ChevronRight as qe}from"lucide-react";import{jsx as n,jsxs as y}from"react/jsx-runtime";var _e=["builder.workspace.bootstrap","builder.channel.receiveInbound","builder.blueprint.generate","builder.plan.compile","builder.preview.create","builder.preview.runHarness","builder.export.prepare","builder.export.approve","builder.export.execute"],Ke=["local runtime trust and lease details","channel-action posture for mobile/operator follow-up","comparison posture and export readiness from the shared snapshot"];function Qe(){return y("div",{className:"space-y-8",children:[y("div",{className:"space-y-3",children:[n("h1",{className:"font-bold text-4xl",children:"Host the Builder workbench"}),n("p",{className:"text-lg text-muted-foreground",children:"Use the reusable Builder workbench as the desktop control surface for snapshot loading, guided authoring, preview, readiness, export, and mobile review handoff."})]}),y("div",{className:"card-subtle space-y-4 p-6",children:[n("h2",{className:"font-bold text-2xl",children:"What you'll build"}),y("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[n("li",{children:"A workspace snapshot fetch path."}),n("li",{children:"A `BuilderWorkbench` host with action callbacks."}),n("li",{children:"Runtime-mode aware preview/export controls plus mobile review links."})]})]}),y("div",{className:"space-y-6",children:[y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"1) Fetch the workspace snapshot"}),n("p",{className:"text-muted-foreground text-sm",children:"The web shell already exposes a query path for the current Builder workspace snapshot. Your host should load it first, then refresh it after each successful command."}),n(B,{language:"typescript",filename:"builder-workbench-controller.ts",code:`export async function fetchBuilderSnapshot(workspaceId: string) {
|
|
370
463
|
const response = await fetch(
|
|
371
464
|
\`/api/operate/builder/queries/builder.workspace.snapshot?workspaceId=\${encodeURIComponent(workspaceId)}\`,
|
|
372
465
|
{ cache: "no-store" }
|
|
@@ -382,7 +475,7 @@ contractspec openapi export --registry ./src/contracts/registry.ts --out ./gener
|
|
|
382
475
|
throw new Error("Builder workspace snapshot query returned an error.");
|
|
383
476
|
}
|
|
384
477
|
return payload.result;
|
|
385
|
-
}`}),n("p",{className:"text-muted-foreground text-sm",children:"Expected output: one `BuilderWorkspaceSnapshot` containing workspace, plan, providers, runtime targets, preview, export, mobile review state, and the operator posture needed for local trust, lease, and comparison status."})]}),
|
|
478
|
+
}`}),n("p",{className:"text-muted-foreground text-sm",children:"Expected output: one `BuilderWorkspaceSnapshot` containing workspace, plan, providers, runtime targets, preview, export, mobile review state, and the operator posture needed for local trust, lease, and comparison status."})]}),y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"2) Host the workbench and refresh on action"}),n("p",{className:"text-muted-foreground text-sm",children:"The simplest host pattern is local state plus a small action wrapper that executes one Builder command and then refreshes the snapshot."}),n(B,{language:"tsx",filename:"BuilderWorkbenchHost.tsx",code:`import {
|
|
386
479
|
BuilderWorkbench,
|
|
387
480
|
useBuilderWorkbenchState,
|
|
388
481
|
} from "@contractspec/module.builder-workbench/presentation";
|
|
@@ -413,7 +506,7 @@ async function runAction(commandKey: string, payload?: Record<string, unknown>)
|
|
|
413
506
|
onApproveExport={() => runAction("builder.export.approve")}
|
|
414
507
|
onExecuteExport={() => runAction("builder.export.execute")}
|
|
415
508
|
selectedExportRuntimeMode="hybrid"
|
|
416
|
-
/>;`}),n("p",{className:"text-muted-foreground text-sm",children:"Expected output: each successful action leaves the host with a fresh snapshot and keeps the workbench tabs aligned with current runtime state."})]}),
|
|
509
|
+
/>;`}),n("p",{className:"text-muted-foreground text-sm",children:"Expected output: each successful action leaves the host with a fresh snapshot and keeps the workbench tabs aligned with current runtime state."})]}),y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"3) Persist Builder defaults in workspace config"}),n("p",{className:"text-muted-foreground text-sm",children:"The host should agree with the CLI and setup flows on the same control-plane defaults. For local or hybrid setups, keep the Builder API base URL, token env var, and local runtime metadata in `.contractsrc.json`."}),n(B,{language:"json",filename:".contractsrc.json",code:`{
|
|
417
510
|
"builder": {
|
|
418
511
|
"enabled": true,
|
|
419
512
|
"runtimeMode": "local",
|
|
@@ -428,14 +521,14 @@ async function runAction(commandKey: string, payload?: Record<string, unknown>)
|
|
|
428
521
|
"providerIds": ["provider.codex", "provider.local.model"]
|
|
429
522
|
}
|
|
430
523
|
}
|
|
431
|
-
}`})]}),
|
|
524
|
+
}`})]}),y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"4) Bootstrap providers and routing policy explicitly"}),n("p",{className:"text-muted-foreground text-sm",children:"Builder v3 treats provider routing as policy, not heuristic. Use the workspace bootstrap command as the single managed-first setup path instead of orchestrating provider registration in the app shell."}),n(B,{language:"typescript",filename:"builder-bootstrap.ts",code:`await executeBuilderCommand({
|
|
432
525
|
commandKey: "builder.workspace.bootstrap",
|
|
433
526
|
workspaceId,
|
|
434
527
|
payload: {
|
|
435
528
|
preset: "managed_mvp",
|
|
436
529
|
includeLocalHelperProvider: true,
|
|
437
530
|
},
|
|
438
|
-
});`})]}),
|
|
531
|
+
});`})]}),y("div",{className:"card-subtle space-y-3 p-6",children:[n("h3",{className:"font-semibold text-lg",children:"Common command keys"}),n("ul",{className:"space-y-2 text-muted-foreground text-sm",children:_e.map((o)=>n("li",{children:n("code",{children:o})},o))})]}),y("div",{className:"card-subtle space-y-3 p-6",children:[n("h3",{className:"font-semibold text-lg",children:"Snapshot-backed operator details"}),n("ul",{className:"space-y-2 text-muted-foreground text-sm",children:Ke.map((o)=>n("li",{children:o},o))})]}),y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"5) Keep runtime mode explicit"}),n("p",{className:"text-muted-foreground text-sm",children:"Preview and export flows are runtime-mode aware. The host chooses between `managed`, `local`, and `hybrid` and passes that choice into preview or export commands instead of hiding it behind provider selection heuristics."}),n(B,{language:"typescript",filename:"runtime-mode",code:`const [selectedExportRuntimeMode, setSelectedExportRuntimeMode] =
|
|
439
532
|
React.useState(resolveBuilderExportRuntimeMode(initialSnapshot));
|
|
440
533
|
|
|
441
534
|
await executeBuilderCommand({
|
|
@@ -444,19 +537,19 @@ await executeBuilderCommand({
|
|
|
444
537
|
payload: {
|
|
445
538
|
runtimeMode: selectedExportRuntimeMode,
|
|
446
539
|
},
|
|
447
|
-
});`})]}),
|
|
540
|
+
});`})]}),y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"6) Link mobile review flows"}),n("p",{className:"text-muted-foreground text-sm",children:"When a patch proposal, approval ticket, or incident needs operator follow-up away from the desktop workbench, deep-link into the mobile review route instead of inventing a separate data model."}),n(B,{language:"typescript",filename:"mobile-review-path.ts",code:`export function buildBuilderMobileReviewPath(
|
|
448
541
|
workspaceId: string,
|
|
449
542
|
cardId: string
|
|
450
543
|
) {
|
|
451
544
|
return \`/operate/builder/workspaces/\${encodeURIComponent(workspaceId)}/mobile-review/\${encodeURIComponent(cardId)}\`;
|
|
452
|
-
}`}),n("p",{className:"text-muted-foreground text-sm",children:"Expected output: the same Builder workspace state stays visible from desktop workbench and mobile review surfaces."})]}),
|
|
545
|
+
}`}),n("p",{className:"text-muted-foreground text-sm",children:"Expected output: the same Builder workspace state stays visible from desktop workbench and mobile review surfaces."})]}),y("div",{className:"space-y-3",children:[n("h2",{className:"font-bold text-2xl",children:"7) Keep Connect adjacent, not embedded"}),n("p",{className:"text-muted-foreground text-sm",children:"Builder owns the authoring control plane. When Builder delegates into coding repositories, enable Connect in those target workspaces for context packs, mutation verification, replay, and review packets, but do not replace Builder contracts with Connect artifacts."}),n(B,{language:"bash",filename:"connect-init.sh",code:"contractspec connect init --scope workspace"})]})]}),y("div",{className:"flex items-center gap-4 pt-4",children:[y(ce,{href:"/docs/specs/builder-control-plane",className:"btn-primary",children:["Back to Builder control plane ",n(qe,{size:16})]}),n(ce,{href:"/docs/studio",className:"btn-ghost",children:"Studio overview"})]})]})}import{CodeBlock as T}from"@contractspec/lib.design-system";import se from"@contractspec/lib.ui-link";import{AlertCircle as He,ChevronRight as Ve,FileCode as Ye,Scan as Z,Settings as Je}from"lucide-react";import{jsx as e,jsxs as a}from"react/jsx-runtime";var Ze=[{name:"NestJS",flag:"nestjs",description:"Controllers, decorators, DTOs"},{name:"Express",flag:"express",description:"Router methods, middleware"},{name:"Fastify",flag:"fastify",description:"Route definitions, schemas"},{name:"Hono",flag:"hono",description:"Route handlers, validators"},{name:"Elysia",flag:"elysia",description:"Type-safe routes, schemas"},{name:"tRPC",flag:"trpc",description:"Procedure definitions"},{name:"Next.js",flag:"next-api",description:"API routes (app/api, pages/api)"}];function $e(){return a("div",{className:"space-y-8",children:[a("div",{className:"space-y-3",children:[e("h1",{className:"font-bold text-4xl",children:"Import Existing Codebases"}),e("p",{className:"text-lg text-muted-foreground",children:"Convert your existing API endpoints into ContractSpec contracts. Auto-detect frameworks, extract schemas, and generate explicit contract definitions from your code."})]}),a("div",{className:"card-subtle space-y-4 p-6",children:[e("h2",{className:"font-bold text-2xl",children:"What you'll learn"}),a("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[e("li",{children:"How to import existing API endpoints as ContractSpec contracts."}),e("li",{children:"Framework-specific patterns and auto-detection."}),e("li",{children:"Customizing imports with scopes, dry-run, and output options."}),e("li",{children:"Registering imported contracts and adding handlers."})]})]}),a("div",{className:"space-y-6",children:[a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"Why import existing code?"}),e("p",{className:"text-muted-foreground text-sm",children:"Instead of writing contracts from scratch, the import command extracts endpoint patterns from your existing codebase. This gives you:"}),a("ul",{className:"list-disc space-y-1 pl-5 text-muted-foreground text-sm",children:[e("li",{children:"Instant spec coverage for existing APIs"}),e("li",{children:"Type-safe schemas derived from your existing types"}),e("li",{children:"A foundation to iterate and refine contracts"}),e("li",{children:"Gradual adoption without rewriting code"})]})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"Supported frameworks"}),e("div",{className:"grid gap-3 md:grid-cols-2 lg:grid-cols-3",children:Ze.map((o)=>a("div",{className:"flex items-start gap-3 rounded-lg border border-white/10 p-4",children:[e(Ye,{className:"text-violet-400",size:18}),a("div",{className:"space-y-1",children:[e("h3",{className:"font-semibold",children:o.name}),e("p",{className:"text-muted-foreground text-xs",children:o.description}),a("code",{className:"text-violet-400 text-xs",children:["--framework ",o.flag]})]})]},o.flag))})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"1) Quick start"}),e("p",{className:"text-muted-foreground text-sm",children:"Run the import command to auto-detect your framework and extract endpoints:"}),e(T,{language:"bash",filename:"import-quickstart",code:`# Auto-detect framework and import all endpoints
|
|
453
546
|
contractspec import ./src
|
|
454
547
|
|
|
455
548
|
# Preview what would be imported (dry-run)
|
|
456
549
|
contractspec import ./src --dry-run
|
|
457
550
|
|
|
458
551
|
# Force a specific framework
|
|
459
|
-
contractspec import ./src --framework nestjs`}),e("p",{className:"text-muted-foreground text-sm",children:"Expected output: A summary of endpoints found, schemas extracted, and files generated."})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"2) Framework-specific patterns"}),e("p",{className:"text-muted-foreground text-sm",children:"The import command recognizes these patterns in each framework:"})]}),a("div",{className:"space-y-3",children:[a("h3",{className:"flex items-center gap-2 font-semibold text-xl",children:[e(
|
|
552
|
+
contractspec import ./src --framework nestjs`}),e("p",{className:"text-muted-foreground text-sm",children:"Expected output: A summary of endpoints found, schemas extracted, and files generated."})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"2) Framework-specific patterns"}),e("p",{className:"text-muted-foreground text-sm",children:"The import command recognizes these patterns in each framework:"})]}),a("div",{className:"space-y-3",children:[a("h3",{className:"flex items-center gap-2 font-semibold text-xl",children:[e(Z,{size:18,className:"text-blue-400"}),"NestJS"]}),e(T,{language:"typescript",filename:"src/users/users.controller.ts (before)",code:`@Controller('users')
|
|
460
553
|
export class UsersController {
|
|
461
554
|
@Get(':id')
|
|
462
555
|
async getUser(@Param('id') id: string): Promise<UserDto> {
|
|
@@ -468,7 +561,7 @@ export class UsersController {
|
|
|
468
561
|
async createUser(@Body() dto: CreateUserDto): Promise<UserDto> {
|
|
469
562
|
return this.usersService.create(dto);
|
|
470
563
|
}
|
|
471
|
-
}`}),a("p",{className:"text-muted-foreground text-sm",children:["Detected: ",e("code",{children:"@Controller"}),", ",e("code",{children:"@Get"}),","," ",e("code",{children:"@Post"}),", ",e("code",{children:"@Body"}),", ",e("code",{children:"@Param"}),","," ",e("code",{children:"@UseGuards"})," decorators."]})]}),a("div",{className:"space-y-3",children:[a("h3",{className:"flex items-center gap-2 font-semibold text-xl",children:[e(
|
|
564
|
+
}`}),a("p",{className:"text-muted-foreground text-sm",children:["Detected: ",e("code",{children:"@Controller"}),", ",e("code",{children:"@Get"}),","," ",e("code",{children:"@Post"}),", ",e("code",{children:"@Body"}),", ",e("code",{children:"@Param"}),","," ",e("code",{children:"@UseGuards"})," decorators."]})]}),a("div",{className:"space-y-3",children:[a("h3",{className:"flex items-center gap-2 font-semibold text-xl",children:[e(Z,{size:18,className:"text-green-400"}),"Express"]}),e(T,{language:"typescript",filename:"src/routes/users.ts (before)",code:`const router = express.Router();
|
|
472
565
|
|
|
473
566
|
router.get('/users/:id', async (req, res) => {
|
|
474
567
|
const user = await getUserById(req.params.id);
|
|
@@ -478,7 +571,7 @@ router.get('/users/:id', async (req, res) => {
|
|
|
478
571
|
router.post('/users', validateBody(CreateUserSchema), async (req, res) => {
|
|
479
572
|
const user = await createUser(req.body);
|
|
480
573
|
res.status(201).json(user);
|
|
481
|
-
});`}),a("p",{className:"text-muted-foreground text-sm",children:["Detected: ",e("code",{children:"router.get"}),", ",e("code",{children:"router.post"}),", validation middleware, Zod schemas."]})]}),a("div",{className:"space-y-3",children:[a("h3",{className:"flex items-center gap-2 font-semibold text-xl",children:[e(
|
|
574
|
+
});`}),a("p",{className:"text-muted-foreground text-sm",children:["Detected: ",e("code",{children:"router.get"}),", ",e("code",{children:"router.post"}),", validation middleware, Zod schemas."]})]}),a("div",{className:"space-y-3",children:[a("h3",{className:"flex items-center gap-2 font-semibold text-xl",children:[e(Z,{size:18,className:"text-purple-400"}),"Next.js API Routes"]}),e(T,{language:"typescript",filename:"app/api/users/[id]/route.ts (before)",code:`export async function GET(
|
|
482
575
|
request: Request,
|
|
483
576
|
{ params }: { params: { id: string } }
|
|
484
577
|
) {
|
|
@@ -490,7 +583,7 @@ export async function POST(request: Request) {
|
|
|
490
583
|
const body = await request.json();
|
|
491
584
|
const user = await createUser(body);
|
|
492
585
|
return Response.json(user, { status: 201 });
|
|
493
|
-
}`}),a("p",{className:"text-muted-foreground text-sm",children:["Detected: ",e("code",{children:"GET"}),", ",e("code",{children:"POST"})," exports in"," ",e("code",{children:"app/api/**/route.ts"})," and ",e("code",{children:"pages/api/**/*.ts"}),"."]})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"3) Understanding generated contracts"}),e("p",{className:"text-muted-foreground text-sm",children:"The import command generates ContractSpec operations with TODO placeholders for fields it cannot infer:"}),e(
|
|
586
|
+
}`}),a("p",{className:"text-muted-foreground text-sm",children:["Detected: ",e("code",{children:"GET"}),", ",e("code",{children:"POST"})," exports in"," ",e("code",{children:"app/api/**/route.ts"})," and ",e("code",{children:"pages/api/**/*.ts"}),"."]})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"3) Understanding generated contracts"}),e("p",{className:"text-muted-foreground text-sm",children:"The import command generates ContractSpec operations with TODO placeholders for fields it cannot infer:"}),e(T,{language:"typescript",filename:".contractspec/generated/users.operation.ts",code:`import { defineQuery, defineCommand } from "@contractspec/lib.contracts-spec";
|
|
494
587
|
import { SchemaModel, ScalarTypeEnum } from "@contractspec/lib.schema";
|
|
495
588
|
|
|
496
589
|
export const GetUserQuery = defineQuery({
|
|
@@ -550,7 +643,7 @@ export const CreateUserCommand = defineCommand({
|
|
|
550
643
|
transport: {
|
|
551
644
|
rest: { method: "POST", path: "/users" },
|
|
552
645
|
},
|
|
553
|
-
});`})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"4) Customizing imports"}),a("div",{className:"flex items-center gap-2",children:[e(
|
|
646
|
+
});`})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"4) Customizing imports"}),a("div",{className:"flex items-center gap-2",children:[e(Je,{size:18,className:"text-violet-400"}),e("h3",{className:"font-semibold text-lg",children:"Available options"})]}),e("div",{className:"overflow-x-auto",children:a("table",{className:"w-full text-sm",children:[e("thead",{children:a("tr",{className:"border-white/10 border-b",children:[e("th",{className:"py-2 pr-4 text-left",children:"Option"}),e("th",{className:"py-2 pr-4 text-left",children:"Description"}),e("th",{className:"py-2 text-left",children:"Example"})]})}),a("tbody",{className:"text-muted-foreground",children:[a("tr",{className:"border-white/5 border-b",children:[e("td",{className:"py-2 pr-4",children:e("code",{children:"--scope"})}),e("td",{className:"py-2 pr-4",children:"Limit to specific directories"}),e("td",{className:"py-2",children:e("code",{children:"--scope src/users src/auth"})})]}),a("tr",{className:"border-white/5 border-b",children:[e("td",{className:"py-2 pr-4",children:e("code",{children:"--framework"})}),e("td",{className:"py-2 pr-4",children:"Force a specific framework"}),e("td",{className:"py-2",children:e("code",{children:"--framework express"})})]}),a("tr",{className:"border-white/5 border-b",children:[e("td",{className:"py-2 pr-4",children:e("code",{children:"--output"})}),e("td",{className:"py-2 pr-4",children:"Output directory"}),e("td",{className:"py-2",children:e("code",{children:"--output ./contracts"})})]}),a("tr",{className:"border-white/5 border-b",children:[e("td",{className:"py-2 pr-4",children:e("code",{children:"--dry-run"})}),e("td",{className:"py-2 pr-4",children:"Preview without writing files"}),e("td",{className:"py-2",children:e("code",{children:"--dry-run"})})]}),a("tr",{className:"border-white/5 border-b",children:[e("td",{className:"py-2 pr-4",children:e("code",{children:"--analyze"})}),e("td",{className:"py-2 pr-4",children:"Analysis only, no code generation"}),e("td",{className:"py-2",children:e("code",{children:"--analyze"})})]}),a("tr",{children:[e("td",{className:"py-2 pr-4",children:e("code",{children:"--json"})}),e("td",{className:"py-2 pr-4",children:"Output as JSON for scripting"}),e("td",{className:"py-2",children:e("code",{children:"--json"})})]})]})]})}),e(T,{language:"bash",filename:"import-options",code:`# Import only specific modules
|
|
554
647
|
contractspec import ./src --scope src/users src/orders
|
|
555
648
|
|
|
556
649
|
# Preview with analysis
|
|
@@ -560,7 +653,7 @@ contractspec import ./src --dry-run --analyze
|
|
|
560
653
|
contractspec import ./src --output ./src/contracts/generated
|
|
561
654
|
|
|
562
655
|
# Get JSON for CI/scripting
|
|
563
|
-
contractspec import ./src --json > import-result.json`})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"5) Registering imported contracts"}),e("p",{className:"text-muted-foreground text-sm",children:"After import, register contracts and add handlers:"}),e(
|
|
656
|
+
contractspec import ./src --json > import-result.json`})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"5) Registering imported contracts"}),e("p",{className:"text-muted-foreground text-sm",children:"After import, register contracts and add handlers:"}),e(T,{language:"typescript",filename:"src/contracts/registry.ts",code:`import {
|
|
564
657
|
OperationSpecRegistry,
|
|
565
658
|
installOp,
|
|
566
659
|
} from "@contractspec/lib.contracts-spec/operations";
|
|
@@ -580,8 +673,8 @@ installOp(registry, GetUserQuery, async (input) => {
|
|
|
580
673
|
installOp(registry, CreateUserCommand, async (input) => {
|
|
581
674
|
const user = await db.user.create({ data: input });
|
|
582
675
|
return { id: user.id };
|
|
583
|
-
});`})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"6) After importing"}),a("ol",{className:"list-decimal space-y-2 pl-5 text-muted-foreground text-sm",children:[a("li",{children:[e("strong",{children:"Review generated contracts"})," — Check the TODO placeholders and fill in descriptions, owners, and tags."]}),a("li",{children:[e("strong",{children:"Refine schemas"})," — Add proper types, validation rules, and error definitions."]}),a("li",{children:[e("strong",{children:"Run validation"})," —"," ",e("code",{children:"contractspec validate"})," to ensure contracts are valid."]}),a("li",{children:[e("strong",{children:"Register and wire handlers"})," — Connect contracts to your existing business logic."]}),a("li",{children:[e("strong",{children:"Iterate"})," — The imported contracts are a starting point. Refine them as your spec matures."]})]})]}),a("div",{className:"space-y-3",children:[a("h2",{className:"flex items-center gap-2 font-bold text-2xl",children:[e(
|
|
584
|
-
bun add @contractspec/lib.contracts-spec @contractspec/lib.contracts-runtime-server-rest @contractspec/lib.schema`}),
|
|
676
|
+
});`})]}),a("div",{className:"space-y-3",children:[e("h2",{className:"font-bold text-2xl",children:"6) After importing"}),a("ol",{className:"list-decimal space-y-2 pl-5 text-muted-foreground text-sm",children:[a("li",{children:[e("strong",{children:"Review generated contracts"})," — Check the TODO placeholders and fill in descriptions, owners, and tags."]}),a("li",{children:[e("strong",{children:"Refine schemas"})," — Add proper types, validation rules, and error definitions."]}),a("li",{children:[e("strong",{children:"Run validation"})," —"," ",e("code",{children:"contractspec validate"})," to ensure contracts are valid."]}),a("li",{children:[e("strong",{children:"Register and wire handlers"})," — Connect contracts to your existing business logic."]}),a("li",{children:[e("strong",{children:"Iterate"})," — The imported contracts are a starting point. Refine them as your spec matures."]})]})]}),a("div",{className:"space-y-3",children:[a("h2",{className:"flex items-center gap-2 font-bold text-2xl",children:[e(He,{size:20,className:"text-yellow-400"}),"Troubleshooting"]}),a("div",{className:"space-y-4",children:[a("div",{className:"card-subtle space-y-2 p-4",children:[e("h3",{className:"font-semibold",children:"Framework not detected"}),a("p",{className:"text-muted-foreground text-sm",children:["Use ",e("code",{children:"--framework <name>"})," to force a specific framework. Check that your entry files follow standard patterns."]})]}),a("div",{className:"card-subtle space-y-2 p-4",children:[e("h3",{className:"font-semibold",children:"Missing schemas"}),a("p",{className:"text-muted-foreground text-sm",children:["Schema inference works best with explicit types. If using"," ",e("code",{children:"any"})," or dynamic types, you'll see TODO placeholders. Fill them in manually."]})]}),a("div",{className:"card-subtle space-y-2 p-4",children:[e("h3",{className:"font-semibold",children:"Partial imports"}),a("p",{className:"text-muted-foreground text-sm",children:["Some endpoints may not be detected if they use unconventional patterns. Use ",e("code",{children:"--analyze"})," to see what was found, then add missing contracts manually."]})]})]})]}),e(g,{title:"Want evidence-driven migration priorities?",body:"Studio clusters product signals into scored patterns, then proposes contract changes and execution-ready work for the highest-impact areas."})]}),a("div",{className:"flex items-center gap-4 pt-4",children:[a(se,{href:"/docs/guides/spec-validation-and-typing",className:"btn-primary",children:["Next: Spec validation + typing ",e(Ve,{size:16})]}),e(se,{href:"/docs/guides",className:"btn-ghost",children:"Back to guides"})]})]})}import{CodeBlock as D}from"@contractspec/lib.design-system";import de from"@contractspec/lib.ui-link";import{ChevronRight as Xe}from"lucide-react";import{jsx as s,jsxs as f}from"react/jsx-runtime";function xe(){return f("div",{className:"space-y-8",children:[f("div",{className:"space-y-3",children:[s("h1",{className:"font-bold text-4xl",children:"Next.js: add one endpoint"}),s("p",{className:"text-lg text-muted-foreground",children:"Add ContractSpec to an existing Next.js App Router project by wiring a single operation end-to-end with validation and types."})]}),f("div",{className:"card-subtle space-y-4 p-6",children:[s("h2",{className:"font-bold text-2xl",children:"What you'll build"}),f("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[s("li",{children:"One OperationSpec with SchemaModel validation."}),s("li",{children:"A registry wiring the operation to its handler."}),s("li",{children:"A Next.js route handler that exposes the operation."})]})]}),f("div",{className:"space-y-6",children:[f("div",{className:"space-y-3",children:[s("h2",{className:"font-bold text-2xl",children:"1) Install core packages"}),s(D,{language:"bash",filename:"nextjs-install",code:`bun add -D contractspec
|
|
677
|
+
bun add @contractspec/lib.contracts-spec @contractspec/lib.contracts-runtime-server-rest @contractspec/lib.schema`}),f("p",{className:"text-muted-foreground text-sm",children:["Expected output: ",s("code",{children:"added 3 packages"})," and a lockfile update."]})]}),f("div",{className:"space-y-3",children:[s("h2",{className:"font-bold text-2xl",children:"2) Define the operation spec"}),f("p",{className:"text-muted-foreground text-sm",children:["Create ",s("code",{children:"src/contracts/healthcheck.operation.ts"}),":"]}),s(D,{language:"typescript",filename:"src/contracts/healthcheck.operation.ts",code:`import { defineQuery } from "@contractspec/lib.contracts-spec/operations";
|
|
585
678
|
import { SchemaModel, ScalarTypeEnum } from "@contractspec/lib.schema";
|
|
586
679
|
|
|
587
680
|
const HealthcheckOutput = new SchemaModel({
|
|
@@ -612,7 +705,7 @@ export const HealthcheckQuery = defineQuery({
|
|
|
612
705
|
gql: { field: "healthcheck_get" },
|
|
613
706
|
mcp: { toolName: "healthcheck_get-v1" },
|
|
614
707
|
},
|
|
615
|
-
});`})]}),
|
|
708
|
+
});`})]}),f("div",{className:"space-y-3",children:[s("h2",{className:"font-bold text-2xl",children:"3) Register the operation"}),f("p",{className:"text-muted-foreground text-sm",children:["Create ",s("code",{children:"src/contracts/registry.ts"}),":"]}),s(D,{language:"typescript",filename:"src/contracts/registry.ts",code:`import {
|
|
616
709
|
OperationSpecRegistry,
|
|
617
710
|
installOp,
|
|
618
711
|
} from "@contractspec/lib.contracts-spec/operations";
|
|
@@ -623,7 +716,7 @@ export const registry = new OperationSpecRegistry();
|
|
|
623
716
|
installOp(registry, HealthcheckQuery, async () => ({
|
|
624
717
|
status: "ok",
|
|
625
718
|
checkedAt: new Date().toISOString(),
|
|
626
|
-
}));`})]}),
|
|
719
|
+
}));`})]}),f("div",{className:"space-y-3",children:[s("h2",{className:"font-bold text-2xl",children:"4) Add the Next.js handler"}),f("p",{className:"text-muted-foreground text-sm",children:["Create ",s("code",{children:"app/api/ops/[...route]/route.ts"}),":"]}),s(D,{language:"typescript",filename:"app/api/ops/[...route]/route.ts",code:`import { makeNextAppHandler } from "@contractspec/lib.contracts-runtime-server-rest/rest-next-app";
|
|
627
720
|
import { registry } from "@/contracts/registry";
|
|
628
721
|
|
|
629
722
|
const handler = makeNextAppHandler(registry, async () => ({
|
|
@@ -631,11 +724,11 @@ const handler = makeNextAppHandler(registry, async () => ({
|
|
|
631
724
|
tenantId: "public",
|
|
632
725
|
}));
|
|
633
726
|
|
|
634
|
-
export { handler as GET, handler as POST };`}),
|
|
727
|
+
export { handler as GET, handler as POST };`}),f("p",{className:"text-muted-foreground text-sm",children:["Expected output: the route responds at",s("code",{children:" /api/ops/healthcheck.get"}),"."]})]}),f("div",{className:"space-y-3",children:[s("h2",{className:"font-bold text-2xl",children:"5) Validate the spec"}),s(D,{language:"bash",filename:"nextjs-validate",code:"contractspec validate src/contracts/healthcheck.operation.ts"}),f("p",{className:"text-muted-foreground text-sm",children:["Expected output: ",s("code",{children:"Validation passed"}),"."]})]}),f("div",{className:"card-subtle space-y-3 p-6",children:[s("h3",{className:"font-semibold text-lg",children:"Example package"}),f("p",{className:"text-muted-foreground text-sm",children:["Use ",s("code",{children:"@contractspec/example.lifecycle-dashboard"})," as a lightweight Next.js snippet reference."]}),s(D,{language:"bash",filename:"nextjs-example",code:`# Inspect the example docs
|
|
635
728
|
contractspec examples show lifecycle-dashboard
|
|
636
729
|
|
|
637
730
|
# Validate all example manifests in this repo
|
|
638
|
-
contractspec examples validate --repo-root .`})]}),
|
|
731
|
+
contractspec examples validate --repo-root .`})]}),s(g,{title:"Want real product evidence behind endpoint changes?",body:"Studio correlates meetings, support, analytics, and code signals before compiling endpoint decisions into spec diffs."})]}),f("div",{className:"flex items-center gap-4 pt-4",children:[f(de,{href:"/docs/guides/spec-validation-and-typing",className:"btn-primary",children:["Next: Spec validation + typing ",s(Xe,{size:16})]}),s(de,{href:"/docs/guides",className:"btn-ghost",children:"Back to guides"})]})]})}import{CodeBlock as K}from"@contractspec/lib.design-system";import le from"@contractspec/lib.ui-link";import{ChevronRight as je}from"lucide-react";import{jsx as l,jsxs as C}from"react/jsx-runtime";var et=["root `README.md` and generated root `AGENTS.md` inputs when contributor or operator workflow changes","the nearest package `README.md` and `AGENTS.md` for any touched public package surface","website docs and `/llms*` summaries when the release changes how users or contributors should work"];function tt(){return C("div",{className:"space-y-8",children:[C("div",{className:"space-y-3",children:[l("h1",{className:"font-bold text-4xl",children:"Author release capsules"}),l("p",{className:"text-lg text-muted-foreground",children:"Pair each publishable changeset with a structured release capsule so changelog, upgrade, and docs surfaces all read from the same release source of truth."})]}),C("div",{className:"card-subtle space-y-4 p-6",children:[l("h2",{className:"font-bold text-2xl",children:"What you'll build"}),C("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[C("li",{children:["A ",l("code",{children:".changeset/<slug>.md"})," file for package/version intent."]}),C("li",{children:["A ",l("code",{children:".changeset/<slug>.release.yaml"})," companion for audiences, migrations, validation, and evidence."]}),l("li",{children:"Generated release artifacts that the website changelog and upgrade flows can consume safely."})]})]}),C("div",{className:"space-y-6",children:[C("div",{className:"space-y-3",children:[l("h2",{className:"font-bold text-2xl",children:"1) Create the paired changeset files"}),l("p",{className:"text-muted-foreground text-sm",children:"The Markdown file states the package bumps and reader-facing change intent. The YAML file carries the structured release metadata."}),l(K,{language:"yaml",filename:".changeset/contract-dx-first-slice.release.yaml",code:`schemaVersion: "1"
|
|
639
732
|
slug: contract-dx-first-slice
|
|
640
733
|
summary: Improve app-config, theme, and feature authoring with explicit validation and shared setup alignment.
|
|
641
734
|
isBreaking: false
|
|
@@ -646,10 +739,10 @@ validation:
|
|
|
646
739
|
commands:
|
|
647
740
|
- "cd packages/libs/contracts-spec && bun run test && bun run typecheck"
|
|
648
741
|
evidence:
|
|
649
|
-
- "Package-level validation entrypoints now back setup, docs, and CLI authoring flows."`}),
|
|
742
|
+
- "Package-level validation entrypoints now back setup, docs, and CLI authoring flows."`}),l("p",{className:"text-muted-foreground text-sm",children:"Expected output: every publishable slug has both the human-facing changeset and the structured release capsule beside it."})]}),C("div",{className:"space-y-3",children:[l("h2",{className:"font-bold text-2xl",children:"2) Use the release authoring commands instead of raw drift-prone edits"}),l(K,{language:"bash",filename:"release-authoring",code:`contractspec release init --summary "Improve app-config, theme, and feature authoring"
|
|
650
743
|
|
|
651
744
|
# Or revise an existing capsule with the guided flow
|
|
652
|
-
contractspec release edit contract-dx-first-slice`}),
|
|
745
|
+
contractspec release edit contract-dx-first-slice`}),l("p",{className:"text-muted-foreground text-sm",children:"Expected output: the CLI scaffolds or revises the paired files with the current release schema instead of leaving maintainers to hand-roll YAML structure."})]}),C("div",{className:"space-y-3",children:[l("h2",{className:"font-bold text-2xl",children:"3) Build the generated release artifacts before consuming them"}),l(K,{language:"bash",filename:"release-build",code:"contractspec release build"}),l("p",{className:"text-muted-foreground text-sm",children:"Expected output: `generated/releases/manifest.json`, `generated/releases/upgrade-manifest.json`, and the related customer/maintainer guidance files are refreshed from the release capsules."})]}),C("div",{className:"space-y-3",children:[l("h2",{className:"font-bold text-2xl",children:"4) Enforce completeness before publishing or building the changelog"}),l(K,{language:"bash",filename:"release-check",code:"contractspec release check --strict"}),l("p",{className:"text-muted-foreground text-sm",children:"Expected output: missing capsules, incomplete migration guidance, or stale generated release artifacts are flagged before the website changelog or publish workflow treats the release data as canonical."})]}),C("div",{className:"card-subtle space-y-3 p-6",children:[l("h3",{className:"font-semibold text-lg",children:"5) Sync the public docs if workflow expectations changed"}),l("ul",{className:"space-y-2 text-muted-foreground text-sm",children:et.map((o)=>l("li",{children:o},o))})]})]}),C("div",{className:"flex items-center gap-4 pt-4",children:[C(le,{href:"/docs/guides/connect-in-a-repo",className:"btn-primary",children:["Connect guide ",l(je,{size:16})]}),l(le,{href:"/changelog",className:"btn-ghost",children:"Website changelog"})]})]})}import{CodeBlock as Q}from"@contractspec/lib.design-system";import pe from"@contractspec/lib.ui-link";import{ChevronRight as at}from"lucide-react";import{jsx as h,jsxs as S}from"react/jsx-runtime";function ot(){return S("div",{className:"space-y-8",children:[S("div",{className:"space-y-3",children:[h("h1",{className:"font-bold text-4xl",children:"Spec-driven validation + typing"}),h("p",{className:"text-lg text-muted-foreground",children:"Define a single operation with SchemaModel, generate validation, and keep your existing handler logic."})]}),S("div",{className:"card-subtle space-y-4 p-6",children:[h("h2",{className:"font-bold text-2xl",children:"What you'll build"}),S("ul",{className:"space-y-2 text-muted-foreground text-sm",children:[h("li",{children:"One command spec with explicit input/output models."}),h("li",{children:"Validation + typing without rewriting your service layer."}),h("li",{children:"Clear acceptance scenarios for regression safety."})]})]}),S("div",{className:"space-y-6",children:[S("div",{className:"space-y-3",children:[h("h2",{className:"font-bold text-2xl",children:"1) Define the spec"}),S("p",{className:"text-muted-foreground text-sm",children:["Create ",h("code",{children:"src/contracts/contact-create.operation.ts"}),":"]}),h(Q,{language:"typescript",filename:"src/contracts/contact-create.operation.ts",code:`import { defineCommand } from "@contractspec/lib.contracts-spec/operations";
|
|
653
746
|
import { SchemaModel, ScalarTypeEnum } from "@contractspec/lib.schema";
|
|
654
747
|
|
|
655
748
|
const ContactInput = new SchemaModel({
|
|
@@ -695,7 +788,7 @@ export const ContactCreateCommand = defineCommand({
|
|
|
695
788
|
},
|
|
696
789
|
],
|
|
697
790
|
},
|
|
698
|
-
});`})]}),
|
|
791
|
+
});`})]}),S("div",{className:"space-y-3",children:[h("h2",{className:"font-bold text-2xl",children:"2) Wire the handler"}),h("p",{className:"text-muted-foreground text-sm",children:"Keep your existing code. Just ensure the handler returns the output shape defined above."}),h(Q,{language:"typescript",filename:"src/handlers/contact-create.ts",code:`import { ContactCreateCommand } from "@/contracts/contact-create.operation";
|
|
699
792
|
|
|
700
793
|
export async function handleContactCreate(
|
|
701
794
|
input: (typeof ContactCreateCommand)["io"]["input"],
|
|
@@ -707,21 +800,23 @@ export const ContactCreateCommand = defineCommand({
|
|
|
707
800
|
email: input.email,
|
|
708
801
|
createdAt: new Date().toISOString(),
|
|
709
802
|
};
|
|
710
|
-
}`})]}),
|
|
803
|
+
}`})]}),S("div",{className:"space-y-3",children:[h("h2",{className:"font-bold text-2xl",children:"3) Validate"}),h(Q,{language:"bash",filename:"spec-validation",code:"contractspec validate src/contracts/contact-create.operation.ts"}),S("p",{className:"text-muted-foreground text-sm",children:["Expected output: ",h("code",{children:"Validation passed"}),"."]})]}),S("div",{className:"card-subtle space-y-3 p-6",children:[h("h3",{className:"font-semibold text-lg",children:"Example package"}),h("p",{className:"text-muted-foreground text-sm",children:"The CRM Pipeline example includes real specs, handlers, and presentations for contact + deal flows."}),h(Q,{language:"bash",filename:"crm-example",code:`# Build + validate the CRM pipeline example
|
|
711
804
|
cd packages/examples/crm-pipeline
|
|
712
805
|
bun install
|
|
713
806
|
bun run build
|
|
714
|
-
bun run validate`})]}),
|
|
807
|
+
bun run validate`})]}),h(g,{title:"Need validation tied to real outcomes?",body:"Studio links checks to evidence, focus decisions, and post-release verification so specs evolve with product truth."})]}),S("div",{className:"flex items-center gap-4 pt-4",children:[S(pe,{href:"/docs/guides/contract-driven-forms",className:"btn-primary",children:["Next: Contract-driven forms ",h(at,{size:16})]}),h(pe,{href:"/docs/guides",className:"btn-ghost",children:"Back to guides"})]})]})}import{CodeBlock as nt}from"@contractspec/lib.design-system";import rt from"@contractspec/lib.ui-link";import{ArrowRight as it,CheckCircle2 as ct,GitBranch as st}from"lucide-react";import{jsx as v,jsxs as I}from"react/jsx-runtime";var dt=[{title:"Adopt one endpoint in Next.js",description:"Start inside a live app with one operation, one generated surface, and one clearly bounded change.",href:"/docs/guides/nextjs-one-endpoint",time:"25 min"},{title:"Import an existing codebase",description:"Stabilize what already exists instead of treating adoption as a rewrite project.",href:"/docs/guides/import-existing-codebases",time:"20 min"},{title:"Validation and typing",description:"Keep runtime validation and TypeScript behavior aligned from the same source definitions.",href:"/docs/guides/spec-validation-and-typing",time:"20 min"},{title:"Build a contract-driven form",description:"Use FormSpec to keep data shape, fields, layout, policy, and submit behavior aligned.",href:"/docs/guides/contract-driven-forms",time:"25 min"},{title:"Generate docs and clients",description:"Publish stable docs, schemas, and client-facing artifacts from the contract layer.",href:"/docs/guides/generate-docs-clients-schemas",time:"20 min"},{title:"Docs pipeline",description:"Feed generated reference material into the docs site without confusing ownership.",href:"/docs/guides/docs-generation-pipeline",time:"20 min"},{title:"Build a first module bundle",description:"Define one bundle spec, resolve a surface plan, and render it through the React host layer.",href:"/docs/guides/first-module-bundle",time:"20 min"},{title:"Host the Builder workbench",description:"Wire a Builder workspace snapshot, common commands, runtime modes, and mobile review links into the reusable host.",href:"/docs/guides/host-builder-workbench",time:"20 min"},{title:"Use Connect in a repo",description:"Enable Connect, verify agent actions locally, and inspect the resulting review and replay artifacts.",href:"/docs/guides/connect-in-a-repo",time:"15 min"},{title:"Author release capsules",description:"Pair changesets with structured release capsules and generate the artifacts that changelog and upgrade flows consume.",href:"/docs/guides/release-capsules",time:"15 min"},{title:"CI diff gating",description:"Use deterministic checks to catch drift and risky changes before they ship.",href:"/docs/guides/ci-contract-diff-gating",time:"15 min"}];function lt(){return I("div",{className:"space-y-10",children:[I("div",{className:"space-y-3",children:[v("p",{className:"editorial-kicker",children:"Build"}),v("h1",{className:"font-serif text-4xl tracking-[-0.04em] md:text-5xl",children:"Adoption guides for teams that want to keep their code."}),v("p",{className:"max-w-3xl text-lg text-muted-foreground leading-8",children:"These guides assume you are introducing ContractSpec into a real code base. Start with a narrow surface, verify the generated outputs, and expand only after the contract loop feels trustworthy."})]}),v("div",{className:"grid gap-4 md:grid-cols-2",children:dt.map((o)=>I(rt,{href:o.href,className:"editorial-panel",children:[I("div",{className:"flex items-start justify-between gap-4",children:[I("div",{children:[v("h2",{className:"font-semibold text-xl",children:o.title}),v("p",{className:"mt-2 text-muted-foreground text-sm leading-7",children:o.description})]}),v(it,{className:"mt-1 shrink-0",size:18})]}),I("div",{className:"mt-4 flex items-center gap-2 text-muted-foreground text-xs",children:[v(ct,{size:14}),I("span",{children:["Target time: ",o.time]})]})]},o.href))}),I("div",{className:"editorial-panel space-y-4",children:[I("div",{className:"flex items-center gap-2 font-semibold text-[color:var(--rust)] text-sm uppercase tracking-[0.2em]",children:[v(st,{size:16}),"Working style"]}),I("ul",{className:"editorial-list",children:[I("li",{children:[v("span",{className:"editorial-list-marker"}),v("span",{children:"Run each guide in a branch or sandboxed workspace."})]}),I("li",{children:[v("span",{className:"editorial-list-marker"}),v("span",{children:"Prefer one bounded surface at a time: one endpoint, one workflow, one integration, one unsafe module."})]}),I("li",{children:[v("span",{className:"editorial-list-marker"}),v("span",{children:"Use the example and reference outputs to verify what changed, not just the narrative page."})]})]}),v(nt,{language:"bash",filename:"guides-quickstart",code:`# list example systems
|
|
715
808
|
contractspec examples list
|
|
716
809
|
|
|
717
810
|
# validate the examples in this workspace
|
|
718
|
-
contractspec examples validate --repo-root .`})]})]})}import{registerDocBlocks as
|
|
811
|
+
contractspec examples validate --repo-root .`})]})]})}import{registerDocBlocks as pt}from"@contractspec/lib.contracts-spec/docs";var mt=[{id:"docs.guides.index",title:"Guides",summary:"Hands-on guides for adopting ContractSpec in real workflows.",kind:"goal",visibility:"public",route:"/docs/guides",tags:["guides","adoption"],body:`# Guides
|
|
719
812
|
|
|
720
813
|
Hands-on, runnable guides that map to real adoption scenarios. Each guide includes commands, expected output, and a CI-verified example package.`},{id:"docs.guides.nextjs-one-endpoint",title:"Next.js one endpoint",summary:"Add ContractSpec to an existing Next.js app with one endpoint.",kind:"usage",visibility:"public",route:"/docs/guides/nextjs-one-endpoint",tags:["guides","nextjs","operations"],body:`# Add ContractSpec to a Next.js app (one endpoint)
|
|
721
814
|
|
|
722
815
|
Create a single OperationSpec, register it, and expose it through a Next.js App Router handler.`},{id:"docs.guides.spec-validation-typing",title:"Spec validation and typing",summary:"Define an operation spec with validation and types, no rewrites.",kind:"usage",visibility:"public",route:"/docs/guides/spec-validation-and-typing",tags:["guides","validation","typing"],body:`# Spec-driven validation and typing
|
|
723
816
|
|
|
724
|
-
Define command/query specs that enforce validation and generate types without rewriting your app.`},{id:"docs.guides.
|
|
817
|
+
Define command/query specs that enforce validation and generate types without rewriting your app.`},{id:"docs.guides.contract-driven-forms",title:"Contract-driven forms",summary:"Define schema-backed FormSpec surfaces and render them safely.",kind:"usage",visibility:"public",route:"/docs/guides/contract-driven-forms",tags:["guides","forms","ui"],body:`# Build a contract-driven form
|
|
818
|
+
|
|
819
|
+
Define a FormSpec with model, fields, layout, policy, and actions, then render it through a shared or app-specific renderer.`},{id:"docs.guides.docs-clients-schemas",title:"Generate docs, clients, schemas",summary:"Generate docs and OpenAPI for client SDKs from specs.",kind:"usage",visibility:"public",route:"/docs/guides/generate-docs-clients-schemas",tags:["guides","docs","openapi"],body:`# Generate docs and client schemas
|
|
725
820
|
|
|
726
821
|
Use ContractSpec to generate documentation and OpenAPI exports for client SDKs.
|
|
727
822
|
|
|
@@ -761,4 +856,4 @@ bun docs:generate -- --version v1.0.0
|
|
|
761
856
|
|
|
762
857
|
Use the generated manifest and chunks under \`docs-index.manifest.json\` and \`docs-index.*.json\` to load the index at runtime.`},{id:"docs.guides.ci-contract-diff-gating",title:"CI gating for contract diffs",summary:"Gate changes with deterministic diffs and CI checks.",kind:"usage",visibility:"public",route:"/docs/guides/ci-contract-diff-gating",tags:["guides","ci","diff"],body:`# CI gating with deterministic diffs
|
|
763
858
|
|
|
764
|
-
Run ContractSpec CI checks to detect drift and breaking changes before merge.`}];
|
|
859
|
+
Run ContractSpec CI checks to detect drift and breaking changes before merge.`}];pt(mt);export{lt as GuidesIndexPage,ot as GuideSpecValidationTypingPage,tt as GuideReleaseCapsulesPage,xe as GuideNextjsOneEndpointPage,$e as GuideImportExistingCodebasesPage,Qe as GuideHostBuilderWorkbenchPage,Fe as GuideGenerateDocsClientsSchemasPage,Ge as GuideFirstModuleBundlePage,Me as GuideDocsPipelinePage,De as GuideContractTypesPage,Pe as GuideContractDrivenFormsPage,we as GuideConnectInRepoPage,be as GuideCIDiffGatingPage};
|