@gtcx/templates 0.1.0

package/dist/index.js

@@ -0,0 +1,1433 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  ActivityTemplate: () => ActivityTemplate,
+  AuditTrail: () => AuditTrail,
+  AuthShell: () => AuthShell,
+  BillingTemplate: () => BillingTemplate,
+  BulkActionsBar: () => BulkActionsBar,
+  DashboardTemplate: () => DashboardTemplate,
+  DetailTemplate: () => DetailTemplate,
+  ErrorPageTemplate: () => ErrorPageTemplate,
+  InviteTemplate: () => InviteTemplate,
+  KpiCard: () => KpiCard,
+  ListTemplate: () => ListTemplate,
+  MembersTemplate: () => MembersTemplate,
+  NotificationsTemplate: () => NotificationsTemplate,
+  ProfileTemplate: () => ProfileTemplate,
+  ProjectsTemplate: () => ProjectsTemplate,
+  SectionCard: () => SectionCard,
+  SecurityTemplate: () => SecurityTemplate,
+  SettingsTemplate: () => SettingsTemplate,
+  TemplateFrame: () => TemplateFrame,
+  WizardTemplate: () => WizardTemplate,
+  templateActionsToPageHeaderActions: () => templateActionsToPageHeaderActions
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/types.ts
+function templateActionsToPageHeaderActions(actions) {
+  return actions.map((action) => ({
+    key: action.key,
+    label: action.label,
+    onClick: action.onAction,
+    kind: action.kind,
+    disabled: action.disabled,
+    ariaLabel: action.ariaLabel,
+    icon: action.icon
+  }));
+}
+
+// src/template-frame.tsx
+var import_antd2 = require("antd");
+
+// src/components/page-header.tsx
+var import_antd = require("antd");
+var import_jsx_runtime = require("react/jsx-runtime");
+var { Title, Text } = import_antd.Typography;
+function PageHeader({ title, subtitle, breadcrumbs, actions }) {
+  const { token } = import_antd.theme.useToken();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { style: { marginBottom: token.marginLG }, children: [
+    breadcrumbs && breadcrumbs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_antd.Breadcrumb,
+      {
+        style: { marginBottom: token.marginSM },
+        items: breadcrumbs.map((item) => ({
+          title: item.href ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { href: item.href, style: { color: token.colorText }, children: item.label }) : item.label
+        }))
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "flex-start" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, { level: 3, style: { margin: 0 }, children: title }),
+        subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Text, { style: { marginTop: token.marginXXS, color: token.colorTextSecondary }, children: subtitle })
+      ] }),
+      actions && actions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Space, { children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_antd.Button,
+        {
+          type: action.kind === "primary" ? "primary" : action.kind === "link" ? "link" : "default",
+          danger: action.kind === "danger",
+          disabled: action.disabled,
+          icon: action.icon,
+          onClick: action.onClick,
+          "aria-label": action.ariaLabel,
+          children: action.label
+        },
+        action.key
+      )) })
+    ] })
+  ] });
+}
+
+// src/template-frame.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var { Text: Text2 } = import_antd2.Typography;
+function TemplateFrame({
+  title,
+  subtitle,
+  breadcrumbs,
+  data: _data,
+  actions,
+  filters,
+  audit,
+  layout,
+  children
+}) {
+  const { token } = import_antd2.theme.useToken();
+  const showBreadcrumbs = layout?.showBreadcrumbs ?? true;
+  const contentPadding = layout?.contentPadding ?? void 0;
+  const pageHeaderActions = actions ? templateActionsToPageHeaderActions(actions) : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: { padding: contentPadding }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      PageHeader,
+      {
+        title,
+        subtitle,
+        breadcrumbs: showBreadcrumbs ? breadcrumbs : void 0,
+        actions: pageHeaderActions
+      }
+    ),
+    filters?.content && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { marginBottom: token.marginLG }, children: filters.content }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("main", { children }),
+    audit && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      import_antd2.Card,
+      {
+        size: "small",
+        style: { marginTop: token.marginXL },
+        styles: { body: { padding: token.paddingSM } },
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_antd2.Space, { direction: "vertical", size: 4, children: [
+          audit.summary && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text2, { style: { color: token.colorTextSecondary }, children: audit.summary }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_antd2.Space, { size: "large", wrap: true, children: [
+            audit.lastUpdatedAt && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text2, { style: { fontSize: token.fontSizeSM, color: token.colorTextSecondary }, children: [
+              "Updated: ",
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("time", { dateTime: audit.lastUpdatedAt, children: audit.lastUpdatedAt })
+            ] }),
+            audit.lastUpdatedBy && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text2, { style: { fontSize: token.fontSizeSM, color: token.colorTextSecondary }, children: [
+              "By: ",
+              audit.lastUpdatedBy
+            ] }),
+            audit.sourceSystem && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Text2, { style: { fontSize: token.fontSizeSM, color: token.colorTextSecondary }, children: [
+              "Source: ",
+              audit.sourceSystem
+            ] }),
+            audit.evidenceUrl && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "a",
+              {
+                href: audit.evidenceUrl,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                style: { fontSize: token.fontSizeSM, color: token.colorPrimary },
+                children: "View Evidence"
+              }
+            )
+          ] })
+        ] })
+      }
+    )
+  ] });
+}
+
+// src/components/kpi-card.tsx
+var import_icons = require("@ant-design/icons");
+var import_antd3 = require("antd");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var { Text: Text3, Title: Title2 } = import_antd3.Typography;
+function KpiCard({
+  label,
+  value,
+  delta,
+  trend,
+  helpText,
+  icon,
+  onClick,
+  "aria-label": ariaLabel
+}) {
+  const { token } = import_antd3.theme.useToken();
+  const trendColor = trend === "up" ? token.colorSuccess : trend === "down" ? token.colorError : token.colorTextSecondary;
+  const TrendIcon = trend === "up" ? import_icons.ArrowUpOutlined : trend === "down" ? import_icons.ArrowDownOutlined : import_icons.MinusOutlined;
+  const isInteractive = !!onClick;
+  const handleKeyDown = (e) => {
+    if (isInteractive && (e.key === "Enter" || e.key === " ")) {
+      e.preventDefault();
+      onClick?.();
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_antd3.Card,
+    {
+      size: "small",
+      hoverable: isInteractive,
+      onClick,
+      tabIndex: isInteractive ? 0 : void 0,
+      role: isInteractive ? "button" : void 0,
+      onKeyDown: isInteractive ? handleKeyDown : void 0,
+      "aria-label": ariaLabel ?? label,
+      styles: { body: { padding: token.paddingMD } },
+      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_antd3.Space, { direction: "vertical", size: 4, style: { width: "100%" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_antd3.Space, { size: "small", children: [
+          icon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { color: token.colorTextSecondary }, children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text3, { type: "secondary", style: { fontSize: token.fontSizeSM }, children: label })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Title2, { level: 3, style: { margin: 0 }, children: value }),
+        (delta || helpText) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_antd3.Space, { size: "small", children: [
+          delta && trend && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Text3, { style: { color: trendColor, fontSize: token.fontSizeSM }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TrendIcon, { style: { marginRight: 4 } }),
+            delta
+          ] }),
+          helpText && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text3, { type: "secondary", style: { fontSize: token.fontSizeSM }, children: helpText })
+        ] })
+      ] })
+    }
+  );
+}
+
+// src/components/section-card.tsx
+var import_antd4 = require("antd");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var { Title: Title3 } = import_antd4.Typography;
+function SectionCard({ title, subtitle, extra, children, noPadding }) {
+  const { token } = import_antd4.theme.useToken();
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+    import_antd4.Card,
+    {
+      role: "region",
+      "aria-label": title,
+      styles: { body: noPadding ? { padding: 0 } : void 0 },
+      children: [
+        (title || extra) && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "flex-start",
+              marginBottom: token.marginMD
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+                title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Title3, { level: 4, style: { margin: 0 }, children: title }),
+                subtitle && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { color: token.colorTextSecondary, fontSize: token.fontSizeSM }, children: subtitle })
+              ] }),
+              extra && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { children: extra })
+            ]
+          }
+        ),
+        children
+      ]
+    }
+  );
+}
+
+// src/components/bulk-actions.tsx
+var import_antd5 = require("antd");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var { Text: Text4 } = import_antd5.Typography;
+function BulkActionsBar({
+  selectedCount,
+  selectedRowKeys,
+  actions,
+  onClear
+}) {
+  const { token } = import_antd5.theme.useToken();
+  if (selectedCount === 0) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": "Bulk actions",
+      style: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        padding: `${token.paddingSM}px ${token.paddingMD}px`,
+        background: token.colorBgContainer,
+        border: `1px solid ${token.colorPrimaryBorder ?? token.colorPrimary}`,
+        borderRadius: token.borderRadius,
+        marginBottom: token.marginMD
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_antd5.Space, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Text4, { strong: true, "aria-live": "polite", children: [
+            selectedCount,
+            " selected"
+          ] }),
+          onClear && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_antd5.Button, { type: "text", size: "small", onClick: onClear, children: "Clear" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_antd5.Space, { children: actions.map((action) => {
+          const isDanger = action.kind === "danger";
+          return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            import_antd5.Button,
+            {
+              type: isDanger ? "default" : action.kind === "primary" ? "primary" : action.kind === "link" ? "link" : "default",
+              danger: isDanger,
+              size: "small",
+              disabled: action.disabled,
+              onClick: () => action.onAction(selectedRowKeys),
+              children: action.label
+            },
+            action.key
+          );
+        }) })
+      ]
+    }
+  );
+}
+
+// src/components/audit-trail.tsx
+var import_icons2 = require("@ant-design/icons");
+var import_antd6 = require("antd");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var { Text: Text5, Title: Title4 } = import_antd6.Typography;
+function AuditTrail({
+  title = "Audit Trail",
+  events,
+  loading,
+  onLoadMore
+}) {
+  const { token } = import_antd6.theme.useToken();
+  const timelineItems = events.map((event) => ({
+    key: event.key,
+    dot: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_icons2.ClockCircleOutlined, { style: { fontSize: 14 } }),
+    children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_antd6.Space, { direction: "vertical", size: 2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_antd6.Space, { size: "small", wrap: true, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text5, { strong: true, children: event.action }),
+        event.by && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Text5, { type: "secondary", children: [
+          "by ",
+          event.by
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Text5, { type: "secondary", style: { fontSize: token.fontSizeSM }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("time", { dateTime: event.at, children: event.at }),
+        event.sourceSystem && ` \xB7 ${event.sourceSystem}`
+      ] }),
+      event.description && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { children: event.description }),
+      event.evidenceUrl && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        "a",
+        {
+          href: event.evidenceUrl,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          style: { fontSize: token.fontSizeSM },
+          children: "View Evidence"
+        }
+      )
+    ] })
+  }));
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_antd6.Card, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Title4, { level: 5, style: { marginBottom: token.marginMD }, children: title }),
+    loading && events.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { textAlign: "center", padding: token.paddingLG }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_antd6.Spin, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { role: "log", "aria-label": title, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_antd6.Timeline, { items: timelineItems }),
+      onLoadMore && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_antd6.Button, { type: "link", onClick: onLoadMore, loading, children: "Load more" }) })
+    ] })
+  ] });
+}
+
+// src/templates/dashboard.tsx
+var import_antd7 = require("antd");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function DashboardTemplate({
+  title,
+  subtitle,
+  breadcrumbs,
+  data,
+  actions,
+  filters,
+  audit,
+  layout
+}) {
+  const { token } = import_antd7.theme.useToken();
+  const kpis = data?.kpis ?? [];
+  const panels = data?.panels ?? [];
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    TemplateFrame,
+    {
+      title,
+      subtitle,
+      breadcrumbs,
+      data,
+      actions,
+      filters,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_antd7.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        kpis.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_antd7.Row, { gutter: [token.marginMD, token.marginMD], children: kpis.map((kpi) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_antd7.Col, { xs: 24, sm: 12, lg: 6, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          KpiCard,
+          {
+            label: kpi.label,
+            value: kpi.value,
+            delta: kpi.delta,
+            trend: kpi.trend,
+            helpText: kpi.helpText,
+            icon: kpi.icon,
+            onClick: kpi.onClick
+          }
+        ) }, kpi.key)) }),
+        panels.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_antd7.Row, { gutter: [token.marginMD, token.marginMD], children: panels.map((panel) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_antd7.Col, { xs: 24, lg: panel.span ?? 12, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SectionCard, { title: panel.title, subtitle: panel.subtitle, extra: panel.extra, children: panel.content }) }, panel.key)) })
+      ] })
+    }
+  );
+}
+
+// src/templates/list.tsx
+var import_icons3 = require("@ant-design/icons");
+var import_antd8 = require("antd");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function ListTemplate({
+  title,
+  subtitle,
+  breadcrumbs,
+  data,
+  actions,
+  filters,
+  audit,
+  layout,
+  table,
+  selection,
+  exports: exportSpecs,
+  tools
+}) {
+  const { token } = import_antd8.theme.useToken();
+  const items = data?.items ?? [];
+  const loading = data?.loading ?? false;
+  const selectedRowKeys = selection?.selectedRowKeys;
+  const selectedCount = selectedRowKeys?.length ?? 0;
+  const bulkActions = selection?.bulkActions?.map((action) => ({
+    key: action.key,
+    label: action.label,
+    kind: action.kind,
+    disabled: action.disabled,
+    onAction: (keys) => action.onAction(keys)
+  })) ?? [];
+  const rowSelection = selection?.enabled ? {
+    ...selectedRowKeys !== void 0 ? { selectedRowKeys } : {},
+    onChange: (keys) => selection.onSelectionChange?.(keys),
+    getCheckboxProps: (record, index) => {
+      if (selection.getAriaLabel) {
+        const label = selection.getAriaLabel(record, index);
+        return { name: label, "aria-label": `Select ${label}` };
+      }
+      const fallback = record?.name ?? record?.title ?? record?.key ?? "row";
+      return {
+        name: String(fallback),
+        "aria-label": `Select ${fallback}`
+      };
+    }
+  } : void 0;
+  const hasToolbar = exportSpecs && exportSpecs.length > 0 || tools;
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    TemplateFrame,
+    {
+      title,
+      subtitle,
+      breadcrumbs,
+      data,
+      actions,
+      filters,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_antd8.Space, { direction: "vertical", size: "middle", style: { width: "100%" }, children: [
+        hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "flex-end",
+              gap: token.marginSM,
+              flexWrap: "wrap"
+            },
+            children: [
+              exportSpecs?.map((exp) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                import_antd8.Button,
+                {
+                  icon: exp.icon ?? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_icons3.DownloadOutlined, {}),
+                  onClick: exp.onExport,
+                  disabled: exp.disabled,
+                  children: exp.label
+                },
+                exp.key
+              )),
+              tools
+            ]
+          }
+        ),
+        selection?.enabled && selectedCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+          BulkActionsBar,
+          {
+            selectedCount,
+            selectedRowKeys: selectedRowKeys ?? [],
+            actions: bulkActions,
+            onClear: () => selection.onSelectionChange?.([])
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_antd8.Card, { styles: { body: { padding: 0 } }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_antd8.Table, { ...table, dataSource: items, loading, rowSelection }) })
+      ] })
+    }
+  );
+}
+
+// src/templates/detail.tsx
+var import_antd9 = require("antd");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function DetailTemplate({
+  title,
+  subtitle,
+  breadcrumbs,
+  data,
+  actions,
+  audit,
+  layout
+}) {
+  const summary = data?.summary;
+  const sections = data?.sections ?? [];
+  const auditTrail = data?.auditTrail;
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    TemplateFrame,
+    {
+      title,
+      subtitle,
+      breadcrumbs,
+      data,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_antd9.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        summary && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SectionCard, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          import_antd9.Descriptions,
+          {
+            items: summary.items,
+            column: summary.columns ?? { xs: 1, sm: 2, lg: 3 },
+            size: "small",
+            bordered: true
+          }
+        ) }),
+        sections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SectionCard, { title: section.title, extra: section.extra, children: section.content }, section.key)),
+        auditTrail && (auditTrail.events.length > 0 || auditTrail.loading) && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          AuditTrail,
+          {
+            title: auditTrail.title,
+            events: auditTrail.events,
+            loading: auditTrail.loading,
+            onLoadMore: auditTrail.onLoadMore
+          }
+        )
+      ] })
+    }
+  );
+}
+
+// src/templates/error.tsx
+var import_antd10 = require("antd");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var defaultTitles = {
+  401: "Unauthorized",
+  403: "Access Denied",
+  404: "Page Not Found",
+  500: "Server Error"
+};
+var defaultMessages = {
+  401: "You need to sign in to access this page.",
+  403: "You don't have permission to access this resource.",
+  404: "The page you're looking for doesn't exist or has been moved.",
+  500: "Something went wrong on our end. Please try again later."
+};
+var statusToResultStatus = {
+  401: "warning",
+  403: "error",
+  404: "404",
+  500: "500"
+};
+function ErrorPageTemplate({
+  status,
+  title,
+  message,
+  actions,
+  extra
+}) {
+  const { token } = import_antd10.theme.useToken();
+  const resolvedTitle = title ?? defaultTitles[status];
+  const resolvedMessage = message ?? defaultMessages[status];
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    "div",
+    {
+      style: {
+        minHeight: "100vh",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: token.paddingLG,
+        background: token.colorBgLayout
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        import_antd10.Result,
+        {
+          status: statusToResultStatus[status],
+          title: resolvedTitle,
+          subTitle: resolvedMessage,
+          extra: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_antd10.Space, { direction: "vertical", size: "middle", align: "center", children: [
+            actions && actions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_antd10.Space, { children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              import_antd10.Button,
+              {
+                type: action.kind === "primary" ? "primary" : action.kind === "link" ? "link" : "default",
+                danger: action.kind === "danger",
+                disabled: action.disabled,
+                icon: action.icon,
+                onClick: action.onAction,
+                "aria-label": action.ariaLabel,
+                children: action.label
+              },
+              action.key
+            )) }),
+            extra
+          ] })
+        }
+      )
+    }
+  );
+}
+
+// src/templates/wizard.tsx
+var import_antd11 = require("antd");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function WizardTemplate({
+  title,
+  subtitle,
+  breadcrumbs,
+  actions,
+  data,
+  filters,
+  audit,
+  layout,
+  onStepChange
+}) {
+  const steps = data?.steps ?? [];
+  const currentStep = data?.currentStep ?? 0;
+  const activeStep = steps[currentStep];
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    TemplateFrame,
+    {
+      title,
+      subtitle,
+      breadcrumbs,
+      actions,
+      data,
+      filters,
+      audit,
+      layout,
+      children: steps.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_antd11.Empty, { description: "No steps configured" }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_antd11.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          import_antd11.Steps,
+          {
+            current: currentStep,
+            onChange: onStepChange,
+            items: steps.map((step) => ({
+              key: step.key,
+              title: step.title,
+              description: step.description
+            }))
+          }
+        ),
+        activeStep && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SectionCard, { title: activeStep.title, subtitle: activeStep.description, children: activeStep.content })
+      ] })
+    }
+  );
+}
+
+// src/templates/settings.tsx
+var import_antd12 = require("antd");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function SettingsTemplate({
+  title,
+  subtitle,
+  breadcrumbs,
+  actions,
+  data,
+  filters,
+  audit,
+  layout
+}) {
+  const sections = data?.sections ?? [];
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    TemplateFrame,
+    {
+      title,
+      subtitle,
+      breadcrumbs,
+      actions,
+      data,
+      filters,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_antd12.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: sections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SectionCard, { title: section.title, subtitle: section.subtitle, children: section.content }, section.key)) })
+    }
+  );
+}
+
+// src/templates/auth-shell.tsx
+var import_antd13 = require("antd");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var { Title: Title5, Text: Text6 } = import_antd13.Typography;
+function AuthShell({
+  brand,
+  title,
+  subtitle,
+  footer,
+  children,
+  maxWidth = 420
+}) {
+  const { token } = import_antd13.theme.useToken();
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    "div",
+    {
+      style: {
+        minHeight: "100vh",
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: token.paddingLG,
+        background: token.colorBgLayout
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { width: "100%", maxWidth }, children: [
+        brand && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { textAlign: "center", marginBottom: token.marginLG }, children: brand }),
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_antd13.Card, { styles: { body: { padding: token.paddingXL } }, children: [
+          (title || subtitle) && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { style: { textAlign: "center", marginBottom: token.marginLG }, children: [
+            title && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Title5, { level: 3, style: { margin: 0 }, children: title }),
+            subtitle && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              Text6,
+              {
+                style: {
+                  marginTop: token.marginXS,
+                  display: "block",
+                  color: token.colorTextSecondary
+                },
+                children: subtitle
+              }
+            )
+          ] }),
+          children
+        ] }),
+        footer && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          "div",
+          {
+            style: {
+              textAlign: "center",
+              marginTop: token.marginLG,
+              color: token.colorTextSecondary,
+              fontSize: token.fontSizeSM
+            },
+            children: footer
+          }
+        )
+      ] })
+    }
+  );
+}
+
+// src/templates/profile.tsx
+var import_antd14 = require("antd");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+function ProfileTemplate({
+  title,
+  breadcrumbs,
+  actions,
+  data,
+  filters: _filters,
+  audit,
+  layout
+}) {
+  const { token } = import_antd14.theme.useToken();
+  const profile = data ?? {};
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+    TemplateFrame,
+    {
+      title: title ?? profile.name ?? "Profile",
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { display: "flex", gap: 24, flexWrap: "wrap", marginBottom: 24 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            import_antd14.Avatar,
+            {
+              size: 96,
+              src: profile.avatar ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("img", { src: profile.avatar, alt: profile.name ?? "Profile avatar" }) : void 0,
+              children: profile.name?.[0]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { flex: 1 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Typography.Title, { level: 3, style: { margin: 0 }, children: profile.name }),
+            profile.role && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Typography.Text, { style: { color: token.colorTextSecondary }, children: profile.role }),
+            profile.bio && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Typography.Paragraph, { style: { marginTop: 8 }, children: profile.bio }),
+            profile.tags && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Space, { wrap: true, children: profile.tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Tag, { children: tag }, tag)) })
+          ] })
+        ] }),
+        profile.stats && profile.stats.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              gap: 32,
+              padding: "16px 0",
+              borderTop: `1px solid ${token.colorBorderSecondary}`,
+              borderBottom: `1px solid ${token.colorBorderSecondary}`,
+              marginBottom: 24
+            },
+            children: profile.stats.map((stat) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { textAlign: "center" }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { fontSize: 24, fontWeight: 600 }, children: stat.value }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { fontSize: 13, color: token.colorTextSecondary }, children: stat.label })
+            ] }, stat.label))
+          }
+        ),
+        profile.details && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Descriptions, { column: 2, style: { marginBottom: 24 }, children: profile.details.map((d) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_antd14.Descriptions.Item, { label: d.label, children: d.value }, d.label)) }),
+        profile.tabs && profile.tabs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          import_antd14.Tabs,
+          {
+            items: profile.tabs.map((tab) => ({
+              key: tab.key,
+              label: tab.label,
+              children: tab.content
+            }))
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/templates/billing.tsx
+var import_antd15 = require("antd");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+function BillingTemplate({
+  title = "Billing",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout,
+  onChangePlan: _onChangePlan,
+  onAddPaymentMethod: _onAddPaymentMethod
+}) {
+  const { token } = import_antd15.theme.useToken();
+  const billing = data ?? {};
+  const invoiceColumns = [
+    { title: "Invoice", dataIndex: "id", key: "id" },
+    { title: "Date", dataIndex: "date", key: "date" },
+    { title: "Amount", dataIndex: "amount", key: "amount" },
+    {
+      title: "Status",
+      dataIndex: "status",
+      key: "status",
+      render: (status) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        import_antd15.Tag,
+        {
+          color: status === "paid" ? "#166534" : status === "pending" ? "#92400e" : "#991b1b",
+          style: { color: "#ffffff", borderColor: "transparent" },
+          children: status
+        }
+      )
+    }
+  ];
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_antd15.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        billing.currentPlan && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SectionCard, { title: "Current Plan", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_antd15.Descriptions, { column: 2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_antd15.Descriptions.Item, { label: "Plan", children: billing.currentPlan.name }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_antd15.Descriptions.Item, { label: "Price", children: [
+            billing.currentPlan.price,
+            billing.currentPlan.interval && ` / ${billing.currentPlan.interval}`
+          ] })
+        ] }) }),
+        billing.paymentMethods && billing.paymentMethods.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SectionCard, { title: "Payment Methods", children: billing.paymentMethods.map((pm, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "space-between",
+              padding: "8px 0",
+              borderBottom: `1px solid ${token.colorBorderSecondary}`
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { children: [
+                pm.type,
+                " ending in ",
+                pm.last4
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { children: [
+                pm.expiry && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_antd15.Typography.Text, { style: { color: token.colorTextSecondary }, children: [
+                  "Expires ",
+                  pm.expiry
+                ] }),
+                pm.isDefault && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  import_antd15.Tag,
+                  {
+                    color: "#1d4ed8",
+                    style: { marginLeft: 8, color: "#ffffff", borderColor: "transparent" },
+                    children: "Default"
+                  }
+                )
+              ] })
+            ]
+          },
+          i
+        )) }),
+        billing.invoices && billing.invoices.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SectionCard, { title: "Invoice History", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          import_antd15.Table,
+          {
+            dataSource: billing.invoices,
+            columns: invoiceColumns,
+            rowKey: "id",
+            pagination: false,
+            size: "small"
+          }
+        ) })
+      ] })
+    }
+  );
+}
+
+// src/templates/security.tsx
+var import_antd16 = require("antd");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+function SecurityTemplate({
+  title = "Security",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout
+}) {
+  const security = data ?? {};
+  const sessionColumns = [
+    { title: "Device", dataIndex: "device", key: "device" },
+    { title: "Location", dataIndex: "location", key: "location" },
+    { title: "Last Active", dataIndex: "lastActive", key: "lastActive" },
+    {
+      title: "Current Session",
+      key: "current",
+      render: (_, record) => record.isCurrent ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd16.Tag, { color: "#166534", style: { color: "#ffffff", borderColor: "transparent" }, children: "Current" }) : null
+    }
+  ];
+  const logColumns = [
+    { title: "Time", dataIndex: "timestamp", key: "timestamp" },
+    { title: "Action", dataIndex: "action", key: "action" },
+    { title: "IP", dataIndex: "ip", key: "ip" },
+    {
+      title: "Status",
+      dataIndex: "status",
+      key: "status",
+      render: (status) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        import_antd16.Tag,
+        {
+          color: status === "success" ? "#166534" : status === "warning" ? "#92400e" : "#991b1b",
+          style: { color: "#ffffff", borderColor: "transparent" },
+          children: status
+        }
+      )
+    }
+  ];
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_antd16.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SectionCard, { title: "Overview", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_antd16.Descriptions, { column: 2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd16.Descriptions.Item, { label: "Two-Factor Authentication", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            import_antd16.Tag,
+            {
+              color: security.twoFactorEnabled ? "#166534" : "#525252",
+              style: { color: "#ffffff", borderColor: "transparent" },
+              children: security.twoFactorEnabled ? "Enabled" : "Disabled"
+            }
+          ) }),
+          security.passwordLastChanged && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_antd16.Descriptions.Item, { label: "Password Last Changed", children: security.passwordLastChanged })
+        ] }) }),
+        security.sessions && security.sessions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SectionCard, { title: "Active Sessions", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          import_antd16.Table,
+          {
+            dataSource: security.sessions,
+            columns: sessionColumns,
+            rowKey: "id",
+            pagination: false,
+            size: "small"
+          }
+        ) }),
+        security.securityLog && security.securityLog.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SectionCard, { title: "Security Log", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          import_antd16.Table,
+          {
+            dataSource: security.securityLog,
+            columns: logColumns,
+            rowKey: "timestamp",
+            pagination: { pageSize: 10 },
+            size: "small"
+          }
+        ) })
+      ] })
+    }
+  );
+}
+
+// src/templates/members.tsx
+var import_antd17 = require("antd");
+var import_jsx_runtime17 = require("react/jsx-runtime");
+function MembersTemplate({
+  title = "Team Members",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout
+}) {
+  const { token } = import_antd17.theme.useToken();
+  const members = data ?? {};
+  const memberColumns = [
+    {
+      title: "Member",
+      key: "member",
+      render: (_, record) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_antd17.Space, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd17.Avatar, { size: "small", src: record.avatar, children: record.name[0] }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { fontWeight: 500 }, children: record.name }),
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd17.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: record.email })
+        ] })
+      ] })
+    },
+    { title: "Role", dataIndex: "role", key: "role", render: (role) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_antd17.Tag, { children: role }) },
+    {
+      title: "Status",
+      dataIndex: "status",
+      key: "status",
+      render: (status) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        import_antd17.Tag,
+        {
+          color: status === "active" ? "#166534" : status === "invited" ? "#92400e" : "#525252",
+          style: { color: "#ffffff", borderColor: "transparent" },
+          children: status
+        }
+      )
+    },
+    { title: "Joined", dataIndex: "joinedAt", key: "joinedAt" }
+  ];
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_antd17.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        members.roles && members.roles.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SectionCard, { title: "Roles", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { display: "flex", gap: 16, flexWrap: "wrap" }, children: members.roles.map((role) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+          "div",
+          {
+            style: {
+              padding: "12px 16px",
+              border: `1px solid ${token.colorBorderSecondary}`,
+              borderRadius: 8,
+              minWidth: 150
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { fontWeight: 600 }, children: role.name }),
+              role.description && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { fontSize: 12, color: token.colorTextSecondary }, children: role.description }),
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { style: { fontSize: 13, marginTop: 4 }, children: [
+                role.memberCount,
+                " members"
+              ] })
+            ]
+          },
+          role.name
+        )) }) }),
+        members.members && members.members.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SectionCard, { title: `Members${members.totalMembers ? ` (${members.totalMembers})` : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          import_antd17.Table,
+          {
+            dataSource: members.members,
+            columns: memberColumns,
+            rowKey: "id",
+            pagination: { pageSize: 10 },
+            size: "small"
+          }
+        ) })
+      ] })
+    }
+  );
+}
+
+// src/templates/notifications.tsx
+var import_antd18 = require("antd");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+function NotificationsTemplate({
+  title = "Notifications",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout,
+  onToggle
+}) {
+  const { token } = import_antd18.theme.useToken();
+  const notifications = data ?? {};
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_antd18.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: notifications.groups?.map((group) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SectionCard, { title: group.title, children: group.channels.map((channel) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+        "div",
+        {
+          style: {
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "center",
+            padding: "12px 0",
+            borderBottom: `1px solid ${token.colorBorderSecondary}`
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { fontWeight: 500, color: token.colorText }, children: channel.label }),
+              channel.description && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_antd18.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: channel.description })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_antd18.Space, { size: "large", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_antd18.Space, { direction: "vertical", align: "center", size: 0, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_antd18.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: "Email" }),
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  import_antd18.Switch,
+                  {
+                    size: "small",
+                    checked: channel.email,
+                    "aria-label": `${channel.label}: email notifications`,
+                    onChange: (v) => onToggle?.(channel.key, "email", v)
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_antd18.Space, { direction: "vertical", align: "center", size: 0, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_antd18.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: "Push" }),
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  import_antd18.Switch,
+                  {
+                    size: "small",
+                    checked: channel.push,
+                    "aria-label": `${channel.label}: push notifications`,
+                    onChange: (v) => onToggle?.(channel.key, "push", v)
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_antd18.Space, { direction: "vertical", align: "center", size: 0, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_antd18.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: "SMS" }),
+                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  import_antd18.Switch,
+                  {
+                    size: "small",
+                    checked: channel.sms,
+                    "aria-label": `${channel.label}: sms notifications`,
+                    onChange: (v) => onToggle?.(channel.key, "sms", v)
+                  }
+                )
+              ] })
+            ] })
+          ]
+        },
+        channel.key
+      )) }, group.title)) })
+    }
+  );
+}
+
+// src/templates/activity.tsx
+var import_antd19 = require("antd");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var colorMap = {
+  info: "#1d4ed8",
+  success: "#166534",
+  warning: "#92400e",
+  error: "#991b1b"
+};
+function ActivityTemplate({
+  title = "Activity",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout
+}) {
+  const { token } = import_antd19.theme.useToken();
+  const activity = data ?? {};
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        import_antd19.Timeline,
+        {
+          items: activity.events?.map((event) => ({
+            color: colorMap[event.type ?? "info"],
+            children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_antd19.Space, { align: "start", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_antd19.Avatar, { size: "small", src: event.actor.avatar, children: event.actor.name[0] }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_antd19.Typography.Text, { strong: true, children: event.actor.name }),
+                  " ",
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_antd19.Typography.Text, { children: event.action }),
+                  event.target && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_antd19.Typography.Text, { strong: true, children: [
+                    " ",
+                    event.target
+                  ] })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_antd19.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: event.timestamp }),
+                event.detail && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { marginTop: 4 }, children: event.detail })
+              ] })
+            ] }) }, event.id)
+          }))
+        }
+      )
+    }
+  );
+}
+
+// src/templates/invite.tsx
+var import_antd20 = require("antd");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+function InviteTemplate({
+  title = "Invite a Friend",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout,
+  onCopyLink
+}) {
+  const { token } = import_antd20.theme.useToken();
+  const invite = data ?? {};
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_antd20.Space, { direction: "vertical", size: "large", style: { width: "100%" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SectionCard, { title: "Your Referral Link", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_antd20.Space, { direction: "vertical", style: { width: "100%" }, children: [
+          invite.referralLink && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+            import_antd20.Input.Search,
+            {
+              value: invite.referralLink,
+              readOnly: true,
+              enterButton: "Copy",
+              "aria-label": "Referral link",
+              onSearch: onCopyLink
+            }
+          ),
+          invite.referralCode && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_antd20.Typography.Text, { style: { color: token.colorTextSecondary }, children: [
+            "Referral code: ",
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_antd20.Typography.Text, { code: true, children: invite.referralCode })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", gap: 16, flexWrap: "wrap" }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_antd20.Card, { size: "small", style: { flex: 1, minWidth: 150, textAlign: "center" }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 28, fontWeight: 700 }, children: invite.totalInvites ?? 0 }),
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { color: token.colorTextSecondary, fontSize: 13 }, children: "Invites Sent" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_antd20.Card, { size: "small", style: { flex: 1, minWidth: 150, textAlign: "center" }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 28, fontWeight: 700 }, children: invite.acceptedInvites ?? 0 }),
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { color: token.colorTextSecondary, fontSize: 13 }, children: "Accepted" })
+          ] })
+        ] }),
+        invite.rewards && invite.rewards.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SectionCard, { title: "Rewards", children: invite.rewards.map((reward) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: 12,
+              padding: "12px 0",
+              borderBottom: `1px solid ${token.colorBorderSecondary}`
+            },
+            children: [
+              reward.icon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { children: reward.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontWeight: 500 }, children: reward.label }),
+                reward.description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_antd20.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: reward.description })
+              ] })
+            ]
+          },
+          reward.label
+        )) })
+      ] })
+    }
+  );
+}
+
+// src/templates/projects.tsx
+var import_antd21 = require("antd");
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var statusColor = {
+  active: "#1d4ed8",
+  completed: "#166534",
+  "on-hold": "#92400e",
+  archived: "#525252"
+};
+function ProjectsTemplate({
+  title = "Projects",
+  breadcrumbs,
+  actions,
+  data,
+  audit,
+  layout,
+  onProjectClick
+}) {
+  const { token } = import_antd21.theme.useToken();
+  const projects = data ?? {};
+  const cols = projects.columns ?? 3;
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    TemplateFrame,
+    {
+      title,
+      breadcrumbs,
+      actions,
+      audit,
+      layout,
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        "div",
+        {
+          style: {
+            display: "grid",
+            gridTemplateColumns: `repeat(${cols}, 1fr)`,
+            gap: 16
+          },
+          children: projects.projects?.map((project) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+            import_antd21.Card,
+            {
+              hoverable: true,
+              size: "small",
+              onClick: () => onProjectClick?.(project),
+              style: { cursor: "pointer" },
+              children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_antd21.Space, { direction: "vertical", style: { width: "100%" }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+                  "div",
+                  {
+                    style: { display: "flex", justifyContent: "space-between", alignItems: "start" },
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_antd21.Typography.Text, { strong: true, children: project.title }),
+                      project.status && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                        import_antd21.Tag,
+                        {
+                          color: statusColor[project.status],
+                          style: { color: "#ffffff", borderColor: "transparent" },
+                          children: project.status
+                        }
+                      )
+                    ]
+                  }
+                ),
+                project.description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_antd21.Typography.Text, { style: { fontSize: 13, color: token.colorTextSecondary }, children: project.description }),
+                project.progress !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                  import_antd21.Progress,
+                  {
+                    percent: project.progress,
+                    size: "small",
+                    "aria-label": `${project.title} completion ${project.progress}%`
+                  }
+                ),
+                project.tags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_antd21.Space, { wrap: true, size: 4, children: project.tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_antd21.Tag, { style: { fontSize: 11 }, children: tag }, tag)) }),
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+                  "div",
+                  {
+                    style: { display: "flex", justifyContent: "space-between", alignItems: "center" },
+                    children: [
+                      project.members && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_antd21.Avatar.Group, { size: "small", max: { count: 3 }, children: project.members.map((m, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_antd21.Avatar, { size: "small", src: m.avatar, alt: m.name, children: m.name[0] }, i)) }),
+                      project.dueDate && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_antd21.Typography.Text, { style: { fontSize: 12, color: token.colorTextSecondary }, children: [
+                        "Due ",
+                        project.dueDate
+                      ] })
+                    ]
+                  }
+                )
+              ] })
+            },
+            project.id
+          ))
+        }
+      )
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ActivityTemplate,
+  AuditTrail,
+  AuthShell,
+  BillingTemplate,
+  BulkActionsBar,
+  DashboardTemplate,
+  DetailTemplate,
+  ErrorPageTemplate,
+  InviteTemplate,
+  KpiCard,
+  ListTemplate,
+  MembersTemplate,
+  NotificationsTemplate,
+  ProfileTemplate,
+  ProjectsTemplate,
+  SectionCard,
+  SecurityTemplate,
+  SettingsTemplate,
+  TemplateFrame,
+  WizardTemplate,
+  templateActionsToPageHeaderActions
+});