@contractspec/bundle.library 3.7.6 → 3.8.2

package/src/components/docs/manifesto/ManifestoPage.tsx

@@ -1,138 +1,67 @@
-// export const metadata = {
-//   title: 'Manifesto: ContractSpec',
-//   description:
-//     'Our philosophy: compiler not prison, no lock-in, standard tech, incremental adoption, AI governance.',
-// };
-
 export function ManifestoPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">Manifesto</h1>
-        <p className="text-muted-foreground text-lg">
-          ContractSpec is the deterministic, spec-first compiler that keeps
-          AI-written software coherent, safe, and regenerable. We're building
-          the safety layer for AI-coded systems.
-        </p>
-      </div>
-
-      <div className="space-y-6">
-        <div className="space-y-3">
-          <h2 className="text-2xl font-bold">Compiler, not prison</h2>
-          <p className="text-muted-foreground">
-            ContractSpec is a tool in your toolchain, not a platform you're
-            locked into. Like TypeScript compiles to JavaScript, ContractSpec
-            compiles specs to standard code. The generated output is
-            yours—readable, modifiable, and ejectable at any time.
-          </p>
-          <p className="text-muted-foreground">
-            We believe developers should own their code. There's no proprietary
-            runtime, no vendor-specific abstractions, no magic that hides
-            complexity. You can always see what ContractSpec generates,
-            understand it, and take it with you if you leave.
-          </p>
-        </div>
-
-        <div className="space-y-3">
-          <h2 className="text-2xl font-bold">Standard tech, no magic</h2>
-          <p className="text-muted-foreground">
-            Everything ContractSpec generates uses technology you already know:
-            TypeScript, Zod, Prisma, GraphQL, REST, React. There's no new
-            language to learn, no YAML configuration hell, no DSL that only
-            works in our ecosystem.
-          </p>
-          <p className="text-muted-foreground">
-            Specs are just TypeScript. If you can write{' '}
-            <code className="rounded bg-violet-500/10 px-1.5 py-0.5 text-sm">
-              z.object({'{'} name: z.string() {'}'})
-            </code>
-            , you can write a ContractSpec. Your existing skills transfer
-            directly.
-          </p>
-        </div>
-
-        <div className="space-y-3">
-          <h2 className="text-2xl font-bold">Incremental adoption</h2>
-          <p className="text-muted-foreground">
-            You don't rewrite your app to use ContractSpec. You stabilize one
-            module at a time. Start with a single API endpoint, a single data
-            model, a single contract. See the value. Expand gradually.
-          </p>
-          <p className="text-muted-foreground">
-            This isn't a big-bang migration. It's a safety layer you add
-            incrementally to existing AI-generated chaos. No pressure. No
-            deadlines. Your pace.
-          </p>
-        </div>
+	return (
+		<div className="space-y-8">
+			<div className="space-y-3">
+				<p className="editorial-kicker">Why ContractSpec</p>
+				<h1 className="font-serif text-4xl tracking-[-0.04em] md:text-5xl">
+					Open system, explicit contracts, incremental adoption.
+				</h1>
+				<p className="max-w-3xl text-lg text-muted-foreground leading-8">
+					ContractSpec exists to make AI-native software more legible and more
+					governable. The system should help teams express durable boundaries,
+					keep generated surfaces aligned, and still own the code and contracts
+					they ship.
+				</p>
+			</div>
 
-        <div className="space-y-3">
-          <h2 className="text-2xl font-bold">AI governance</h2>
-          <p className="text-muted-foreground">
-            In 2025, AI agents generate enormous amounts of code. But they can't
-            enforce invariants, they break multi-surface consistency, and they
-            hallucinate refactors. The result is code that's hard to maintain
-            and dangerous to trust.
-          </p>
-          <p className="text-muted-foreground">
-            ContractSpec provides the governance layer. Contracts define what
-            the system <em>should</em> do. AI agents read specs, not
-            implementations. Code that violates contracts gets flagged and
-            rejected before it can cause damage.
-          </p>
-        </div>
+			<div className="space-y-6">
+				<section className="editorial-panel space-y-3">
+					<h2 className="font-serif text-3xl tracking-[-0.03em]">
+						Open system, not closed platform
+					</h2>
+					<p className="text-muted-foreground text-sm leading-7">
+						The OSS layer should remain useful on its own. Teams need explicit
+						contracts, readable code, and outputs they can keep. Studio can sit
+						on top of that system, but it should never be the only way to own or
+						understand the behavior.
+					</p>
+				</section>
 
-        <div className="space-y-3">
-          <h2 className="text-2xl font-bold">Multi-surface consistency</h2>
-          <p className="text-muted-foreground">
-            One spec generates API endpoints, database schemas, UI types, event
-            definitions, and MCP tools. All surfaces stay in sync because they
-            share the same source of truth.
-          </p>
-          <p className="text-muted-foreground">
-            No more chasing drift between your API and your database. No more
-            frontend types that don't match backend contracts. One change to the
-            spec, all surfaces update consistently.
-          </p>
-        </div>
+				<section className="editorial-panel space-y-3">
+					<h2 className="font-serif text-3xl tracking-[-0.03em]">
+						Contracts before surface sprawl
+					</h2>
+					<p className="text-muted-foreground text-sm leading-7">
+						AI tooling accelerates surface creation faster than most teams can
+						govern it. The answer is not more hidden glue. The answer is a
+						durable contract layer that keeps API, UI, data, workflows, and
+						operator behavior aligned.
+					</p>
+				</section>
 
-        <div className="space-y-3">
-          <h2 className="text-2xl font-bold">Safe regeneration</h2>
-          <p className="text-muted-foreground">
-            You can regenerate code at any time without fear. Specs enforce
-            invariants. Breaking changes are caught at compile time, not in
-            production. Roll back to any previous version with confidence.
-          </p>
-          <p className="text-muted-foreground">
-            This is the promise of spec-first development: the code is derived
-            from the spec, so regenerating it is always safe. No more "don't
-            touch that file" warnings. No more fear of AI-generated spaghetti.
-          </p>
-        </div>
-      </div>
+				<section className="editorial-panel space-y-3">
+					<h2 className="font-serif text-3xl tracking-[-0.03em]">
+						Incremental adoption wins
+					</h2>
+					<p className="text-muted-foreground text-sm leading-7">
+						Most teams already have a codebase. The practical path is to
+						stabilize one boundary at a time, prove the loop, and grow from
+						there. That is why the docs and product should lead with one module,
+						one endpoint, one workflow, one unsafe surface at a time.
+					</p>
+				</section>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Join us</h2>
-        <p className="text-muted-foreground">
-          We're building the safety layer for AI-coded systems. If you believe
-          developers should own their code, that AI needs governance, and that
-          standard tech beats proprietary magic—we'd love to have you.
-        </p>
-        <p className="text-muted-foreground">
-          You keep your app. We stabilize it, one module at a time. You own the
-          code. It's standard tech.{' '}
-          <span className="font-semibold text-violet-400">
-            We're the compiler, not the prison.
-          </span>
-        </p>
-        <div className="flex flex-wrap gap-4 pt-4">
-          <a href="/install" className="btn-primary">
-            Install OSS Core
-          </a>
-          <a href="https://www.contractspec.studio" className="btn-ghost">
-            Try Studio
-          </a>
-        </div>
-      </div>
-    </div>
-  );
+				<section className="editorial-panel space-y-3">
+					<h2 className="font-serif text-3xl tracking-[-0.03em]">
+						Studio should stay additive
+					</h2>
+					<p className="text-muted-foreground text-sm leading-7">
+						The best operating product can and should exist on top of the open
+						system. But the OSS foundation must remain strong enough that
+						technical adopters trust it before they ever adopt Studio.
+					</p>
+				</section>
+			</div>
+		</div>
+	);
 }

package/src/components/docs/ops/AutoEvolutionOpsPage.tsx

@@ -5,40 +5,40 @@
 // };
 
 export function OpsAutoEvolutionPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">Auto-Evolution Runbook</h1>
-        <p className="text-muted-foreground text-lg">
-          Configure sampling, approvals, experiments, and golden tests so your
-          app keeps improving without regressions.
-        </p>
-      </div>
+	return (
+		<div className="space-y-8">
+			<div className="space-y-4">
+				<h1 className="font-bold text-4xl">Auto-Evolution Runbook</h1>
+				<p className="text-lg text-muted-foreground">
+					Configure sampling, approvals, experiments, and golden tests so your
+					app keeps improving without regressions.
+				</p>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Pipeline overview</h2>
-        <ol className="text-muted-foreground list-decimal space-y-2 pl-6 text-sm">
-          <li>
-            Tracing middleware emits telemetry samples with tenant/user context.
-          </li>
-          <li>IntentAggregator batches samples (15m window, configurable).</li>
-          <li>IntentDetector raises error/latency/throughput signals.</li>
-          <li>SpecGenerator produces proposals with confidence scores.</li>
-          <li>ApprovalWorkflow routes low-confidence suggestions to humans.</li>
-          <li>
-            SpecExperimentRegistry rolls out approved variants using guardrails.
-          </li>
-          <li>
-            TrafficRecorder captures new traffic and GoldenTestGenerator outputs
-            suites.
-          </li>
-        </ol>
-      </div>
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Pipeline overview</h2>
+				<ol className="list-decimal space-y-2 pl-6 text-muted-foreground text-sm">
+					<li>
+						Tracing middleware emits telemetry samples with tenant/user context.
+					</li>
+					<li>IntentAggregator batches samples (15m window, configurable).</li>
+					<li>IntentDetector raises error/latency/throughput signals.</li>
+					<li>SpecGenerator produces proposals with confidence scores.</li>
+					<li>ApprovalWorkflow routes low-confidence suggestions to humans.</li>
+					<li>
+						SpecExperimentRegistry rolls out approved variants using guardrails.
+					</li>
+					<li>
+						TrafficRecorder captures new traffic and GoldenTestGenerator outputs
+						suites.
+					</li>
+				</ol>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Key environment variables</h2>
-        <pre className="bg-muted rounded-lg border p-4 text-sm">
-          {`# Telemetry sampling
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Key environment variables</h2>
+				<pre className="rounded-lg border bg-muted p-4 text-sm">
+					{`# Telemetry sampling
 AUTO_EVOLUTION_SAMPLE_RATE=0.02
 AUTO_EVOLUTION_WINDOW_MS=900000
 
@@ -49,55 +49,55 @@ AUTO_EVOLUTION_AUTO_APPROVE=0.2
 # Guardrails (fallback defaults)
 AUTO_EVOLUTION_MAX_ERROR_RATE=0.02
 AUTO_EVOLUTION_MAX_P99_MS=500`}
-        </pre>
-      </div>
+				</pre>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Operations checklist</h2>
-        <ul className="text-muted-foreground list-disc space-y-2 pl-6 text-sm">
-          <li>
-            Review new `SpecSuggestion` records every morning (UI coming soon;
-            Prisma view today).
-          </li>
-          <li>Keep at least one reviewer per domain on-call for approvals.</li>
-          <li>
-            Attach `SpecExperimentAdapter.trackOutcome` to every runtime
-            adapter.
-          </li>
-          <li>
-            Schedule `contractspec test generate` nightly (or on deploy) to
-            refresh golden suites.
-          </li>
-          <li>
-            Feed `runGoldenTests` into CI to gate merges touching evolved specs.
-          </li>
-        </ul>
-      </div>
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Operations checklist</h2>
+				<ul className="list-disc space-y-2 pl-6 text-muted-foreground text-sm">
+					<li>
+						Review new `SpecSuggestion` records every morning (UI coming soon;
+						Prisma view today).
+					</li>
+					<li>Keep at least one reviewer per domain on-call for approvals.</li>
+					<li>
+						Attach `SpecExperimentAdapter.trackOutcome` to every runtime
+						adapter.
+					</li>
+					<li>
+						Schedule `contractspec test generate` nightly (or on deploy) to
+						refresh golden suites.
+					</li>
+					<li>
+						Feed `runGoldenTests` into CI to gate merges touching evolved specs.
+					</li>
+				</ul>
+			</div>
 
-      <div className="grid gap-4 md:grid-cols-3">
-        {[
-          {
-            title: 'Sampling',
-            description:
-              'Start at 1–2% of traffic. Increase only after sanitization is verified.',
-          },
-          {
-            title: 'Approvals',
-            description:
-              'High-risk ops (money, compliance) should never auto-approve. Use ApprovalWorkflow notes for audit.',
-          },
-          {
-            title: 'On-call alerts',
-            description:
-              'Tie SpecExperimentController rollbacks into PagerDuty/Slack so engineers see guardrail trips immediately.',
-          },
-        ].map((card) => (
-          <div key={card.title} className="card-subtle space-y-2 p-4">
-            <h3 className="text-lg font-semibold">{card.title}</h3>
-            <p className="text-muted-foreground text-sm">{card.description}</p>
-          </div>
-        ))}
-      </div>
-    </div>
-  );
+			<div className="grid gap-4 md:grid-cols-3">
+				{[
+					{
+						title: 'Sampling',
+						description:
+							'Start at 1–2% of traffic. Increase only after sanitization is verified.',
+					},
+					{
+						title: 'Approvals',
+						description:
+							'High-risk ops (money, compliance) should never auto-approve. Use ApprovalWorkflow notes for audit.',
+					},
+					{
+						title: 'On-call alerts',
+						description:
+							'Tie SpecExperimentController rollbacks into PagerDuty/Slack so engineers see guardrail trips immediately.',
+					},
+				].map((card) => (
+					<div key={card.title} className="card-subtle space-y-2 p-4">
+						<h3 className="font-semibold text-lg">{card.title}</h3>
+						<p className="text-muted-foreground text-sm">{card.description}</p>
+					</div>
+				))}
+			</div>
+		</div>
+	);
 }

package/src/components/docs/ops/DistributedTracingOpsPage.tsx

@@ -4,37 +4,37 @@
 // };
 
 export function OpsDistributedTracingPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">Distributed Tracing</h1>
-        <p className="text-muted-foreground text-lg">
-          ContractSpec uses OpenTelemetry (OTel) for distributed tracing. This
-          guide explains how to configure exporters and collectors.
-        </p>
-      </div>
+	return (
+		<div className="space-y-8">
+			<div className="space-y-4">
+				<h1 className="font-bold text-4xl">Distributed Tracing</h1>
+				<p className="text-lg text-muted-foreground">
+					ContractSpec uses OpenTelemetry (OTel) for distributed tracing. This
+					guide explains how to configure exporters and collectors.
+				</p>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Configuration</h2>
-        <p>Configure the OTel SDK via environment variables:</p>
-        <pre className="bg-muted rounded-lg border p-4 text-sm">
-          {`OTEL_SERVICE_NAME=my-service
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Configuration</h2>
+				<p>Configure the OTel SDK via environment variables:</p>
+				<pre className="rounded-lg border bg-muted p-4 text-sm">
+					{`OTEL_SERVICE_NAME=my-service
 OTEL_EXPORTER_OTLP_ENDPOINT=http://otel-collector:4318
 OTEL_TRACES_SAMPLER=parentbased_traceidratio
 OTEL_TRACES_SAMPLER_ARG=0.1`}
-        </pre>
-      </div>
+				</pre>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Exporters</h2>
-        <p>By default, the OTLP exporter is used. You can point it to:</p>
-        <ul className="list-disc space-y-2 pl-6">
-          <li>Jaeger</li>
-          <li>Tempo (Grafana)</li>
-          <li>Honeycomb</li>
-          <li>Datadog (via OTel Collector)</li>
-        </ul>
-      </div>
-    </div>
-  );
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Exporters</h2>
+				<p>By default, the OTLP exporter is used. You can point it to:</p>
+				<ul className="list-disc space-y-2 pl-6">
+					<li>Jaeger</li>
+					<li>Tempo (Grafana)</li>
+					<li>Honeycomb</li>
+					<li>Datadog (via OTel Collector)</li>
+				</ul>
+			</div>
+		</div>
+	);
 }

package/src/components/docs/ops/ops-lifecycle.docblocks.ts

@@ -1,41 +1,41 @@
 import type { DocBlock } from '@contractspec/lib.contracts-spec/docs';
 
 export const opsLifecycleDocs: DocBlock[] = [
-  {
-    id: 'docs.ops.lifecycle-operations.goal',
-    title: 'Lifecycle operations goal',
-    summary:
-      'Keep managed lifecycle assessments timely, auditable, and low-risk per tenant.',
-    kind: 'goal',
-    visibility: 'public',
-    route: '/docs/ops/lifecycle-operations/goal',
-    tags: ['ops', 'lifecycle'],
-    body: 'Operate lifecycle assessments with predictable cadence, clear observability, and reversible customizations so tenants stay aligned to milestones without risking data access.',
-  },
-  {
-    id: 'docs.ops.lifecycle-operations.usage',
-    title: 'Lifecycle operations usage guide',
-    summary: 'Quick checklist for running lifecycle managed ops.',
-    kind: 'usage',
-    visibility: 'public',
-    route: '/docs/ops/lifecycle-operations/usage',
-    tags: ['ops', 'lifecycle'],
-    body: `- Run weekly auto-refresh per tenant; allow manual reruns behind \`LIFECYCLE_DETECTION_ALPHA\`.
+	{
+		id: 'docs.ops.lifecycle-operations.goal',
+		title: 'Lifecycle operations goal',
+		summary:
+			'Keep managed lifecycle assessments timely, auditable, and low-risk per tenant.',
+		kind: 'goal',
+		visibility: 'public',
+		route: '/docs/ops/lifecycle-operations/goal',
+		tags: ['ops', 'lifecycle'],
+		body: 'Operate lifecycle assessments with predictable cadence, clear observability, and reversible customizations so tenants stay aligned to milestones without risking data access.',
+	},
+	{
+		id: 'docs.ops.lifecycle-operations.usage',
+		title: 'Lifecycle operations usage guide',
+		summary: 'Quick checklist for running lifecycle managed ops.',
+		kind: 'usage',
+		visibility: 'public',
+		route: '/docs/ops/lifecycle-operations/usage',
+		tags: ['ops', 'lifecycle'],
+		body: `- Run weekly auto-refresh per tenant; allow manual reruns behind \`LIFECYCLE_DETECTION_ALPHA\`.
 - Publish top 3 actions + milestone checklist to Studio UI; emit lifecycle events.
 - Monitor P95 < 500ms; alert on confidence < 0.5 or stage churn.
 - Version overrides (weights, milestones, playbooks); never edit compiled JS.
 - Log incidents for detection gaps or bad recommendations; gate ceremony output via flag if broken.`,
-  },
-  {
-    id: 'docs.ops.lifecycle-operations.how',
-    title: 'Lifecycle operations runbook',
-    summary:
-      'Full runbook for lifecycle assessments, customization, and alerts.',
-    kind: 'how',
-    visibility: 'public',
-    route: '/docs/ops/lifecycle-operations/how',
-    tags: ['ops', 'lifecycle'],
-    body: `## Lifecycle Operations Runbook (ContractSpec Managed)
+	},
+	{
+		id: 'docs.ops.lifecycle-operations.how',
+		title: 'Lifecycle operations runbook',
+		summary:
+			'Full runbook for lifecycle assessments, customization, and alerts.',
+		kind: 'how',
+		visibility: 'public',
+		route: '/docs/ops/lifecycle-operations/how',
+		tags: ['ops', 'lifecycle'],
+		body: `## Lifecycle Operations Runbook (ContractSpec Managed)
 
 This runbook guides ContractSpec operators who run the lifecycle managed service (bundle + Studio surfaces). It focuses on cadence, monitoring, customization, and escalation without touching tenant-specific databases.
 
@@ -147,5 +147,5 @@ Alert recipients: lifecycle ops squad + product owner.
 - Progressive delivery config for lifecycle feature flags.
 
 Maintain this runbook alongside code changes; every bundle release must document operational impact and flag defaults.`,
-  },
+	},
 ];