@contractspec/bundle.marketing 1.12.0

package/dist/components/templates/TemplatesClientPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesClientPage.js","names":[],"sources":["../../../src/components/templates/TemplatesClientPage.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { Search } from 'lucide-react';\nimport { cn } from '@contractspec/lib.ui-kit-core/utils';\nimport Link from 'next/link';\nimport type {\n  RegistryTemplate,\n  TemplateId,\n} from '@contractspec/lib.example-shared-ui';\nimport { useRegistryTemplates } from '@contractspec/lib.example-shared-ui';\nimport { getTemplate } from '@contractspec/module.examples';\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from '@contractspec/lib.ui-kit-web/ui/tooltip';\nimport {\n  analyticsEventNames,\n  captureAnalyticsEvent,\n} from '@contractspec/bundle.library/libs/posthog/client';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogHeader,\n  DialogTitle,\n} from '@contractspec/lib.ui-kit-web/ui/dialog';\nimport { WaitlistSection } from '../marketing';\nimport { TemplatePreviewModal } from './TemplatesPreviewModal';\n\nconst templates = [\n  {\n    id: 'minimal-example',\n    templateId: 'todos-app' as TemplateId,\n    title: 'Minimal Example',\n    description:\n      'A minimal template to get you running in minutes. Perfect for exploring the engine.',\n    tags: ['Getting Started'],\n    capabilities: 'Basic Forms, Auth',\n    isStarter: true,\n    previewUrl: '/sandbox?template=minimal-example',\n    docsUrl: '/docs/getting-started/hello-world',\n  },\n  // ============================================\n  // Phase 1 Examples (using cross-cutting modules)\n  // ============================================\n  {\n    id: 'saas-boilerplate',\n    templateId: 'saas-boilerplate' as TemplateId,\n    title: 'SaaS Boilerplate',\n    description:\n      'Complete SaaS foundation with multi-tenant orgs, projects, settings, and billing usage.',\n    tags: ['Getting Started', 'SaaS', 'Business'],\n    capabilities: 'Multi-tenancy, RBAC, Projects, Billing',\n    isNew: true,\n    previewUrl: '/sandbox?template=saas-boilerplate',\n    docsUrl: '/docs/templates/saas-boilerplate',\n  },\n  {\n    id: 'crm-pipeline',\n    templateId: 'crm-pipeline' as TemplateId,\n    title: 'CRM Pipeline',\n    description:\n      'Sales CRM with contacts, companies, deals, pipeline stages, and task management.',\n    tags: ['CRM', 'Business'],\n    capabilities: 'Contacts, Deals, Pipelines, Tasks',\n    isNew: true,\n    previewUrl: '/sandbox?template=crm-pipeline',\n    docsUrl: '/docs/templates/crm-pipeline',\n  },\n  {\n    id: 'agent-console',\n    templateId: 'agent-console' as TemplateId,\n    title: 'AI Agent Console',\n    description:\n      'AI agent orchestration platform with tools, agents, runs, and execution logs.',\n    tags: ['AI', 'Ops'],\n    capabilities: 'Tools, Agents, Runs, Metrics',\n    isNew: true,\n    previewUrl: '/sandbox?template=agent-console',\n    docsUrl: '/docs/templates/agent-console',\n  },\n  // ============================================\n  // Phase 2-4 Examples\n  // ============================================\n  {\n    id: 'workflow-system',\n    templateId: 'workflow-system' as TemplateId,\n    title: 'Workflow / Approval System',\n    description:\n      'Multi-step workflows with role-based approvals and state transitions.',\n    tags: ['Business', 'Ops'],\n    capabilities: 'Workflows, Approvals, State Machine',\n    isNew: true,\n    previewUrl: '/sandbox?template=workflow-system',\n    docsUrl: '/docs/templates/workflow-system',\n  },\n  {\n    id: 'marketplace',\n    templateId: 'marketplace' as TemplateId,\n    title: 'Marketplace',\n    description:\n      'Two-sided marketplace with stores, products, orders, and payouts.',\n    tags: ['Business', 'Payments'],\n    capabilities: 'Stores, Products, Orders, Payouts',\n    isNew: true,\n    previewUrl: '/sandbox?template=marketplace',\n    docsUrl: '/docs/templates/marketplace',\n  },\n  {\n    id: 'integration-hub',\n    templateId: 'integration-hub' as TemplateId,\n    title: 'Integration Hub',\n    description:\n      'Third-party integrations with connections, sync configs, and field mapping.',\n    tags: ['Ops', 'AI'],\n    capabilities: 'Integrations, Connections, Sync',\n    isNew: true,\n    previewUrl: '/sandbox?template=integration-hub',\n    docsUrl: '/docs/templates/integration-hub',\n  },\n  // ============================================\n  // Learning Journeys\n  // ============================================\n  {\n    id: 'learning-journey-studio-onboarding',\n    templateId: 'learning-journey-studio-onboarding' as TemplateId,\n    title: 'Learning Journey — Studio Getting Started',\n    description:\n      'First 30 minutes in Studio: choose template, edit spec, regenerate, playground, evolution.',\n    tags: ['Learning', 'Onboarding'],\n    capabilities: 'Spec-first onboarding, XP/streak, progress widget',\n    isNew: true,\n    previewUrl: '/sandbox?template=learning-journey-studio-onboarding',\n    docsUrl: '/docs/templates/learning-journey-studio-onboarding',\n  },\n  {\n    id: 'learning-journey-platform-tour',\n    templateId: 'learning-journey-platform-tour' as TemplateId,\n    title: 'Learning Journey — Platform Primitives Tour',\n    description:\n      'Touch identity, audit, notifications, jobs, flags, files, metering once with guided steps.',\n    tags: ['Learning', 'Platform'],\n    capabilities: 'Cross-module tour with event-driven completion',\n    isNew: true,\n    previewUrl: '/sandbox?template=learning-journey-platform-tour',\n    docsUrl: '/docs/templates/learning-journey-platform-tour',\n  },\n  {\n    id: 'learning-journey-crm-onboarding',\n    templateId: 'learning-journey-crm-onboarding' as TemplateId,\n    title: 'Learning Journey — CRM First Win',\n    description:\n      'Get to first closed-won deal: pipeline, contact/company, deal, stages, follow-up.',\n    tags: ['Learning', 'CRM'],\n    capabilities: 'CRM onboarding with XP/streak/badge',\n    isNew: true,\n    previewUrl: '/sandbox?template=learning-journey-crm-onboarding',\n    docsUrl: '/docs/templates/learning-journey-crm-onboarding',\n  },\n  {\n    id: 'analytics-dashboard',\n    templateId: 'analytics-dashboard' as TemplateId,\n    title: 'Analytics Dashboard',\n    description:\n      'Custom dashboards with widgets, saved queries, and real-time visualization.',\n    tags: ['Business', 'Ops'],\n    capabilities: 'Dashboards, Widgets, Queries',\n    isNew: true,\n    previewUrl: '/sandbox?template=analytics-dashboard',\n    docsUrl: '/docs/templates/analytics-dashboard',\n  },\n  // ============================================\n  // Classic Templates\n  // ============================================\n  {\n    id: 'plumber-ops',\n    templateId: 'messaging-app' as TemplateId,\n    title: 'Plumber Ops',\n    description:\n      'Complete workflow: Quotes → Deposit → Job → Invoice → Payment. Policy-enforced approvals.',\n    tags: ['Trades', 'Payments'],\n    capabilities: 'Quotes, Jobs, Invoicing, Payments',\n    previewUrl: '/sandbox?template=plumber-ops',\n    docsUrl: '/docs/specs/workflows',\n  },\n  {\n    id: 'coliving-management',\n    templateId: 'recipe-app-i18n' as TemplateId,\n    title: 'Coliving Management',\n    description:\n      'Coliving management: Onboarding, chores, shared wallet. Multi-party approvals built-in.',\n    tags: ['Coliving', 'Finance'],\n    capabilities: 'Tasks, Approvals, Payments',\n    previewUrl: '/sandbox?template=coliving-management',\n    docsUrl: '/docs/specs/workflows',\n  },\n  {\n    id: 'chores-allowance',\n    templateId: 'todos-app' as TemplateId,\n    title: 'Chores & Allowance',\n    description:\n      'Family task management with approval workflows. Teach financial accountability safely.',\n    tags: ['Family', 'Ops'],\n    capabilities: 'Tasks, Approvals, Notifications',\n    previewUrl: '/sandbox?template=chores-allowance',\n    docsUrl: '/docs/specs/workflows',\n  },\n  {\n    id: 'service-dispatch',\n    templateId: 'messaging-app' as TemplateId,\n    title: 'Service Dispatch',\n    description:\n      'Field service scheduling, routing, and invoicing. Real-time coordination with policy gates.',\n    tags: ['Ops', 'Trades'],\n    capabilities: 'Scheduling, Maps, Invoicing',\n    previewUrl: '/sandbox?template=service-dispatch',\n    docsUrl: '/docs/specs/workflows',\n  },\n  {\n    id: 'content-review',\n    templateId: 'todos-app' as TemplateId,\n    title: 'Content Review',\n    description:\n      'Multi-stage approval workflow for content. Audit trail for every decision.',\n    tags: ['Ops'],\n    capabilities: 'Workflows, Approvals, Comments',\n    previewUrl: '/sandbox?template=content-review',\n    docsUrl: '/docs/specs/workflows',\n  },\n];\ntype LocalTemplate = (typeof templates)[number];\n\nconst allTags = [\n  'Getting Started',\n  'SaaS',\n  'Business',\n  'CRM',\n  'AI',\n  'Trades',\n  'Coliving',\n  'Family',\n  'Ops',\n  'Payments',\n  'Learning',\n  'Platform',\n];\n\nexport const TemplatesPage = () => {\n  const [selectedTag, setSelectedTag] = useState<string | null>(null);\n  const [search, setSearch] = useState('');\n  const [preview, setPreview] = useState<TemplateId | null>(null);\n  const [waitlistModalOpen, setWaitlistModalOpen] = useState(false);\n  const [source, setSource] = useState<'local' | 'registry'>('local');\n  const [selectedTemplateForCommand, setSelectedTemplateForCommand] = useState<\n    RegistryTemplate | LocalTemplate | null\n  >(null);\n\n  const { data: registryTemplates = [], isLoading: registryLoading } =\n    useRegistryTemplates();\n\n  const filtered = templates.filter((t) => {\n    const matchTag = !selectedTag || t.tags.includes(selectedTag);\n    const matchSearch =\n      !search ||\n      t.title.toLowerCase().includes(search.toLowerCase()) ||\n      t.description.toLowerCase().includes(search.toLowerCase());\n    return matchTag && matchSearch;\n  });\n\n  const commandId = selectedTemplateForCommand\n    ? 'templateId' in selectedTemplateForCommand\n      ? selectedTemplateForCommand.templateId\n      : selectedTemplateForCommand.id\n    : '';\n\n  return (\n    <TooltipProvider>\n      <main className=\"\">\n        {/* Hero */}\n        <section className=\"section-padding hero-gradient border-border relative border-b\">\n          <div className=\"mx-auto max-w-4xl space-y-6 text-center\">\n            <h1 className=\"text-5xl leading-tight font-bold md:text-6xl\">\n              Recipe templates\n            </h1>\n            <p className=\"text-muted-foreground text-lg\">\n              Ready-to-use, customizable recipes. Policies built in. One-click\n              deploy.\n            </p>\n          </div>\n        </section>\n\n        {/* Search & Filter */}\n        <section className=\"section-padding border-border border-b\">\n          <div className=\"mx-auto max-w-6xl space-y-6\">\n            <div className=\"flex items-center justify-between gap-3\">\n              <div className=\"text-muted-foreground text-sm\">Source:</div>\n              <div className=\"flex gap-2\">\n                <button\n                  onClick={() => setSource('local')}\n                  className={cn(\n                    'rounded-full px-4 py-2 text-sm font-medium transition-colors',\n                    {\n                      'bg-violet-500 text-white': source === 'local',\n                      'bg-card border-border hover:bg-card/80 border':\n                        source !== 'local',\n                    }\n                  )}\n                  aria-pressed={source === 'local'}\n                >\n                  Local\n                </button>\n                <button\n                  onClick={() => setSource('registry')}\n                  className={cn(\n                    'rounded-full px-4 py-2 text-sm font-medium transition-colors',\n                    {\n                      'bg-violet-500 text-white': source === 'registry',\n                      'bg-card border-border hover:bg-card/80 border':\n                        source !== 'registry',\n                    }\n                  )}\n                  aria-pressed={source === 'registry'}\n                >\n                  Community\n                </button>\n              </div>\n            </div>\n            <div className=\"relative\">\n              <Search\n                className=\"text-muted-foreground absolute top-3 left-3\"\n                size={20}\n              />\n              <input\n                type=\"text\"\n                placeholder=\"Search templates...\"\n                value={search}\n                onChange={(e) => setSearch(e.target.value)}\n                className=\"bg-card border-border w-full rounded-lg border py-3 pr-4 pl-10 focus:ring-2 focus:ring-violet-500 focus:outline-none\"\n                aria-label=\"Search templates\"\n              />\n            </div>\n            <div className=\"flex flex-wrap gap-2\">\n              <button\n                onClick={() => setSelectedTag(null)}\n                className={`rounded-full px-4 py-2 text-sm font-medium transition-colors ${\n                  selectedTag === null\n                    ? 'bg-violet-500 text-white'\n                    : 'bg-card border-border hover:bg-card/80 border'\n                }`}\n                aria-pressed={selectedTag === null}\n              >\n                All\n              </button>\n              {allTags.map((tag) => (\n                <button\n                  key={tag}\n                  onClick={() => setSelectedTag(tag)}\n                  className={cn(\n                    `rounded-full px-4 py-2 text-sm font-medium transition-colors`,\n                    {\n                      'bg-violet-500 text-white': selectedTag === tag,\n                      'bg-card border-border hover:bg-card/80 border':\n                        selectedTag !== tag,\n                    }\n                  )}\n                  aria-pressed={selectedTag === tag}\n                >\n                  {tag}\n                </button>\n              ))}\n            </div>\n          </div>\n        </section>\n\n        {/* Templates Grid */}\n        <section className=\"section-padding\">\n          <div className=\"mx-auto max-w-6xl\">\n            {source === 'registry' ? (\n              registryLoading ? (\n                <div className=\"py-12 text-center\">\n                  <p className=\"text-muted-foreground\">\n                    Loading community templates…\n                  </p>\n                </div>\n              ) : registryTemplates.length === 0 ? (\n                <div className=\"py-12 text-center\">\n                  <p className=\"text-muted-foreground\">\n                    No community templates found (configure\n                    `NEXT_PUBLIC_CONTRACTSPEC_REGISTRY_URL`).\n                  </p>\n                </div>\n              ) : (\n                <div className=\"grid gap-6 md:grid-cols-2 lg:grid-cols-3\">\n                  {registryTemplates.map((t) => (\n                    <div\n                      key={t.id}\n                      className=\"card-subtle relative flex flex-col space-y-4 p-6 transition-colors hover:border-violet-500/50\"\n                    >\n                      <div>\n                        <h3 className=\"text-lg font-bold\">{t.name}</h3>\n                        <p className=\"text-muted-foreground mt-1 text-sm\">\n                          {t.description}\n                        </p>\n                      </div>\n                      <div className=\"flex-1 space-y-2\">\n                        <div className=\"flex flex-wrap gap-1\">\n                          {t.tags.map((tag) => (\n                            <span\n                              key={tag}\n                              className=\"rounded border border-violet-500/20 bg-violet-500/10 px-2 py-1 text-xs text-violet-300\"\n                            >\n                              {tag}\n                            </span>\n                          ))}\n                        </div>\n                      </div>\n                      <div className=\"flex gap-2 pt-4\">\n                        <Tooltip>\n                          <TooltipTrigger asChild>\n                            <button\n                              className=\"btn-ghost flex-1 text-center text-xs\"\n                              onClick={() => {\n                                const local = getTemplate(t.id as TemplateId);\n                                if (!local) {\n                                  setSelectedTemplateForCommand(t);\n                                  return;\n                                }\n                                setPreview(t.id as TemplateId);\n                              }}\n                            >\n                              Preview\n                            </button>\n                          </TooltipTrigger>\n                          <TooltipContent>\n                            <p>Preview this template (if available locally)</p>\n                          </TooltipContent>\n                        </Tooltip>\n                        <Tooltip>\n                          <TooltipTrigger asChild>\n                            <button\n                              className=\"btn-primary flex-1 text-center text-xs\"\n                              onClick={() => {\n                                captureAnalyticsEvent(\n                                  analyticsEventNames.EXAMPLE_REPO_OPEN,\n                                  {\n                                    surface: 'templates',\n                                    templateId: t.id,\n                                    source: 'registry',\n                                  }\n                                );\n                                setSelectedTemplateForCommand(t);\n                              }}\n                            >\n                              Use Template\n                            </button>\n                          </TooltipTrigger>\n                          <TooltipContent>\n                            <p>Get CLI command</p>\n                          </TooltipContent>\n                        </Tooltip>\n                      </div>\n                    </div>\n                  ))}\n                </div>\n              )\n            ) : filtered.length === 0 ? (\n              <div className=\"py-12 text-center\">\n                <p className=\"text-muted-foreground\">\n                  No templates match your filters. Try a different search.\n                </p>\n              </div>\n            ) : (\n              <div className=\"grid gap-6 md:grid-cols-2 lg:grid-cols-3\">\n                {filtered.map((template, i) => (\n                  <div\n                    key={i}\n                    className=\"card-subtle relative flex flex-col space-y-4 p-6 transition-colors hover:border-violet-500/50\"\n                  >\n                    {'isNew' in template && template.isNew && (\n                      <span className=\"absolute top-3 right-3 rounded-full bg-green-500 px-2 py-0.5 text-xs font-semibold text-white\">\n                        New\n                      </span>\n                    )}\n                    <div>\n                      <h3 className=\"text-lg font-bold\">{template.title}</h3>\n                      <p className=\"text-muted-foreground mt-1 text-sm\">\n                        {template.description}\n                      </p>\n                    </div>\n                    <div className=\"flex-1 space-y-2\">\n                      <p className=\"text-muted-foreground text-xs\">\n                        <span className=\"text-foreground font-medium\">\n                          Capabilities:\n                        </span>{' '}\n                        {template.capabilities}\n                      </p>\n                      <div className=\"flex flex-wrap gap-1\">\n                        {template.tags.map((tag) => (\n                          <span\n                            key={tag}\n                            className=\"rounded border border-violet-500/20 bg-violet-500/10 px-2 py-1 text-xs text-violet-300\"\n                          >\n                            {tag}\n                          </span>\n                        ))}\n                      </div>\n                    </div>\n                    <div className=\"flex gap-2 pt-4\">\n                      <Tooltip>\n                        <TooltipTrigger asChild>\n                          <button\n                            className=\"btn-ghost flex-1 text-center text-xs\"\n                            onClick={() => setPreview(template.templateId)}\n                          >\n                            Preview\n                          </button>\n                        </TooltipTrigger>\n                        <TooltipContent>\n                          <p>Preview this template in a modal</p>\n                        </TooltipContent>\n                      </Tooltip>\n                      <Tooltip>\n                        <TooltipTrigger asChild>\n                          <button\n                            className=\"btn-primary flex-1 text-center text-xs\"\n                            onClick={() => {\n                              captureAnalyticsEvent(\n                                analyticsEventNames.EXAMPLE_REPO_OPEN,\n                                {\n                                  surface: 'templates',\n                                  templateId: template.templateId,\n                                  source: 'local',\n                                }\n                              );\n                              setSelectedTemplateForCommand(template);\n                            }}\n                          >\n                            Use Template\n                          </button>\n                        </TooltipTrigger>\n                        <TooltipContent>\n                          <p>Get CLI command</p>\n                        </TooltipContent>\n                      </Tooltip>\n                    </div>\n                  </div>\n                ))}\n              </div>\n            )}\n          </div>\n        </section>\n\n        {/* Extend with Integrations & Knowledge */}\n        <section className=\"section-padding border-border bg-striped border-t\">\n          <div className=\"mx-auto max-w-6xl space-y-8\">\n            <div className=\"space-y-4 text-center\">\n              <h2 className=\"text-3xl font-bold md:text-4xl\">\n                Extend templates with integrations & knowledge\n              </h2>\n              <p className=\"text-muted-foreground mx-auto max-w-2xl\">\n                Every template can be enhanced with built-in integrations and\n                knowledge spaces. Add payments, email, AI, and structured\n                knowledge without writing integration code.\n              </p>\n            </div>\n            <div className=\"grid gap-6 md:grid-cols-3\">\n              <div className=\"card-subtle space-y-4 p-6\">\n                <div className=\"text-3xl\">💳</div>\n                <h3 className=\"font-bold\">Add Payments</h3>\n                <p className=\"text-muted-foreground text-sm\">\n                  Connect Stripe to any template for payment processing,\n                  subscriptions, and invoicing. Type-safe and policy-enforced.\n                </p>\n                <Link\n                  href=\"/docs/integrations/stripe\"\n                  className=\"inline-flex items-center gap-1 text-sm text-violet-400 hover:text-violet-300\"\n                >\n                  Learn more →\n                </Link>\n              </div>\n              <div className=\"card-subtle space-y-4 p-6\">\n                <div className=\"text-3xl\">📧</div>\n                <h3 className=\"font-bold\">Add Notifications</h3>\n                <p className=\"text-muted-foreground text-sm\">\n                  Send transactional emails via Postmark or Resend. Process\n                  inbound emails with Gmail API. SMS via Twilio.\n                </p>\n                <Link\n                  href=\"/docs/integrations\"\n                  className=\"inline-flex items-center gap-1 text-sm text-violet-400 hover:text-violet-300\"\n                >\n                  View integrations →\n                </Link>\n              </div>\n              <div className=\"card-subtle space-y-4 p-6\">\n                <div className=\"text-3xl\">🧠</div>\n                <h3 className=\"font-bold\">Add AI & Knowledge</h3>\n                <p className=\"text-muted-foreground text-sm\">\n                  Power templates with OpenAI, vector search via Qdrant, and\n                  structured knowledge spaces for context-aware workflows.\n                </p>\n                <Link\n                  href=\"/docs/knowledge\"\n                  className=\"inline-flex items-center gap-1 text-sm text-violet-400 hover:text-violet-300\"\n                >\n                  Learn about knowledge →\n                </Link>\n              </div>\n            </div>\n            <div className=\"pt-4 text-center\">\n              <p className=\"text-muted-foreground mb-4 text-sm\">\n                All integrations are configured per-tenant with automatic health\n                checks and credential rotation.\n              </p>\n              <Link href=\"/docs/architecture\" className=\"btn-primary\">\n                View Architecture\n              </Link>\n            </div>\n          </div>\n        </section>\n      </main>\n\n      {/*{preview ? (*/}\n      <TemplatePreviewModal\n        templateId={preview}\n        onClose={() => {\n          setPreview(null);\n        }}\n      />\n      {/*) : null}*/}\n\n      <Dialog open={waitlistModalOpen} onOpenChange={setWaitlistModalOpen}>\n        <DialogContent className=\"max-h-[90vh] max-w-2xl overflow-y-auto\">\n          <DialogHeader>\n            <DialogTitle>Early Access Required</DialogTitle>\n            <DialogDescription>\n              ContractSpec Studio is in early access. Join the waitlist to\n              deploy projects to our managed cloud.\n            </DialogDescription>\n          </DialogHeader>\n          <WaitlistSection variant=\"compact\" />\n        </DialogContent>\n      </Dialog>\n\n      <Dialog\n        open={!!selectedTemplateForCommand}\n        onOpenChange={() => setSelectedTemplateForCommand(null)}\n      >\n        <DialogContent className=\"max-w-md\">\n          <DialogHeader>\n            <DialogTitle>Use this template</DialogTitle>\n            <DialogDescription>\n              Initialize a new project with this template using the CLI.\n            </DialogDescription>\n          </DialogHeader>\n          <div className=\"space-y-4 pt-4\">\n            <div className=\"rounded-md border border-zinc-800 bg-zinc-950 p-4 font-mono text-sm text-zinc-50\">\n              npx contractspec init --template {commandId}\n            </div>\n            <div className=\"flex gap-2\">\n              <button\n                className=\"btn-secondary w-full\"\n                onClick={() => {\n                  navigator.clipboard.writeText(\n                    `npx contractspec init --template ${commandId}`\n                  );\n                  captureAnalyticsEvent(\n                    analyticsEventNames.COPY_COMMAND_CLICK,\n                    {\n                      surface: 'templates',\n                      templateId: commandId,\n                      filename: 'templates-cli',\n                    }\n                  );\n                }}\n              >\n                Copy Command\n              </button>\n            </div>\n            <div className=\"relative\">\n              <div className=\"absolute inset-0 flex items-center\">\n                <span className=\"border-border w-full border-t\" />\n              </div>\n              <div className=\"relative flex justify-center text-xs uppercase\">\n                <span className=\"bg-background text-muted-foreground px-2\">\n                  Or\n                </span>\n              </div>\n            </div>\n            <button\n              className=\"btn-ghost w-full text-sm\"\n              onClick={() => {\n                captureAnalyticsEvent(analyticsEventNames.CTA_STUDIO_CLICK, {\n                  surface: 'templates',\n                  templateId: commandId,\n                });\n                setSelectedTemplateForCommand(null);\n                setWaitlistModalOpen(true);\n              }}\n            >\n              Deploy to Studio (Waitlist)\n            </button>\n          </div>\n        </DialogContent>\n      </Dialog>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"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"}

package/dist/components/templates/TemplatesPage.d.ts

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

package/dist/components/templates/TemplatesPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesPage.d.ts","names":[],"sources":["../../../src/components/templates/TemplatesPage.tsx"],"mappings":";;;iBA0BgB,sBAAA,CAAA,GAAsB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/templates/TemplatesPage.js

@@ -0,0 +1,125 @@
+'use client';
+
+import { HStack, VStack } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { Button, ButtonLink, Input, MarketingCard, MarketingCardContent, MarketingCardDescription, MarketingCardHeader, MarketingCardTitle, MarketingSection } from "@contractspec/lib.design-system";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { listTemplates } from "@contractspec/module.examples";
+
+//#region src/components/templates/TemplatesPage.tsx
+function matchesQuery(t, query) {
+	const q = query.trim().toLowerCase();
+	if (!q) return true;
+	return `${t.id} ${t.name} ${t.description} ${t.tags.join(" ")}`.toLowerCase().includes(q);
+}
+function TemplatesMarketingPage() {
+	const [query, setQuery] = useState("");
+	const templates = useMemo(() => listTemplates(), []);
+	const filtered = useMemo(() => templates.filter((t) => matchesQuery(t, query)), [templates, query]);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(MarketingSection, {
+			tone: "default",
+			children: /* @__PURE__ */ jsxs(VStack, {
+				as: "header",
+				gap: "lg",
+				align: "center",
+				children: [/* @__PURE__ */ jsxs(VStack, {
+					gap: "sm",
+					align: "center",
+					children: [/* @__PURE__ */ jsx(ButtonLink, {
+						href: "/docs",
+						variant: "ghost",
+						children: "Docs"
+					}), /* @__PURE__ */ jsx(ButtonLink, {
+						href: "/sandbox",
+						variant: "ghost",
+						children: "Open Sandbox"
+					})]
+				}), /* @__PURE__ */ jsx(VStack, {
+					gap: "sm",
+					align: "center",
+					children: /* @__PURE__ */ jsx(ButtonLink, {
+						href: "/templates",
+						variant: "default",
+						children: "Templates"
+					})
+				})]
+			})
+		}),
+		/* @__PURE__ */ jsx(MarketingSection, {
+			tone: "muted",
+			children: /* @__PURE__ */ jsxs(VStack, {
+				gap: "lg",
+				children: [/* @__PURE__ */ jsx(VStack, {
+					gap: "sm",
+					children: /* @__PURE__ */ jsx(ButtonLink, {
+						href: "/templates",
+						variant: "ghost",
+						children: "Browse all examples"
+					})
+				}), /* @__PURE__ */ jsx(HStack, {
+					gap: "md",
+					align: "center",
+					justify: "between",
+					wrap: "wrap",
+					children: /* @__PURE__ */ jsx(Input, {
+						"aria-label": "Search templates and examples",
+						placeholder: "Search templates and examples…",
+						value: query,
+						onChange: (e) => setQuery(e.target.value)
+					})
+				})]
+			})
+		}),
+		/* @__PURE__ */ jsx(MarketingSection, {
+			tone: "default",
+			children: /* @__PURE__ */ jsx(VStack, {
+				gap: "lg",
+				children: /* @__PURE__ */ jsx(HStack, {
+					gap: "md",
+					wrap: "wrap",
+					children: filtered.map((t) => /* @__PURE__ */ jsxs(MarketingCard, {
+						className: "w-full md:w-[calc(50%-0.75rem)] lg:w-[calc(33.333%-1rem)]",
+						children: [/* @__PURE__ */ jsxs(MarketingCardHeader, { children: [/* @__PURE__ */ jsxs(MarketingCardTitle, { children: [
+							t.icon,
+							" ",
+							t.name
+						] }), /* @__PURE__ */ jsx(MarketingCardDescription, { children: t.description })] }), /* @__PURE__ */ jsx(MarketingCardContent, { children: /* @__PURE__ */ jsxs(VStack, {
+							gap: "md",
+							children: [/* @__PURE__ */ jsx(HStack, {
+								gap: "sm",
+								wrap: "wrap",
+								children: t.tags.slice(0, 6).map((tag) => /* @__PURE__ */ jsx(ButtonLink, {
+									href: `/templates?tag=${encodeURIComponent(tag)}`,
+									variant: "ghost",
+									children: tag
+								}, `${t.id}-${tag}`))
+							}), /* @__PURE__ */ jsxs(HStack, {
+								gap: "sm",
+								justify: "between",
+								wrap: "wrap",
+								children: [/* @__PURE__ */ jsx(ButtonLinkToSandbox, { templateId: t.id }), /* @__PURE__ */ jsx(Button, {
+									variant: "outline",
+									onClick: () => void 0,
+									disabled: true,
+									children: "Install to Studio (soon)"
+								})]
+							})]
+						}) })]
+					}, t.id))
+				})
+			})
+		})
+	] });
+}
+function ButtonLinkToSandbox({ templateId }) {
+	return /* @__PURE__ */ jsx(ButtonLink, {
+		href: `/sandbox?template=${encodeURIComponent(templateId)}`,
+		variant: "default",
+		children: "Preview"
+	});
+}
+
+//#endregion
+export { TemplatesMarketingPage };
+//# sourceMappingURL=TemplatesPage.js.map

package/dist/components/templates/TemplatesPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesPage.js","names":[],"sources":["../../../src/components/templates/TemplatesPage.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\nimport {\n  Button,\n  ButtonLink,\n  Input,\n  MarketingCard,\n  MarketingCardContent,\n  MarketingCardDescription,\n  MarketingCardHeader,\n  MarketingCardTitle,\n  MarketingSection,\n} from '@contractspec/lib.design-system';\nimport { HStack, VStack } from '@contractspec/lib.ui-kit-web/ui/stack';\nimport { listTemplates } from '@contractspec/module.examples';\nimport type { TemplateDefinition } from '@contractspec/lib.example-shared-ui';\n\nfunction matchesQuery(t: TemplateDefinition, query: string): boolean {\n  const q = query.trim().toLowerCase();\n  if (!q) return true;\n  const hay =\n    `${t.id} ${t.name} ${t.description} ${t.tags.join(' ')}`.toLowerCase();\n  return hay.includes(q);\n}\n\nexport function TemplatesMarketingPage() {\n  const [query, setQuery] = useState('');\n\n  const templates = useMemo(() => listTemplates(), []);\n  const filtered = useMemo(\n    () => templates.filter((t) => matchesQuery(t, query)),\n    [templates, query]\n  );\n\n  return (\n    <>\n      <MarketingSection tone=\"default\">\n        <VStack as=\"header\" gap=\"lg\" align=\"center\">\n          <VStack gap=\"sm\" align=\"center\">\n            <ButtonLink href=\"/docs\" variant=\"ghost\">\n              Docs\n            </ButtonLink>\n            <ButtonLink href=\"/sandbox\" variant=\"ghost\">\n              Open Sandbox\n            </ButtonLink>\n          </VStack>\n          <VStack gap=\"sm\" align=\"center\">\n            <ButtonLink href=\"/templates\" variant=\"default\">\n              Templates\n            </ButtonLink>\n          </VStack>\n        </VStack>\n      </MarketingSection>\n\n      <MarketingSection tone=\"muted\">\n        <VStack gap=\"lg\">\n          <VStack gap=\"sm\">\n            <ButtonLink href=\"/templates\" variant=\"ghost\">\n              Browse all examples\n            </ButtonLink>\n          </VStack>\n          <HStack gap=\"md\" align=\"center\" justify=\"between\" wrap=\"wrap\">\n            <Input\n              aria-label=\"Search templates and examples\"\n              placeholder=\"Search templates and examples…\"\n              value={query}\n              onChange={(e) => setQuery(e.target.value)}\n            />\n          </HStack>\n        </VStack>\n      </MarketingSection>\n\n      <MarketingSection tone=\"default\">\n        <VStack gap=\"lg\">\n          <HStack gap=\"md\" wrap=\"wrap\">\n            {filtered.map((t) => (\n              <MarketingCard\n                key={t.id}\n                className=\"w-full md:w-[calc(50%-0.75rem)] lg:w-[calc(33.333%-1rem)]\"\n              >\n                <MarketingCardHeader>\n                  <MarketingCardTitle>\n                    {t.icon} {t.name}\n                  </MarketingCardTitle>\n                  <MarketingCardDescription>\n                    {t.description}\n                  </MarketingCardDescription>\n                </MarketingCardHeader>\n                <MarketingCardContent>\n                  <VStack gap=\"md\">\n                    <HStack gap=\"sm\" wrap=\"wrap\">\n                      {t.tags.slice(0, 6).map((tag: string) => (\n                        <ButtonLink\n                          key={`${t.id}-${tag}`}\n                          href={`/templates?tag=${encodeURIComponent(tag)}`}\n                          variant=\"ghost\"\n                        >\n                          {tag}\n                        </ButtonLink>\n                      ))}\n                    </HStack>\n                    <HStack gap=\"sm\" justify=\"between\" wrap=\"wrap\">\n                      <ButtonLinkToSandbox templateId={t.id} />\n                      <Button variant=\"outline\" onClick={() => void 0} disabled>\n                        Install to Studio (soon)\n                      </Button>\n                    </HStack>\n                  </VStack>\n                </MarketingCardContent>\n              </MarketingCard>\n            ))}\n          </HStack>\n        </VStack>\n      </MarketingSection>\n    </>\n  );\n}\n\nfunction ButtonLinkToSandbox({ templateId }: { templateId: string }) {\n  return (\n    <ButtonLink\n      href={`/sandbox?template=${encodeURIComponent(templateId)}`}\n      variant=\"default\"\n    >\n      Preview\n    </ButtonLink>\n  );\n}\n"],"mappings":";;;;;;;;;AAkBA,SAAS,aAAa,GAAuB,OAAwB;CACnE,MAAM,IAAI,MAAM,MAAM,CAAC,aAAa;AACpC,KAAI,CAAC,EAAG,QAAO;AAGf,QADE,GAAG,EAAE,GAAG,GAAG,EAAE,KAAK,GAAG,EAAE,YAAY,GAAG,EAAE,KAAK,KAAK,IAAI,GAAG,aAAa,CAC7D,SAAS,EAAE;;AAGxB,SAAgB,yBAAyB;CACvC,MAAM,CAAC,OAAO,YAAY,SAAS,GAAG;CAEtC,MAAM,YAAY,cAAc,eAAe,EAAE,EAAE,CAAC;CACpD,MAAM,WAAW,cACT,UAAU,QAAQ,MAAM,aAAa,GAAG,MAAM,CAAC,EACrD,CAAC,WAAW,MAAM,CACnB;AAED,QACE;EACE,oBAAC;GAAiB,MAAK;aACrB,qBAAC;IAAO,IAAG;IAAS,KAAI;IAAK,OAAM;eACjC,qBAAC;KAAO,KAAI;KAAK,OAAM;gBACrB,oBAAC;MAAW,MAAK;MAAQ,SAAQ;gBAAQ;OAE5B,EACb,oBAAC;MAAW,MAAK;MAAW,SAAQ;gBAAQ;OAE/B;MACN,EACT,oBAAC;KAAO,KAAI;KAAK,OAAM;eACrB,oBAAC;MAAW,MAAK;MAAa,SAAQ;gBAAU;OAEnC;MACN;KACF;IACQ;EAEnB,oBAAC;GAAiB,MAAK;aACrB,qBAAC;IAAO,KAAI;eACV,oBAAC;KAAO,KAAI;eACV,oBAAC;MAAW,MAAK;MAAa,SAAQ;gBAAQ;OAEjC;MACN,EACT,oBAAC;KAAO,KAAI;KAAK,OAAM;KAAS,SAAQ;KAAU,MAAK;eACrD,oBAAC;MACC,cAAW;MACX,aAAY;MACZ,OAAO;MACP,WAAW,MAAM,SAAS,EAAE,OAAO,MAAM;OACzC;MACK;KACF;IACQ;EAEnB,oBAAC;GAAiB,MAAK;aACrB,oBAAC;IAAO,KAAI;cACV,oBAAC;KAAO,KAAI;KAAK,MAAK;eACnB,SAAS,KAAK,MACb,qBAAC;MAEC,WAAU;iBAEV,qBAAC,kCACC,qBAAC;OACE,EAAE;OAAK;OAAE,EAAE;UACO,EACrB,oBAAC,sCACE,EAAE,cACsB,IACP,EACtB,oBAAC,kCACC,qBAAC;OAAO,KAAI;kBACV,oBAAC;QAAO,KAAI;QAAK,MAAK;kBACnB,EAAE,KAAK,MAAM,GAAG,EAAE,CAAC,KAAK,QACvB,oBAAC;SAEC,MAAM,kBAAkB,mBAAmB,IAAI;SAC/C,SAAQ;mBAEP;WAJI,GAAG,EAAE,GAAG,GAAG,MAKL,CACb;SACK,EACT,qBAAC;QAAO,KAAI;QAAK,SAAQ;QAAU,MAAK;mBACtC,oBAAC,uBAAoB,YAAY,EAAE,KAAM,EACzC,oBAAC;SAAO,SAAQ;SAAU,eAAe,KAAK;SAAG;mBAAS;UAEjD;SACF;QACF,GACY;QA/BlB,EAAE,GAgCO,CAChB;MACK;KACF;IACQ;KAClB;;AAIP,SAAS,oBAAoB,EAAE,cAAsC;AACnE,QACE,oBAAC;EACC,MAAM,qBAAqB,mBAAmB,WAAW;EACzD,SAAQ;YACT;GAEY"}

package/dist/components/templates/TemplatesPreviewModal.d.ts

@@ -0,0 +1,15 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { TemplateId } from "@contractspec/lib.example-shared-ui";
+
+//#region src/components/templates/TemplatesPreviewModal.d.ts
+interface TemplatePreviewModalProps {
+  templateId: TemplateId | null;
+  onClose: () => void;
+}
+declare const TemplatePreviewModal: ({
+  templateId,
+  onClose
+}: TemplatePreviewModalProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TemplatePreviewModal };
+//# sourceMappingURL=TemplatesPreviewModal.d.ts.map

package/dist/components/templates/TemplatesPreviewModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesPreviewModal.d.ts","names":[],"sources":["../../../src/components/templates/TemplatesPreviewModal.tsx"],"mappings":";;;;UAmGU,yBAAA;EACR,UAAA,EAAY,UAAA;EACZ,OAAA;AAAA;AAAA,cAmBW,oBAAA;EAAwB,UAAA;EAAA;AAAA,GAGlC,yBAAA,KAAyB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/templates/TemplatesPreviewModal.js

@@ -0,0 +1,137 @@
+'use client';
+
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Dialog, DialogContent } from "@contractspec/lib.ui-kit-web/ui/dialog";
+import dynamic from "next/dynamic";
+import { ScrollArea } from "@contractspec/lib.ui-kit-web/ui/scroll-area";
+import { LoadingSpinner } from "@contractspec/lib.ui-kit-web/ui/atoms/LoadingSpinner";
+
+//#region src/components/templates/TemplatesPreviewModal.tsx
+const TemplateShell = dynamic(() => import("@contractspec/lib.example-shared-ui").then((mod) => mod.TemplateShell), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const TodosTaskList = dynamic(() => import("@contractspec/bundle.library/components/templates/todos/TaskList").then((mod) => mod.TaskList), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const MessagingWorkspace = dynamic(() => import("@contractspec/bundle.library/components/templates/messaging/MessagingWorkspace").then((mod) => mod.MessagingWorkspace), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const RecipesExperience = dynamic(() => import("@contractspec/bundle.library/components/templates/recipes/RecipeList").then((mod) => mod.RecipeList), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const SaasDashboard = dynamic(() => import("@contractspec/example.saas-boilerplate").then((mod) => mod.SaasDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const CrmDashboard = dynamic(() => import("@contractspec/example.crm-pipeline").then((mod) => mod.CrmDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const AgentDashboard = dynamic(() => import("@contractspec/example.agent-console/ui").then((mod) => mod.AgentDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const WorkflowDashboard = dynamic(() => import("@contractspec/example.workflow-system/ui").then((mod) => mod.WorkflowDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const MarketplaceDashboard = dynamic(() => import("@contractspec/example.marketplace/ui").then((mod) => mod.MarketplaceDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const IntegrationDashboard = dynamic(() => import("@contractspec/example.integration-hub/ui").then((mod) => mod.IntegrationDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const AnalyticsDashboard = dynamic(() => import("@contractspec/example.analytics-dashboard").then((mod) => mod.AnalyticsDashboard), {
+	ssr: false,
+	loading: () => /* @__PURE__ */ jsx(LoadingSpinner, {})
+});
+const TemplatePreviewModal = ({ templateId, onClose }) => {
+	const previewComponent = useMemo(() => {
+		switch (templateId) {
+			case "todos-app": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Starter tasks",
+				description: "Track work items with filters, priorities, and per-tenant data isolation.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(TodosTaskList, {})
+			});
+			case "messaging-app": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Messaging workspace",
+				description: "Realtime-ready messaging surface with optimistic delivery.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(MessagingWorkspace, {})
+			});
+			case "recipe-app-i18n": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Ceremony recipes",
+				description: "Switch locales and preview how rituals translate across teams.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(RecipesExperience, {})
+			});
+			case "saas-boilerplate": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "SaaS Boilerplate",
+				description: "Multi-tenant organizations, projects, settings, and billing usage tracking.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(SaasDashboard, {})
+			});
+			case "crm-pipeline": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "CRM Pipeline",
+				description: "Sales CRM with contacts, companies, deals, and pipeline stages.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(CrmDashboard, {})
+			});
+			case "agent-console": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "AI Agent Console",
+				description: "AI agent orchestration with tools, agents, runs, and execution logs.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(AgentDashboard, {})
+			});
+			case "workflow-system": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Workflow System",
+				description: "Multi-step workflows with role-based approvals.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(WorkflowDashboard, {})
+			});
+			case "marketplace": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Marketplace",
+				description: "Two-sided marketplace with stores, products, and orders.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(MarketplaceDashboard, {})
+			});
+			case "integration-hub": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Integration Hub",
+				description: "Third-party integrations with sync and field mapping.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(IntegrationDashboard, {})
+			});
+			case "analytics-dashboard": return /* @__PURE__ */ jsx(TemplateShell, {
+				title: "Analytics Dashboard",
+				description: "Custom dashboards with widgets and queries.",
+				showSaveAction: false,
+				children: /* @__PURE__ */ jsx(AnalyticsDashboard, {})
+			});
+			case null: return null;
+			default: return null;
+		}
+	}, [templateId]);
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: !!previewComponent,
+		onOpenChange: onClose,
+		children: /* @__PURE__ */ jsx(DialogContent, {
+			className: "mb-8 flex h-[calc(100vh-2rem)] min-w-[calc(100vw-2rem)] flex-col justify-between gap-0 p-0",
+			children: /* @__PURE__ */ jsx(ScrollArea, {
+				className: "flex flex-col justify-between overflow-hidden",
+				children: previewComponent
+			})
+		})
+	});
+};
+
+//#endregion
+export { TemplatePreviewModal };
+//# sourceMappingURL=TemplatesPreviewModal.js.map

package/dist/components/templates/TemplatesPreviewModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesPreviewModal.js","names":[],"sources":["../../../src/components/templates/TemplatesPreviewModal.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport dynamic from 'next/dynamic';\nimport { Dialog, DialogContent } from '@contractspec/lib.ui-kit-web/ui/dialog';\nimport { ScrollArea } from '@contractspec/lib.ui-kit-web/ui/scroll-area';\nimport { LoadingSpinner } from '@contractspec/lib.ui-kit-web/ui/atoms/LoadingSpinner';\nimport type { TemplateId } from '@contractspec/lib.example-shared-ui';\n\n// Dynamically import template components with ssr: false\nconst TemplateShell = dynamic(\n  () =>\n    import('@contractspec/lib.example-shared-ui').then(\n      (mod) => mod.TemplateShell\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst TodosTaskList = dynamic(\n  () =>\n    import('@contractspec/bundle.library/components/templates/todos/TaskList').then(\n      (mod) => mod.TaskList\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst MessagingWorkspace = dynamic(\n  () =>\n    import('@contractspec/bundle.library/components/templates/messaging/MessagingWorkspace').then(\n      (mod) => mod.MessagingWorkspace\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst RecipesExperience = dynamic(\n  () =>\n    import('@contractspec/bundle.library/components/templates/recipes/RecipeList').then(\n      (mod) => mod.RecipeList\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst SaasDashboard = dynamic(\n  () =>\n    import('@contractspec/example.saas-boilerplate').then(\n      (mod) => mod.SaasDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst CrmDashboard = dynamic(\n  () =>\n    import('@contractspec/example.crm-pipeline').then(\n      (mod) => mod.CrmDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst AgentDashboard = dynamic(\n  () =>\n    import('@contractspec/example.agent-console/ui').then(\n      (mod) => mod.AgentDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst WorkflowDashboard = dynamic(\n  () =>\n    import('@contractspec/example.workflow-system/ui').then(\n      (mod) => mod.WorkflowDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst MarketplaceDashboard = dynamic(\n  () =>\n    import('@contractspec/example.marketplace/ui').then(\n      (mod) => mod.MarketplaceDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst IntegrationDashboard = dynamic(\n  () =>\n    import('@contractspec/example.integration-hub/ui').then(\n      (mod) => mod.IntegrationDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\nconst AnalyticsDashboard = dynamic(\n  () =>\n    import('@contractspec/example.analytics-dashboard').then(\n      (mod) => mod.AnalyticsDashboard\n    ),\n  { ssr: false, loading: () => <LoadingSpinner /> }\n);\n\ninterface TemplatePreviewModalProps {\n  templateId: TemplateId | null;\n  onClose: () => void;\n}\n//\n//   return (\n//     <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/70 px-4 py-10\">\n//       <div className=\"bg-background relative h-full max-h-[90vh] w-full max-w-5xl overflow-y-auto rounded-3xl p-6 shadow-2xl\">\n//         <button\n//           type=\"button\"\n//           className=\"btn-ghost absolute top-4 right-4 text-sm\"\n//           onClick={onClose}\n//         >\n//           Close\n//         </button>\n//         {previewComponent}\n//       </div>\n//     </div>\n//   );\n// };\n\nexport const TemplatePreviewModal = ({\n  templateId,\n  onClose,\n}: TemplatePreviewModalProps) => {\n  const previewComponent = useMemo(() => {\n    switch (templateId) {\n      case 'todos-app':\n        return (\n          <TemplateShell\n            title=\"Starter tasks\"\n            description=\"Track work items with filters, priorities, and per-tenant data isolation.\"\n            showSaveAction={false}\n          >\n            <TodosTaskList />\n          </TemplateShell>\n        );\n      case 'messaging-app':\n        return (\n          <TemplateShell\n            title=\"Messaging workspace\"\n            description=\"Realtime-ready messaging surface with optimistic delivery.\"\n            showSaveAction={false}\n          >\n            <MessagingWorkspace />\n          </TemplateShell>\n        );\n      case 'recipe-app-i18n':\n        return (\n          <TemplateShell\n            title=\"Ceremony recipes\"\n            description=\"Switch locales and preview how rituals translate across teams.\"\n            showSaveAction={false}\n          >\n            <RecipesExperience />\n          </TemplateShell>\n        );\n      case 'saas-boilerplate':\n        return (\n          <TemplateShell\n            title=\"SaaS Boilerplate\"\n            description=\"Multi-tenant organizations, projects, settings, and billing usage tracking.\"\n            showSaveAction={false}\n          >\n            <SaasDashboard />\n          </TemplateShell>\n        );\n      case 'crm-pipeline':\n        return (\n          <TemplateShell\n            title=\"CRM Pipeline\"\n            description=\"Sales CRM with contacts, companies, deals, and pipeline stages.\"\n            showSaveAction={false}\n          >\n            <CrmDashboard />\n          </TemplateShell>\n        );\n      case 'agent-console':\n        return (\n          <TemplateShell\n            title=\"AI Agent Console\"\n            description=\"AI agent orchestration with tools, agents, runs, and execution logs.\"\n            showSaveAction={false}\n          >\n            <AgentDashboard />\n          </TemplateShell>\n        );\n      case 'workflow-system':\n        return (\n          <TemplateShell\n            title=\"Workflow System\"\n            description=\"Multi-step workflows with role-based approvals.\"\n            showSaveAction={false}\n          >\n            <WorkflowDashboard />\n          </TemplateShell>\n        );\n      case 'marketplace':\n        return (\n          <TemplateShell\n            title=\"Marketplace\"\n            description=\"Two-sided marketplace with stores, products, and orders.\"\n            showSaveAction={false}\n          >\n            <MarketplaceDashboard />\n          </TemplateShell>\n        );\n      case 'integration-hub':\n        return (\n          <TemplateShell\n            title=\"Integration Hub\"\n            description=\"Third-party integrations with sync and field mapping.\"\n            showSaveAction={false}\n          >\n            <IntegrationDashboard />\n          </TemplateShell>\n        );\n      case 'analytics-dashboard':\n        return (\n          <TemplateShell\n            title=\"Analytics Dashboard\"\n            description=\"Custom dashboards with widgets and queries.\"\n            showSaveAction={false}\n          >\n            <AnalyticsDashboard />\n          </TemplateShell>\n        );\n      case null:\n        return null;\n      default:\n        return null;\n    }\n  }, [templateId]);\n\n  return (\n    <Dialog open={!!previewComponent} onOpenChange={onClose}>\n      {/*<DialogTrigger asChild>*/}\n      {/*  <Button variant=\"outline\">Fullscreen Dialog</Button>*/}\n      {/*</DialogTrigger>*/}\n      <DialogContent className=\"mb-8 flex h-[calc(100vh-2rem)] min-w-[calc(100vw-2rem)] flex-col justify-between gap-0 p-0\">\n        <ScrollArea className=\"flex flex-col justify-between overflow-hidden\">\n          {/*<DialogHeader className=\"contents space-y-0 text-left\">*/}\n          {/*  <DialogTitle className=\"px-6 pt-6\">Product Information</DialogTitle>*/}\n          {/*  <DialogDescription asChild>*/}\n          {/*  </DialogDescription>*/}\n          {/*</DialogHeader>*/}\n          {previewComponent}\n        </ScrollArea>\n        {/*<DialogFooter className=\"px-6 pb-6 sm:justify-end\">*/}\n        {/*  <DialogClose asChild>*/}\n        {/*    <Button variant=\"outline\">*/}\n        {/*      <ChevronLeftIcon />*/}\n        {/*      Back*/}\n        {/*    </Button>*/}\n        {/*  </DialogClose>*/}\n        {/*  <Button type=\"button\">Read More</Button>*/}\n        {/*</DialogFooter>*/}\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"mappings":"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"}

package/dist/components/templates/index.d.ts

@@ -0,0 +1,4 @@
+import { TemplatesPage } from "./TemplatesClientPage.js";
+import { TemplatesMarketingPage } from "./TemplatesPage.js";
+import { TemplatePreviewModal } from "./TemplatesPreviewModal.js";
+export { TemplatePreviewModal, TemplatesMarketingPage, TemplatesPage };

package/dist/components/templates/index.js

@@ -0,0 +1,5 @@
+import { TemplatePreviewModal } from "./TemplatesPreviewModal.js";
+import { TemplatesPage } from "./TemplatesClientPage.js";
+import { TemplatesMarketingPage } from "./TemplatesPage.js";
+
+export { TemplatePreviewModal, TemplatesMarketingPage, TemplatesPage };

package/dist/index.d.ts

@@ -0,0 +1,29 @@
+import { ChangelogPage } from "./components/marketing/ChangelogPage.js";
+import { CofounderPage } from "./components/marketing/CofounderPage.js";
+import { ContactClient } from "./components/marketing/ContactClient.js";
+import { ContributePage } from "./components/marketing/ContributePage.js";
+import { DesignPartnerPage } from "./components/marketing/DesignPartnerPage.js";
+import { LandingPage } from "./components/marketing/LandingPage.js";
+import { PricingClient } from "./components/marketing/PricingClient.js";
+import { ProductClientPage } from "./components/marketing/ProductClientPage.js";
+import { WaitlistSection } from "./components/marketing/waitlist-section.js";
+import { PricingThinkingModal } from "./components/marketing/pricing-thinking-modal.js";
+import "./components/marketing/index.js";
+import { TemplatesPage } from "./components/templates/TemplatesClientPage.js";
+import { TemplatesMarketingPage } from "./components/templates/TemplatesPage.js";
+import { TemplatePreviewModal } from "./components/templates/TemplatesPreviewModal.js";
+import "./components/templates/index.js";
+import { SubmitContactFormResult, SubmitNewsletterResult, SubmitWaitlistApplicationResult, SubmitWaitlistResult } from "./libs/email/types.js";
+import { submitContactForm } from "./libs/email/contact.js";
+import { subscribeToNewsletter } from "./libs/email/newsletter.js";
+import { joinWaitlist } from "./libs/email/waitlist.js";
+import { submitWaitlistApplication } from "./libs/email/waitlist-application.js";
+import { ComponentMap, RoutePresentation } from "./registry/types.js";
+import { createPresentationEngine, presentationEngine } from "./registry/engine.js";
+import { CreateComponentPresentationOptions, DOCS_CONTEXT, DOCS_GOAL, DOCS_TAGS, MARKETING_CONTEXT, MARKETING_GOAL, createComponentPresentation, tagsFromPath } from "./registry/factory.js";
+import { componentMap, getAllPresentationRoutes, getPresentationForRoute, hasPresentation, presentationRegistry } from "./registry/registry.js";
+import { docsComponentMap, docsPresentations } from "./registry/registry-docs.js";
+import { landingComponentMap, landingPresentations, learningPresentations } from "./registry/registry-landing.js";
+import { AIChatProvider, aiChatProviders, getMarkdownUrl, renderPresentationToMarkdown, renderPresentationToReact } from "./registry/utils.js";
+import "./registry/index.js";
+export { AIChatProvider, ChangelogPage, CofounderPage, ComponentMap, ContactClient, ContributePage, CreateComponentPresentationOptions, DOCS_CONTEXT, DOCS_GOAL, DOCS_TAGS, DesignPartnerPage, LandingPage, MARKETING_CONTEXT, MARKETING_GOAL, PricingClient, PricingThinkingModal, ProductClientPage, RoutePresentation, type SubmitContactFormResult, type SubmitNewsletterResult, type SubmitWaitlistApplicationResult, type SubmitWaitlistResult, TemplatePreviewModal, TemplatesMarketingPage, TemplatesPage, WaitlistSection, aiChatProviders, componentMap, createComponentPresentation, createPresentationEngine, docsComponentMap, docsPresentations, getAllPresentationRoutes, getMarkdownUrl, getPresentationForRoute, hasPresentation, joinWaitlist, landingComponentMap, landingPresentations, learningPresentations, presentationEngine, presentationRegistry, renderPresentationToMarkdown, renderPresentationToReact, submitContactForm, submitWaitlistApplication, subscribeToNewsletter, tagsFromPath };

package/dist/index.js

@@ -0,0 +1,28 @@
+import { LandingPage } from "./components/marketing/LandingPage.js";
+import { ProductClientPage } from "./components/marketing/ProductClientPage.js";
+import { joinWaitlist } from "./libs/email/waitlist.js";
+import { submitWaitlistApplication } from "./libs/email/waitlist-application.js";
+import { WaitlistSection } from "./components/marketing/waitlist-section.js";
+import { PricingThinkingModal } from "./components/marketing/pricing-thinking-modal.js";
+import { PricingClient } from "./components/marketing/PricingClient.js";
+import { submitContactForm } from "./libs/email/contact.js";
+import { ContactClient } from "./components/marketing/ContactClient.js";
+import { ChangelogPage } from "./components/marketing/ChangelogPage.js";
+import { CofounderPage } from "./components/marketing/CofounderPage.js";
+import { ContributePage } from "./components/marketing/ContributePage.js";
+import { DesignPartnerPage } from "./components/marketing/DesignPartnerPage.js";
+import "./components/marketing/index.js";
+import { TemplatePreviewModal } from "./components/templates/TemplatesPreviewModal.js";
+import { TemplatesPage } from "./components/templates/TemplatesClientPage.js";
+import { TemplatesMarketingPage } from "./components/templates/TemplatesPage.js";
+import "./components/templates/index.js";
+import { subscribeToNewsletter } from "./libs/email/newsletter.js";
+import { DOCS_CONTEXT, DOCS_GOAL, DOCS_TAGS, MARKETING_CONTEXT, MARKETING_GOAL, createComponentPresentation, tagsFromPath } from "./registry/factory.js";
+import { docsComponentMap, docsPresentations } from "./registry/registry-docs.js";
+import { landingComponentMap, landingPresentations, learningPresentations } from "./registry/registry-landing.js";
+import { componentMap, getAllPresentationRoutes, getPresentationForRoute, hasPresentation, presentationRegistry } from "./registry/registry.js";
+import { createPresentationEngine, presentationEngine } from "./registry/engine.js";
+import { aiChatProviders, getMarkdownUrl, renderPresentationToMarkdown, renderPresentationToReact } from "./registry/utils.js";
+import "./registry/index.js";
+
+export { ChangelogPage, CofounderPage, ContactClient, ContributePage, DOCS_CONTEXT, DOCS_GOAL, DOCS_TAGS, DesignPartnerPage, LandingPage, MARKETING_CONTEXT, MARKETING_GOAL, PricingClient, PricingThinkingModal, ProductClientPage, TemplatePreviewModal, TemplatesMarketingPage, TemplatesPage, WaitlistSection, aiChatProviders, componentMap, createComponentPresentation, createPresentationEngine, docsComponentMap, docsPresentations, getAllPresentationRoutes, getMarkdownUrl, getPresentationForRoute, hasPresentation, joinWaitlist, landingComponentMap, landingPresentations, learningPresentations, presentationEngine, presentationRegistry, renderPresentationToMarkdown, renderPresentationToReact, submitContactForm, submitWaitlistApplication, subscribeToNewsletter, tagsFromPath };

package/dist/libs/email/client.d.ts

@@ -0,0 +1,15 @@
+import { EmailConfigResult, EmailSendOutcome, EmailServiceConfig, SendEmailRequest } from "./types.js";
+import { Temv1alpha1, createClient } from "@scaleway/sdk";
+
+//#region src/libs/email/client.d.ts
+type EmailApi = Pick<Temv1alpha1.API, 'createEmail'>;
+declare const getEmailConfig: () => EmailConfigResult;
+declare const sendEmail: (config: EmailServiceConfig, request: SendEmailRequest) => Promise<EmailSendOutcome>;
+declare const __internal: {
+  resetCaches(): void;
+  setApiFactory(factory: (client: ReturnType<typeof createClient>) => EmailApi): void;
+  setClient(client: EmailApi): void;
+};
+//#endregion
+export { __internal, getEmailConfig, sendEmail };
+//# sourceMappingURL=client.d.ts.map

package/dist/libs/email/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","names":[],"sources":["../../../src/libs/email/client.ts"],"mappings":";;;;KAuBK,QAAA,GAAW,IAAA,CAAK,WAAA,CAAY,GAAA;AAAA,cAgBpB,cAAA,QAAqB,iBAAA;AAAA,cAyDrB,SAAA,GACX,MAAA,EAAQ,kBAAA,EACR,OAAA,EAAS,gBAAA,KACR,OAAA,CAAQ,gBAAA;AAAA,cA+BE,UAAA;;0BAQC,MAAA,EAAQ,UAAA,QAAkB,YAAA,MAAkB,QAAA;oBAItC,QAAA;AAAA"}