@contractspec/example.saas-boilerplate 3.8.9 → 3.8.11

package/dist/ui/renderers/index.js

@@ -1,902 +1,6 @@
 // @bun
-// src/shared/mock-data.ts
-var MOCK_PROJECTS = [
-  {
-    id: "proj-1",
-    name: "Marketing Website",
-    description: "Main company website redesign project",
-    slug: "marketing-website",
-    organizationId: "demo-org",
-    createdBy: "user-1",
-    status: "ACTIVE",
-    isPublic: false,
-    tags: ["marketing", "website", "redesign"],
-    createdAt: new Date("2024-01-15T10:00:00Z"),
-    updatedAt: new Date("2024-03-20T14:30:00Z")
-  },
-  {
-    id: "proj-2",
-    name: "Mobile App v2",
-    description: "Next generation mobile application",
-    slug: "mobile-app-v2",
-    organizationId: "demo-org",
-    createdBy: "user-2",
-    status: "ACTIVE",
-    isPublic: false,
-    tags: ["mobile", "app", "v2"],
-    createdAt: new Date("2024-02-01T09:00:00Z"),
-    updatedAt: new Date("2024-04-05T11:15:00Z")
-  },
-  {
-    id: "proj-3",
-    name: "API Integration",
-    description: "Third-party API integration project",
-    slug: "api-integration",
-    organizationId: "demo-org",
-    createdBy: "user-1",
-    status: "DRAFT",
-    isPublic: false,
-    tags: ["api", "integration"],
-    createdAt: new Date("2024-03-10T08:00:00Z"),
-    updatedAt: new Date("2024-03-10T08:00:00Z")
-  },
-  {
-    id: "proj-4",
-    name: "Analytics Dashboard",
-    description: "Internal analytics and reporting dashboard",
-    slug: "analytics-dashboard",
-    organizationId: "demo-org",
-    createdBy: "user-3",
-    status: "ARCHIVED",
-    isPublic: true,
-    tags: ["analytics", "dashboard", "reporting"],
-    createdAt: new Date("2023-10-01T12:00:00Z"),
-    updatedAt: new Date("2024-02-28T16:45:00Z")
-  }
-];
-var MOCK_SUBSCRIPTION = {
-  id: "sub-1",
-  organizationId: "demo-org",
-  planId: "pro",
-  planName: "Professional",
-  status: "ACTIVE",
-  currentPeriodStart: new Date("2024-04-01T00:00:00Z"),
-  currentPeriodEnd: new Date("2024-05-01T00:00:00Z"),
-  limits: {
-    projects: 25,
-    users: 10,
-    storage: 50,
-    apiCalls: 1e5
-  },
-  usage: {
-    projects: 4,
-    users: 5,
-    storage: 12.5,
-    apiCalls: 45230
-  }
-};
-var MOCK_USAGE_SUMMARY = {
-  organizationId: "demo-org",
-  period: "current_month",
-  apiCalls: {
-    total: 45230,
-    limit: 1e5,
-    percentUsed: 45.23
-  },
-  storage: {
-    totalGb: 12.5,
-    limitGb: 50,
-    percentUsed: 25
-  },
-  activeProjects: 4,
-  activeUsers: 5,
-  breakdown: [
-    { date: "2024-04-01", apiCalls: 3200, storageGb: 12.1 },
-    { date: "2024-04-02", apiCalls: 2800, storageGb: 12.2 },
-    { date: "2024-04-03", apiCalls: 4100, storageGb: 12.3 },
-    { date: "2024-04-04", apiCalls: 3600, storageGb: 12.4 },
-    { date: "2024-04-05", apiCalls: 3800, storageGb: 12.5 }
-  ]
-};
-
-// src/billing/billing.handler.ts
-async function mockGetSubscriptionHandler() {
-  return MOCK_SUBSCRIPTION;
-}
-async function mockGetUsageSummaryHandler(input) {
-  return {
-    ...MOCK_USAGE_SUMMARY,
-    period: input.period ?? "current_month"
-  };
-}
-async function mockRecordUsageHandler(input) {
-  const currentUsage = MOCK_USAGE_SUMMARY.apiCalls.total;
-  const newTotal = currentUsage + input.quantity;
-  return {
-    recorded: true,
-    newTotal
-  };
-}
-async function mockCheckFeatureAccessHandler(input) {
-  const { feature } = input;
-  const featureMap = {
-    custom_domains: {
-      allowed: true
-    },
-    api_access: {
-      allowed: true,
-      currentUsage: MOCK_USAGE_SUMMARY.apiCalls.total,
-      limit: MOCK_USAGE_SUMMARY.apiCalls.limit
-    },
-    advanced_analytics: {
-      allowed: false,
-      reason: "FEATURE_NOT_INCLUDED"
-    },
-    unlimited_projects: {
-      allowed: false,
-      reason: "PLAN_LIMIT",
-      currentUsage: MOCK_SUBSCRIPTION.usage.projects,
-      limit: MOCK_SUBSCRIPTION.limits.projects
-    }
-  };
-  return featureMap[feature] ?? { allowed: true };
-}
-
-// src/project/project.handler.ts
-async function mockListProjectsHandler(input) {
-  const { status, search, limit = 20, offset = 0 } = input;
-  let filtered = [...MOCK_PROJECTS];
-  if (status && status !== "all") {
-    filtered = filtered.filter((p) => p.status === status);
-  }
-  if (search) {
-    const q = search.toLowerCase();
-    filtered = filtered.filter((p) => p.name.toLowerCase().includes(q) || p.description?.toLowerCase().includes(q) || p.tags.some((t) => t.toLowerCase().includes(q)));
-  }
-  filtered.sort((a, b) => b.updatedAt.getTime() - a.updatedAt.getTime());
-  const total = filtered.length;
-  const projects = filtered.slice(offset, offset + limit);
-  return {
-    projects,
-    total
-  };
-}
-async function mockGetProjectHandler(input) {
-  const project = MOCK_PROJECTS.find((p) => p.id === input.projectId);
-  if (!project) {
-    throw new Error("NOT_FOUND");
-  }
-  return project;
-}
-async function mockCreateProjectHandler(input, context) {
-  if (input.slug) {
-    const exists = MOCK_PROJECTS.some((p) => p.slug === input.slug);
-    if (exists) {
-      throw new Error("SLUG_EXISTS");
-    }
-  }
-  const now = new Date;
-  return {
-    id: `proj-${Date.now()}`,
-    name: input.name,
-    description: input.description,
-    slug: input.slug ?? input.name.toLowerCase().replace(/\s+/g, "-"),
-    organizationId: context.organizationId,
-    createdBy: context.userId,
-    status: "DRAFT",
-    isPublic: input.isPublic ?? false,
-    tags: input.tags ?? [],
-    createdAt: now,
-    updatedAt: now
-  };
-}
-async function mockUpdateProjectHandler(input) {
-  const project = MOCK_PROJECTS.find((p) => p.id === input.projectId);
-  if (!project) {
-    throw new Error("NOT_FOUND");
-  }
-  return {
-    ...project,
-    name: input.name ?? project.name,
-    description: input.description ?? project.description,
-    slug: input.slug ?? project.slug,
-    isPublic: input.isPublic ?? project.isPublic,
-    tags: input.tags ?? project.tags,
-    status: input.status ?? project.status,
-    updatedAt: new Date
-  };
-}
-async function mockDeleteProjectHandler(input) {
-  const project = MOCK_PROJECTS.find((p) => p.id === input.projectId);
-  if (!project) {
-    throw new Error("NOT_FOUND");
-  }
-  return { success: true };
-}
-
-// src/handlers/saas.handlers.ts
-import { web } from "@contractspec/lib.runtime-sandbox";
-var { generateId } = web;
-function rowToProject(row) {
-  return {
-    id: row.id,
-    projectId: row.projectId,
-    organizationId: row.organizationId,
-    name: row.name,
-    description: row.description ?? undefined,
-    status: row.status,
-    tier: row.tier,
-    createdAt: new Date(row.createdAt),
-    updatedAt: new Date(row.updatedAt)
-  };
-}
-function rowToSubscription(row) {
-  return {
-    id: row.id,
-    projectId: row.projectId,
-    organizationId: row.organizationId,
-    plan: row.plan,
-    status: row.status,
-    billingCycle: row.billingCycle,
-    currentPeriodStart: new Date(row.currentPeriodStart),
-    currentPeriodEnd: new Date(row.currentPeriodEnd),
-    cancelAtPeriodEnd: Boolean(row.cancelAtPeriodEnd)
-  };
-}
-function createSaasHandlers(db) {
-  async function listProjects(input) {
-    const {
-      projectId,
-      organizationId,
-      status,
-      search,
-      limit = 20,
-      offset = 0
-    } = input;
-    let whereClause = "WHERE projectId = ?";
-    const params = [projectId];
-    if (organizationId) {
-      whereClause += " AND organizationId = ?";
-      params.push(organizationId);
-    }
-    if (status && status !== "all") {
-      whereClause += " AND status = ?";
-      params.push(status);
-    }
-    if (search) {
-      whereClause += " AND (name LIKE ? OR description LIKE ?)";
-      params.push(`%${search}%`, `%${search}%`);
-    }
-    const countResult = (await db.query(`SELECT COUNT(*) as count FROM saas_project ${whereClause}`, params)).rows;
-    const total = countResult[0]?.count ?? 0;
-    const rows = (await db.query(`SELECT * FROM saas_project ${whereClause} ORDER BY createdAt DESC LIMIT ? OFFSET ?`, [...params, limit, offset])).rows;
-    return {
-      items: rows.map(rowToProject),
-      total,
-      hasMore: offset + rows.length < total
-    };
-  }
-  async function getProject(id) {
-    const rows = (await db.query(`SELECT * FROM saas_project WHERE id = ?`, [id])).rows;
-    return rows[0] ? rowToProject(rows[0]) : null;
-  }
-  async function createProject(input, context) {
-    const id = generateId("proj");
-    const now = new Date().toISOString();
-    await db.execute(`INSERT INTO saas_project (id, projectId, organizationId, name, description, status, tier, createdAt, updatedAt)
-       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`, [
-      id,
-      context.projectId,
-      context.organizationId,
-      input.name,
-      input.description ?? null,
-      "DRAFT",
-      input.tier ?? "FREE",
-      now,
-      now
-    ]);
-    const rows = (await db.query(`SELECT * FROM saas_project WHERE id = ?`, [id])).rows;
-    return rowToProject(rows[0]);
-  }
-  async function updateProject(input) {
-    const now = new Date().toISOString();
-    const updates = ["updatedAt = ?"];
-    const params = [now];
-    if (input.name !== undefined) {
-      updates.push("name = ?");
-      params.push(input.name);
-    }
-    if (input.description !== undefined) {
-      updates.push("description = ?");
-      params.push(input.description);
-    }
-    if (input.status !== undefined) {
-      updates.push("status = ?");
-      params.push(input.status);
-    }
-    params.push(input.id);
-    await db.execute(`UPDATE saas_project SET ${updates.join(", ")} WHERE id = ?`, params);
-    const rows = (await db.query(`SELECT * FROM saas_project WHERE id = ?`, [input.id])).rows;
-    if (!rows[0]) {
-      throw new Error("NOT_FOUND");
-    }
-    return rowToProject(rows[0]);
-  }
-  async function deleteProject(id) {
-    await db.execute(`DELETE FROM saas_project WHERE id = ?`, [id]);
-  }
-  async function getSubscription(input) {
-    let query = `SELECT * FROM saas_subscription WHERE projectId = ?`;
-    const params = [input.projectId];
-    if (input.organizationId) {
-      query += " AND organizationId = ?";
-      params.push(input.organizationId);
-    }
-    query += " LIMIT 1";
-    const rows = (await db.query(query, params)).rows;
-    return rows[0] ? rowToSubscription(rows[0]) : null;
-  }
-  return {
-    listProjects,
-    getProject,
-    createProject,
-    updateProject,
-    deleteProject,
-    getSubscription
-  };
-}
-// src/visualizations/catalog.ts
-import {
-  defineVisualization,
-  VisualizationRegistry
-} from "@contractspec/lib.contracts-spec/visualizations";
-var PROJECT_LIST_REF = {
-  key: "saas.project.list",
-  version: "1.0.0"
-};
-var META = {
-  version: "1.0.0",
-  domain: "saas",
-  stability: "experimental",
-  owners: ["@example.saas-boilerplate"],
-  tags: ["saas", "visualization", "projects"]
-};
-var SaasProjectUsageVisualization = defineVisualization({
-  meta: {
-    ...META,
-    key: "saas-boilerplate.visualization.project-usage",
-    title: "Project Capacity",
-    description: "Current project count against the current plan limit.",
-    goal: "Show usage against the active plan allowance.",
-    context: "SaaS account overview."
-  },
-  source: { primary: PROJECT_LIST_REF, resultPath: "data" },
-  visualization: {
-    kind: "metric",
-    measure: "totalProjects",
-    comparisonMeasure: "projectLimit",
-    measures: [
-      {
-        key: "totalProjects",
-        label: "Projects",
-        dataPath: "totalProjects",
-        format: "number"
-      },
-      {
-        key: "projectLimit",
-        label: "Plan Limit",
-        dataPath: "projectLimit",
-        format: "number"
-      }
-    ],
-    table: { caption: "Current project count and plan limit." }
-  }
-});
-var SaasProjectStatusVisualization = defineVisualization({
-  meta: {
-    ...META,
-    key: "saas-boilerplate.visualization.project-status",
-    title: "Project Status",
-    description: "Distribution of project states.",
-    goal: "Show the mix of active, draft, and archived projects.",
-    context: "Project portfolio overview."
-  },
-  source: { primary: PROJECT_LIST_REF, resultPath: "data" },
-  visualization: {
-    kind: "pie",
-    nameDimension: "status",
-    valueMeasure: "projects",
-    dimensions: [
-      { key: "status", label: "Status", dataPath: "status", type: "category" }
-    ],
-    measures: [
-      {
-        key: "projects",
-        label: "Projects",
-        dataPath: "projects",
-        format: "number"
-      }
-    ],
-    table: { caption: "Project counts by status." }
-  }
-});
-var SaasProjectTierVisualization = defineVisualization({
-  meta: {
-    ...META,
-    key: "saas-boilerplate.visualization.project-tiers",
-    title: "Tier Comparison",
-    description: "Distribution of projects across tiers.",
-    goal: "Compare how the current portfolio is distributed by tier.",
-    context: "Plan and packaging overview."
-  },
-  source: { primary: PROJECT_LIST_REF, resultPath: "data" },
-  visualization: {
-    kind: "cartesian",
-    variant: "bar",
-    xDimension: "tier",
-    yMeasures: ["projects"],
-    dimensions: [
-      { key: "tier", label: "Tier", dataPath: "tier", type: "category" }
-    ],
-    measures: [
-      {
-        key: "projects",
-        label: "Projects",
-        dataPath: "projects",
-        format: "number",
-        color: "#1d4ed8"
-      }
-    ],
-    table: { caption: "Project counts by tier." }
-  }
-});
-var SaasProjectActivityVisualization = defineVisualization({
-  meta: {
-    ...META,
-    key: "saas-boilerplate.visualization.project-activity",
-    title: "Recent Project Activity",
-    description: "Daily project creation activity.",
-    goal: "Show recent project activity over time.",
-    context: "Project portfolio trend view."
-  },
-  source: { primary: PROJECT_LIST_REF, resultPath: "data" },
-  visualization: {
-    kind: "cartesian",
-    variant: "line",
-    xDimension: "day",
-    yMeasures: ["projects"],
-    dimensions: [{ key: "day", label: "Day", dataPath: "day", type: "time" }],
-    measures: [
-      {
-        key: "projects",
-        label: "Projects",
-        dataPath: "projects",
-        format: "number",
-        color: "#0f766e"
-      }
-    ],
-    table: { caption: "Daily project creation counts." }
-  }
-});
-var SaasVisualizationSpecs = [
-  SaasProjectUsageVisualization,
-  SaasProjectStatusVisualization,
-  SaasProjectTierVisualization,
-  SaasProjectActivityVisualization
-];
-var SaasVisualizationRegistry = new VisualizationRegistry([
-  ...SaasVisualizationSpecs
-]);
-var SaasVisualizationRefs = SaasVisualizationSpecs.map((spec) => ({
-  key: spec.meta.key,
-  version: spec.meta.version
-}));
-
-// src/visualizations/selectors.ts
-function toDayKey(value) {
-  const date = value instanceof Date ? value : new Date(value);
-  return date.toISOString().slice(0, 10);
-}
-function createSaasVisualizationItems(projects, projectLimit = 10) {
-  const statusCounts = new Map;
-  const tierCounts = new Map;
-  const activityCounts = new Map;
-  for (const project of projects) {
-    statusCounts.set(project.status, (statusCounts.get(project.status) ?? 0) + 1);
-    tierCounts.set(project.tier, (tierCounts.get(project.tier) ?? 0) + 1);
-    const day = toDayKey(project.createdAt);
-    activityCounts.set(day, (activityCounts.get(day) ?? 0) + 1);
-  }
-  return [
-    {
-      key: "saas-capacity",
-      spec: SaasProjectUsageVisualization,
-      data: { data: [{ totalProjects: projects.length, projectLimit }] },
-      title: "Project Capacity",
-      description: "Current project count compared to the active limit.",
-      height: 220
-    },
-    {
-      key: "saas-status",
-      spec: SaasProjectStatusVisualization,
-      data: {
-        data: Array.from(statusCounts.entries()).map(([status, count]) => ({
-          status,
-          projects: count
-        }))
-      },
-      title: "Project Status",
-      description: "Status mix across the current project portfolio.",
-      height: 260
-    },
-    {
-      key: "saas-tier",
-      spec: SaasProjectTierVisualization,
-      data: {
-        data: Array.from(tierCounts.entries()).map(([tier, count]) => ({
-          tier,
-          projects: count
-        }))
-      },
-      title: "Tier Comparison",
-      description: "How projects are distributed across tiers."
-    },
-    {
-      key: "saas-activity",
-      spec: SaasProjectActivityVisualization,
-      data: {
-        data: Array.from(activityCounts.entries()).sort(([left], [right]) => left.localeCompare(right)).map(([day, count]) => ({ day, projects: count }))
-      },
-      title: "Recent Project Activity",
-      description: "Daily project creation activity."
-    }
-  ];
-}
-// src/ui/hooks/useProjectList.ts
-import { useTemplateRuntime } from "@contractspec/lib.example-shared-ui";
-import { useCallback, useEffect, useMemo, useState } from "react";
-function useProjectList(options = {}) {
-  const { handlers, projectId } = useTemplateRuntime();
-  const { saas: saas2 } = handlers;
-  const [data, setData] = useState(null);
-  const [subscription, setSubscription] = useState(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState(null);
-  const [page, setPage] = useState(1);
-  const fetchData = useCallback(async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      const [projectsResult, subscriptionResult] = await Promise.all([
-        saas2.listProjects({
-          projectId,
-          status: options.status === "all" ? undefined : options.status,
-          search: options.search,
-          limit: options.limit ?? 20,
-          offset: (page - 1) * (options.limit ?? 20)
-        }),
-        saas2.getSubscription({ projectId })
-      ]);
-      setData({
-        items: projectsResult.items,
-        total: projectsResult.total
-      });
-      setSubscription(subscriptionResult);
-    } catch (err) {
-      setError(err instanceof Error ? err : new Error("Unknown error"));
-    } finally {
-      setLoading(false);
-    }
-  }, [saas2, projectId, options.status, options.search, options.limit, page]);
-  useEffect(() => {
-    fetchData();
-  }, [fetchData]);
-  const stats = useMemo(() => {
-    if (!data)
-      return null;
-    const items = data.items;
-    return {
-      total: data.total,
-      activeCount: items.filter((p) => p.status === "ACTIVE").length,
-      draftCount: items.filter((p) => p.status === "DRAFT").length,
-      projectLimit: 10,
-      usagePercent: Math.min(data.total / 10 * 100, 100)
-    };
-  }, [data]);
-  return {
-    data,
-    subscription,
-    loading,
-    error,
-    stats,
-    page,
-    refetch: fetchData,
-    nextPage: () => setPage((p) => p + 1),
-    prevPage: () => page > 1 && setPage((p) => p - 1)
-  };
-}
-
-// src/ui/renderers/project-list.markdown.ts
-var PROJECT_TIERS = [
-  "FREE",
-  "PRO",
-  "ENTERPRISE"
-];
-function toVisualizationProject(project, index) {
-  return {
-    status: project.status === "DELETED" ? "ARCHIVED" : project.status,
-    tier: PROJECT_TIERS[index % PROJECT_TIERS.length] ?? "FREE",
-    createdAt: project.createdAt
-  };
-}
-var projectListMarkdownRenderer = {
-  target: "markdown",
-  render: async (desc, _ctx) => {
-    if (desc.source.type !== "component" || desc.source.componentKey !== "ProjectListView") {
-      throw new Error("projectListMarkdownRenderer: not ProjectListView");
-    }
-    const data = await mockListProjectsHandler({
-      limit: 20,
-      offset: 0
-    });
-    const items = data.projects ?? [];
-    const lines = [
-      "# Projects",
-      "",
-      `**Total**: ${data.total} projects`,
-      ""
-    ];
-    if (items.length === 0) {
-      lines.push("_No projects found._");
-    } else {
-      lines.push("| Status | Project | Description |");
-      lines.push("|--------|---------|-------------|");
-      for (const project of items) {
-        const status = project.status === "ACTIVE" ? "\u2705" : project.status === "ARCHIVED" ? "\uD83D\uDCE6" : "\u23F8\uFE0F";
-        lines.push(`| ${status} | **${project.name}** | ${project.description ?? "-"} |`);
-      }
-    }
-    return {
-      mimeType: "text/markdown",
-      body: lines.join(`
-`)
-    };
-  }
-};
-var saasDashboardMarkdownRenderer = {
-  target: "markdown",
-  render: async (desc, _ctx) => {
-    if (desc.source.type !== "component" || desc.source.componentKey !== "SaasDashboard") {
-      throw new Error("saasDashboardMarkdownRenderer: not SaasDashboard");
-    }
-    const [projectsData, subscription] = await Promise.all([
-      mockListProjectsHandler({ limit: 50 }),
-      mockGetSubscriptionHandler()
-    ]);
-    const projects = projectsData.projects ?? [];
-    const activeProjects = projects.filter((p) => p.status === "ACTIVE").length;
-    const archivedProjects = projects.filter((p) => p.status === "ARCHIVED").length;
-    const visualizations = createSaasVisualizationItems(projects.map(toVisualizationProject), 10);
-    const lines = [
-      "# SaaS Dashboard",
-      "",
-      "> Organization overview and usage summary",
-      "",
-      "## Summary",
-      "",
-      "| Metric | Value |",
-      "|--------|-------|",
-      `| Total Projects | ${projectsData.total} |`,
-      `| Active Projects | ${activeProjects} |`,
-      `| Archived Projects | ${archivedProjects} |`,
-      `| Subscription Plan | ${subscription.planName} |`,
-      `| Subscription Status | ${subscription.status} |`,
-      ""
-    ];
-    lines.push("## Visualization Overview");
-    lines.push("");
-    for (const item of visualizations) {
-      lines.push(`- **${item.title}** via \`${item.spec.meta.key}\``);
-    }
-    lines.push("");
-    lines.push("## Projects");
-    lines.push("");
-    if (projects.length === 0) {
-      lines.push("_No projects yet._");
-    } else {
-      lines.push("| Status | Project | Description |");
-      lines.push("|--------|---------|-------------|");
-      for (const project of projects.slice(0, 10)) {
-        const status = project.status === "ACTIVE" ? "\u2705" : project.status === "ARCHIVED" ? "\uD83D\uDCE6" : "\u23F8\uFE0F";
-        lines.push(`| ${status} | **${project.name}** | ${project.description ?? "-"} |`);
-      }
-      if (projects.length > 10) {
-        lines.push(`| ... | ... | _${projectsData.total - 10} more projects_ |`);
-      }
-    }
-    lines.push("");
-    lines.push("## Subscription");
-    lines.push("");
-    lines.push(`- **Plan**: ${subscription.planName}`);
-    lines.push(`- **Status**: ${subscription.status}`);
-    if (subscription.currentPeriodEnd) {
-      lines.push(`- **Period End**: ${new Date(subscription.currentPeriodEnd).toLocaleDateString()}`);
-    }
-    return {
-      mimeType: "text/markdown",
-      body: lines.join(`
-`)
-    };
-  }
-};
-var saasBillingMarkdownRenderer = {
-  target: "markdown",
-  render: async (desc, _ctx) => {
-    if (desc.source.type !== "component" || desc.source.componentKey !== "SubscriptionView") {
-      throw new Error("saasBillingMarkdownRenderer: not SubscriptionView");
-    }
-    const subscription = await mockGetSubscriptionHandler();
-    const lines = [
-      "# Billing & Subscription",
-      "",
-      "> Current subscription details and billing information",
-      "",
-      "## Subscription Details",
-      "",
-      "| Property | Value |",
-      "|----------|-------|",
-      `| Plan | ${subscription.planName} |`,
-      `| Status | ${subscription.status} |`,
-      `| ID | ${subscription.id} |`,
-      `| Period Start | ${new Date(subscription.currentPeriodStart).toLocaleDateString()} |`,
-      `| Period End | ${new Date(subscription.currentPeriodEnd).toLocaleDateString()} |`
-    ];
-    lines.push("");
-    lines.push("## Plan Limits");
-    lines.push("");
-    lines.push(`- **Projects**: ${subscription.limits.projects}`);
-    lines.push(`- **Users**: ${subscription.limits.users}`);
-    lines.push("");
-    lines.push("## Plan Features");
-    lines.push("");
-    if (subscription.planName.toLowerCase().includes("free")) {
-      lines.push("- \u2705 Up to 3 projects");
-      lines.push("- \u2705 Basic support");
-      lines.push("- \u274C Priority support");
-      lines.push("- \u274C Advanced analytics");
-    } else if (subscription.planName.toLowerCase().includes("pro")) {
-      lines.push("- \u2705 Unlimited projects");
-      lines.push("- \u2705 Priority support");
-      lines.push("- \u2705 Advanced analytics");
-      lines.push("- \u274C Custom integrations");
-    } else {
-      lines.push("- \u2705 Unlimited projects");
-      lines.push("- \u2705 Priority support");
-      lines.push("- \u2705 Advanced analytics");
-      lines.push("- \u2705 Custom integrations");
-      lines.push("- \u2705 Dedicated support");
-    }
-    return {
-      mimeType: "text/markdown",
-      body: lines.join(`
-`)
-    };
-  }
-};
-
-// src/ui/SaasProjectList.tsx
-import {
-  Button,
-  EmptyState,
-  EntityCard,
-  ErrorState,
-  LoaderBlock,
-  StatCard,
-  StatCardGroup,
-  StatusChip
-} from "@contractspec/lib.design-system";
-import { jsxDEV } from "react/jsx-dev-runtime";
-"use client";
-function getStatusTone(status) {
-  switch (status) {
-    case "ACTIVE":
-      return "success";
-    case "DRAFT":
-      return "neutral";
-    case "ARCHIVED":
-      return "danger";
-    default:
-      return "neutral";
-  }
-}
-function SaasProjectList({
-  onProjectClick,
-  onCreateProject
-}) {
-  const { data, loading, error, stats, refetch } = useProjectList();
-  if (loading && !data) {
-    return /* @__PURE__ */ jsxDEV(LoaderBlock, {
-      label: "Loading projects..."
-    }, undefined, false, undefined, this);
-  }
-  if (error) {
-    return /* @__PURE__ */ jsxDEV(ErrorState, {
-      title: "Failed to load projects",
-      description: error.message,
-      onRetry: refetch,
-      retryLabel: "Retry"
-    }, undefined, false, undefined, this);
-  }
-  if (!data?.items.length) {
-    return /* @__PURE__ */ jsxDEV(EmptyState, {
-      title: "No projects found",
-      description: "Create your first project to get started.",
-      primaryAction: onCreateProject ? /* @__PURE__ */ jsxDEV(Button, {
-        onPress: onCreateProject,
-        children: "Create Project"
-      }, undefined, false, undefined, this) : undefined
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "space-y-6",
-    children: [
-      stats && /* @__PURE__ */ jsxDEV(StatCardGroup, {
-        children: [
-          /* @__PURE__ */ jsxDEV(StatCard, {
-            label: "Total Projects",
-            value: stats.total.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV(StatCard, {
-            label: "Active",
-            value: stats.activeCount.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV(StatCard, {
-            label: "Draft",
-            value: stats.draftCount.toString()
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
-        children: data.items.map((project) => /* @__PURE__ */ jsxDEV(EntityCard, {
-          cardTitle: project.name,
-          cardSubtitle: project.tier,
-          meta: /* @__PURE__ */ jsxDEV("p", {
-            className: "text-muted-foreground text-sm",
-            children: project.description
-          }, undefined, false, undefined, this),
-          chips: /* @__PURE__ */ jsxDEV(StatusChip, {
-            tone: getStatusTone(project.status),
-            label: project.status
-          }, undefined, false, undefined, this),
-          footer: /* @__PURE__ */ jsxDEV("span", {
-            className: "text-muted-foreground text-xs",
-            children: project.updatedAt.toLocaleDateString()
-          }, undefined, false, undefined, this),
-          onClick: onProjectClick ? () => onProjectClick(project.id) : undefined
-        }, project.id, false, undefined, this))
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/ui/renderers/project-list.renderer.tsx
-import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
-var projectListReactRenderer = {
-  target: "react",
-  render: async (desc, _ctx) => {
-    if (desc.source.type !== "component") {
-      throw new Error("Invalid source type");
-    }
-    if (desc.source.componentKey !== "SaasProjectListView") {
-      throw new Error(`Unknown component: ${desc.source.componentKey}`);
-    }
-    return /* @__PURE__ */ jsxDEV2(SaasProjectList, {}, undefined, false, undefined, this);
-  }
-};
-export {
-  saasDashboardMarkdownRenderer,
-  saasBillingMarkdownRenderer,
-  projectListReactRenderer,
-  projectListMarkdownRenderer
-};
+var K=[{id:"proj-1",name:"Marketing Website",description:"Main company website redesign project",slug:"marketing-website",organizationId:"demo-org",createdBy:"user-1",status:"ACTIVE",isPublic:!1,tags:["marketing","website","redesign"],createdAt:new Date("2024-01-15T10:00:00Z"),updatedAt:new Date("2024-03-20T14:30:00Z")},{id:"proj-2",name:"Mobile App v2",description:"Next generation mobile application",slug:"mobile-app-v2",organizationId:"demo-org",createdBy:"user-2",status:"ACTIVE",isPublic:!1,tags:["mobile","app","v2"],createdAt:new Date("2024-02-01T09:00:00Z"),updatedAt:new Date("2024-04-05T11:15:00Z")},{id:"proj-3",name:"API Integration",description:"Third-party API integration project",slug:"api-integration",organizationId:"demo-org",createdBy:"user-1",status:"DRAFT",isPublic:!1,tags:["api","integration"],createdAt:new Date("2024-03-10T08:00:00Z"),updatedAt:new Date("2024-03-10T08:00:00Z")},{id:"proj-4",name:"Analytics Dashboard",description:"Internal analytics and reporting dashboard",slug:"analytics-dashboard",organizationId:"demo-org",createdBy:"user-3",status:"ARCHIVED",isPublic:!0,tags:["analytics","dashboard","reporting"],createdAt:new Date("2023-10-01T12:00:00Z"),updatedAt:new Date("2024-02-28T16:45:00Z")}],v={id:"sub-1",organizationId:"demo-org",planId:"pro",planName:"Professional",status:"ACTIVE",currentPeriodStart:new Date("2024-04-01T00:00:00Z"),currentPeriodEnd:new Date("2024-05-01T00:00:00Z"),limits:{projects:25,users:10,storage:50,apiCalls:1e5},usage:{projects:4,users:5,storage:12.5,apiCalls:45230}},U={organizationId:"demo-org",period:"current_month",apiCalls:{total:45230,limit:1e5,percentUsed:45.23},storage:{totalGb:12.5,limitGb:50,percentUsed:25},activeProjects:4,activeUsers:5,breakdown:[{date:"2024-04-01",apiCalls:3200,storageGb:12.1},{date:"2024-04-02",apiCalls:2800,storageGb:12.2},{date:"2024-04-03",apiCalls:4100,storageGb:12.3},{date:"2024-04-04",apiCalls:3600,storageGb:12.4},{date:"2024-04-05",apiCalls:3800,storageGb:12.5}]};async function R(){return v}async function l(H){return{...U,period:H.period??"current_month"}}async function j(H){return{recorded:!0,newTotal:U.apiCalls.total+H.quantity}}async function c(H){let{feature:X}=H;return{custom_domains:{allowed:!0},api_access:{allowed:!0,currentUsage:U.apiCalls.total,limit:U.apiCalls.limit},advanced_analytics:{allowed:!1,reason:"FEATURE_NOT_INCLUDED"},unlimited_projects:{allowed:!1,reason:"PLAN_LIMIT",currentUsage:v.usage.projects,limit:v.limits.projects}}[X]??{allowed:!0}}async function V(H){let{status:X,search:Q,limit:$=20,offset:N=0}=H,Z=[...K];if(X&&X!=="all")Z=Z.filter((W)=>W.status===X);if(Q){let W=Q.toLowerCase();Z=Z.filter((k)=>k.name.toLowerCase().includes(W)||k.description?.toLowerCase().includes(W)||k.tags.some((G)=>G.toLowerCase().includes(W)))}Z.sort((W,k)=>k.updatedAt.getTime()-W.updatedAt.getTime());let F=Z.length;return{projects:Z.slice(N,N+$),total:F}}async function u(H){let X=K.find((Q)=>Q.id===H.projectId);if(!X)throw Error("NOT_FOUND");return X}async function r(H,X){if(H.slug){if(K.some((N)=>N.slug===H.slug))throw Error("SLUG_EXISTS")}let Q=new Date;return{id:`proj-${Date.now()}`,name:H.name,description:H.description,slug:H.slug??H.name.toLowerCase().replace(/\s+/g,"-"),organizationId:X.organizationId,createdBy:X.userId,status:"DRAFT",isPublic:H.isPublic??!1,tags:H.tags??[],createdAt:Q,updatedAt:Q}}async function n(H){let X=K.find((Q)=>Q.id===H.projectId);if(!X)throw Error("NOT_FOUND");return{...X,name:H.name??X.name,description:H.description??X.description,slug:H.slug??X.slug,isPublic:H.isPublic??X.isPublic,tags:H.tags??X.tags,status:H.status??X.status,updatedAt:new Date}}async function a(H){if(!K.find((Q)=>Q.id===H.projectId))throw Error("NOT_FOUND");return{success:!0}}import{web as p}from"@contractspec/lib.runtime-sandbox";var{generateId:o}=p;function g(H){return{id:H.id,projectId:H.projectId,organizationId:H.organizationId,name:H.name,description:H.description??void 0,status:H.status,tier:H.tier,createdAt:new Date(H.createdAt),updatedAt:new Date(H.updatedAt)}}function e(H){return{id:H.id,projectId:H.projectId,organizationId:H.organizationId,plan:H.plan,status:H.status,billingCycle:H.billingCycle,currentPeriodStart:new Date(H.currentPeriodStart),currentPeriodEnd:new Date(H.currentPeriodEnd),cancelAtPeriodEnd:Boolean(H.cancelAtPeriodEnd)}}function RH(H){async function X(B){let{projectId:W,organizationId:k,status:G,search:m,limit:y=20,offset:A=0}=B,L="WHERE projectId = ?",J=[W];if(k)L+=" AND organizationId = ?",J.push(k);if(G&&G!=="all")L+=" AND status = ?",J.push(G);if(m)L+=" AND (name LIKE ? OR description LIKE ?)",J.push(`%${m}%`,`%${m}%`);let D=(await H.query(`SELECT COUNT(*) as count FROM saas_project ${L}`,J)).rows[0]?.count??0,T=(await H.query(`SELECT * FROM saas_project ${L} ORDER BY createdAt DESC LIMIT ? OFFSET ?`,[...J,y,A])).rows;return{items:T.map(g),total:D,hasMore:A+T.length<D}}async function Q(B){let W=(await H.query("SELECT * FROM saas_project WHERE id = ?",[B])).rows;return W[0]?g(W[0]):null}async function $(B,W){let k=o("proj"),G=new Date().toISOString();await H.execute(`INSERT INTO saas_project (id, projectId, organizationId, name, description, status, tier, createdAt, updatedAt)
+       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,[k,W.projectId,W.organizationId,B.name,B.description??null,"DRAFT",B.tier??"FREE",G,G]);let m=(await H.query("SELECT * FROM saas_project WHERE id = ?",[k])).rows;return g(m[0])}async function N(B){let W=new Date().toISOString(),k=["updatedAt = ?"],G=[W];if(B.name!==void 0)k.push("name = ?"),G.push(B.name);if(B.description!==void 0)k.push("description = ?"),G.push(B.description);if(B.status!==void 0)k.push("status = ?"),G.push(B.status);G.push(B.id),await H.execute(`UPDATE saas_project SET ${k.join(", ")} WHERE id = ?`,G);let m=(await H.query("SELECT * FROM saas_project WHERE id = ?",[B.id])).rows;if(!m[0])throw Error("NOT_FOUND");return g(m[0])}async function Z(B){await H.execute("DELETE FROM saas_project WHERE id = ?",[B])}async function F(B){let W="SELECT * FROM saas_subscription WHERE projectId = ?",k=[B.projectId];if(B.organizationId)W+=" AND organizationId = ?",k.push(B.organizationId);W+=" LIMIT 1";let G=(await H.query(W,k)).rows;return G[0]?e(G[0]):null}return{listProjects:X,getProject:Q,createProject:$,updateProject:N,deleteProject:Z,getSubscription:F}}import{defineVisualization as x,VisualizationRegistry as i}from"@contractspec/lib.contracts-spec/visualizations";var I={key:"saas.project.list",version:"1.0.0"},z={version:"1.0.0",domain:"saas",stability:"experimental",owners:["@example.saas-boilerplate"],tags:["saas","visualization","projects"]},h=x({meta:{...z,key:"saas-boilerplate.visualization.project-usage",title:"Project Capacity",description:"Current project count against the current plan limit.",goal:"Show usage against the active plan allowance.",context:"SaaS account overview."},source:{primary:I,resultPath:"data"},visualization:{kind:"metric",measure:"totalProjects",comparisonMeasure:"projectLimit",measures:[{key:"totalProjects",label:"Projects",dataPath:"totalProjects",format:"number"},{key:"projectLimit",label:"Plan Limit",dataPath:"projectLimit",format:"number"}],table:{caption:"Current project count and plan limit."}}}),_=x({meta:{...z,key:"saas-boilerplate.visualization.project-status",title:"Project Status",description:"Distribution of project states.",goal:"Show the mix of active, draft, and archived projects.",context:"Project portfolio overview."},source:{primary:I,resultPath:"data"},visualization:{kind:"pie",nameDimension:"status",valueMeasure:"projects",dimensions:[{key:"status",label:"Status",dataPath:"status",type:"category"}],measures:[{key:"projects",label:"Projects",dataPath:"projects",format:"number"}],table:{caption:"Project counts by status."}}}),M=x({meta:{...z,key:"saas-boilerplate.visualization.project-tiers",title:"Tier Comparison",description:"Distribution of projects across tiers.",goal:"Compare how the current portfolio is distributed by tier.",context:"Plan and packaging overview."},source:{primary:I,resultPath:"data"},visualization:{kind:"cartesian",variant:"bar",xDimension:"tier",yMeasures:["projects"],dimensions:[{key:"tier",label:"Tier",dataPath:"tier",type:"category"}],measures:[{key:"projects",label:"Projects",dataPath:"projects",format:"number",color:"#1d4ed8"}],table:{caption:"Project counts by tier."}}}),E=x({meta:{...z,key:"saas-boilerplate.visualization.project-activity",title:"Recent Project Activity",description:"Daily project creation activity.",goal:"Show recent project activity over time.",context:"Project portfolio trend view."},source:{primary:I,resultPath:"data"},visualization:{kind:"cartesian",variant:"line",xDimension:"day",yMeasures:["projects"],dimensions:[{key:"day",label:"Day",dataPath:"day",type:"time"}],measures:[{key:"projects",label:"Projects",dataPath:"projects",format:"number",color:"#0f766e"}],table:{caption:"Daily project creation counts."}}}),P=[h,_,M,E],_H=new i([...P]),MH=P.map((H)=>({key:H.meta.key,version:H.meta.version}));function s(H){return(H instanceof Date?H:new Date(H)).toISOString().slice(0,10)}function b(H,X=10){let Q=new Map,$=new Map,N=new Map;for(let Z of H){Q.set(Z.status,(Q.get(Z.status)??0)+1),$.set(Z.tier,($.get(Z.tier)??0)+1);let F=s(Z.createdAt);N.set(F,(N.get(F)??0)+1)}return[{key:"saas-capacity",spec:h,data:{data:[{totalProjects:H.length,projectLimit:X}]},title:"Project Capacity",description:"Current project count compared to the active limit.",height:220},{key:"saas-status",spec:_,data:{data:Array.from(Q.entries()).map(([Z,F])=>({status:Z,projects:F}))},title:"Project Status",description:"Status mix across the current project portfolio.",height:260},{key:"saas-tier",spec:M,data:{data:Array.from($.entries()).map(([Z,F])=>({tier:Z,projects:F}))},title:"Tier Comparison",description:"How projects are distributed across tiers."},{key:"saas-activity",spec:E,data:{data:Array.from(N.entries()).sort(([Z],[F])=>Z.localeCompare(F)).map(([Z,F])=>({day:Z,projects:F}))},title:"Recent Project Activity",description:"Daily project creation activity."}]}import{useTemplateRuntime as t}from"@contractspec/lib.example-shared-ui";import{useCallback as HH,useEffect as $H,useMemo as QH,useState as f}from"react";function w(H={}){let{handlers:X,projectId:Q}=t(),{saas:$}=X,[N,Z]=f(null),[F,B]=f(null),[W,k]=f(!0),[G,m]=f(null),[y,A]=f(1),L=HH(async()=>{k(!0),m(null);try{let[Y,D]=await Promise.all([$.listProjects({projectId:Q,status:H.status==="all"?void 0:H.status,search:H.search,limit:H.limit??20,offset:(y-1)*(H.limit??20)}),$.getSubscription({projectId:Q})]);Z({items:Y.items,total:Y.total}),B(D)}catch(Y){m(Y instanceof Error?Y:Error("Unknown error"))}finally{k(!1)}},[$,Q,H.status,H.search,H.limit,y]);$H(()=>{L()},[L]);let J=QH(()=>{if(!N)return null;let Y=N.items;return{total:N.total,activeCount:Y.filter((D)=>D.status==="ACTIVE").length,draftCount:Y.filter((D)=>D.status==="DRAFT").length,projectLimit:10,usagePercent:Math.min(N.total/10*100,100)}},[N]);return{data:N,subscription:F,loading:W,error:G,stats:J,page:y,refetch:L,nextPage:()=>A((Y)=>Y+1),prevPage:()=>y>1&&A((Y)=>Y-1)}}var S=["FREE","PRO","ENTERPRISE"];function WH(H,X){return{status:H.status==="DELETED"?"ARCHIVED":H.status,tier:S[X%S.length]??"FREE",createdAt:H.createdAt}}var XH={target:"markdown",render:async(H,X)=>{if(H.source.type!=="component"||H.source.componentKey!=="ProjectListView")throw Error("projectListMarkdownRenderer: not ProjectListView");let Q=await V({limit:20,offset:0}),$=Q.projects??[],N=["# Projects","",`**Total**: ${Q.total} projects`,""];if($.length===0)N.push("_No projects found._");else{N.push("| Status | Project | Description |"),N.push("|--------|---------|-------------|");for(let Z of $){let F=Z.status==="ACTIVE"?"\u2705":Z.status==="ARCHIVED"?"\uD83D\uDCE6":"\u23F8\uFE0F";N.push(`| ${F} | **${Z.name}** | ${Z.description??"-"} |`)}}return{mimeType:"text/markdown",body:N.join(`
+`)}}},ZH={target:"markdown",render:async(H,X)=>{if(H.source.type!=="component"||H.source.componentKey!=="SaasDashboard")throw Error("saasDashboardMarkdownRenderer: not SaasDashboard");let[Q,$]=await Promise.all([V({limit:50}),R()]),N=Q.projects??[],Z=N.filter((k)=>k.status==="ACTIVE").length,F=N.filter((k)=>k.status==="ARCHIVED").length,B=b(N.map(WH),10),W=["# SaaS Dashboard","","> Organization overview and usage summary","","## Summary","","| Metric | Value |","|--------|-------|",`| Total Projects | ${Q.total} |`,`| Active Projects | ${Z} |`,`| Archived Projects | ${F} |`,`| Subscription Plan | ${$.planName} |`,`| Subscription Status | ${$.status} |`,""];W.push("## Visualization Overview"),W.push("");for(let k of B)W.push(`- **${k.title}** via \`${k.spec.meta.key}\``);if(W.push(""),W.push("## Projects"),W.push(""),N.length===0)W.push("_No projects yet._");else{W.push("| Status | Project | Description |"),W.push("|--------|---------|-------------|");for(let k of N.slice(0,10)){let G=k.status==="ACTIVE"?"\u2705":k.status==="ARCHIVED"?"\uD83D\uDCE6":"\u23F8\uFE0F";W.push(`| ${G} | **${k.name}** | ${k.description??"-"} |`)}if(N.length>10)W.push(`| ... | ... | _${Q.total-10} more projects_ |`)}if(W.push(""),W.push("## Subscription"),W.push(""),W.push(`- **Plan**: ${$.planName}`),W.push(`- **Status**: ${$.status}`),$.currentPeriodEnd)W.push(`- **Period End**: ${new Date($.currentPeriodEnd).toLocaleDateString()}`);return{mimeType:"text/markdown",body:W.join(`
+`)}}},BH={target:"markdown",render:async(H,X)=>{if(H.source.type!=="component"||H.source.componentKey!=="SubscriptionView")throw Error("saasBillingMarkdownRenderer: not SubscriptionView");let Q=await R(),$=["# Billing & Subscription","","> Current subscription details and billing information","","## Subscription Details","","| Property | Value |","|----------|-------|",`| Plan | ${Q.planName} |`,`| Status | ${Q.status} |`,`| ID | ${Q.id} |`,`| Period Start | ${new Date(Q.currentPeriodStart).toLocaleDateString()} |`,`| Period End | ${new Date(Q.currentPeriodEnd).toLocaleDateString()} |`];if($.push(""),$.push("## Plan Limits"),$.push(""),$.push(`- **Projects**: ${Q.limits.projects}`),$.push(`- **Users**: ${Q.limits.users}`),$.push(""),$.push("## Plan Features"),$.push(""),Q.planName.toLowerCase().includes("free"))$.push("- \u2705 Up to 3 projects"),$.push("- \u2705 Basic support"),$.push("- \u274C Priority support"),$.push("- \u274C Advanced analytics");else if(Q.planName.toLowerCase().includes("pro"))$.push("- \u2705 Unlimited projects"),$.push("- \u2705 Priority support"),$.push("- \u2705 Advanced analytics"),$.push("- \u274C Custom integrations");else $.push("- \u2705 Unlimited projects"),$.push("- \u2705 Priority support"),$.push("- \u2705 Advanced analytics"),$.push("- \u2705 Custom integrations"),$.push("- \u2705 Dedicated support");return{mimeType:"text/markdown",body:$.join(`
+`)}}};import{Button as kH,EmptyState as NH,EntityCard as FH,ErrorState as GH,LoaderBlock as YH,StatCard as O,StatCardGroup as qH,StatusChip as mH}from"@contractspec/lib.design-system";import{jsx as q,jsxs as C}from"react/jsx-runtime";function LH(H){switch(H){case"ACTIVE":return"success";case"DRAFT":return"neutral";case"ARCHIVED":return"danger";default:return"neutral"}}function d({onProjectClick:H,onCreateProject:X}){let{data:Q,loading:$,error:N,stats:Z,refetch:F}=w();if($&&!Q)return q(YH,{label:"Loading projects..."});if(N)return q(GH,{title:"Failed to load projects",description:N.message,onRetry:F,retryLabel:"Retry"});if(!Q?.items.length)return q(NH,{title:"No projects found",description:"Create your first project to get started.",primaryAction:X?q(kH,{onPress:X,children:"Create Project"}):void 0});return C("div",{className:"space-y-6",children:[Z&&C(qH,{children:[q(O,{label:"Total Projects",value:Z.total.toString()}),q(O,{label:"Active",value:Z.activeCount.toString()}),q(O,{label:"Draft",value:Z.draftCount.toString()})]}),q("div",{className:"grid gap-4 md:grid-cols-2 lg:grid-cols-3",children:Q.items.map((B)=>q(FH,{cardTitle:B.name,cardSubtitle:B.tier,meta:q("p",{className:"text-muted-foreground text-sm",children:B.description}),chips:q(mH,{tone:LH(B.status),label:B.status}),footer:q("span",{className:"text-muted-foreground text-xs",children:B.updatedAt.toLocaleDateString()}),onClick:H?()=>H(B.id):void 0},B.id))})]})}import{jsx as UH}from"react/jsx-runtime";var DH={target:"react",render:async(H,X)=>{if(H.source.type!=="component")throw Error("Invalid source type");if(H.source.componentKey!=="SaasProjectListView")throw Error(`Unknown component: ${H.source.componentKey}`);return UH(d,{})}};export{ZH as saasDashboardMarkdownRenderer,BH as saasBillingMarkdownRenderer,DH as projectListReactRenderer,XH as projectListMarkdownRenderer};