@contractspec/bundle.library 3.7.5 → 3.7.7

package/src/components/docs/libraries/LibrariesAiAgentPage.tsx

@@ -1,29 +1,29 @@
+import { CodeBlock, InstallCommand } from '@contractspec/lib.design-system';
 import Link from '@contractspec/lib.ui-link';
 import { ChevronRight } from 'lucide-react';
-import { CodeBlock, InstallCommand } from '@contractspec/lib.design-system';
 
 export function LibrariesAiAgentPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">@contractspec/lib.ai-agent</h1>
-        <p className="text-muted-foreground text-lg">
-          Define AI agents in TypeScript, run them with deterministic tool
-          calling, capture working memory, and route low-confidence decisions to
-          human reviewers.
-        </p>
-      </div>
+	return (
+		<div className="space-y-8">
+			<div className="space-y-4">
+				<h1 className="font-bold text-4xl">@contractspec/lib.ai-agent</h1>
+				<p className="text-lg text-muted-foreground">
+					Define AI agents in TypeScript, run them with deterministic tool
+					calling, capture working memory, and route low-confidence decisions to
+					human reviewers.
+				</p>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Installation</h2>
-        <InstallCommand package="@contractspec/lib.ai-agent" />
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Installation</h2>
+				<InstallCommand package="@contractspec/lib.ai-agent" />
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Define & register</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import { defineAgent, AgentRegistry } from '@contractspec/lib.ai-agent';
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Define & register</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import { defineAgent, AgentRegistry } from '@contractspec/lib.ai-agent';
 
 const SupportBot = defineAgent({
   meta: { name: 'support.bot', version: '1.0.0' },
@@ -36,14 +36,14 @@ const SupportBot = defineAgent({
 });
 
 const registry = new AgentRegistry().register(SupportBot);`}
-        />
-      </div>
+				/>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Run with approvals</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import { AgentRunner, ToolExecutor, ApprovalWorkflow } from '@contractspec/lib.ai-agent';
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Run with approvals</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import { AgentRunner, ToolExecutor, ApprovalWorkflow } from '@contractspec/lib.ai-agent';
 
 const runner = new AgentRunner({
   registry,
@@ -56,37 +56,37 @@ const result = await runner.run({ agent: 'support.bot', input: ticket.body });
 if (result.approvalRequestId) {
   // show in ApprovalQueue UI
 }`}
-        />
-      </div>
+				/>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">What's inside</h2>
-        <ul className="text-muted-foreground list-inside list-disc space-y-2">
-          <li>
-            <code>defineAgent</code>, <code>AgentRegistry</code>,{' '}
-            <code>AgentRunner</code>
-          </li>
-          <li>
-            <code>ToolExecutor</code> with schema-enforced tool definitions
-          </li>
-          <li>
-            <code>InMemoryAgentMemory</code> plus interfaces for custom stores
-          </li>
-          <li>
-            <code>ApprovalWorkflow</code> + <code>ApprovalStore</code> for
-            human-in-the-loop reviews
-          </li>
-        </ul>
-      </div>
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">What's inside</h2>
+				<ul className="list-inside list-disc space-y-2 text-muted-foreground">
+					<li>
+						<code>defineAgent</code>, <code>AgentRegistry</code>,{' '}
+						<code>AgentRunner</code>
+					</li>
+					<li>
+						<code>ToolExecutor</code> with schema-enforced tool definitions
+					</li>
+					<li>
+						<code>InMemoryAgentMemory</code> plus interfaces for custom stores
+					</li>
+					<li>
+						<code>ApprovalWorkflow</code> + <code>ApprovalStore</code> for
+						human-in-the-loop reviews
+					</li>
+				</ul>
+			</div>
 
-      <div className="flex items-center gap-4 pt-4">
-        <Link href="/docs/libraries" className="btn-ghost">
-          Back to Libraries
-        </Link>
-        <Link href="/docs/libraries/support-bot" className="btn-primary">
-          Next: Support Bot <ChevronRight size={16} />
-        </Link>
-      </div>
-    </div>
-  );
+			<div className="flex items-center gap-4 pt-4">
+				<Link href="/docs/libraries" className="btn-ghost">
+					Back to Libraries
+				</Link>
+				<Link href="/docs/libraries/support-bot" className="btn-primary">
+					Next: Support Bot <ChevronRight size={16} />
+				</Link>
+			</div>
+		</div>
+	);
 }

package/src/components/docs/libraries/LibrariesAnalyticsPage.tsx

@@ -1,26 +1,26 @@
 import { CodeBlock, InstallCommand } from '@contractspec/lib.design-system';
 
 export function LibrariesAnalyticsPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">@contractspec/lib.analytics</h1>
-        <p className="text-muted-foreground text-lg">
-          Work directly with telemetry events to understand conversion,
-          retention, churn, and growth opportunities.
-        </p>
-      </div>
-
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Installation</h2>
-        <InstallCommand package="@contractspec/lib.analytics" />
-      </div>
-
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Funnels in memory</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import { FunnelAnalyzer } from '@contractspec/lib.analytics/funnel';
+	return (
+		<div className="space-y-8">
+			<div className="space-y-4">
+				<h1 className="font-bold text-4xl">@contractspec/lib.analytics</h1>
+				<p className="text-lg text-muted-foreground">
+					Work directly with telemetry events to understand conversion,
+					retention, churn, and growth opportunities.
+				</p>
+			</div>
+
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Installation</h2>
+				<InstallCommand package="@contractspec/lib.analytics" />
+			</div>
+
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Funnels in memory</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import { FunnelAnalyzer } from '@contractspec/lib.analytics/funnel';
 
 const analyzer = new FunnelAnalyzer();
 const report = analyzer.analyze(events, {
@@ -31,33 +31,33 @@ const report = analyzer.analyze(events, {
     { id: 'verified', eventName: 'account.verified' },
   ],
 });`}
-        />
-      </div>
-
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Cohorts & churn</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import { CohortTracker } from '@contractspec/lib.analytics/cohort';
+				/>
+			</div>
+
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Cohorts & churn</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import { CohortTracker } from '@contractspec/lib.analytics/cohort';
 import { ChurnPredictor } from '@contractspec/lib.analytics/churn';
 
 const cohorts = new CohortTracker().analyze(events, { bucket: 'week', periods: 8 });
 const churn = new ChurnPredictor().score(events);`}
-        />
-      </div>
+				/>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">Growth hypotheses</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import { GrowthHypothesisGenerator } from '@contractspec/lib.analytics/growth';
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">Growth hypotheses</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import { GrowthHypothesisGenerator } from '@contractspec/lib.analytics/growth';
 
 const ideas = new GrowthHypothesisGenerator().generate([
   { name: 'Activation rate', current: 0.42, previous: 0.55, target: 0.6 },
   { name: 'Expansion ARPU', current: 1.2, previous: 0.9 },
 ]);`}
-        />
-      </div>
-    </div>
-  );
+				/>
+			</div>
+		</div>
+	);
 }

package/src/components/docs/libraries/LibrariesContentGenPage.tsx

@@ -3,26 +3,26 @@ import Link from '@contractspec/lib.ui-link';
 import { ChevronRight } from 'lucide-react';
 
 export function LibrariesContentGenPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">@contractspec/lib.content-gen</h1>
-        <p className="text-muted-foreground text-lg">
-          Feed a single ContentBrief and produce cohesive marketing assets
-          without touching a CMS.
-        </p>
-      </div>
+	return (
+		<div className="space-y-8">
+			<div className="space-y-4">
+				<h1 className="font-bold text-4xl">@contractspec/lib.content-gen</h1>
+				<p className="text-lg text-muted-foreground">
+					Feed a single ContentBrief and produce cohesive marketing assets
+					without touching a CMS.
+				</p>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Installation</h2>
-        <InstallCommand package="@contractspec/lib.content-gen" />
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Installation</h2>
+				<InstallCommand package="@contractspec/lib.content-gen" />
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">One brief, many assets</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import {
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">One brief, many assets</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import {
   BlogGenerator,
   LandingPageGenerator,
   EmailCampaignGenerator,
@@ -43,29 +43,29 @@ const landing = await new LandingPageGenerator().generate(brief);
 const email = await new EmailCampaignGenerator().generate({ brief, variant: 'announcement' });
 const social = await new SocialPostGenerator().generate(brief);
 const seo = new SeoOptimizer().optimize(brief);`}
-        />
-      </div>
+				/>
+			</div>
 
-      <div className="space-y-3">
-        <h2 className="text-2xl font-bold">When to use</h2>
-        <ul className="text-muted-foreground list-inside list-disc space-y-2">
-          <li>Ship landing page refreshes whenever specs change.</li>
-          <li>Automate release emails + nurture sequences per vertical.</li>
-          <li>
-            Create social snippets that stay on-message with the same brief.
-          </li>
-          <li>Generate SEO metadata + Schema.org markup alongside content.</li>
-        </ul>
-      </div>
+			<div className="space-y-3">
+				<h2 className="font-bold text-2xl">When to use</h2>
+				<ul className="list-inside list-disc space-y-2 text-muted-foreground">
+					<li>Ship landing page refreshes whenever specs change.</li>
+					<li>Automate release emails + nurture sequences per vertical.</li>
+					<li>
+						Create social snippets that stay on-message with the same brief.
+					</li>
+					<li>Generate SEO metadata + Schema.org markup alongside content.</li>
+				</ul>
+			</div>
 
-      <div className="flex items-center gap-4 pt-4">
-        <Link href="/docs/libraries" className="btn-ghost">
-          Back to Libraries
-        </Link>
-        <Link href="/docs/libraries/support-bot" className="btn-primary">
-          Next: Support Bot <ChevronRight size={16} />
-        </Link>
-      </div>
-    </div>
-  );
+			<div className="flex items-center gap-4 pt-4">
+				<Link href="/docs/libraries" className="btn-ghost">
+					Back to Libraries
+				</Link>
+				<Link href="/docs/libraries/support-bot" className="btn-primary">
+					Next: Support Bot <ChevronRight size={16} />
+				</Link>
+			</div>
+		</div>
+	);
 }

package/src/components/docs/libraries/LibrariesContractsPage.tsx

@@ -1,56 +1,56 @@
+import { CodeBlock, InstallCommand } from '@contractspec/lib.design-system';
 import Link from '@contractspec/lib.ui-link';
 import { ChevronRight } from 'lucide-react';
-import { CodeBlock, InstallCommand } from '@contractspec/lib.design-system';
 
 export function LibrariesContractsPage() {
-  return (
-    <div className="space-y-8">
-      <div className="space-y-4">
-        <h1 className="text-4xl font-bold">@contractspec/lib.contracts-spec</h1>
-        <p className="text-muted-foreground text-lg">
-          The core library for defining what your application can do. Unified
-          specifications for Operations, Events, Presentations, and Features.
-        </p>
-      </div>
+	return (
+		<div className="space-y-8">
+			<div className="space-y-4">
+				<h1 className="font-bold text-4xl">@contractspec/lib.contracts-spec</h1>
+				<p className="text-lg text-muted-foreground">
+					The core library for defining what your application can do. Unified
+					specifications for Operations, Events, Presentations, and Features.
+				</p>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Installation</h2>
-        <InstallCommand
-          package={[
-            '@contractspec/lib.contracts-spec',
-            '@contractspec/lib.schema',
-          ]}
-        />
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Installation</h2>
+				<InstallCommand
+					package={[
+						'@contractspec/lib.contracts-spec',
+						'@contractspec/lib.schema',
+					]}
+				/>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">What lives where</h2>
-        <ul className="text-muted-foreground list-inside list-disc space-y-2">
-          <li>
-            <strong>@contractspec/lib.contracts-spec</strong> (root): The core
-            contracts definitions (OperationSpec, PresentationSpec, Registry).
-          </li>
-          <li>
-            <strong>@contractspec/lib.contracts-runtime-client-react</strong>:
-            Browser-safe helpers (React renderers, client SDK). Import this for
-            web/React Native.
-          </li>
-          <li>
-            <strong>@contractspec/lib.contracts-runtime-server-rest</strong>:
-            HTTP/MCP adapters, registries, integrations (Node-only).
-          </li>
-          <li>
-            <strong>@contractspec/lib.schema</strong>: Schema dictionary
-            (SchemaModel, FieldType) for I/O definitions.
-          </li>
-        </ul>
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">What lives where</h2>
+				<ul className="list-inside list-disc space-y-2 text-muted-foreground">
+					<li>
+						<strong>@contractspec/lib.contracts-spec</strong> (root): The core
+						contracts definitions (OperationSpec, PresentationSpec, Registry).
+					</li>
+					<li>
+						<strong>@contractspec/lib.contracts-runtime-client-react</strong>:
+						Browser-safe helpers (React renderers, client SDK). Import this for
+						web/React Native.
+					</li>
+					<li>
+						<strong>@contractspec/lib.contracts-runtime-server-rest</strong>:
+						HTTP/MCP adapters, registries, integrations (Node-only).
+					</li>
+					<li>
+						<strong>@contractspec/lib.schema</strong>: Schema dictionary
+						(SchemaModel, FieldType) for I/O definitions.
+					</li>
+				</ul>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Quick Example</h2>
-        <CodeBlock
-          language="typescript"
-          code={`import { defineCommand } from '@contractspec/lib.contracts-spec';
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Quick Example</h2>
+				<CodeBlock
+					language="typescript"
+					code={`import { defineCommand } from '@contractspec/lib.contracts-spec';
 import { SchemaModel, ScalarTypeEnum } from '@contractspec/lib.schema';
 
 const CreateUserInput = new SchemaModel({
@@ -73,94 +73,94 @@ export const CreateUser = defineCommand({
   },
   policy: { auth: 'admin' },
 });`}
-        />
-      </div>
+				/>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Core Concepts</h2>
-        <ul className="text-muted-foreground list-inside list-disc space-y-2">
-          <li>
-            <strong>OperationSpec</strong>: Immutable description of an
-            operation (Command or Query). Defines I/O, policy, and metadata.
-          </li>
-          <li>
-            <strong>OperationSpecRegistry</strong>: Registry of specs +
-            handlers. Use <code className="font-mono text-xs">installOp</code>{' '}
-            to attach a handler.
-          </li>
-          <li>
-            <strong>CapabilitySpec</strong>: Canonical capability declaration
-            (requires/provides).
-          </li>
-          <li>
-            <strong>PolicySpec</strong>: Declarative policy rules (ABAC/ReBAC,
-            rate limits).
-          </li>
-          <li>
-            <strong>TelemetrySpec</strong>: Analytics definitions and privacy
-            levels.
-          </li>
-          <li>
-            <strong>PresentationSpec (V2)</strong>: Describes how data is
-            rendered (Web Components, Markdown, Data).
-          </li>
-        </ul>
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Core Concepts</h2>
+				<ul className="list-inside list-disc space-y-2 text-muted-foreground">
+					<li>
+						<strong>OperationSpec</strong>: Immutable description of an
+						operation (Command or Query). Defines I/O, policy, and metadata.
+					</li>
+					<li>
+						<strong>OperationSpecRegistry</strong>: Registry of specs +
+						handlers. Use <code className="font-mono text-xs">installOp</code>{' '}
+						to attach a handler.
+					</li>
+					<li>
+						<strong>CapabilitySpec</strong>: Canonical capability declaration
+						(requires/provides).
+					</li>
+					<li>
+						<strong>PolicySpec</strong>: Declarative policy rules (ABAC/ReBAC,
+						rate limits).
+					</li>
+					<li>
+						<strong>TelemetrySpec</strong>: Analytics definitions and privacy
+						levels.
+					</li>
+					<li>
+						<strong>PresentationSpec (V2)</strong>: Describes how data is
+						rendered (Web Components, Markdown, Data).
+					</li>
+				</ul>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Lifecycle</h2>
-        <ol className="text-muted-foreground list-inside list-decimal space-y-2">
-          <li>
-            <strong>Define</strong> the spec (I/O via SchemaModel or Zod).
-          </li>
-          <li>
-            <strong>Register</strong> it:{' '}
-            <code className="font-mono text-xs">
-              installOp(registry, spec, handler)
-            </code>
-            .
-          </li>
-          <li>
-            <strong>Expose</strong> it via an adapter (REST, GraphQL, MCP).
-          </li>
-          <li>
-            <strong>Validate</strong> at runtime automatically.
-          </li>
-        </ol>
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Lifecycle</h2>
+				<ol className="list-inside list-decimal space-y-2 text-muted-foreground">
+					<li>
+						<strong>Define</strong> the spec (I/O via SchemaModel or Zod).
+					</li>
+					<li>
+						<strong>Register</strong> it:{' '}
+						<code className="font-mono text-xs">
+							installOp(registry, spec, handler)
+						</code>
+						.
+					</li>
+					<li>
+						<strong>Expose</strong> it via an adapter (REST, GraphQL, MCP).
+					</li>
+					<li>
+						<strong>Validate</strong> at runtime automatically.
+					</li>
+				</ol>
+			</div>
 
-      <div className="space-y-4">
-        <h2 className="text-2xl font-bold">Adapters</h2>
-        <ul className="text-muted-foreground space-y-2">
-          <li>
-            <code className="bg-background/50 rounded px-2 py-1">
-              server/rest-next-app
-            </code>
-            : Next.js App Router adapter
-          </li>
-          <li>
-            <code className="bg-background/50 rounded px-2 py-1">
-              server/provider-mcp
-            </code>
-            : Model Context Protocol (MCP) for AI agents
-          </li>
-          <li>
-            <code className="bg-background/50 rounded px-2 py-1">
-              server/graphql-pothos
-            </code>
-            : GraphQL schema generator
-          </li>
-        </ul>
-      </div>
+			<div className="space-y-4">
+				<h2 className="font-bold text-2xl">Adapters</h2>
+				<ul className="space-y-2 text-muted-foreground">
+					<li>
+						<code className="rounded bg-background/50 px-2 py-1">
+							server/rest-next-app
+						</code>
+						: Next.js App Router adapter
+					</li>
+					<li>
+						<code className="rounded bg-background/50 px-2 py-1">
+							server/provider-mcp
+						</code>
+						: Model Context Protocol (MCP) for AI agents
+					</li>
+					<li>
+						<code className="rounded bg-background/50 px-2 py-1">
+							server/graphql-pothos
+						</code>
+						: GraphQL schema generator
+					</li>
+				</ul>
+			</div>
 
-      <div className="flex items-center gap-4 pt-4">
-        <Link href="/docs/libraries/schema" className="btn-primary">
-          Next: Schema <ChevronRight size={16} />
-        </Link>
-        <Link href="/docs/specs/capabilities" className="btn-ghost">
-          Core Concepts
-        </Link>
-      </div>
-    </div>
-  );
+			<div className="flex items-center gap-4 pt-4">
+				<Link href="/docs/libraries/schema" className="btn-primary">
+					Next: Schema <ChevronRight size={16} />
+				</Link>
+				<Link href="/docs/specs/capabilities" className="btn-ghost">
+					Core Concepts
+				</Link>
+			</div>
+		</div>
+	);
 }