@contractspec/example.saas-boilerplate 3.8.9 → 3.8.11

package/dist/ui/index.js

@@ -1,2078 +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/hooks/useProjectMutations.ts
-import { useTemplateRuntime as useTemplateRuntime2 } from "@contractspec/lib.example-shared-ui";
-import { useCallback as useCallback2, useState as useState2 } from "react";
-function useProjectMutations(options = {}) {
-  const { handlers, projectId } = useTemplateRuntime2();
-  const { saas: saas2 } = handlers;
-  const [createState, setCreateState] = useState2({
-    loading: false,
-    error: null,
-    data: null
-  });
-  const [updateState, setUpdateState] = useState2({
-    loading: false,
-    error: null,
-    data: null
-  });
-  const [deleteState, setDeleteState] = useState2({
-    loading: false,
-    error: null,
-    data: null
-  });
-  const createProject = useCallback2(async (input) => {
-    setCreateState({ loading: true, error: null, data: null });
-    try {
-      const result = await saas2.createProject(input, {
-        projectId,
-        organizationId: "demo-org"
-      });
-      setCreateState({ loading: false, error: null, data: result });
-      options.onSuccess?.();
-      return result;
-    } catch (err) {
-      const error = err instanceof Error ? err : new Error("Failed to create project");
-      setCreateState({ loading: false, error, data: null });
-      options.onError?.(error);
-      return null;
-    }
-  }, [saas2, projectId, options]);
-  const updateProject = useCallback2(async (input) => {
-    setUpdateState({ loading: true, error: null, data: null });
-    try {
-      const result = await saas2.updateProject(input);
-      setUpdateState({ loading: false, error: null, data: result });
-      options.onSuccess?.();
-      return result;
-    } catch (err) {
-      const error = err instanceof Error ? err : new Error("Failed to update project");
-      setUpdateState({ loading: false, error, data: null });
-      options.onError?.(error);
-      return null;
-    }
-  }, [saas2, options]);
-  const deleteProject = useCallback2(async (id) => {
-    setDeleteState({ loading: true, error: null, data: null });
-    try {
-      await saas2.deleteProject(id);
-      setDeleteState({
-        loading: false,
-        error: null,
-        data: { success: true }
-      });
-      options.onSuccess?.();
-      return true;
-    } catch (err) {
-      const error = err instanceof Error ? err : new Error("Failed to delete project");
-      setDeleteState({ loading: false, error, data: null });
-      options.onError?.(error);
-      return false;
-    }
-  }, [saas2, options]);
-  const archiveProject = useCallback2(async (id) => {
-    return updateProject({ id, status: "ARCHIVED" });
-  }, [updateProject]);
-  const activateProject = useCallback2(async (id) => {
-    return updateProject({ id, status: "ACTIVE" });
-  }, [updateProject]);
-  return {
-    createProject,
-    updateProject,
-    deleteProject,
-    archiveProject,
-    activateProject,
-    createState,
-    updateState,
-    deleteState,
-    isLoading: createState.loading || updateState.loading || deleteState.loading
-  };
-}
-
-// src/ui/hooks/index.ts
-"use client";
-
-// src/ui/modals/CreateProjectModal.tsx
-import { Button, Input } from "@contractspec/lib.design-system";
-import { useState as useState3 } from "react";
-import { jsxDEV } from "react/jsx-dev-runtime";
-"use client";
-var TIERS = [
-  { value: "FREE", label: "Free" },
-  { value: "PRO", label: "Pro" },
-  { value: "ENTERPRISE", label: "Enterprise" }
-];
-function CreateProjectModal({
-  isOpen,
-  onClose,
-  onSubmit,
-  isLoading = false
-}) {
-  const [name, setName] = useState3("");
-  const [description, setDescription] = useState3("");
-  const [tier, setTier] = useState3("FREE");
-  const [error, setError] = useState3(null);
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-    setError(null);
-    if (!name.trim()) {
-      setError("Project name is required");
-      return;
-    }
-    try {
-      await onSubmit({
-        name: name.trim(),
-        description: description.trim() || undefined,
-        tier
-      });
-      setName("");
-      setDescription("");
-      setTier("FREE");
-      onClose();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to create project");
-    }
-  };
-  if (!isOpen)
-    return null;
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "fixed inset-0 z-50 flex items-center justify-center",
-    children: [
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "absolute inset-0 bg-background/80 backdrop-blur-sm",
-        onClick: onClose,
-        role: "button",
-        tabIndex: 0,
-        onKeyDown: (e) => {
-          if (e.key === "Enter" || e.key === " ")
-            onClose();
-        },
-        "aria-label": "Close modal"
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "relative z-10 w-full max-w-md rounded-xl border border-border bg-card p-6 shadow-xl",
-        children: [
-          /* @__PURE__ */ jsxDEV("h2", {
-            className: "mb-4 font-semibold text-xl",
-            children: "Create New Project"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV("form", {
-            onSubmit: handleSubmit,
-            className: "space-y-4",
-            children: [
-              /* @__PURE__ */ jsxDEV("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV("label", {
-                    htmlFor: "project-name",
-                    className: "mb-1 block font-medium text-muted-foreground text-sm",
-                    children: "Project Name *"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV(Input, {
-                    id: "project-name",
-                    value: name,
-                    onChange: (e) => setName(e.target.value),
-                    placeholder: "e.g., My Awesome Project",
-                    disabled: isLoading
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV("label", {
-                    htmlFor: "project-description",
-                    className: "mb-1 block font-medium text-muted-foreground text-sm",
-                    children: "Description"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV("textarea", {
-                    id: "project-description",
-                    value: description,
-                    onChange: (e) => setDescription(e.target.value),
-                    placeholder: "Describe what this project is about...",
-                    rows: 3,
-                    disabled: isLoading,
-                    className: "w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:opacity-50"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV("label", {
-                    htmlFor: "project-tier",
-                    className: "mb-1 block font-medium text-muted-foreground text-sm",
-                    children: "Tier"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV("select", {
-                    id: "project-tier",
-                    value: tier,
-                    onChange: (e) => setTier(e.target.value),
-                    disabled: isLoading,
-                    className: "h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:opacity-50",
-                    children: TIERS.map((t) => /* @__PURE__ */ jsxDEV("option", {
-                      value: t.value,
-                      children: t.label
-                    }, t.value, false, undefined, this))
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              error && /* @__PURE__ */ jsxDEV("div", {
-                className: "rounded-md bg-destructive/10 p-3 text-destructive text-sm",
-                children: error
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV("div", {
-                className: "flex justify-end gap-3 pt-2",
-                children: [
-                  /* @__PURE__ */ jsxDEV(Button, {
-                    type: "button",
-                    variant: "ghost",
-                    onPress: onClose,
-                    disabled: isLoading,
-                    children: "Cancel"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV(Button, {
-                    type: "submit",
-                    disabled: isLoading,
-                    children: isLoading ? "Creating..." : "Create Project"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/ui/modals/ProjectActionsModal.tsx
-import { Button as Button2, Input as Input2 } from "@contractspec/lib.design-system";
-import { useEffect as useEffect2, useState as useState4 } from "react";
-import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
-"use client";
-function ProjectActionsModal({
-  isOpen,
-  project,
-  onClose,
-  onUpdate,
-  onArchive,
-  onActivate,
-  onDelete,
-  isLoading = false
-}) {
-  const [mode, setMode] = useState4("menu");
-  const [name, setName] = useState4("");
-  const [description, setDescription] = useState4("");
-  const [error, setError] = useState4(null);
-  const resetForm = () => {
-    setMode("menu");
-    setError(null);
-    if (project) {
-      setName(project.name);
-      setDescription(project.description ?? "");
-    }
-  };
-  const handleClose = () => {
-    resetForm();
-    onClose();
-  };
-  useEffect2(() => {
-    if (project) {
-      setName(project.name);
-      setDescription(project.description ?? "");
-    }
-  }, [project]);
-  const handleEdit = async () => {
-    if (!project)
-      return;
-    setError(null);
-    if (!name.trim()) {
-      setError("Project name is required");
-      return;
-    }
-    try {
-      await onUpdate({
-        id: project.id,
-        name: name.trim(),
-        description: description.trim() || undefined
-      });
-      handleClose();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to update project");
-    }
-  };
-  const handleArchive = async () => {
-    if (!project)
-      return;
-    setError(null);
-    try {
-      await onArchive(project.id);
-      handleClose();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to archive project");
-    }
-  };
-  const handleActivate = async () => {
-    if (!project)
-      return;
-    setError(null);
-    try {
-      await onActivate(project.id);
-      handleClose();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to activate project");
-    }
-  };
-  const handleDelete = async () => {
-    if (!project)
-      return;
-    setError(null);
-    try {
-      await onDelete(project.id);
-      handleClose();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to delete project");
-    }
-  };
-  if (!isOpen || !project)
-    return null;
-  return /* @__PURE__ */ jsxDEV2("div", {
-    className: "fixed inset-0 z-50 flex items-center justify-center",
-    children: [
-      /* @__PURE__ */ jsxDEV2("div", {
-        className: "absolute inset-0 bg-background/80 backdrop-blur-sm",
-        onClick: handleClose,
-        role: "button",
-        tabIndex: 0,
-        onKeyDown: (e) => {
-          if (e.key === "Enter" || e.key === " ")
-            handleClose();
-        },
-        "aria-label": "Close modal"
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV2("div", {
-        className: "relative z-10 w-full max-w-md rounded-xl border border-border bg-card p-6 shadow-xl",
-        children: [
-          /* @__PURE__ */ jsxDEV2("div", {
-            className: "mb-4 border-border border-b pb-4",
-            children: [
-              /* @__PURE__ */ jsxDEV2("h2", {
-                className: "font-semibold text-xl",
-                children: project.name
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "text-muted-foreground text-sm",
-                children: [
-                  project.tier,
-                  " \xB7 ",
-                  project.status
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          mode === "menu" && /* @__PURE__ */ jsxDEV2("div", {
-            className: "space-y-3",
-            children: [
-              /* @__PURE__ */ jsxDEV2(Button2, {
-                className: "w-full justify-start",
-                variant: "ghost",
-                onPress: () => setMode("edit"),
-                children: [
-                  /* @__PURE__ */ jsxDEV2("span", {
-                    className: "mr-2",
-                    children: "\u270F\uFE0F"
-                  }, undefined, false, undefined, this),
-                  " Edit Project"
-                ]
-              }, undefined, true, undefined, this),
-              project.status === "ACTIVE" || project.status === "DRAFT" ? /* @__PURE__ */ jsxDEV2(Button2, {
-                className: "w-full justify-start",
-                variant: "ghost",
-                onPress: () => setMode("archive"),
-                children: [
-                  /* @__PURE__ */ jsxDEV2("span", {
-                    className: "mr-2",
-                    children: "\uD83D\uDCE6"
-                  }, undefined, false, undefined, this),
-                  " Archive Project"
-                ]
-              }, undefined, true, undefined, this) : project.status === "ARCHIVED" ? /* @__PURE__ */ jsxDEV2(Button2, {
-                className: "w-full justify-start",
-                variant: "ghost",
-                onPress: handleActivate,
-                disabled: isLoading,
-                children: [
-                  /* @__PURE__ */ jsxDEV2("span", {
-                    className: "mr-2",
-                    children: "\uD83D\uDD04"
-                  }, undefined, false, undefined, this),
-                  " Restore Project"
-                ]
-              }, undefined, true, undefined, this) : null,
-              /* @__PURE__ */ jsxDEV2(Button2, {
-                className: "w-full justify-start text-red-500 hover:text-red-600",
-                variant: "ghost",
-                onPress: () => setMode("delete"),
-                children: [
-                  /* @__PURE__ */ jsxDEV2("span", {
-                    className: "mr-2",
-                    children: "\uD83D\uDDD1\uFE0F"
-                  }, undefined, false, undefined, this),
-                  " Delete Project"
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "border-border border-t pt-3",
-                children: /* @__PURE__ */ jsxDEV2(Button2, {
-                  className: "w-full",
-                  variant: "outline",
-                  onPress: handleClose,
-                  children: "Close"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          mode === "edit" && /* @__PURE__ */ jsxDEV2("div", {
-            className: "space-y-4",
-            children: [
-              /* @__PURE__ */ jsxDEV2("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV2("label", {
-                    htmlFor: "edit-name",
-                    className: "mb-1 block font-medium text-muted-foreground text-sm",
-                    children: "Project Name *"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV2(Input2, {
-                    id: "edit-name",
-                    value: name,
-                    onChange: (e) => setName(e.target.value),
-                    disabled: isLoading
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV2("label", {
-                    htmlFor: "edit-description",
-                    className: "mb-1 block font-medium text-muted-foreground text-sm",
-                    children: "Description"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV2("textarea", {
-                    id: "edit-description",
-                    value: description,
-                    onChange: (e) => setDescription(e.target.value),
-                    rows: 3,
-                    disabled: isLoading,
-                    className: "w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:opacity-50"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              error && /* @__PURE__ */ jsxDEV2("div", {
-                className: "rounded-md bg-destructive/10 p-3 text-destructive text-sm",
-                children: error
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "flex justify-end gap-3 pt-2",
-                children: [
-                  /* @__PURE__ */ jsxDEV2(Button2, {
-                    variant: "ghost",
-                    onPress: () => setMode("menu"),
-                    disabled: isLoading,
-                    children: "Back"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV2(Button2, {
-                    onPress: handleEdit,
-                    disabled: isLoading,
-                    children: isLoading ? "Saving..." : "Save Changes"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          mode === "archive" && /* @__PURE__ */ jsxDEV2("div", {
-            className: "space-y-4",
-            children: [
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "text-muted-foreground",
-                children: [
-                  "Are you sure you want to archive",
-                  " ",
-                  /* @__PURE__ */ jsxDEV2("span", {
-                    className: "font-medium text-foreground",
-                    children: project.name
-                  }, undefined, false, undefined, this),
-                  "?"
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "text-muted-foreground text-sm",
-                children: "Archived projects can be restored later."
-              }, undefined, false, undefined, this),
-              error && /* @__PURE__ */ jsxDEV2("div", {
-                className: "rounded-md bg-destructive/10 p-3 text-destructive text-sm",
-                children: error
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "flex justify-end gap-3 pt-2",
-                children: [
-                  /* @__PURE__ */ jsxDEV2(Button2, {
-                    variant: "ghost",
-                    onPress: () => setMode("menu"),
-                    disabled: isLoading,
-                    children: "Cancel"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV2(Button2, {
-                    onPress: handleArchive,
-                    disabled: isLoading,
-                    children: isLoading ? "Archiving..." : "\uD83D\uDCE6 Archive"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          mode === "delete" && /* @__PURE__ */ jsxDEV2("div", {
-            className: "space-y-4",
-            children: [
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "text-muted-foreground",
-                children: [
-                  "Are you sure you want to delete",
-                  " ",
-                  /* @__PURE__ */ jsxDEV2("span", {
-                    className: "font-medium text-foreground",
-                    children: project.name
-                  }, undefined, false, undefined, this),
-                  "?"
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "text-destructive text-sm",
-                children: "This action cannot be undone."
-              }, undefined, false, undefined, this),
-              error && /* @__PURE__ */ jsxDEV2("div", {
-                className: "rounded-md bg-destructive/10 p-3 text-destructive text-sm",
-                children: error
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "flex justify-end gap-3 pt-2",
-                children: [
-                  /* @__PURE__ */ jsxDEV2(Button2, {
-                    variant: "ghost",
-                    onPress: () => setMode("menu"),
-                    disabled: isLoading,
-                    children: "Cancel"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV2(Button2, {
-                    variant: "destructive",
-                    onPress: handleDelete,
-                    disabled: isLoading,
-                    children: isLoading ? "Deleting..." : "\uD83D\uDDD1\uFE0F Delete"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-// src/ui/overlays/demo-overlays.ts
-var saasFreeUserOverlay = {
-  overlayId: "saas-boilerplate.free-tier",
-  version: "1.0.0",
-  description: "Shows limitations for free tier users",
-  appliesTo: {
-    feature: "saas-boilerplate",
-    tier: "free"
-  },
-  modifications: [
-    {
-      type: "setLimit",
-      field: "projects",
-      max: 3,
-      message: "Upgrade to create more projects"
-    },
-    { type: "hideField", field: "advancedSettings", reason: "Pro feature" },
-    {
-      type: "addBadge",
-      position: "header",
-      label: "Free Plan",
-      variant: "default"
-    }
-  ]
-};
-var saasDemoOverlay = {
-  overlayId: "saas-boilerplate.demo-user",
-  version: "1.0.0",
-  description: "Demo mode for SaaS boilerplate",
-  appliesTo: {
-    feature: "saas-boilerplate",
-    role: "demo"
-  },
-  modifications: [
-    {
-      type: "hideField",
-      field: "billingSection",
-      reason: "Demo users cannot access billing"
-    },
-    {
-      type: "hideField",
-      field: "deleteAccount",
-      reason: "Not available in demo"
-    },
-    {
-      type: "addBadge",
-      position: "header",
-      label: "Demo Mode",
-      variant: "warning"
-    }
-  ]
-};
-var saasOverlays = [
-  saasFreeUserOverlay,
-  saasDemoOverlay
-];
-// 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 as Button3,
-  EmptyState,
-  EntityCard,
-  ErrorState,
-  LoaderBlock,
-  StatCard,
-  StatCardGroup,
-  StatusChip
-} from "@contractspec/lib.design-system";
-import { jsxDEV as jsxDEV3 } 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__ */ jsxDEV3(LoaderBlock, {
-      label: "Loading projects..."
-    }, undefined, false, undefined, this);
-  }
-  if (error) {
-    return /* @__PURE__ */ jsxDEV3(ErrorState, {
-      title: "Failed to load projects",
-      description: error.message,
-      onRetry: refetch,
-      retryLabel: "Retry"
-    }, undefined, false, undefined, this);
-  }
-  if (!data?.items.length) {
-    return /* @__PURE__ */ jsxDEV3(EmptyState, {
-      title: "No projects found",
-      description: "Create your first project to get started.",
-      primaryAction: onCreateProject ? /* @__PURE__ */ jsxDEV3(Button3, {
-        onPress: onCreateProject,
-        children: "Create Project"
-      }, undefined, false, undefined, this) : undefined
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV3("div", {
-    className: "space-y-6",
-    children: [
-      stats && /* @__PURE__ */ jsxDEV3(StatCardGroup, {
-        children: [
-          /* @__PURE__ */ jsxDEV3(StatCard, {
-            label: "Total Projects",
-            value: stats.total.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV3(StatCard, {
-            label: "Active",
-            value: stats.activeCount.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV3(StatCard, {
-            label: "Draft",
-            value: stats.draftCount.toString()
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV3("div", {
-        className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
-        children: data.items.map((project) => /* @__PURE__ */ jsxDEV3(EntityCard, {
-          cardTitle: project.name,
-          cardSubtitle: project.tier,
-          meta: /* @__PURE__ */ jsxDEV3("p", {
-            className: "text-muted-foreground text-sm",
-            children: project.description
-          }, undefined, false, undefined, this),
-          chips: /* @__PURE__ */ jsxDEV3(StatusChip, {
-            tone: getStatusTone(project.status),
-            label: project.status
-          }, undefined, false, undefined, this),
-          footer: /* @__PURE__ */ jsxDEV3("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 jsxDEV4 } 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__ */ jsxDEV4(SaasProjectList, {}, undefined, false, undefined, this);
-  }
-};
-// src/ui/SaasDashboard.visualizations.tsx
-import {
-  VisualizationCard,
-  VisualizationGrid
-} from "@contractspec/lib.design-system";
-import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
-"use client";
-function SaasVisualizationOverview({
-  projects,
-  projectLimit
-}) {
-  const items = createSaasVisualizationItems(projects, projectLimit);
-  return /* @__PURE__ */ jsxDEV5("section", {
-    className: "space-y-3",
-    children: [
-      /* @__PURE__ */ jsxDEV5("div", {
-        children: [
-          /* @__PURE__ */ jsxDEV5("h3", {
-            className: "font-semibold text-lg",
-            children: "Portfolio Visualizations"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV5("p", {
-            className: "text-muted-foreground text-sm",
-            children: "Contract-backed charts for project mix, capacity, and activity."
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV5(VisualizationGrid, {
-        children: items.map((item) => /* @__PURE__ */ jsxDEV5(VisualizationCard, {
-          data: item.data,
-          description: item.description,
-          height: item.height,
-          spec: item.spec,
-          title: item.title
-        }, item.key, false, undefined, this))
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/ui/SaasDashboard.tsx
-import {
-  Button as Button4,
-  EmptyState as EmptyState2,
-  EntityCard as EntityCard2,
-  ErrorState as ErrorState2,
-  LoaderBlock as LoaderBlock2,
-  StatCard as StatCard2,
-  StatCardGroup as StatCardGroup2,
-  StatusChip as StatusChip2
-} from "@contractspec/lib.design-system";
-import { useCallback as useCallback3, useState as useState5 } from "react";
-import { jsxDEV as jsxDEV6 } from "react/jsx-dev-runtime";
-"use client";
-function getStatusTone2(status) {
-  switch (status) {
-    case "ACTIVE":
-      return "success";
-    case "DRAFT":
-      return "neutral";
-    case "ARCHIVED":
-      return "warning";
-    default:
-      return "neutral";
-  }
-}
-function SaasDashboard() {
-  const [activeTab, setActiveTab] = useState5("projects");
-  const [isCreateModalOpen, setIsCreateModalOpen] = useState5(false);
-  const [selectedProject, setSelectedProject] = useState5(null);
-  const [isProjectActionsOpen, setIsProjectActionsOpen] = useState5(false);
-  const { data, subscription, loading, error, stats, refetch } = useProjectList();
-  const mutations = useProjectMutations({
-    onSuccess: () => {
-      refetch();
-    }
-  });
-  const handleProjectClick = useCallback3((project) => {
-    setSelectedProject(project);
-    setIsProjectActionsOpen(true);
-  }, []);
-  const tabs = [
-    { id: "projects", label: "Projects", icon: "\uD83D\uDCC1" },
-    { id: "billing", label: "Billing", icon: "\uD83D\uDCB3" },
-    { id: "settings", label: "Settings", icon: "\u2699\uFE0F" }
-  ];
-  if (loading && !data) {
-    return /* @__PURE__ */ jsxDEV6(LoaderBlock2, {
-      label: "Loading dashboard..."
-    }, undefined, false, undefined, this);
-  }
-  if (error) {
-    return /* @__PURE__ */ jsxDEV6(ErrorState2, {
-      title: "Failed to load dashboard",
-      description: error.message,
-      onRetry: refetch,
-      retryLabel: "Retry"
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV6("div", {
-    className: "space-y-6",
-    children: [
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "flex items-center justify-between",
-        children: [
-          /* @__PURE__ */ jsxDEV6("h2", {
-            className: "font-bold text-2xl",
-            children: "SaaS Dashboard"
-          }, undefined, false, undefined, this),
-          activeTab === "projects" && /* @__PURE__ */ jsxDEV6(Button4, {
-            onPress: () => setIsCreateModalOpen(true),
-            children: [
-              /* @__PURE__ */ jsxDEV6("span", {
-                className: "mr-2",
-                children: "+"
-              }, undefined, false, undefined, this),
-              " New Project"
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      stats && subscription && /* @__PURE__ */ jsxDEV6(StatCardGroup2, {
-        children: [
-          /* @__PURE__ */ jsxDEV6(StatCard2, {
-            label: "Projects",
-            value: stats.total.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6(StatCard2, {
-            label: "Active",
-            value: stats.activeCount.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6(StatCard2, {
-            label: "Draft",
-            value: stats.draftCount.toString()
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6(StatCard2, {
-            label: "Plan",
-            value: subscription.plan,
-            hint: subscription.status
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      data && stats && /* @__PURE__ */ jsxDEV6(SaasVisualizationOverview, {
-        projectLimit: stats.projectLimit,
-        projects: data.items
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV6("nav", {
-        className: "flex gap-1 rounded-lg bg-muted p-1",
-        role: "tablist",
-        children: tabs.map((tab) => /* @__PURE__ */ jsxDEV6("button", {
-          type: "button",
-          role: "tab",
-          "aria-selected": activeTab === tab.id,
-          onClick: () => setActiveTab(tab.id),
-          className: `flex flex-1 items-center justify-center gap-2 rounded-md px-4 py-2 font-medium text-sm transition-colors ${activeTab === tab.id ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"}`,
-          children: [
-            /* @__PURE__ */ jsxDEV6("span", {
-              children: tab.icon
-            }, undefined, false, undefined, this),
-            tab.label
-          ]
-        }, tab.id, true, undefined, this))
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "min-h-[400px]",
-        role: "tabpanel",
-        children: [
-          activeTab === "projects" && /* @__PURE__ */ jsxDEV6(ProjectsTab, {
-            data,
-            onProjectClick: handleProjectClick
-          }, undefined, false, undefined, this),
-          activeTab === "billing" && /* @__PURE__ */ jsxDEV6(BillingTab, {
-            subscription
-          }, undefined, false, undefined, this),
-          activeTab === "settings" && /* @__PURE__ */ jsxDEV6(SettingsTab, {}, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV6(CreateProjectModal, {
-        isOpen: isCreateModalOpen,
-        onClose: () => setIsCreateModalOpen(false),
-        onSubmit: async (input) => {
-          await mutations.createProject(input);
-        },
-        isLoading: mutations.createState.loading
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV6(ProjectActionsModal, {
-        isOpen: isProjectActionsOpen,
-        project: selectedProject,
-        onClose: () => {
-          setIsProjectActionsOpen(false);
-          setSelectedProject(null);
-        },
-        onUpdate: async (input) => {
-          await mutations.updateProject(input);
-        },
-        onArchive: async (projectId) => {
-          await mutations.archiveProject(projectId);
-        },
-        onActivate: async (projectId) => {
-          await mutations.activateProject(projectId);
-        },
-        onDelete: async (projectId) => {
-          await mutations.deleteProject(projectId);
-        },
-        isLoading: mutations.isLoading
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function ProjectsTab({ data, onProjectClick }) {
-  if (!data?.items.length) {
-    return /* @__PURE__ */ jsxDEV6(EmptyState2, {
-      title: "No projects yet",
-      description: "Create your first project to get started."
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV6("div", {
-    className: "space-y-4",
-    children: /* @__PURE__ */ jsxDEV6("div", {
-      className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
-      children: data.items.map((project) => /* @__PURE__ */ jsxDEV6(EntityCard2, {
-        cardTitle: project.name,
-        cardSubtitle: project.tier,
-        meta: /* @__PURE__ */ jsxDEV6("p", {
-          className: "text-muted-foreground text-sm",
-          children: project.description
-        }, undefined, false, undefined, this),
-        chips: /* @__PURE__ */ jsxDEV6(StatusChip2, {
-          tone: getStatusTone2(project.status),
-          label: project.status
-        }, undefined, false, undefined, this),
-        footer: /* @__PURE__ */ jsxDEV6("div", {
-          className: "flex w-full items-center justify-between",
-          children: [
-            /* @__PURE__ */ jsxDEV6("span", {
-              className: "text-muted-foreground text-xs",
-              children: project.updatedAt.toLocaleDateString()
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV6(Button4, {
-              variant: "ghost",
-              size: "sm",
-              onPress: () => onProjectClick?.(project),
-              children: "Actions"
-            }, undefined, false, undefined, this)
-          ]
-        }, undefined, true, undefined, this)
-      }, project.id, false, undefined, this))
-    }, undefined, false, undefined, this)
-  }, undefined, false, undefined, this);
-}
-function BillingTab({ subscription }) {
-  if (!subscription)
-    return null;
-  return /* @__PURE__ */ jsxDEV6("div", {
-    className: "space-y-6",
-    children: [
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "rounded-xl border border-border bg-card p-6",
-        children: [
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex items-start justify-between",
-            children: [
-              /* @__PURE__ */ jsxDEV6("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV6("h3", {
-                    className: "font-semibold text-lg",
-                    children: [
-                      subscription.plan,
-                      " Plan"
-                    ]
-                  }, undefined, true, undefined, this),
-                  /* @__PURE__ */ jsxDEV6("p", {
-                    className: "text-muted-foreground text-sm",
-                    children: [
-                      "Current period:",
-                      " ",
-                      subscription.currentPeriodStart.toLocaleDateString(),
-                      " -",
-                      " ",
-                      subscription.currentPeriodEnd.toLocaleDateString()
-                    ]
-                  }, undefined, true, undefined, this),
-                  /* @__PURE__ */ jsxDEV6("p", {
-                    className: "text-muted-foreground text-sm",
-                    children: [
-                      "Billing cycle: ",
-                      subscription.billingCycle
-                    ]
-                  }, undefined, true, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV6(StatusChip2, {
-                tone: "success",
-                label: subscription.status
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "mt-4 flex gap-3",
-            children: [
-              /* @__PURE__ */ jsxDEV6(Button4, {
-                variant: "outline",
-                onPress: () => alert("Upgrade clicked!"),
-                children: "Upgrade Plan"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6(Button4, {
-                variant: "ghost",
-                onPress: () => alert("Manage Billing clicked!"),
-                children: "Manage Billing"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      subscription.cancelAtPeriodEnd && /* @__PURE__ */ jsxDEV6("div", {
-        className: "rounded-xl border border-border bg-destructive/10 p-4 text-destructive",
-        children: /* @__PURE__ */ jsxDEV6("p", {
-          className: "font-medium text-sm",
-          children: "\u26A0\uFE0F Your subscription will be cancelled at the end of the current period."
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function SettingsTab() {
-  return /* @__PURE__ */ jsxDEV6("div", {
-    className: "space-y-6",
-    children: /* @__PURE__ */ jsxDEV6("div", {
-      className: "rounded-xl border border-border bg-card p-6",
-      children: [
-        /* @__PURE__ */ jsxDEV6("h3", {
-          className: "mb-4 font-semibold text-lg",
-          children: "Organization Settings"
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV6("div", {
-          className: "space-y-4",
-          children: [
-            /* @__PURE__ */ jsxDEV6("div", {
-              children: [
-                /* @__PURE__ */ jsxDEV6("label", {
-                  htmlFor: "org-name",
-                  className: "font-medium text-sm",
-                  children: "Organization Name"
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV6("input", {
-                  id: "org-name",
-                  type: "text",
-                  defaultValue: "Demo Organization",
-                  className: "mt-1 block w-full rounded-md border border-input bg-background px-3 py-2"
-                }, undefined, false, undefined, this)
-              ]
-            }, undefined, true, undefined, this),
-            /* @__PURE__ */ jsxDEV6("div", {
-              children: [
-                /* @__PURE__ */ jsxDEV6("label", {
-                  htmlFor: "timezone",
-                  className: "font-medium text-sm",
-                  children: "Default Timezone"
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV6("select", {
-                  id: "timezone",
-                  className: "mt-1 block w-full rounded-md border border-input bg-background px-3 py-2",
-                  children: [
-                    /* @__PURE__ */ jsxDEV6("option", {
-                      children: "UTC"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("option", {
-                      children: "America/New_York"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("option", {
-                      children: "Europe/London"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("option", {
-                      children: "Asia/Tokyo"
-                    }, undefined, false, undefined, this)
-                  ]
-                }, undefined, true, undefined, this)
-              ]
-            }, undefined, true, undefined, this),
-            /* @__PURE__ */ jsxDEV6("div", {
-              className: "pt-2",
-              children: /* @__PURE__ */ jsxDEV6(Button4, {
-                onPress: () => alert("Settings saved!"),
-                children: "Save Settings"
-              }, undefined, false, undefined, this)
-            }, undefined, false, undefined, this)
-          ]
-        }, undefined, true, undefined, this)
-      ]
-    }, undefined, true, undefined, this)
-  }, undefined, false, undefined, this);
-}
-
-// src/ui/SaasSettingsPanel.tsx
-import { Button as Button5 } from "@contractspec/lib.design-system";
-import { useState as useState6 } from "react";
-import { jsxDEV as jsxDEV7 } from "react/jsx-dev-runtime";
-"use client";
-function SaasSettingsPanel() {
-  const [orgName, setOrgName] = useState6("Demo Organization");
-  const [timezone, setTimezone] = useState6("UTC");
-  return /* @__PURE__ */ jsxDEV7("div", {
-    className: "space-y-6",
-    children: [
-      /* @__PURE__ */ jsxDEV7("div", {
-        className: "rounded-xl border border-border bg-card p-6",
-        children: [
-          /* @__PURE__ */ jsxDEV7("h3", {
-            className: "mb-4 font-semibold text-lg",
-            children: "Organization Settings"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV7("div", {
-            className: "space-y-4",
-            children: [
-              /* @__PURE__ */ jsxDEV7("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV7("label", {
-                    htmlFor: "setting-org-name",
-                    className: "block font-medium text-sm",
-                    children: "Organization Name"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV7("input", {
-                    id: "setting-org-name",
-                    type: "text",
-                    value: orgName,
-                    onChange: (e) => setOrgName(e.target.value),
-                    className: "mt-1 block w-full rounded-md border border-input bg-background px-3 py-2"
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV7("div", {
-                children: [
-                  /* @__PURE__ */ jsxDEV7("label", {
-                    htmlFor: "setting-timezone",
-                    className: "block font-medium text-sm",
-                    children: "Default Timezone"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV7("select", {
-                    id: "setting-timezone",
-                    value: timezone,
-                    onChange: (e) => setTimezone(e.target.value),
-                    className: "mt-1 block w-full rounded-md border border-input bg-background px-3 py-2",
-                    children: [
-                      /* @__PURE__ */ jsxDEV7("option", {
-                        value: "UTC",
-                        children: "UTC"
-                      }, undefined, false, undefined, this),
-                      /* @__PURE__ */ jsxDEV7("option", {
-                        value: "America/New_York",
-                        children: "America/New_York"
-                      }, undefined, false, undefined, this),
-                      /* @__PURE__ */ jsxDEV7("option", {
-                        value: "Europe/London",
-                        children: "Europe/London"
-                      }, undefined, false, undefined, this),
-                      /* @__PURE__ */ jsxDEV7("option", {
-                        value: "Asia/Tokyo",
-                        children: "Asia/Tokyo"
-                      }, undefined, false, undefined, this)
-                    ]
-                  }, undefined, true, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV7("div", {
-            className: "mt-6",
-            children: /* @__PURE__ */ jsxDEV7(Button5, {
-              variant: "default",
-              children: "Save Changes"
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV7("div", {
-        className: "rounded-xl border border-border bg-card p-6",
-        children: [
-          /* @__PURE__ */ jsxDEV7("h3", {
-            className: "mb-4 font-semibold text-lg",
-            children: "Notifications"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV7("div", {
-            className: "space-y-3",
-            children: [
-              { label: "Email notifications", defaultChecked: true },
-              { label: "Usage alerts", defaultChecked: true },
-              { label: "Weekly digest", defaultChecked: false }
-            ].map((item) => /* @__PURE__ */ jsxDEV7("label", {
-              className: "flex items-center gap-3",
-              children: [
-                /* @__PURE__ */ jsxDEV7("input", {
-                  type: "checkbox",
-                  defaultChecked: item.defaultChecked,
-                  className: "h-4 w-4 rounded border-input"
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV7("span", {
-                  className: "text-sm",
-                  children: item.label
-                }, undefined, false, undefined, this)
-              ]
-            }, item.label, true, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV7("div", {
-        className: "rounded-xl border border-red-200 bg-red-50 p-6 dark:border-red-900 dark:bg-red-950/20",
-        children: [
-          /* @__PURE__ */ jsxDEV7("h3", {
-            className: "mb-2 font-semibold text-lg text-red-700 dark:text-red-400",
-            children: "Danger Zone"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV7("p", {
-            className: "mb-4 text-red-600 text-sm dark:text-red-300",
-            children: "These actions are irreversible. Please proceed with caution."
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV7("div", {
-            className: "flex gap-3",
-            children: [
-              /* @__PURE__ */ jsxDEV7(Button5, {
-                variant: "secondary",
-                size: "sm",
-                children: "Export Data"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV7(Button5, {
-                variant: "secondary",
-                size: "sm",
-                children: "Delete Organization"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-export {
-  useProjectMutations,
-  useProjectList,
-  saasOverlays,
-  saasFreeUserOverlay,
-  saasDemoOverlay,
-  saasDashboardMarkdownRenderer,
-  saasBillingMarkdownRenderer,
-  projectListReactRenderer,
-  projectListMarkdownRenderer,
-  SaasSettingsPanel,
-  SaasProjectList,
-  SaasDashboard,
-  ProjectActionsModal,
-  CreateProjectModal
-};
+var M=[{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")}],T={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}},L={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 C(){return T}async function RH(H){return{...L,period:H.period??"current_month"}}async function yH(H){return{recorded:!0,newTotal:L.apiCalls.total+H.quantity}}async function zH(H){let{feature:$}=H;return{custom_domains:{allowed:!0},api_access:{allowed:!0,currentUsage:L.apiCalls.total,limit:L.apiCalls.limit},advanced_analytics:{allowed:!1,reason:"FEATURE_NOT_INCLUDED"},unlimited_projects:{allowed:!1,reason:"PLAN_LIMIT",currentUsage:T.usage.projects,limit:T.limits.projects}}[$]??{allowed:!0}}async function S(H){let{status:$,search:W,limit:Q=20,offset:Y=0}=H,q=[...M];if($&&$!=="all")q=q.filter((Z)=>Z.status===$);if(W){let Z=W.toLowerCase();q=q.filter((G)=>G.name.toLowerCase().includes(Z)||G.description?.toLowerCase().includes(Z)||G.tags.some((J)=>J.toLowerCase().includes(Z)))}q.sort((Z,G)=>G.updatedAt.getTime()-Z.updatedAt.getTime());let N=q.length;return{projects:q.slice(Y,Y+Q),total:N}}async function _H(H){let $=M.find((W)=>W.id===H.projectId);if(!$)throw Error("NOT_FOUND");return $}async function DH(H,$){if(H.slug){if(M.some((Y)=>Y.slug===H.slug))throw Error("SLUG_EXISTS")}let W=new Date;return{id:`proj-${Date.now()}`,name:H.name,description:H.description,slug:H.slug??H.name.toLowerCase().replace(/\s+/g,"-"),organizationId:$.organizationId,createdBy:$.userId,status:"DRAFT",isPublic:H.isPublic??!1,tags:H.tags??[],createdAt:W,updatedAt:W}}async function BH(H){let $=M.find((W)=>W.id===H.projectId);if(!$)throw Error("NOT_FOUND");return{...$,name:H.name??$.name,description:H.description??$.description,slug:H.slug??$.slug,isPublic:H.isPublic??$.isPublic,tags:H.tags??$.tags,status:H.status??$.status,updatedAt:new Date}}async function AH(H){if(!M.find((W)=>W.id===H.projectId))throw Error("NOT_FOUND");return{success:!0}}import{web as vH}from"@contractspec/lib.runtime-sandbox";var{generateId:IH}=vH;function x(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 OH(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 y3(H){async function $(X){let{projectId:Z,organizationId:G,status:J,search:R,limit:z=20,offset:V=0}=X,U="WHERE projectId = ?",k=[Z];if(G)U+=" AND organizationId = ?",k.push(G);if(J&&J!=="all")U+=" AND status = ?",k.push(J);if(R)U+=" AND (name LIKE ? OR description LIKE ?)",k.push(`%${R}%`,`%${R}%`);let F=(await H.query(`SELECT COUNT(*) as count FROM saas_project ${U}`,k)).rows[0]?.count??0,b=(await H.query(`SELECT * FROM saas_project ${U} ORDER BY createdAt DESC LIMIT ? OFFSET ?`,[...k,z,V])).rows;return{items:b.map(x),total:F,hasMore:V+b.length<F}}async function W(X){let Z=(await H.query("SELECT * FROM saas_project WHERE id = ?",[X])).rows;return Z[0]?x(Z[0]):null}async function Q(X,Z){let G=IH("proj"),J=new Date().toISOString();await H.execute(`INSERT INTO saas_project (id, projectId, organizationId, name, description, status, tier, createdAt, updatedAt)
+       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,[G,Z.projectId,Z.organizationId,X.name,X.description??null,"DRAFT",X.tier??"FREE",J,J]);let R=(await H.query("SELECT * FROM saas_project WHERE id = ?",[G])).rows;return x(R[0])}async function Y(X){let Z=new Date().toISOString(),G=["updatedAt = ?"],J=[Z];if(X.name!==void 0)G.push("name = ?"),J.push(X.name);if(X.description!==void 0)G.push("description = ?"),J.push(X.description);if(X.status!==void 0)G.push("status = ?"),J.push(X.status);J.push(X.id),await H.execute(`UPDATE saas_project SET ${G.join(", ")} WHERE id = ?`,J);let R=(await H.query("SELECT * FROM saas_project WHERE id = ?",[X.id])).rows;if(!R[0])throw Error("NOT_FOUND");return x(R[0])}async function q(X){await H.execute("DELETE FROM saas_project WHERE id = ?",[X])}async function N(X){let Z="SELECT * FROM saas_subscription WHERE projectId = ?",G=[X.projectId];if(X.organizationId)Z+=" AND organizationId = ?",G.push(X.organizationId);Z+=" LIMIT 1";let J=(await H.query(Z,G)).rows;return J[0]?OH(J[0]):null}return{listProjects:$,getProject:W,createProject:Q,updateProject:Y,deleteProject:q,getSubscription:N}}import{defineVisualization as l,VisualizationRegistry as hH}from"@contractspec/lib.contracts-spec/visualizations";var d={key:"saas.project.list",version:"1.0.0"},u={version:"1.0.0",domain:"saas",stability:"experimental",owners:["@example.saas-boilerplate"],tags:["saas","visualization","projects"]},i=l({meta:{...u,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:d,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."}}}),o=l({meta:{...u,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:d,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."}}}),e=l({meta:{...u,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:d,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."}}}),s=l({meta:{...u,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:d,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."}}}),ZH=[i,o,e,s],I3=new hH([...ZH]),O3=ZH.map((H)=>({key:H.meta.key,version:H.meta.version}));function LH(H){return(H instanceof Date?H:new Date(H)).toISOString().slice(0,10)}function c(H,$=10){let W=new Map,Q=new Map,Y=new Map;for(let q of H){W.set(q.status,(W.get(q.status)??0)+1),Q.set(q.tier,(Q.get(q.tier)??0)+1);let N=LH(q.createdAt);Y.set(N,(Y.get(N)??0)+1)}return[{key:"saas-capacity",spec:i,data:{data:[{totalProjects:H.length,projectLimit:$}]},title:"Project Capacity",description:"Current project count compared to the active limit.",height:220},{key:"saas-status",spec:o,data:{data:Array.from(W.entries()).map(([q,N])=>({status:q,projects:N}))},title:"Project Status",description:"Status mix across the current project portfolio.",height:260},{key:"saas-tier",spec:e,data:{data:Array.from(Q.entries()).map(([q,N])=>({tier:q,projects:N}))},title:"Tier Comparison",description:"How projects are distributed across tiers."},{key:"saas-activity",spec:s,data:{data:Array.from(Y.entries()).sort(([q],[N])=>q.localeCompare(N)).map(([q,N])=>({day:q,projects:N}))},title:"Recent Project Activity",description:"Daily project creation activity."}]}import{useTemplateRuntime as MH}from"@contractspec/lib.example-shared-ui";import{useCallback as EH,useEffect as TH,useMemo as mH,useState as m}from"react";function w(H={}){let{handlers:$,projectId:W}=MH(),{saas:Q}=$,[Y,q]=m(null),[N,X]=m(null),[Z,G]=m(!0),[J,R]=m(null),[z,V]=m(1),U=EH(async()=>{G(!0),R(null);try{let[K,F]=await Promise.all([Q.listProjects({projectId:W,status:H.status==="all"?void 0:H.status,search:H.search,limit:H.limit??20,offset:(z-1)*(H.limit??20)}),Q.getSubscription({projectId:W})]);q({items:K.items,total:K.total}),X(F)}catch(K){R(K instanceof Error?K:Error("Unknown error"))}finally{G(!1)}},[Q,W,H.status,H.search,H.limit,z]);TH(()=>{U()},[U]);let k=mH(()=>{if(!Y)return null;let K=Y.items;return{total:Y.total,activeCount:K.filter((F)=>F.status==="ACTIVE").length,draftCount:K.filter((F)=>F.status==="DRAFT").length,projectLimit:10,usagePercent:Math.min(Y.total/10*100,100)}},[Y]);return{data:Y,subscription:N,loading:Z,error:J,stats:k,page:z,refetch:U,nextPage:()=>V((K)=>K+1),prevPage:()=>z>1&&V((K)=>K-1)}}import{useTemplateRuntime as wH}from"@contractspec/lib.example-shared-ui";import{useCallback as g,useState as t}from"react";function HH(H={}){let{handlers:$,projectId:W}=wH(),{saas:Q}=$,[Y,q]=t({loading:!1,error:null,data:null}),[N,X]=t({loading:!1,error:null,data:null}),[Z,G]=t({loading:!1,error:null,data:null}),J=g(async(k)=>{q({loading:!0,error:null,data:null});try{let K=await Q.createProject(k,{projectId:W,organizationId:"demo-org"});return q({loading:!1,error:null,data:K}),H.onSuccess?.(),K}catch(K){let F=K instanceof Error?K:Error("Failed to create project");return q({loading:!1,error:F,data:null}),H.onError?.(F),null}},[Q,W,H]),R=g(async(k)=>{X({loading:!0,error:null,data:null});try{let K=await Q.updateProject(k);return X({loading:!1,error:null,data:K}),H.onSuccess?.(),K}catch(K){let F=K instanceof Error?K:Error("Failed to update project");return X({loading:!1,error:F,data:null}),H.onError?.(F),null}},[Q,H]),z=g(async(k)=>{G({loading:!0,error:null,data:null});try{return await Q.deleteProject(k),G({loading:!1,error:null,data:{success:!0}}),H.onSuccess?.(),!0}catch(K){let F=K instanceof Error?K:Error("Failed to delete project");return G({loading:!1,error:F,data:null}),H.onError?.(F),!1}},[Q,H]),V=g(async(k)=>{return R({id:k,status:"ARCHIVED"})},[R]),U=g(async(k)=>{return R({id:k,status:"ACTIVE"})},[R]);return{createProject:J,updateProject:R,deleteProject:z,archiveProject:V,activateProject:U,createState:Y,updateState:N,deleteState:Z,isLoading:Y.loading||N.loading||Z.loading}}import{Button as GH,Input as gH}from"@contractspec/lib.design-system";import{useState as p}from"react";import{jsx as v,jsxs as E}from"react/jsx-runtime";var PH=[{value:"FREE",label:"Free"},{value:"PRO",label:"Pro"},{value:"ENTERPRISE",label:"Enterprise"}];function $H({isOpen:H,onClose:$,onSubmit:W,isLoading:Q=!1}){let[Y,q]=p(""),[N,X]=p(""),[Z,G]=p("FREE"),[J,R]=p(null),z=async(V)=>{if(V.preventDefault(),R(null),!Y.trim()){R("Project name is required");return}try{await W({name:Y.trim(),description:N.trim()||void 0,tier:Z}),q(""),X(""),G("FREE"),$()}catch(U){R(U instanceof Error?U.message:"Failed to create project")}};if(!H)return null;return E("div",{className:"fixed inset-0 z-50 flex items-center justify-center",children:[v("div",{className:"absolute inset-0 bg-background/80 backdrop-blur-sm",onClick:$,role:"button",tabIndex:0,onKeyDown:(V)=>{if(V.key==="Enter"||V.key===" ")$()},"aria-label":"Close modal"}),E("div",{className:"relative z-10 w-full max-w-md rounded-xl border border-border bg-card p-6 shadow-xl",children:[v("h2",{className:"mb-4 font-semibold text-xl",children:"Create New Project"}),E("form",{onSubmit:z,className:"space-y-4",children:[E("div",{children:[v("label",{htmlFor:"project-name",className:"mb-1 block font-medium text-muted-foreground text-sm",children:"Project Name *"}),v(gH,{id:"project-name",value:Y,onChange:(V)=>q(V.target.value),placeholder:"e.g., My Awesome Project",disabled:Q})]}),E("div",{children:[v("label",{htmlFor:"project-description",className:"mb-1 block font-medium text-muted-foreground text-sm",children:"Description"}),v("textarea",{id:"project-description",value:N,onChange:(V)=>X(V.target.value),placeholder:"Describe what this project is about...",rows:3,disabled:Q,className:"w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:opacity-50"})]}),E("div",{children:[v("label",{htmlFor:"project-tier",className:"mb-1 block font-medium text-muted-foreground text-sm",children:"Tier"}),v("select",{id:"project-tier",value:Z,onChange:(V)=>G(V.target.value),disabled:Q,className:"h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:opacity-50",children:PH.map((V)=>v("option",{value:V.value,children:V.label},V.value))})]}),J&&v("div",{className:"rounded-md bg-destructive/10 p-3 text-destructive text-sm",children:J}),E("div",{className:"flex justify-end gap-3 pt-2",children:[v(GH,{type:"button",variant:"ghost",onPress:$,disabled:Q,children:"Cancel"}),v(GH,{type:"submit",disabled:Q,children:Q?"Creating...":"Create Project"})]})]})]})]})}import{Button as O,Input as bH}from"@contractspec/lib.design-system";import{useEffect as CH,useState as j}from"react";import{jsx as y,jsxs as D}from"react/jsx-runtime";function QH({isOpen:H,project:$,onClose:W,onUpdate:Q,onArchive:Y,onActivate:q,onDelete:N,isLoading:X=!1}){let[Z,G]=j("menu"),[J,R]=j(""),[z,V]=j(""),[U,k]=j(null),K=()=>{if(G("menu"),k(null),$)R($.name),V($.description??"")},F=()=>{K(),W()};CH(()=>{if($)R($.name),V($.description??"")},[$]);let b=async()=>{if(!$)return;if(k(null),!J.trim()){k("Project name is required");return}try{await Q({id:$.id,name:J.trim(),description:z.trim()||void 0}),F()}catch(B){k(B instanceof Error?B.message:"Failed to update project")}},kH=async()=>{if(!$)return;k(null);try{await Y($.id),F()}catch(B){k(B instanceof Error?B.message:"Failed to archive project")}},VH=async()=>{if(!$)return;k(null);try{await q($.id),F()}catch(B){k(B instanceof Error?B.message:"Failed to activate project")}},UH=async()=>{if(!$)return;k(null);try{await N($.id),F()}catch(B){k(B instanceof Error?B.message:"Failed to delete project")}};if(!H||!$)return null;return D("div",{className:"fixed inset-0 z-50 flex items-center justify-center",children:[y("div",{className:"absolute inset-0 bg-background/80 backdrop-blur-sm",onClick:F,role:"button",tabIndex:0,onKeyDown:(B)=>{if(B.key==="Enter"||B.key===" ")F()},"aria-label":"Close modal"}),D("div",{className:"relative z-10 w-full max-w-md rounded-xl border border-border bg-card p-6 shadow-xl",children:[D("div",{className:"mb-4 border-border border-b pb-4",children:[y("h2",{className:"font-semibold text-xl",children:$.name}),D("p",{className:"text-muted-foreground text-sm",children:[$.tier," \xB7 ",$.status]})]}),Z==="menu"&&D("div",{className:"space-y-3",children:[D(O,{className:"w-full justify-start",variant:"ghost",onPress:()=>G("edit"),children:[y("span",{className:"mr-2",children:"\u270F\uFE0F"})," Edit Project"]}),$.status==="ACTIVE"||$.status==="DRAFT"?D(O,{className:"w-full justify-start",variant:"ghost",onPress:()=>G("archive"),children:[y("span",{className:"mr-2",children:"\uD83D\uDCE6"})," Archive Project"]}):$.status==="ARCHIVED"?D(O,{className:"w-full justify-start",variant:"ghost",onPress:VH,disabled:X,children:[y("span",{className:"mr-2",children:"\uD83D\uDD04"})," Restore Project"]}):null,D(O,{className:"w-full justify-start text-red-500 hover:text-red-600",variant:"ghost",onPress:()=>G("delete"),children:[y("span",{className:"mr-2",children:"\uD83D\uDDD1\uFE0F"})," Delete Project"]}),y("div",{className:"border-border border-t pt-3",children:y(O,{className:"w-full",variant:"outline",onPress:F,children:"Close"})})]}),Z==="edit"&&D("div",{className:"space-y-4",children:[D("div",{children:[y("label",{htmlFor:"edit-name",className:"mb-1 block font-medium text-muted-foreground text-sm",children:"Project Name *"}),y(bH,{id:"edit-name",value:J,onChange:(B)=>R(B.target.value),disabled:X})]}),D("div",{children:[y("label",{htmlFor:"edit-description",className:"mb-1 block font-medium text-muted-foreground text-sm",children:"Description"}),y("textarea",{id:"edit-description",value:z,onChange:(B)=>V(B.target.value),rows:3,disabled:X,className:"w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:opacity-50"})]}),U&&y("div",{className:"rounded-md bg-destructive/10 p-3 text-destructive text-sm",children:U}),D("div",{className:"flex justify-end gap-3 pt-2",children:[y(O,{variant:"ghost",onPress:()=>G("menu"),disabled:X,children:"Back"}),y(O,{onPress:b,disabled:X,children:X?"Saving...":"Save Changes"})]})]}),Z==="archive"&&D("div",{className:"space-y-4",children:[D("p",{className:"text-muted-foreground",children:["Are you sure you want to archive"," ",y("span",{className:"font-medium text-foreground",children:$.name}),"?"]}),y("p",{className:"text-muted-foreground text-sm",children:"Archived projects can be restored later."}),U&&y("div",{className:"rounded-md bg-destructive/10 p-3 text-destructive text-sm",children:U}),D("div",{className:"flex justify-end gap-3 pt-2",children:[y(O,{variant:"ghost",onPress:()=>G("menu"),disabled:X,children:"Cancel"}),y(O,{onPress:kH,disabled:X,children:X?"Archiving...":"\uD83D\uDCE6 Archive"})]})]}),Z==="delete"&&D("div",{className:"space-y-4",children:[D("p",{className:"text-muted-foreground",children:["Are you sure you want to delete"," ",y("span",{className:"font-medium text-foreground",children:$.name}),"?"]}),y("p",{className:"text-destructive text-sm",children:"This action cannot be undone."}),U&&y("div",{className:"rounded-md bg-destructive/10 p-3 text-destructive text-sm",children:U}),D("div",{className:"flex justify-end gap-3 pt-2",children:[y(O,{variant:"ghost",onPress:()=>G("menu"),disabled:X,children:"Cancel"}),y(O,{variant:"destructive",onPress:UH,disabled:X,children:X?"Deleting...":"\uD83D\uDDD1\uFE0F Delete"})]})]})]})]})}var SH={overlayId:"saas-boilerplate.free-tier",version:"1.0.0",description:"Shows limitations for free tier users",appliesTo:{feature:"saas-boilerplate",tier:"free"},modifications:[{type:"setLimit",field:"projects",max:3,message:"Upgrade to create more projects"},{type:"hideField",field:"advancedSettings",reason:"Pro feature"},{type:"addBadge",position:"header",label:"Free Plan",variant:"default"}]},xH={overlayId:"saas-boilerplate.demo-user",version:"1.0.0",description:"Demo mode for SaaS boilerplate",appliesTo:{feature:"saas-boilerplate",role:"demo"},modifications:[{type:"hideField",field:"billingSection",reason:"Demo users cannot access billing"},{type:"hideField",field:"deleteAccount",reason:"Not available in demo"},{type:"addBadge",position:"header",label:"Demo Mode",variant:"warning"}]},t3=[SH,xH];var YH=["FREE","PRO","ENTERPRISE"];function lH(H,$){return{status:H.status==="DELETED"?"ARCHIVED":H.status,tier:YH[$%YH.length]??"FREE",createdAt:H.createdAt}}var dH={target:"markdown",render:async(H,$)=>{if(H.source.type!=="component"||H.source.componentKey!=="ProjectListView")throw Error("projectListMarkdownRenderer: not ProjectListView");let W=await S({limit:20,offset:0}),Q=W.projects??[],Y=["# Projects","",`**Total**: ${W.total} projects`,""];if(Q.length===0)Y.push("_No projects found._");else{Y.push("| Status | Project | Description |"),Y.push("|--------|---------|-------------|");for(let q of Q){let N=q.status==="ACTIVE"?"\u2705":q.status==="ARCHIVED"?"\uD83D\uDCE6":"\u23F8\uFE0F";Y.push(`| ${N} | **${q.name}** | ${q.description??"-"} |`)}}return{mimeType:"text/markdown",body:Y.join(`
+`)}}},uH={target:"markdown",render:async(H,$)=>{if(H.source.type!=="component"||H.source.componentKey!=="SaasDashboard")throw Error("saasDashboardMarkdownRenderer: not SaasDashboard");let[W,Q]=await Promise.all([S({limit:50}),C()]),Y=W.projects??[],q=Y.filter((G)=>G.status==="ACTIVE").length,N=Y.filter((G)=>G.status==="ARCHIVED").length,X=c(Y.map(lH),10),Z=["# SaaS Dashboard","","> Organization overview and usage summary","","## Summary","","| Metric | Value |","|--------|-------|",`| Total Projects | ${W.total} |`,`| Active Projects | ${q} |`,`| Archived Projects | ${N} |`,`| Subscription Plan | ${Q.planName} |`,`| Subscription Status | ${Q.status} |`,""];Z.push("## Visualization Overview"),Z.push("");for(let G of X)Z.push(`- **${G.title}** via \`${G.spec.meta.key}\``);if(Z.push(""),Z.push("## Projects"),Z.push(""),Y.length===0)Z.push("_No projects yet._");else{Z.push("| Status | Project | Description |"),Z.push("|--------|---------|-------------|");for(let G of Y.slice(0,10)){let J=G.status==="ACTIVE"?"\u2705":G.status==="ARCHIVED"?"\uD83D\uDCE6":"\u23F8\uFE0F";Z.push(`| ${J} | **${G.name}** | ${G.description??"-"} |`)}if(Y.length>10)Z.push(`| ... | ... | _${W.total-10} more projects_ |`)}if(Z.push(""),Z.push("## Subscription"),Z.push(""),Z.push(`- **Plan**: ${Q.planName}`),Z.push(`- **Status**: ${Q.status}`),Q.currentPeriodEnd)Z.push(`- **Period End**: ${new Date(Q.currentPeriodEnd).toLocaleDateString()}`);return{mimeType:"text/markdown",body:Z.join(`
+`)}}},cH={target:"markdown",render:async(H,$)=>{if(H.source.type!=="component"||H.source.componentKey!=="SubscriptionView")throw Error("saasBillingMarkdownRenderer: not SubscriptionView");let W=await C(),Q=["# Billing & Subscription","","> Current subscription details and billing information","","## Subscription Details","","| Property | Value |","|----------|-------|",`| Plan | ${W.planName} |`,`| Status | ${W.status} |`,`| ID | ${W.id} |`,`| Period Start | ${new Date(W.currentPeriodStart).toLocaleDateString()} |`,`| Period End | ${new Date(W.currentPeriodEnd).toLocaleDateString()} |`];if(Q.push(""),Q.push("## Plan Limits"),Q.push(""),Q.push(`- **Projects**: ${W.limits.projects}`),Q.push(`- **Users**: ${W.limits.users}`),Q.push(""),Q.push("## Plan Features"),Q.push(""),W.planName.toLowerCase().includes("free"))Q.push("- \u2705 Up to 3 projects"),Q.push("- \u2705 Basic support"),Q.push("- \u274C Priority support"),Q.push("- \u274C Advanced analytics");else if(W.planName.toLowerCase().includes("pro"))Q.push("- \u2705 Unlimited projects"),Q.push("- \u2705 Priority support"),Q.push("- \u2705 Advanced analytics"),Q.push("- \u274C Custom integrations");else Q.push("- \u2705 Unlimited projects"),Q.push("- \u2705 Priority support"),Q.push("- \u2705 Advanced analytics"),Q.push("- \u2705 Custom integrations"),Q.push("- \u2705 Dedicated support");return{mimeType:"text/markdown",body:Q.join(`
+`)}}};import{Button as pH,EmptyState as jH,EntityCard as nH,ErrorState as rH,LoaderBlock as aH,StatCard as WH,StatCardGroup as iH,StatusChip as oH}from"@contractspec/lib.design-system";import{jsx as I,jsxs as qH}from"react/jsx-runtime";function eH(H){switch(H){case"ACTIVE":return"success";case"DRAFT":return"neutral";case"ARCHIVED":return"danger";default:return"neutral"}}function FH({onProjectClick:H,onCreateProject:$}){let{data:W,loading:Q,error:Y,stats:q,refetch:N}=w();if(Q&&!W)return I(aH,{label:"Loading projects..."});if(Y)return I(rH,{title:"Failed to load projects",description:Y.message,onRetry:N,retryLabel:"Retry"});if(!W?.items.length)return I(jH,{title:"No projects found",description:"Create your first project to get started.",primaryAction:$?I(pH,{onPress:$,children:"Create Project"}):void 0});return qH("div",{className:"space-y-6",children:[q&&qH(iH,{children:[I(WH,{label:"Total Projects",value:q.total.toString()}),I(WH,{label:"Active",value:q.activeCount.toString()}),I(WH,{label:"Draft",value:q.draftCount.toString()})]}),I("div",{className:"grid gap-4 md:grid-cols-2 lg:grid-cols-3",children:W.items.map((X)=>I(nH,{cardTitle:X.name,cardSubtitle:X.tier,meta:I("p",{className:"text-muted-foreground text-sm",children:X.description}),chips:I(oH,{tone:eH(X.status),label:X.status}),footer:I("span",{className:"text-muted-foreground text-xs",children:X.updatedAt.toLocaleDateString()}),onClick:H?()=>H(X.id):void 0},X.id))})]})}import{jsx as tH}from"react/jsx-runtime";var sH={target:"react",render:async(H,$)=>{if(H.source.type!=="component")throw Error("Invalid source type");if(H.source.componentKey!=="SaasProjectListView")throw Error(`Unknown component: ${H.source.componentKey}`);return tH(FH,{})}};import{VisualizationCard as H3,VisualizationGrid as $3}from"@contractspec/lib.design-system";import{jsx as n,jsxs as fH}from"react/jsx-runtime";function NH({projects:H,projectLimit:$}){let W=c(H,$);return fH("section",{className:"space-y-3",children:[fH("div",{children:[n("h3",{className:"font-semibold text-lg",children:"Portfolio Visualizations"}),n("p",{className:"text-muted-foreground text-sm",children:"Contract-backed charts for project mix, capacity, and activity."})]}),n($3,{children:W.map((Q)=>n(H3,{data:Q.data,description:Q.description,height:Q.height,spec:Q.spec,title:Q.title},Q.key))})]})}import{Button as P,EmptyState as Q3,EntityCard as W3,ErrorState as X3,LoaderBlock as Z3,StatCard as r,StatCardGroup as G3,StatusChip as JH}from"@contractspec/lib.design-system";import{useCallback as Y3,useState as a}from"react";import{jsx as f,jsxs as _}from"react/jsx-runtime";function q3(H){switch(H){case"ACTIVE":return"success";case"DRAFT":return"neutral";case"ARCHIVED":return"warning";default:return"neutral"}}function h$(){let[H,$]=a("projects"),[W,Q]=a(!1),[Y,q]=a(null),[N,X]=a(!1),{data:Z,subscription:G,loading:J,error:R,stats:z,refetch:V}=w(),U=HH({onSuccess:()=>{V()}}),k=Y3((F)=>{q(F),X(!0)},[]),K=[{id:"projects",label:"Projects",icon:"\uD83D\uDCC1"},{id:"billing",label:"Billing",icon:"\uD83D\uDCB3"},{id:"settings",label:"Settings",icon:"\u2699\uFE0F"}];if(J&&!Z)return f(Z3,{label:"Loading dashboard..."});if(R)return f(X3,{title:"Failed to load dashboard",description:R.message,onRetry:V,retryLabel:"Retry"});return _("div",{className:"space-y-6",children:[_("div",{className:"flex items-center justify-between",children:[f("h2",{className:"font-bold text-2xl",children:"SaaS Dashboard"}),H==="projects"&&_(P,{onPress:()=>Q(!0),children:[f("span",{className:"mr-2",children:"+"})," New Project"]})]}),z&&G&&_(G3,{children:[f(r,{label:"Projects",value:z.total.toString()}),f(r,{label:"Active",value:z.activeCount.toString()}),f(r,{label:"Draft",value:z.draftCount.toString()}),f(r,{label:"Plan",value:G.plan,hint:G.status})]}),Z&&z&&f(NH,{projectLimit:z.projectLimit,projects:Z.items}),f("nav",{className:"flex gap-1 rounded-lg bg-muted p-1",role:"tablist",children:K.map((F)=>_("button",{type:"button",role:"tab","aria-selected":H===F.id,onClick:()=>$(F.id),className:`flex flex-1 items-center justify-center gap-2 rounded-md px-4 py-2 font-medium text-sm transition-colors ${H===F.id?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground"}`,children:[f("span",{children:F.icon}),F.label]},F.id))}),_("div",{className:"min-h-[400px]",role:"tabpanel",children:[H==="projects"&&f(F3,{data:Z,onProjectClick:k}),H==="billing"&&f(f3,{subscription:G}),H==="settings"&&f(N3,{})]}),f($H,{isOpen:W,onClose:()=>Q(!1),onSubmit:async(F)=>{await U.createProject(F)},isLoading:U.createState.loading}),f(QH,{isOpen:N,project:Y,onClose:()=>{X(!1),q(null)},onUpdate:async(F)=>{await U.updateProject(F)},onArchive:async(F)=>{await U.archiveProject(F)},onActivate:async(F)=>{await U.activateProject(F)},onDelete:async(F)=>{await U.deleteProject(F)},isLoading:U.isLoading})]})}function F3({data:H,onProjectClick:$}){if(!H?.items.length)return f(Q3,{title:"No projects yet",description:"Create your first project to get started."});return f("div",{className:"space-y-4",children:f("div",{className:"grid gap-4 md:grid-cols-2 lg:grid-cols-3",children:H.items.map((W)=>f(W3,{cardTitle:W.name,cardSubtitle:W.tier,meta:f("p",{className:"text-muted-foreground text-sm",children:W.description}),chips:f(JH,{tone:q3(W.status),label:W.status}),footer:_("div",{className:"flex w-full items-center justify-between",children:[f("span",{className:"text-muted-foreground text-xs",children:W.updatedAt.toLocaleDateString()}),f(P,{variant:"ghost",size:"sm",onPress:()=>$?.(W),children:"Actions"})]})},W.id))})})}function f3({subscription:H}){if(!H)return null;return _("div",{className:"space-y-6",children:[_("div",{className:"rounded-xl border border-border bg-card p-6",children:[_("div",{className:"flex items-start justify-between",children:[_("div",{children:[_("h3",{className:"font-semibold text-lg",children:[H.plan," Plan"]}),_("p",{className:"text-muted-foreground text-sm",children:["Current period:"," ",H.currentPeriodStart.toLocaleDateString()," -"," ",H.currentPeriodEnd.toLocaleDateString()]}),_("p",{className:"text-muted-foreground text-sm",children:["Billing cycle: ",H.billingCycle]})]}),f(JH,{tone:"success",label:H.status})]}),_("div",{className:"mt-4 flex gap-3",children:[f(P,{variant:"outline",onPress:()=>alert("Upgrade clicked!"),children:"Upgrade Plan"}),f(P,{variant:"ghost",onPress:()=>alert("Manage Billing clicked!"),children:"Manage Billing"})]})]}),H.cancelAtPeriodEnd&&f("div",{className:"rounded-xl border border-border bg-destructive/10 p-4 text-destructive",children:f("p",{className:"font-medium text-sm",children:"\u26A0\uFE0F Your subscription will be cancelled at the end of the current period."})})]})}function N3(){return f("div",{className:"space-y-6",children:_("div",{className:"rounded-xl border border-border bg-card p-6",children:[f("h3",{className:"mb-4 font-semibold text-lg",children:"Organization Settings"}),_("div",{className:"space-y-4",children:[_("div",{children:[f("label",{htmlFor:"org-name",className:"font-medium text-sm",children:"Organization Name"}),f("input",{id:"org-name",type:"text",defaultValue:"Demo Organization",className:"mt-1 block w-full rounded-md border border-input bg-background px-3 py-2"})]}),_("div",{children:[f("label",{htmlFor:"timezone",className:"font-medium text-sm",children:"Default Timezone"}),_("select",{id:"timezone",className:"mt-1 block w-full rounded-md border border-input bg-background px-3 py-2",children:[f("option",{children:"UTC"}),f("option",{children:"America/New_York"}),f("option",{children:"Europe/London"}),f("option",{children:"Asia/Tokyo"})]})]}),f("div",{className:"pt-2",children:f(P,{onPress:()=>alert("Settings saved!"),children:"Save Settings"})})]})]})})}import{Button as XH}from"@contractspec/lib.design-system";import{useState as KH}from"react";import{jsx as A,jsxs as h}from"react/jsx-runtime";function m$(){let[H,$]=KH("Demo Organization"),[W,Q]=KH("UTC");return h("div",{className:"space-y-6",children:[h("div",{className:"rounded-xl border border-border bg-card p-6",children:[A("h3",{className:"mb-4 font-semibold text-lg",children:"Organization Settings"}),h("div",{className:"space-y-4",children:[h("div",{children:[A("label",{htmlFor:"setting-org-name",className:"block font-medium text-sm",children:"Organization Name"}),A("input",{id:"setting-org-name",type:"text",value:H,onChange:(Y)=>$(Y.target.value),className:"mt-1 block w-full rounded-md border border-input bg-background px-3 py-2"})]}),h("div",{children:[A("label",{htmlFor:"setting-timezone",className:"block font-medium text-sm",children:"Default Timezone"}),h("select",{id:"setting-timezone",value:W,onChange:(Y)=>Q(Y.target.value),className:"mt-1 block w-full rounded-md border border-input bg-background px-3 py-2",children:[A("option",{value:"UTC",children:"UTC"}),A("option",{value:"America/New_York",children:"America/New_York"}),A("option",{value:"Europe/London",children:"Europe/London"}),A("option",{value:"Asia/Tokyo",children:"Asia/Tokyo"})]})]})]}),A("div",{className:"mt-6",children:A(XH,{variant:"default",children:"Save Changes"})})]}),h("div",{className:"rounded-xl border border-border bg-card p-6",children:[A("h3",{className:"mb-4 font-semibold text-lg",children:"Notifications"}),A("div",{className:"space-y-3",children:[{label:"Email notifications",defaultChecked:!0},{label:"Usage alerts",defaultChecked:!0},{label:"Weekly digest",defaultChecked:!1}].map((Y)=>h("label",{className:"flex items-center gap-3",children:[A("input",{type:"checkbox",defaultChecked:Y.defaultChecked,className:"h-4 w-4 rounded border-input"}),A("span",{className:"text-sm",children:Y.label})]},Y.label))})]}),h("div",{className:"rounded-xl border border-red-200 bg-red-50 p-6 dark:border-red-900 dark:bg-red-950/20",children:[A("h3",{className:"mb-2 font-semibold text-lg text-red-700 dark:text-red-400",children:"Danger Zone"}),A("p",{className:"mb-4 text-red-600 text-sm dark:text-red-300",children:"These actions are irreversible. Please proceed with caution."}),h("div",{className:"flex gap-3",children:[A(XH,{variant:"secondary",size:"sm",children:"Export Data"}),A(XH,{variant:"secondary",size:"sm",children:"Delete Organization"})]})]})]})}export{HH as useProjectMutations,w as useProjectList,t3 as saasOverlays,SH as saasFreeUserOverlay,xH as saasDemoOverlay,uH as saasDashboardMarkdownRenderer,cH as saasBillingMarkdownRenderer,sH as projectListReactRenderer,dH as projectListMarkdownRenderer,m$ as SaasSettingsPanel,FH as SaasProjectList,h$ as SaasDashboard,QH as ProjectActionsModal,$H as CreateProjectModal};