@contractspec/bundle.marketing 3.8.8 → 3.8.10

package/dist/node/components/templates/TemplateCard.js

@@ -0,0 +1,78 @@
+import { createRequire } from "node:module";
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/templates/TemplateCard.tsx
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function TemplateCard({
+  title,
+  description,
+  metaBadges,
+  tags,
+  featureList = [],
+  isNew = false,
+  previewAction,
+  useAction
+}) {
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "editorial-panel relative flex flex-col space-y-4 transition-colors hover:border-[color:rgb(162_79_42_/_0.55)]",
+    children: [
+      isNew ? /* @__PURE__ */ jsxDEV("span", {
+        className: "absolute top-4 right-4 rounded-full bg-[color:var(--success)] px-2.5 py-1 font-medium text-[11px] text-white uppercase",
+        children: "New"
+      }, undefined, false, undefined, this) : null,
+      /* @__PURE__ */ jsxDEV("div", {
+        children: [
+          /* @__PURE__ */ jsxDEV("h3", {
+            className: "font-serif text-2xl tracking-[-0.03em]",
+            children: title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("p", {
+            className: "mt-1 text-muted-foreground text-sm",
+            children: description
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "flex-1 space-y-3",
+        children: [
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "flex flex-wrap gap-2",
+            children: metaBadges.map((badge) => /* @__PURE__ */ jsxDEV("span", {
+              className: "rounded-full border border-border bg-background px-3 py-1 text-[11px] text-foreground",
+              children: badge
+            }, badge, false, undefined, this))
+          }, undefined, false, undefined, this),
+          featureList.length > 0 ? /* @__PURE__ */ jsxDEV("p", {
+            className: "text-muted-foreground text-xs",
+            children: [
+              /* @__PURE__ */ jsxDEV("span", {
+                className: "font-medium text-foreground",
+                children: "Features:"
+              }, undefined, false, undefined, this),
+              " ",
+              featureList.join(", ")
+            ]
+          }, undefined, true, undefined, this) : null,
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "flex flex-wrap gap-1",
+            children: tags.map((tag) => /* @__PURE__ */ jsxDEV("span", {
+              className: "rounded-full border border-border bg-muted px-3 py-1 text-[11px] text-muted-foreground",
+              children: tag
+            }, tag, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "flex gap-2 pt-4",
+        children: [
+          previewAction,
+          useAction
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  TemplateCard
+};

package/dist/node/components/templates/TemplateCommandDialog.js

@@ -0,0 +1,105 @@
+import { createRequire } from "node:module";
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/templates/TemplateCommandDialog.tsx
+import {
+  analyticsEventNames,
+  captureAnalyticsEvent
+} from "@contractspec/bundle.library/libs/posthog/client";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle
+} from "@contractspec/lib.ui-kit-web/ui/dialog";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function TemplateCommandDialog({
+  templateId,
+  onClose,
+  onDeployStudio
+}) {
+  const command = templateId ? `npx contractspec init --template ${templateId}` : "";
+  return /* @__PURE__ */ jsxDEV(Dialog, {
+    open: !!templateId,
+    onOpenChange: (open) => !open && onClose(),
+    children: /* @__PURE__ */ jsxDEV(DialogContent, {
+      className: "max-w-md",
+      children: [
+        /* @__PURE__ */ jsxDEV(DialogHeader, {
+          children: [
+            /* @__PURE__ */ jsxDEV(DialogTitle, {
+              children: "Use this template"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV(DialogDescription, {
+              children: "Initialize a new project with this template using the CLI."
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ jsxDEV("div", {
+          className: "space-y-4 pt-4",
+          children: [
+            /* @__PURE__ */ jsxDEV("div", {
+              className: "rounded-md border border-zinc-800 bg-zinc-950 p-4 font-mono text-sm text-zinc-50",
+              children: command
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV("div", {
+              className: "flex gap-2",
+              children: /* @__PURE__ */ jsxDEV("button", {
+                className: "btn-secondary w-full",
+                onClick: () => {
+                  if (!templateId) {
+                    return;
+                  }
+                  navigator.clipboard.writeText(command);
+                  captureAnalyticsEvent(analyticsEventNames.COPY_COMMAND_CLICK, {
+                    surface: "templates",
+                    templateId,
+                    filename: "templates-cli"
+                  });
+                },
+                children: "Copy Command"
+              }, undefined, false, undefined, this)
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV("div", {
+              className: "relative",
+              children: [
+                /* @__PURE__ */ jsxDEV("div", {
+                  className: "absolute inset-0 flex items-center",
+                  children: /* @__PURE__ */ jsxDEV("span", {
+                    className: "w-full border-border border-t"
+                  }, undefined, false, undefined, this)
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV("div", {
+                  className: "relative flex justify-center text-xs uppercase",
+                  children: /* @__PURE__ */ jsxDEV("span", {
+                    className: "bg-background px-2 text-muted-foreground",
+                    children: "Or"
+                  }, undefined, false, undefined, this)
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ jsxDEV("button", {
+              className: "btn-ghost w-full text-sm",
+              onClick: () => {
+                if (!templateId) {
+                  return;
+                }
+                captureAnalyticsEvent(analyticsEventNames.CTA_STUDIO_CLICK, {
+                  surface: "templates",
+                  templateId
+                });
+                onDeployStudio();
+              },
+              children: "Deploy to Studio"
+            }, undefined, false, undefined, this)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  TemplateCommandDialog
+};

package/dist/node/components/templates/TemplatePreviewContent.js

@@ -0,0 +1,91 @@
+import { createRequire } from "node:module";
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/templates/TemplatePreviewContent.tsx
+import {
+  TemplateShell
+} from "@contractspec/lib.example-shared-ui";
+import { LoadingSpinner } from "@contractspec/lib.ui-kit-web/ui/atoms/LoadingSpinner";
+import dynamic from "next/dynamic";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+var SaasDashboard = dynamic(() => import("@contractspec/example.saas-boilerplate").then((module) => module.SaasDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var CrmDashboard = dynamic(() => import("@contractspec/example.crm-pipeline").then((module) => module.CrmDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var DataGridShowcase = dynamic(() => import("@contractspec/example.data-grid-showcase/ui").then((module) => module.DataGridShowcase), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var VisualizationShowcase = dynamic(() => import("@contractspec/example.visualization-showcase/ui").then((module) => module.VisualizationShowcase), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var AgentDashboard = dynamic(() => import("@contractspec/example.agent-console/ui").then((module) => module.AgentDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var AiChatAssistantDashboard = dynamic(() => import("@contractspec/example.ai-chat-assistant").then((module) => module.AiChatAssistantDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var WorkflowDashboard = dynamic(() => import("@contractspec/example.workflow-system/ui").then((module) => module.WorkflowDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var MarketplaceDashboard = dynamic(() => import("@contractspec/example.marketplace/ui").then((module) => module.MarketplaceDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var IntegrationDashboard = dynamic(() => import("@contractspec/example.integration-hub/ui").then((module) => module.IntegrationDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var AnalyticsDashboard = dynamic(() => import("@contractspec/example.analytics-dashboard").then((module) => module.AnalyticsDashboard), { ssr: false, loading: () => /* @__PURE__ */ jsxDEV(LoadingSpinner, {}, undefined, false, undefined, this) });
+var PREVIEW_DEFINITIONS = {
+  "saas-boilerplate": {
+    title: "SaaS Boilerplate",
+    description: "Multi-tenant organizations, projects, settings, and billing usage tracking.",
+    component: SaasDashboard
+  },
+  "crm-pipeline": {
+    title: "CRM Pipeline",
+    description: "Sales CRM with contacts, companies, deals, and pipeline stages.",
+    component: CrmDashboard
+  },
+  "data-grid-showcase": {
+    title: "Data Grid Showcase",
+    description: "Shared ContractSpec table primitives with client, server, and DataView-driven lanes.",
+    component: DataGridShowcase
+  },
+  "visualization-showcase": {
+    title: "Visualization Showcase",
+    description: "ContractSpec-owned chart primitives rendered through shared visualization contracts and design-system wrappers.",
+    component: VisualizationShowcase
+  },
+  "agent-console": {
+    title: "AI Agent Console",
+    description: "AI agent orchestration with tools, agents, runs, and execution logs.",
+    component: AgentDashboard
+  },
+  "ai-chat-assistant": {
+    title: "AI Chat Assistant",
+    description: "Focused assistant surface with reasoning, sources, suggestions, and MCP-aware tools.",
+    component: AiChatAssistantDashboard
+  },
+  "workflow-system": {
+    title: "Workflow System",
+    description: "Multi-step workflows with role-based approvals.",
+    component: WorkflowDashboard
+  },
+  marketplace: {
+    title: "Marketplace",
+    description: "Two-sided marketplace with stores, products, orders, and payouts.",
+    component: MarketplaceDashboard
+  },
+  "integration-hub": {
+    title: "Integration Hub",
+    description: "Third-party integrations with connections, sync configs, and field mapping.",
+    component: IntegrationDashboard
+  },
+  "analytics-dashboard": {
+    title: "Analytics Dashboard",
+    description: "Custom dashboards with widgets and queries.",
+    component: AnalyticsDashboard
+  }
+};
+function TemplatePreviewContent({
+  templateId
+}) {
+  const preview = PREVIEW_DEFINITIONS[templateId];
+  if (!preview) {
+    return null;
+  }
+  const PreviewComponent = preview.component;
+  return /* @__PURE__ */ jsxDEV(TemplateShell, {
+    title: preview.title,
+    description: preview.description,
+    showSaveAction: false,
+    children: /* @__PURE__ */ jsxDEV(PreviewComponent, {}, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  TemplatePreviewContent
+};

package/dist/node/components/templates/TemplatesBrowseControls.js

@@ -0,0 +1,125 @@
+import { createRequire } from "node:module";
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/templates/TemplatesBrowseControls.tsx
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { Search } from "lucide-react";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function TemplatesBrowseControls({
+  registryConfigured,
+  availableSources,
+  source,
+  onSourceChange,
+  search,
+  onSearchChange,
+  selectedTag,
+  onTagChange,
+  showTagFilters,
+  visibleTagFacets,
+  hiddenTagFacets,
+  showAllTags,
+  onShowAllTagsChange
+}) {
+  return /* @__PURE__ */ jsxDEV("section", {
+    className: "editorial-section",
+    children: /* @__PURE__ */ jsxDEV("div", {
+      className: "editorial-shell space-y-6",
+      children: [
+        /* @__PURE__ */ jsxDEV("div", {
+          className: "flex flex-col gap-6 lg:flex-row lg:items-end lg:justify-between",
+          children: [
+            /* @__PURE__ */ jsxDEV("div", {
+              className: "max-w-3xl space-y-3",
+              children: [
+                /* @__PURE__ */ jsxDEV("p", {
+                  className: "editorial-kicker",
+                  children: "Browse by source"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV("h2", {
+                  className: "font-serif text-4xl tracking-[-0.04em]",
+                  children: "Use local scenarios for core proof, then scan the community."
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV("p", {
+                  className: "text-muted-foreground text-sm leading-7",
+                  children: registryConfigured ? "Local templates show the official adoption path. Community templates show where the ecosystem is pushing the system next." : "Local templates show the official adoption path. Community browsing appears automatically when a registry URL is configured."
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            registryConfigured ? /* @__PURE__ */ jsxDEV("div", {
+              className: "flex gap-2",
+              children: availableSources.map((option) => /* @__PURE__ */ jsxDEV("button", {
+                onClick: () => onSourceChange(option),
+                className: cn("rounded-full px-4 py-2 font-medium text-sm transition-colors", {
+                  "bg-primary text-primary-foreground": source === option,
+                  "border border-border bg-card hover:bg-card/80": source !== option
+                }),
+                "aria-pressed": source === option,
+                children: option === "local" ? "Local" : "Community"
+              }, option, false, undefined, this))
+            }, undefined, false, undefined, this) : null
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ jsxDEV("div", {
+          className: "editorial-panel space-y-5",
+          children: [
+            /* @__PURE__ */ jsxDEV("div", {
+              className: "relative",
+              children: [
+                /* @__PURE__ */ jsxDEV(Search, {
+                  className: "absolute top-3.5 left-4 text-muted-foreground",
+                  size: 18
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV("input", {
+                  type: "text",
+                  placeholder: "Search scenarios, industries, or tags",
+                  value: search,
+                  onChange: (event) => onSearchChange(event.target.value),
+                  className: "w-full rounded-full border border-border bg-background px-12 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-ring",
+                  "aria-label": "Search templates"
+                }, undefined, false, undefined, this)
+              ]
+            }, undefined, true, undefined, this),
+            showTagFilters ? /* @__PURE__ */ jsxDEV("div", {
+              className: "space-y-3",
+              children: [
+                /* @__PURE__ */ jsxDEV("div", {
+                  className: "flex flex-wrap gap-2",
+                  children: [
+                    /* @__PURE__ */ jsxDEV("button", {
+                      onClick: () => onTagChange(null),
+                      className: cn("rounded-full px-4 py-2 font-medium text-sm transition-colors", {
+                        "bg-primary text-primary-foreground": selectedTag === null,
+                        "border border-border bg-card hover:bg-card/80": selectedTag !== null
+                      }),
+                      "aria-pressed": selectedTag === null,
+                      children: "All"
+                    }, undefined, false, undefined, this),
+                    visibleTagFacets.map((facet) => /* @__PURE__ */ jsxDEV("button", {
+                      onClick: () => onTagChange(facet.tag),
+                      className: cn("rounded-full px-4 py-2 font-medium text-sm transition-colors", {
+                        "bg-primary text-primary-foreground": selectedTag === facet.tag,
+                        "border border-border bg-card hover:bg-card/80": selectedTag !== facet.tag
+                      }),
+                      "aria-pressed": selectedTag === facet.tag,
+                      children: facet.tag
+                    }, facet.tag, false, undefined, this))
+                  ]
+                }, undefined, true, undefined, this),
+                hiddenTagFacets.length > 0 || showAllTags ? /* @__PURE__ */ jsxDEV("button", {
+                  type: "button",
+                  onClick: () => onShowAllTagsChange(!showAllTags),
+                  className: "text-muted-foreground text-sm transition-colors hover:text-foreground",
+                  children: showAllTags ? "Show fewer" : "More tags"
+                }, undefined, false, undefined, this) : null
+              ]
+            }, undefined, true, undefined, this) : null
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  TemplatesBrowseControls
+};