@vadimcomanescu/nadicode-design-system 2.0.9 → 4.0.0

package/dist/chunk-AWZFQQGN.js

@@ -0,0 +1,167 @@
+import { MarketingShellPageKit } from './chunk-Z233ZQZE.js';
+import { NewsletterBlock } from './chunk-K7NQ6ZAW.js';
+import { ChangelogBlock } from './chunk-VEO56RH4.js';
+import { CodeBlock } from './chunk-XTASI4IY.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { Heading } from './chunk-WI547C47.js';
+import { Card, CardHeader, CardTitle, CardContent } from './chunk-AH6YSYYT.js';
+import { Avatar, AvatarFallback } from './chunk-NAAU5IWU.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { Badge } from './chunk-S4JAHKOP.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var EMPTY_CATEGORIES = [];
+var EMPTY_ARTICLES = [];
+var DEFAULT_CHANGELOG = {};
+var DEFAULT_NEWSLETTER = {};
+var DEFAULT_EMPTY_STATE = {
+  title: "No content available",
+  description: "Add content entries to populate this route."
+};
+function BlogContentPageKit({
+  shell,
+  state = "has-data",
+  variant = "content-index",
+  categories = EMPTY_CATEGORIES,
+  activeCategoryId = null,
+  onCategoryChange,
+  articles = EMPTY_ARTICLES,
+  detail,
+  changelog = DEFAULT_CHANGELOG,
+  pagination,
+  newsletter = DEFAULT_NEWSLETTER,
+  loadingMessage = "Loading content...",
+  emptyState = DEFAULT_EMPTY_STATE,
+  className
+}) {
+  const shouldRenderLoading = state === "loading";
+  const shouldRenderEmpty = state === "empty" || (state === "filtered" || state === "has-data" || state === "paginated") && variant === "content-index" && articles.length === 0;
+  let content = null;
+  if (shouldRenderLoading) {
+    content = /* @__PURE__ */ jsx("div", { role: "status", className: "rounded-md border border-border/70 bg-surface/70 px-4 py-3 text-sm text-text-secondary", children: loadingMessage });
+  } else if (variant === "changelog") {
+    content = changelog === null ? null : /* @__PURE__ */ jsx(ChangelogBlock, { ...changelog });
+  } else if (variant === "content-detail") {
+    content = detail ? /* @__PURE__ */ jsxs("article", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsxs("header", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx(Heading, { level: 2, children: detail.title }),
+        detail.excerpt ? /* @__PURE__ */ jsx(Typography, { variant: "muted", children: detail.excerpt }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3 border-y border-border/70 py-3", children: [
+          /* @__PURE__ */ jsx(Avatar, { className: "h-9 w-9", children: /* @__PURE__ */ jsx(AvatarFallback, { children: detail.authorFallback ?? detail.authorName.slice(0, 2).toUpperCase() }) }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "small", className: "font-medium text-text-primary", children: detail.authorName }),
+            /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-text-secondary", children: [
+              detail.publishedAt,
+              detail.readTimeLabel ? ` \xB7 ${detail.readTimeLabel}` : ""
+            ] })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "space-y-6", children: detail.content }),
+      detail.codeExamples && detail.codeExamples.length > 0 ? /* @__PURE__ */ jsxs("section", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx(Heading, { level: 4, children: "Code examples" }),
+        detail.codeExamples.map((example) => /* @__PURE__ */ jsx(
+          CodeBlock,
+          {
+            filename: example.filename,
+            language: example.language,
+            code: example.code
+          },
+          example.id
+        ))
+      ] }) : null
+    ] }) : /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: emptyState.title }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Typography, { variant: "muted", children: emptyState.description }) })
+    ] });
+  } else {
+    content = /* @__PURE__ */ jsxs("div", { "data-testid": "blog-index-view", className: "space-y-6", children: [
+      categories.length > 0 ? /* @__PURE__ */ jsxs("div", { "data-testid": "blog-category-controls", className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: activeCategoryId === null ? "primary" : "outline",
+            size: "sm",
+            onClick: () => onCategoryChange?.(null),
+            children: "All"
+          }
+        ),
+        categories.map((category) => /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: activeCategoryId === category.id ? "primary" : "outline",
+            size: "sm",
+            onClick: () => onCategoryChange?.(category.id),
+            children: [
+              category.label,
+              typeof category.count === "number" ? ` (${category.count})` : ""
+            ]
+          },
+          category.id
+        ))
+      ] }) : null,
+      shouldRenderEmpty ? /* @__PURE__ */ jsxs(Card, { "data-testid": "blog-empty-state", children: [
+        /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: emptyState.title }) }),
+        /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Typography, { variant: "muted", children: emptyState.description }) })
+      ] }) : /* @__PURE__ */ jsx("div", { className: "grid gap-4", children: articles.map((article) => /* @__PURE__ */ jsxs(Card, { children: [
+        /* @__PURE__ */ jsxs(CardHeader, { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+            /* @__PURE__ */ jsx(Badge, { variant: "outline", children: article.category }),
+            article.readTimeLabel ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-tertiary", children: article.readTimeLabel }) : null
+          ] }),
+          /* @__PURE__ */ jsx(CardTitle, { children: article.title }),
+          /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: article.excerpt })
+        ] }),
+        /* @__PURE__ */ jsxs(CardContent, { className: "flex flex-wrap items-center justify-between gap-3", children: [
+          /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-text-secondary", children: [
+            article.authorName,
+            " \xB7 ",
+            article.publishedAt
+          ] }),
+          article.onOpen ? /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: article.onOpen, children: "Open" }) : null
+        ] })
+      ] }, article.id)) }),
+      pagination ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-text-secondary", children: [
+          "Page ",
+          pagination.page,
+          " of ",
+          pagination.totalPages
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              size: "sm",
+              variant: "outline",
+              disabled: pagination.page <= 1,
+              onClick: () => pagination.onPageChange(Math.max(1, pagination.page - 1)),
+              children: "Previous page"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              size: "sm",
+              variant: "outline",
+              disabled: pagination.page >= pagination.totalPages,
+              onClick: () => pagination.onPageChange(Math.min(pagination.totalPages, pagination.page + 1)),
+              children: "Next page"
+            }
+          )
+        ] })
+      ] }) : null
+    ] });
+  }
+  return /* @__PURE__ */ jsx(MarketingShellPageKit, { ...shell, children: /* @__PURE__ */ jsxs("section", { className: cn("mx-auto w-full max-w-5xl space-y-8 px-6 pb-16", className), children: [
+    content,
+    newsletter === null ? null : /* @__PURE__ */ jsx(NewsletterBlock, { ...newsletter })
+  ] }) });
+}
+
+export { BlogContentPageKit };

package/dist/chunk-BRCBJ3S4.js

@@ -0,0 +1,42 @@
+import { PasswordRecoveryBlock } from './chunk-5PZ4VR2D.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function RecoveryPageKit({
+  mode = "reset",
+  onSubmit,
+  onBackToLogin,
+  title,
+  description,
+  buttonText,
+  successTitle,
+  errorMessage,
+  className,
+  cardClassName
+}) {
+  return /* @__PURE__ */ jsx("section", { className: cn("min-h-dvh w-full bg-background px-4 py-12 md:px-8 md:py-20", className), children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-5xl flex-col items-center justify-center gap-4", children: [
+    errorMessage ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "alert",
+        className: "w-full max-w-sm rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+        children: errorMessage
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      PasswordRecoveryBlock,
+      {
+        className: cn("w-full", cardClassName),
+        mode,
+        onSubmit,
+        onBackToLogin,
+        title,
+        description,
+        buttonText,
+        successTitle
+      }
+    )
+  ] }) });
+}
+
+export { RecoveryPageKit };

package/dist/chunk-BRICSLHJ.js

@@ -0,0 +1,30 @@
+import { LoginBlock } from './chunk-RGE5OQMZ.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx } from 'react/jsx-runtime';
+
+function SignupPageKit({
+  action,
+  googleAction,
+  error,
+  showSocial = true,
+  labels,
+  signInHref,
+  className,
+  cardClassName
+}) {
+  return /* @__PURE__ */ jsx("section", { className: cn("min-h-dvh w-full bg-background px-4 py-12 md:px-8 md:py-20", className), children: /* @__PURE__ */ jsx("div", { className: "mx-auto flex w-full max-w-5xl items-center justify-center", children: /* @__PURE__ */ jsx(
+    LoginBlock,
+    {
+      className: cn("w-full", cardClassName),
+      type: "signup",
+      action,
+      googleAction,
+      error,
+      showSocial,
+      labels,
+      signInHref
+    }
+  ) }) });
+}
+
+export { SignupPageKit };

package/dist/chunk-BYEHHZZN.js

@@ -0,0 +1,115 @@
+import { CrudFormPageKit } from './chunk-KWILREVQ.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { Heading } from './chunk-WI547C47.js';
+import { Card, CardHeader, CardTitle, CardContent } from './chunk-AH6YSYYT.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function mapState(state) {
+  switch (state) {
+    case "validation-error":
+      return "validation-error";
+    case "saving":
+      return "submitting";
+    case "active-step":
+      return "dirty";
+    case "complete":
+      return "saved";
+    default:
+      return "pristine";
+  }
+}
+function OnboardingPageKit({
+  shell,
+  steps,
+  activeStepIndex,
+  state = "default",
+  validationMessage,
+  onStepChange,
+  onComplete,
+  canSkipOptionalStep = false,
+  onBack,
+  onContinueFromComplete,
+  completeTitle = "Onboarding complete",
+  completeDescription = "Your workspace is ready. Continue to your dashboard.",
+  className
+}) {
+  const hasSteps = steps.length > 0;
+  const boundedStepIndex = hasSteps ? Math.min(Math.max(activeStepIndex, 0), steps.length - 1) : 0;
+  const currentStep = hasSteps ? steps[boundedStepIndex] : null;
+  const isLastStep = hasSteps ? boundedStepIndex === steps.length - 1 : true;
+  if (state === "complete") {
+    return /* @__PURE__ */ jsx(
+      CrudFormPageKit,
+      {
+        shell,
+        title: "Onboarding",
+        description: "Complete state",
+        state: "saved",
+        sections: [
+          {
+            id: "complete",
+            title: completeTitle,
+            content: /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: completeTitle }) }),
+              /* @__PURE__ */ jsxs(CardContent, { className: "space-y-3", children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "muted", children: completeDescription }),
+                onContinueFromComplete ? /* @__PURE__ */ jsx(Button, { onClick: onContinueFromComplete, children: "Continue" }) : null
+              ] })
+            ] })
+          }
+        ],
+        className
+      }
+    );
+  }
+  const title = currentStep ? `Onboarding \xB7 ${currentStep.title}` : "Onboarding";
+  const description = hasSteps ? `Step ${boundedStepIndex + 1} of ${steps.length}` : "Configure your workspace in a guided flow.";
+  return /* @__PURE__ */ jsx(
+    CrudFormPageKit,
+    {
+      shell,
+      title,
+      description,
+      state: mapState(state),
+      validationMessage,
+      sections: [
+        {
+          id: currentStep?.id ?? "no-steps",
+          title: currentStep?.title ?? "No steps configured",
+          description: currentStep?.description,
+          optional: currentStep?.optional,
+          content: currentStep ? /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+            /* @__PURE__ */ jsx(Heading, { level: 4, children: currentStep.title }),
+            currentStep.description ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: currentStep.description }) : null,
+            /* @__PURE__ */ jsx("div", { children: currentStep.content })
+          ] }) : /* @__PURE__ */ jsx(Typography, { variant: "muted", children: "Provide at least one onboarding step." })
+        }
+      ],
+      actions: {
+        secondary: onBack ? {
+          label: "Back",
+          onAction: onBack,
+          disabled: boundedStepIndex === 0
+        } : void 0,
+        tertiary: canSkipOptionalStep && currentStep?.optional ? {
+          label: "Skip optional step",
+          onAction: () => onComplete?.()
+        } : void 0,
+        primary: {
+          label: isLastStep ? "Complete" : "Next",
+          onAction: () => {
+            if (!hasSteps || isLastStep) {
+              onComplete?.();
+            } else {
+              onStepChange?.(boundedStepIndex + 1);
+            }
+          }
+        }
+      },
+      className
+    }
+  );
+}
+
+export { OnboardingPageKit };

package/dist/chunk-C33GUEDY.js

@@ -0,0 +1,149 @@
+import { NavigationShellPageKit } from './chunk-ZKLB5N3Q.js';
+import { ActivityFeedBlock } from './chunk-ZM2NODUK.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { MetricCard } from './chunk-BRXNGF5W.js';
+import { Heading } from './chunk-WI547C47.js';
+import { DataFreshness } from './chunk-WST5NLLC.js';
+import { ChartCard } from './chunk-HJZRSPWB.js';
+import { Empty, EmptyTitle, EmptyDescription } from './chunk-55HD4L6G.js';
+import { Card, CardHeader, CardTitle, CardContent } from './chunk-AH6YSYYT.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var EMPTY_KPIS = [];
+var EMPTY_CHART_REGIONS = [];
+var EMPTY_ACTIVITY_ITEMS = [];
+function deriveRegionState(state, data) {
+  if (state) {
+    return state;
+  }
+  if (!data || data.length === 0) {
+    return "empty";
+  }
+  return "has-data";
+}
+function renderChartRegion(region) {
+  const state = deriveRegionState(region.state, region.data);
+  const isPartialDataState = state === "partial-data";
+  if (state === "error") {
+    return /* @__PURE__ */ jsxs(Card, { className: region.className, children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: region.title }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "alert",
+          className: "rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+          children: region.errorMessage ?? "Chart region is unavailable."
+        }
+      ) })
+    ] }, region.id);
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", region.className), children: [
+    isPartialDataState ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Some chart points are still loading, available data remains visible." }) : null,
+    /* @__PURE__ */ jsx(
+      ChartCard,
+      {
+        title: region.title,
+        description: region.description,
+        chart: region.chart,
+        data: state === "empty" ? [] : region.data,
+        loading: state === "loading",
+        emptyTitle: region.emptyTitle ?? "No chart data",
+        emptyDescription: region.emptyDescription ?? "This chart will populate once data is available."
+      }
+    )
+  ] }, region.id);
+}
+function DashboardPageKit({
+  shell,
+  title = "Dashboard overview",
+  description = "Track KPI performance, chart health, and recent activity from one route-level contract.",
+  kpis = EMPTY_KPIS,
+  kpiState,
+  chartRegions = EMPTY_CHART_REGIONS,
+  activityRegion,
+  lastUpdated,
+  className
+}) {
+  const freshnessTimestamp = lastUpdated ?? /* @__PURE__ */ new Date();
+  const resolvedKpiState = deriveRegionState(kpiState, kpis);
+  const resolvedActivityState = deriveRegionState(activityRegion?.state, activityRegion?.items ?? EMPTY_ACTIVITY_ITEMS);
+  const hasLoadingCharts = chartRegions.some((region) => deriveRegionState(region.state, region.data) === "loading");
+  const loadingKpis = Array.from({ length: Math.max(kpis.length, 4) }, (_, index) => /* @__PURE__ */ jsx(
+    MetricCard,
+    {
+      label: `Loading metric ${index + 1}`,
+      value: 0,
+      loading: true
+    },
+    `loading-kpi-${index}`
+  ));
+  return /* @__PURE__ */ jsx(NavigationShellPageKit, { ...shell, children: /* @__PURE__ */ jsxs("section", { className: cn("space-y-6", className), children: [
+    /* @__PURE__ */ jsxs("header", { className: "flex flex-wrap items-center gap-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
+        /* @__PURE__ */ jsx(Heading, { level: 3, children: title }),
+        /* @__PURE__ */ jsx(Typography, { variant: "muted", children: description })
+      ] }),
+      /* @__PURE__ */ jsx(DataFreshness, { lastUpdated: freshnessTimestamp, isLive: true })
+    ] }),
+    /* @__PURE__ */ jsxs("section", { "aria-label": "Dashboard KPI region", className: "space-y-3", children: [
+      resolvedKpiState === "loading" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Loading KPI metrics" }),
+        /* @__PURE__ */ jsx("div", { className: "grid gap-4 md:grid-cols-2 xl:grid-cols-4", children: loadingKpis })
+      ] }) : null,
+      resolvedKpiState === "error" ? /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "alert",
+          className: "rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+          children: "KPI metrics are currently unavailable."
+        }
+      ) : null,
+      resolvedKpiState === "empty" ? /* @__PURE__ */ jsxs(Empty, { children: [
+        /* @__PURE__ */ jsx(EmptyTitle, { children: "No KPI data" }),
+        /* @__PURE__ */ jsx(EmptyDescription, { children: "Connect your data source to populate KPI cards." })
+      ] }) : null,
+      resolvedKpiState === "partial-data" ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Some KPI metrics are temporarily unavailable." }) : null,
+      resolvedKpiState === "has-data" || resolvedKpiState === "partial-data" ? /* @__PURE__ */ jsx("div", { className: "grid gap-4 md:grid-cols-2 xl:grid-cols-4", children: kpis.map((kpi) => /* @__PURE__ */ jsx(
+        MetricCard,
+        {
+          ...kpi
+        },
+        `${kpi.label}-${String(kpi.value)}`
+      )) }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("section", { "aria-label": "Dashboard chart regions", className: "grid gap-4 xl:grid-cols-2", children: [
+      hasLoadingCharts ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary xl:col-span-2", children: "Loading chart data" }) : null,
+      chartRegions.map((region) => renderChartRegion(region))
+    ] }),
+    /* @__PURE__ */ jsxs("section", { "aria-label": "Dashboard activity region", children: [
+      resolvedActivityState === "loading" ? /* @__PURE__ */ jsxs(Card, { children: [
+        /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: activityRegion?.title ?? "Recent activity" }) }),
+        /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Loading activity feed" }) })
+      ] }) : null,
+      resolvedActivityState === "error" ? /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "alert",
+          className: "rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+          children: activityRegion?.errorMessage ?? "Activity feed is unavailable."
+        }
+      ) : null,
+      resolvedActivityState === "empty" ? /* @__PURE__ */ jsxs(Empty, { children: [
+        /* @__PURE__ */ jsx(EmptyTitle, { children: activityRegion?.emptyTitle ?? "No activity yet" }),
+        /* @__PURE__ */ jsx(EmptyDescription, { children: activityRegion?.emptyDescription ?? "Recent updates will appear once your team starts making changes." })
+      ] }) : null,
+      resolvedActivityState === "partial-data" ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Recent activity is partially available while remaining events sync." }) : null,
+      resolvedActivityState === "has-data" || resolvedActivityState === "partial-data" ? /* @__PURE__ */ jsx(
+        ActivityFeedBlock,
+        {
+          title: activityRegion?.title ?? "Recent activity",
+          activities: activityRegion?.items,
+          className: "py-4 md:py-6"
+        }
+      ) : null
+    ] })
+  ] }) });
+}
+
+export { DashboardPageKit };

package/dist/chunk-CUDMDYKE.js

@@ -0,0 +1,150 @@
+import { NavigationShellPageKit } from './chunk-ZKLB5N3Q.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { NativeSelect } from './chunk-UGV45DH3.js';
+import { Heading } from './chunk-WI547C47.js';
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-PXDHNGTG.js';
+import { ChartCard } from './chunk-HJZRSPWB.js';
+import { Empty, EmptyTitle, EmptyDescription } from './chunk-55HD4L6G.js';
+import { Card, CardHeader, CardTitle, CardContent, CardDescription } from './chunk-AH6YSYYT.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { Badge } from './chunk-S4JAHKOP.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function deriveState(state, data) {
+  if (state) {
+    return state;
+  }
+  if (!data || data.length === 0) {
+    return "empty";
+  }
+  return "has-data";
+}
+function renderGridRegion(region) {
+  const state = deriveState(region.state, region.rows);
+  const isFilteredState = state === "filtered";
+  const isPartialDataState = state === "partial-data";
+  if (state === "loading") {
+    return /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: region.title }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Loading analytics table" }) })
+    ] }, region.id);
+  }
+  if (state === "error") {
+    return /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: region.title }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "alert",
+          className: "rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+          children: region.errorMessage ?? "Analytics table is unavailable."
+        }
+      ) })
+    ] }, region.id);
+  }
+  if (state === "empty" || isFilteredState) {
+    return /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: region.title }),
+        region.description ? /* @__PURE__ */ jsx(CardDescription, { children: region.description }) : null
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs(Empty, { children: [
+        /* @__PURE__ */ jsx(EmptyTitle, { children: region.emptyTitle ?? (isFilteredState ? "No rows for selected filters" : "No matching rows") }),
+        /* @__PURE__ */ jsx(EmptyDescription, { children: region.emptyDescription ?? (isFilteredState ? "Broaden filters or date range to restore table results." : "Adjust filters or date range to load analytics records.") })
+      ] }) })
+    ] }, region.id);
+  }
+  return /* @__PURE__ */ jsxs(Card, { children: [
+    /* @__PURE__ */ jsxs(CardHeader, { children: [
+      /* @__PURE__ */ jsx(CardTitle, { children: region.title }),
+      region.description ? /* @__PURE__ */ jsx(CardDescription, { children: region.description }) : null
+    ] }),
+    /* @__PURE__ */ jsxs(CardContent, { children: [
+      isPartialDataState ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "mb-3 text-text-secondary", children: "Showing available rows while some analytics dimensions are still syncing." }) : null,
+      /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs(Table, { children: [
+        /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, { children: region.columns.map((column) => /* @__PURE__ */ jsx(TableHead, { children: column }, `${region.id}-${column}`)) }) }),
+        /* @__PURE__ */ jsx(TableBody, { children: region.rows.map((row, rowIndex) => /* @__PURE__ */ jsx(TableRow, { children: region.columns.map((column) => /* @__PURE__ */ jsx(TableCell, { children: row[column] ?? "-" }, `${region.id}-row-${rowIndex}-${column}`)) }, `${region.id}-row-${rowIndex}`)) })
+      ] }) })
+    ] })
+  ] }, region.id);
+}
+function AnalyticsPageKit({
+  shell,
+  title = "Analytics reporting",
+  description = "Coordinate filters, chart surfaces, and tabular analysis from one stable page-kit contract.",
+  filters,
+  chartRegions,
+  gridRegions,
+  comparisonLabel,
+  onResetFilters,
+  className
+}) {
+  return /* @__PURE__ */ jsx(NavigationShellPageKit, { ...shell, children: /* @__PURE__ */ jsxs("section", { className: cn("space-y-6", className), children: [
+    /* @__PURE__ */ jsxs("header", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx(Heading, { level: 3, children: title }),
+      /* @__PURE__ */ jsx(Typography, { variant: "muted", children: description })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "section",
+      {
+        "aria-label": "Analytics filters",
+        className: "rounded-lg border border-border/70 bg-surface/60 p-4",
+        children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end gap-4", children: [
+          filters.map((filter) => /* @__PURE__ */ jsxs("div", { className: "min-w-[180px] flex-1 space-y-2", children: [
+            /* @__PURE__ */ jsx("label", { htmlFor: `analytics-filter-${filter.id}`, className: "text-sm font-medium text-text-primary", children: filter.label }),
+            /* @__PURE__ */ jsx(
+              NativeSelect,
+              {
+                id: `analytics-filter-${filter.id}`,
+                "aria-label": filter.label,
+                value: filter.value,
+                onChange: (event) => filter.onChange?.(event.target.value),
+                children: filter.options.map((option) => /* @__PURE__ */ jsx("option", { value: option.value, children: option.label }, `${filter.id}-${option.value}`))
+              }
+            )
+          ] }, filter.id)),
+          comparisonLabel ? /* @__PURE__ */ jsx(Badge, { variant: "outline", children: comparisonLabel }) : null,
+          onResetFilters ? /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: onResetFilters, children: "Reset filters" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx("section", { className: "grid gap-4 xl:grid-cols-2", children: chartRegions.map((region) => {
+      const state = deriveState(region.state, region.data);
+      const isFilteredState = state === "filtered";
+      const isPartialDataState = state === "partial-data";
+      if (state === "error") {
+        return /* @__PURE__ */ jsxs(Card, { className: region.className, children: [
+          /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: region.title }) }),
+          /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              role: "alert",
+              className: "rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+              children: region.errorMessage ?? "Analytics chart is unavailable."
+            }
+          ) })
+        ] }, region.id);
+      }
+      return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        isPartialDataState ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: "Showing available chart data while some series are still syncing." }) : null,
+        /* @__PURE__ */ jsx(
+          ChartCard,
+          {
+            className: region.className,
+            title: region.title,
+            description: region.description,
+            chart: region.chart,
+            data: state === "empty" || isFilteredState ? [] : region.data,
+            loading: state === "loading",
+            emptyTitle: region.emptyTitle ?? (isFilteredState ? "No chart points for selected filters" : "No chart points"),
+            emptyDescription: region.emptyDescription ?? "Try adjusting filters to broaden the results."
+          }
+        )
+      ] }, region.id);
+    }) }),
+    /* @__PURE__ */ jsx("section", { className: "grid gap-4 xl:grid-cols-2", children: gridRegions.map((region) => renderGridRegion(region)) })
+  ] }) });
+}
+
+export { AnalyticsPageKit };