@contractspec/example.saas-boilerplate 1.57.0 → 1.59.0

package/dist/ui/SaasProjectList.d.ts

@@ -1,14 +1,7 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
-//#region src/ui/SaasProjectList.d.ts
 interface SaasProjectListProps {
-  onProjectClick?: (projectId: string) => void;
-  onCreateProject?: () => void;
+    onProjectClick?: (projectId: string) => void;
+    onCreateProject?: () => void;
 }
-declare function SaasProjectList({
-  onProjectClick,
-  onCreateProject
-}: SaasProjectListProps): react_jsx_runtime0.JSX.Element;
-//#endregion
-export { SaasProjectList };
+export declare function SaasProjectList({ onProjectClick, onCreateProject, }: SaasProjectListProps): import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=SaasProjectList.d.ts.map

package/dist/ui/SaasProjectList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SaasProjectList.d.ts","names":[],"sources":["../../src/ui/SaasProjectList.tsx"],"mappings":";;;UAiBU,oBAAA;EACR,cAAA,IAAkB,SAAA;EAClB,eAAA;AAAA;AAAA,iBAkBc,eAAA,CAAA;EACd,cAAA;EACA;AAAA,GACC,oBAAA,GAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"SaasProjectList.d.ts","sourceRoot":"","sources":["../../src/ui/SaasProjectList.tsx"],"names":[],"mappings":"AAiBA,UAAU,oBAAoB;IAC5B,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAiBD,wBAAgB,eAAe,CAAC,EAC9B,cAAc,EACd,eAAe,GAChB,EAAE,oBAAoB,2CAwEtB"}

package/dist/ui/SaasProjectList.js

@@ -1,76 +1,163 @@
-'use client';
-
-import { useProjectList } from "./hooks/useProjectList.js";
-import { Button, EmptyState, EntityCard, ErrorState, LoaderBlock, StatCard, StatCardGroup, StatusChip } from "@contractspec/lib.design-system";
-import { jsx, jsxs } from "react/jsx-runtime";
+// @bun
+// src/ui/hooks/useProjectList.ts
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useTemplateRuntime } from "@contractspec/lib.example-shared-ui";
+function useProjectList(options = {}) {
+  const { handlers, projectId } = useTemplateRuntime();
+  const { saas } = 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([
+        saas.listProjects({
+          projectId,
+          status: options.status === "all" ? undefined : options.status,
+          search: options.search,
+          limit: options.limit ?? 20,
+          offset: (page - 1) * (options.limit ?? 20)
+        }),
+        saas.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);
+    }
+  }, [saas, 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)
+  };
+}
 
-//#region src/ui/SaasProjectList.tsx
-/**
-* SaaS Project List - Standalone project list component
-*/
+// src/ui/SaasProjectList.tsx
+import {
+  StatCard,
+  StatCardGroup,
+  StatusChip,
+  EntityCard,
+  EmptyState,
+  LoaderBlock,
+  ErrorState,
+  Button
+} from "@contractspec/lib.design-system";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
 function getStatusTone(status) {
-	switch (status) {
-		case "ACTIVE": return "success";
-		case "DRAFT": return "neutral";
-		case "ARCHIVED": return "danger";
-		default: return "neutral";
-	}
+  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__ */ jsx(LoaderBlock, { label: "Loading projects..." });
-	if (error) return /* @__PURE__ */ jsx(ErrorState, {
-		title: "Failed to load projects",
-		description: error.message,
-		onRetry: refetch,
-		retryLabel: "Retry"
-	});
-	if (!data?.items.length) return /* @__PURE__ */ jsx(EmptyState, {
-		title: "No projects found",
-		description: "Create your first project to get started.",
-		primaryAction: onCreateProject ? /* @__PURE__ */ jsx(Button, {
-			onPress: onCreateProject,
-			children: "Create Project"
-		}) : void 0
-	});
-	return /* @__PURE__ */ jsxs("div", {
-		className: "space-y-6",
-		children: [stats && /* @__PURE__ */ jsxs(StatCardGroup, { children: [
-			/* @__PURE__ */ jsx(StatCard, {
-				label: "Total Projects",
-				value: stats.total.toString()
-			}),
-			/* @__PURE__ */ jsx(StatCard, {
-				label: "Active",
-				value: stats.activeCount.toString()
-			}),
-			/* @__PURE__ */ jsx(StatCard, {
-				label: "Draft",
-				value: stats.draftCount.toString()
-			})
-		] }), /* @__PURE__ */ jsx("div", {
-			className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
-			children: data.items.map((project) => /* @__PURE__ */ jsx(EntityCard, {
-				cardTitle: project.name,
-				cardSubtitle: project.tier,
-				meta: /* @__PURE__ */ jsx("p", {
-					className: "text-muted-foreground text-sm",
-					children: project.description
-				}),
-				chips: /* @__PURE__ */ jsx(StatusChip, {
-					tone: getStatusTone(project.status),
-					label: project.status
-				}),
-				footer: /* @__PURE__ */ jsx("span", {
-					className: "text-muted-foreground text-xs",
-					children: project.updatedAt.toLocaleDateString()
-				}),
-				onClick: onProjectClick ? () => onProjectClick(project.id) : void 0
-			}, project.id))
-		})]
-	});
+function SaasProjectList({
+  onProjectClick,
+  onCreateProject
+}) {
+  const { data, loading, error, stats, refetch } = useProjectList();
+  if (loading && !data) {
+    return /* @__PURE__ */ jsxDEV(LoaderBlock, {
+      label: "Loading projects..."
+    }, undefined, false, undefined, this);
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxDEV(ErrorState, {
+      title: "Failed to load projects",
+      description: error.message,
+      onRetry: refetch,
+      retryLabel: "Retry"
+    }, undefined, false, undefined, this);
+  }
+  if (!data?.items.length) {
+    return /* @__PURE__ */ jsxDEV(EmptyState, {
+      title: "No projects found",
+      description: "Create your first project to get started.",
+      primaryAction: onCreateProject ? /* @__PURE__ */ jsxDEV(Button, {
+        onPress: onCreateProject,
+        children: "Create Project"
+      }, undefined, false, undefined, this) : undefined
+    }, undefined, false, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "space-y-6",
+    children: [
+      stats && /* @__PURE__ */ jsxDEV(StatCardGroup, {
+        children: [
+          /* @__PURE__ */ jsxDEV(StatCard, {
+            label: "Total Projects",
+            value: stats.total.toString()
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV(StatCard, {
+            label: "Active",
+            value: stats.activeCount.toString()
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV(StatCard, {
+            label: "Draft",
+            value: stats.draftCount.toString()
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
+        children: data.items.map((project) => /* @__PURE__ */ jsxDEV(EntityCard, {
+          cardTitle: project.name,
+          cardSubtitle: project.tier,
+          meta: /* @__PURE__ */ jsxDEV("p", {
+            className: "text-muted-foreground text-sm",
+            children: project.description
+          }, undefined, false, undefined, this),
+          chips: /* @__PURE__ */ jsxDEV(StatusChip, {
+            tone: getStatusTone(project.status),
+            label: project.status
+          }, undefined, false, undefined, this),
+          footer: /* @__PURE__ */ jsxDEV("span", {
+            className: "text-muted-foreground text-xs",
+            children: project.updatedAt.toLocaleDateString()
+          }, undefined, false, undefined, this),
+          onClick: onProjectClick ? () => onProjectClick(project.id) : undefined
+        }, project.id, false, undefined, this))
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
 }
-
-//#endregion
-export { SaasProjectList };
-//# sourceMappingURL=SaasProjectList.js.map
+export {
+  SaasProjectList
+};

package/dist/ui/SaasSettingsPanel.d.ts

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

package/dist/ui/SaasSettingsPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SaasSettingsPanel.d.ts","names":[],"sources":["../../src/ui/SaasSettingsPanel.tsx"],"mappings":";;;iBAQgB,iBAAA,CAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"SaasSettingsPanel.d.ts","sourceRoot":"","sources":["../../src/ui/SaasSettingsPanel.tsx"],"names":[],"mappings":"AAQA,wBAAgB,iBAAiB,4CAuFhC"}

package/dist/ui/SaasSettingsPanel.js

@@ -1,138 +1,146 @@
-'use client';
-
+// @bun
+// src/ui/SaasSettingsPanel.tsx
 import { useState } from "react";
 import { Button } from "@contractspec/lib.design-system";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/ui/SaasSettingsPanel.tsx
-/**
-* SaaS Settings Panel - Organization and user settings
-*/
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
 function SaasSettingsPanel() {
-	const [orgName, setOrgName] = useState("Demo Organization");
-	const [timezone, setTimezone] = useState("UTC");
-	return /* @__PURE__ */ jsxs("div", {
-		className: "space-y-6",
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "border-border bg-card rounded-xl border p-6",
-				children: [
-					/* @__PURE__ */ jsx("h3", {
-						className: "mb-4 text-lg font-semibold",
-						children: "Organization Settings"
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "space-y-4",
-						children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("label", {
-							htmlFor: "setting-org-name",
-							className: "block text-sm font-medium",
-							children: "Organization Name"
-						}), /* @__PURE__ */ jsx("input", {
-							id: "setting-org-name",
-							type: "text",
-							value: orgName,
-							onChange: (e) => setOrgName(e.target.value),
-							className: "border-input bg-background mt-1 block w-full rounded-md border px-3 py-2"
-						})] }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("label", {
-							htmlFor: "setting-timezone",
-							className: "block text-sm font-medium",
-							children: "Default Timezone"
-						}), /* @__PURE__ */ jsxs("select", {
-							id: "setting-timezone",
-							value: timezone,
-							onChange: (e) => setTimezone(e.target.value),
-							className: "border-input bg-background mt-1 block w-full rounded-md border px-3 py-2",
-							children: [
-								/* @__PURE__ */ jsx("option", {
-									value: "UTC",
-									children: "UTC"
-								}),
-								/* @__PURE__ */ jsx("option", {
-									value: "America/New_York",
-									children: "America/New_York"
-								}),
-								/* @__PURE__ */ jsx("option", {
-									value: "Europe/London",
-									children: "Europe/London"
-								}),
-								/* @__PURE__ */ jsx("option", {
-									value: "Asia/Tokyo",
-									children: "Asia/Tokyo"
-								})
-							]
-						})] })]
-					}),
-					/* @__PURE__ */ jsx("div", {
-						className: "mt-6",
-						children: /* @__PURE__ */ jsx(Button, {
-							variant: "default",
-							children: "Save Changes"
-						})
-					})
-				]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "border-border bg-card rounded-xl border p-6",
-				children: [/* @__PURE__ */ jsx("h3", {
-					className: "mb-4 text-lg font-semibold",
-					children: "Notifications"
-				}), /* @__PURE__ */ jsx("div", {
-					className: "space-y-3",
-					children: [
-						{
-							label: "Email notifications",
-							defaultChecked: true
-						},
-						{
-							label: "Usage alerts",
-							defaultChecked: true
-						},
-						{
-							label: "Weekly digest",
-							defaultChecked: false
-						}
-					].map((item) => /* @__PURE__ */ jsxs("label", {
-						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ jsx("input", {
-							type: "checkbox",
-							defaultChecked: item.defaultChecked,
-							className: "border-input h-4 w-4 rounded"
-						}), /* @__PURE__ */ jsx("span", {
-							className: "text-sm",
-							children: item.label
-						})]
-					}, item.label))
-				})]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "rounded-xl border border-red-200 bg-red-50 p-6 dark:border-red-900 dark:bg-red-950/20",
-				children: [
-					/* @__PURE__ */ jsx("h3", {
-						className: "mb-2 text-lg font-semibold text-red-700 dark:text-red-400",
-						children: "Danger Zone"
-					}),
-					/* @__PURE__ */ jsx("p", {
-						className: "mb-4 text-sm text-red-600 dark:text-red-300",
-						children: "These actions are irreversible. Please proceed with caution."
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "flex gap-3",
-						children: [/* @__PURE__ */ jsx(Button, {
-							variant: "secondary",
-							size: "sm",
-							children: "Export Data"
-						}), /* @__PURE__ */ jsx(Button, {
-							variant: "secondary",
-							size: "sm",
-							children: "Delete Organization"
-						})]
-					})
-				]
-			})
-		]
-	});
+  const [orgName, setOrgName] = useState("Demo Organization");
+  const [timezone, setTimezone] = useState("UTC");
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "space-y-6",
+    children: [
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "border-border bg-card rounded-xl border p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV("h3", {
+            className: "mb-4 text-lg font-semibold",
+            children: "Organization Settings"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "space-y-4",
+            children: [
+              /* @__PURE__ */ jsxDEV("div", {
+                children: [
+                  /* @__PURE__ */ jsxDEV("label", {
+                    htmlFor: "setting-org-name",
+                    className: "block text-sm font-medium",
+                    children: "Organization Name"
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ jsxDEV("input", {
+                    id: "setting-org-name",
+                    type: "text",
+                    value: orgName,
+                    onChange: (e) => setOrgName(e.target.value),
+                    className: "border-input bg-background mt-1 block w-full rounded-md border px-3 py-2"
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              /* @__PURE__ */ jsxDEV("div", {
+                children: [
+                  /* @__PURE__ */ jsxDEV("label", {
+                    htmlFor: "setting-timezone",
+                    className: "block text-sm font-medium",
+                    children: "Default Timezone"
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ jsxDEV("select", {
+                    id: "setting-timezone",
+                    value: timezone,
+                    onChange: (e) => setTimezone(e.target.value),
+                    className: "border-input bg-background mt-1 block w-full rounded-md border px-3 py-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV("option", {
+                        value: "UTC",
+                        children: "UTC"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV("option", {
+                        value: "America/New_York",
+                        children: "America/New_York"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV("option", {
+                        value: "Europe/London",
+                        children: "Europe/London"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV("option", {
+                        value: "Asia/Tokyo",
+                        children: "Asia/Tokyo"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "mt-6",
+            children: /* @__PURE__ */ jsxDEV(Button, {
+              variant: "default",
+              children: "Save Changes"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV("div", {
+        className: "border-border bg-card rounded-xl border p-6",
+        children: [
+          /* @__PURE__ */ jsxDEV("h3", {
+            className: "mb-4 text-lg font-semibold",
+            children: "Notifications"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "space-y-3",
+            children: [
+              { label: "Email notifications", defaultChecked: true },
+              { label: "Usage alerts", defaultChecked: true },
+              { label: "Weekly digest", defaultChecked: false }
+            ].map((item) => /* @__PURE__ */ jsxDEV("label", {
+              className: "flex items-center gap-3",
+              children: [
+                /* @__PURE__ */ jsxDEV("input", {
+                  type: "checkbox",
+                  defaultChecked: item.defaultChecked,
+                  className: "border-input h-4 w-4 rounded"
+                }, undefined, false, undefined, this),
+                /* @__PURE__ */ jsxDEV("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__ */ jsxDEV("div", {
+        className: "rounded-xl border border-red-200 bg-red-50 p-6 dark:border-red-900 dark:bg-red-950/20",
+        children: [
+          /* @__PURE__ */ jsxDEV("h3", {
+            className: "mb-2 text-lg font-semibold text-red-700 dark:text-red-400",
+            children: "Danger Zone"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("p", {
+            className: "mb-4 text-sm text-red-600 dark:text-red-300",
+            children: "These actions are irreversible. Please proceed with caution."
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV("div", {
+            className: "flex gap-3",
+            children: [
+              /* @__PURE__ */ jsxDEV(Button, {
+                variant: "secondary",
+                size: "sm",
+                children: "Export Data"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV(Button, {
+                variant: "secondary",
+                size: "sm",
+                children: "Delete Organization"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
 }
-
-//#endregion
-export { SaasSettingsPanel };
-//# sourceMappingURL=SaasSettingsPanel.js.map
+export {
+  SaasSettingsPanel
+};

package/dist/ui/hooks/index.d.ts

@@ -1,3 +1,3 @@
-import { UseProjectListOptions, useProjectList } from "./useProjectList.js";
-import { UseProjectMutationsOptions, useProjectMutations } from "./useProjectMutations.js";
-export { type UseProjectListOptions, type UseProjectMutationsOptions, useProjectList, useProjectMutations };
+export { useProjectList, type UseProjectListOptions } from './useProjectList';
+export { useProjectMutations, type UseProjectMutationsOptions, } from './useProjectMutations';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/hooks/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,KAAK,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAC9E,OAAO,EACL,mBAAmB,EACnB,KAAK,0BAA0B,GAChC,MAAM,uBAAuB,CAAC"}