@schandlergarcia/sf-web-components 1.9.28 → 1.9.30

package/dist/components/library/cards/SemanticTableCard.d.ts

@@ -1,13 +1,18 @@
-import { TableCardProps, TableColumn } from "./TableCard";
-export interface SemanticTableCardProps extends Omit<TableCardProps, "data" | "columns"> {
-    semanticId: string;
-    dataOverride?: Record<string, unknown>[];
-    columnsOverride?: TableColumn[];
-    compact?: boolean;
-    striped?: boolean;
-    isDark?: boolean;
-    simulateInitialLoad?: boolean;
-    minInitialDelayMs?: number;
-    maxInitialDelayMs?: number;
-}
-export default function SemanticTableCard({ semanticId, dataOverride, columnsOverride, title, subtitle, searchable, sortable, paginated, pageSize, compact, striped, isDark, simulateInitialLoad, minInitialDelayMs, maxInitialDelayMs, ...rest }: SemanticTableCardProps): import("react/jsx-runtime").JSX.Element;
+export default function SemanticTableCard({ semanticId, dataOverride, columnsOverride, title, subtitle, searchable, sortable, paginated, pageSize, compact, striped, isDark, simulateInitialLoad, minInitialDelayMs, maxInitialDelayMs, ...rest }: {
+    [x: string]: any;
+    semanticId: any;
+    dataOverride: any;
+    columnsOverride: any;
+    title: any;
+    subtitle: any;
+    searchable?: boolean | undefined;
+    sortable?: boolean | undefined;
+    paginated?: boolean | undefined;
+    pageSize?: number | undefined;
+    compact: any;
+    striped: any;
+    isDark: any;
+    simulateInitialLoad: any;
+    minInitialDelayMs: any;
+    maxInitialDelayMs: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/library/cards/SemanticTableCardWithLoading.d.ts

@@ -1,8 +1,7 @@
-import { SemanticTableCardProps } from "./SemanticTableCard";
-export interface SemanticTableCardWithLoadingProps extends SemanticTableCardProps {
-    simulateInitialLoad?: boolean;
-    minInitialDelayMs?: number;
-    maxInitialDelayMs?: number;
-    loading?: boolean;
-}
-export default function SemanticTableCardWithLoading({ simulateInitialLoad, minInitialDelayMs, maxInitialDelayMs, loading: loadingProp, ...props }: SemanticTableCardWithLoadingProps): import("react/jsx-runtime").JSX.Element;
+export default function SemanticTableCardWithLoading({ simulateInitialLoad, minInitialDelayMs, maxInitialDelayMs, loading: loadingProp, ...props }: {
+    [x: string]: any;
+    simulateInitialLoad?: boolean | undefined;
+    minInitialDelayMs?: number | undefined;
+    maxInitialDelayMs?: number | undefined;
+    loading: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/library/cards/StatusCard.d.ts

@@ -1,29 +1,15 @@
-import React from "react";
-import { BaseCardProps } from "./BaseCard";
-type Layout = "list" | "grid" | "timeline";
-export interface StatusItem {
-    id?: string | number;
-    title?: string;
-    name?: string;
-    description?: string;
-    status?: string;
-    timestamp?: string | Date;
-    value?: string | number;
-    unit?: string;
-}
-export interface StatusCardProps extends Omit<BaseCardProps, "variant" | "header" | "body"> {
-    title?: string;
-    subtitle?: string;
-    status?: string;
-    items?: StatusItem[];
-    layout?: Layout;
-    showProgress?: boolean;
-    showTimestamp?: boolean;
-    actions?: React.ReactNode;
-    loading?: boolean;
-    error?: string | Error;
-    emptyMessage?: string;
-    maxBodyHeight?: string | number;
-}
-export default function StatusCard({ title, subtitle, status, items, layout, showProgress, showTimestamp, actions, loading, error, emptyMessage, maxBodyHeight, ...cardProps }: StatusCardProps): import("react/jsx-runtime").JSX.Element;
-export {};
+export default function StatusCard({ title, subtitle, status, items, layout, showProgress, showTimestamp, actions, loading, error, emptyMessage, maxBodyHeight, ...cardProps }: {
+    [x: string]: any;
+    title: any;
+    subtitle: any;
+    status?: string | undefined;
+    items?: never[] | undefined;
+    layout?: string | undefined;
+    showProgress?: boolean | undefined;
+    showTimestamp?: boolean | undefined;
+    actions: any;
+    loading?: boolean | undefined;
+    error: any;
+    emptyMessage?: string | undefined;
+    maxBodyHeight: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/library/cards/StatusCard.js

@@ -1,7 +1,8 @@
 import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import "react";
 import w from "./BaseCard.js";
 import y from "../ui/Text.js";
-const x = {
+const g = {
   operational: {
     label: "Operational",
     dot: "bg-emerald-500",
@@ -25,7 +26,7 @@ const x = {
 };
 function h(t) {
   const a = String(t ?? "operational").toLowerCase();
-  return a === "ok" || a === "healthy" || a === "up" ? "operational" : a === "warn" || a === "warning" || a === "partial" ? "degraded" : a === "down" || a === "critical" ? "outage" : x[a] ? a : "operational";
+  return a === "ok" || a === "healthy" || a === "up" ? "operational" : a === "warn" || a === "warning" || a === "partial" ? "degraded" : a === "down" || a === "critical" ? "outage" : g[a] ? a : "operational";
 }
 function I(t) {
   if (!t) return "";
@@ -37,13 +38,13 @@ function I(t) {
   }
 }
 function S({ status: t }) {
-  const a = h(t), r = x[a];
+  const a = h(t), r = g[a];
   return /* @__PURE__ */ l("span", { className: ["inline-flex items-center gap-2 rounded-full px-2.5 py-1 text-xs font-semibold", r.chip].join(" "), children: [
     /* @__PURE__ */ e("span", { className: ["h-2 w-2 rounded-full", r.dot].join(" "), "aria-hidden": "true" }),
     r.label
   ] });
 }
-function g({ item: t, showTimestamp: a }) {
+function b({ item: t, showTimestamp: a }) {
   const r = t?.title ?? t?.name ?? "Item", s = t?.description, i = t?.value, o = t?.unit, d = t?.timestamp, c = t?.status;
   return /* @__PURE__ */ l("div", { className: "flex items-start justify-between gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900", children: [
     /* @__PURE__ */ l("div", { className: "min-w-0", children: [
@@ -64,15 +65,15 @@ function M({ items: t, showTimestamp: a }) {
   return /* @__PURE__ */ l("div", { className: "relative mt-4", children: [
     /* @__PURE__ */ e("div", { className: "absolute left-3 top-0 h-full w-px bg-slate-200 dark:bg-slate-800", "aria-hidden": "true" }),
     /* @__PURE__ */ e("div", { className: "space-y-3", children: t.map((r, s) => {
-      const i = r?.id ?? s, o = r?.status, d = x[h(o)];
+      const i = r?.id ?? s, o = r?.status, d = g[h(o)];
       return /* @__PURE__ */ l("div", { className: "relative pl-8", children: [
         /* @__PURE__ */ e("div", { className: ["absolute left-[9px] top-3 h-2.5 w-2.5 rounded-full", d.dot].join(" "), "aria-hidden": "true" }),
-        /* @__PURE__ */ e(g, { item: r, showTimestamp: a })
+        /* @__PURE__ */ e(b, { item: r, showTimestamp: a })
       ] }, i);
     }) })
   ] });
 }
-function _({
+function E({
   title: t,
   subtitle: a,
   status: r = "operational",
@@ -82,9 +83,9 @@ function _({
   showTimestamp: d = !0,
   actions: c,
   loading: j = !1,
-  error: p,
+  error: x,
   emptyMessage: C = "No status items.",
-  maxBodyHeight: u,
+  maxBodyHeight: p,
   ...f
 }) {
   const T = h(r), v = /* @__PURE__ */ l("div", { className: "flex items-start justify-between gap-3", children: [
@@ -97,26 +98,26 @@ function _({
       c ? /* @__PURE__ */ e("div", { className: "ml-1", children: c }) : null
     ] })
   ] });
-  if (p)
+  if (x)
     return /* @__PURE__ */ e(
       w,
       {
         variant: "status",
         header: v,
-        body: /* @__PURE__ */ e("div", { className: "mt-4 rounded-xl border border-rose-200 bg-rose-50 p-4 text-sm text-rose-900 dark:border-rose-900/40 dark:bg-rose-950/30 dark:text-rose-100", children: String(p) }),
+        body: /* @__PURE__ */ e("div", { className: "mt-4 rounded-xl border border-rose-200 bg-rose-50 p-4 text-sm text-rose-900 dark:border-rose-900/40 dark:bg-rose-950/30 dark:text-rose-100", children: String(x) }),
         ...f
       }
     );
-  const b = s.length, N = s.filter((n) => h(n?.status) === "operational").length, k = b > 0 ? Math.round(N / b * 100) : 100, z = u ? { maxHeight: typeof u == "number" ? `${u}px` : u, overflowY: "auto" } : {}, A = j ? /* @__PURE__ */ e("div", { className: "space-y-3", children: Array.from({ length: 3 }).map((n, m) => /* @__PURE__ */ l("div", { className: "flex items-center gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900", children: [
+  const u = s.length, N = s.filter((n) => h(n?.status) === "operational").length, k = u > 0 ? Math.round(N / u * 100) : 100, z = p ? { maxHeight: p, overflowY: "auto" } : {}, A = j ? /* @__PURE__ */ e("div", { className: "space-y-3", children: Array.from({ length: 3 }).map((n, m) => /* @__PURE__ */ l("div", { className: "flex items-center gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900", children: [
     /* @__PURE__ */ e("div", { className: "h-4 w-1/4 animate-pulse rounded bg-slate-200 dark:bg-slate-800" }),
     /* @__PURE__ */ e("div", { className: "h-4 w-1/3 animate-pulse rounded bg-slate-200 dark:bg-slate-800" })
-  ] }, m)) }) : s.length === 0 ? /* @__PURE__ */ e("div", { className: "rounded-xl border border-dashed border-slate-300 bg-slate-50 p-6 text-center text-sm text-slate-600 dark:border-slate-700 dark:bg-slate-950/30 dark:text-slate-300", children: C }) : i === "grid" ? /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: s.map((n, m) => /* @__PURE__ */ e(g, { item: n, showTimestamp: d }, n?.id ?? m)) }) : i === "timeline" ? /* @__PURE__ */ e(M, { items: s, showTimestamp: d }) : /* @__PURE__ */ e("div", { className: "space-y-3", children: s.map((n, m) => /* @__PURE__ */ e(g, { item: n, showTimestamp: d }, n?.id ?? m)) }), D = /* @__PURE__ */ l("div", { className: "mt-4", children: [
-    o && b > 0 ? /* @__PURE__ */ l("div", { className: "mb-4", children: [
+  ] }, m)) }) : s.length === 0 ? /* @__PURE__ */ e("div", { className: "rounded-xl border border-dashed border-slate-300 bg-slate-50 p-6 text-center text-sm text-slate-600 dark:border-slate-700 dark:bg-slate-950/30 dark:text-slate-300", children: C }) : i === "grid" ? /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: s.map((n, m) => /* @__PURE__ */ e(b, { item: n, showTimestamp: d }, n?.id ?? m)) }) : i === "timeline" ? /* @__PURE__ */ e(M, { items: s, showTimestamp: d }) : /* @__PURE__ */ e("div", { className: "space-y-3", children: s.map((n, m) => /* @__PURE__ */ e(b, { item: n, showTimestamp: d }, n?.id ?? m)) }), D = /* @__PURE__ */ l("div", { className: "mt-4", children: [
+    o && u > 0 ? /* @__PURE__ */ l("div", { className: "mb-4", children: [
       /* @__PURE__ */ l("div", { className: "flex items-center justify-between text-xs text-slate-600 dark:text-slate-300", children: [
         /* @__PURE__ */ l("span", { children: [
           N,
           " / ",
-          b,
+          u,
           " operational"
         ] }),
         /* @__PURE__ */ l("span", { children: [
@@ -131,6 +132,6 @@ function _({
   return /* @__PURE__ */ e(w, { variant: "status", header: v, body: D, ...f });
 }
 export {
-  _ as default
+  E as default
 };
 //# sourceMappingURL=StatusCard.js.map

package/dist/components/library/cards/StatusCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusCard.js","sources":["../../../../src/components/library/cards/StatusCard.tsx"],"sourcesContent":["import React from \"react\";\nimport BaseCard, { BaseCardProps } from \"./BaseCard\";\nimport UIText from \"../ui/Text\";\n\ntype Status = \"operational\" | \"degraded\" | \"outage\" | \"maintenance\";\ntype Layout = \"list\" | \"grid\" | \"timeline\";\n\ninterface StatusMeta {\n  label: string;\n  dot: string;\n  chip: string;\n}\n\nconst STATUS_META: Record<Status, StatusMeta> = {\n  operational: {\n    label: \"Operational\",\n    dot: \"bg-emerald-500\",\n    chip: \"bg-emerald-100 text-emerald-900 dark:bg-emerald-950/30 dark:text-emerald-200\"\n  },\n  degraded: {\n    label: \"Degraded\",\n    dot: \"bg-amber-500\",\n    chip: \"bg-amber-100 text-amber-900 dark:bg-amber-950/30 dark:text-amber-200\"\n  },\n  outage: {\n    label: \"Outage\",\n    dot: \"bg-rose-500\",\n    chip: \"bg-rose-100 text-rose-900 dark:bg-rose-950/30 dark:text-rose-200\"\n  },\n  maintenance: {\n    label: \"Maintenance\",\n    dot: \"bg-slate-500\",\n    chip: \"bg-slate-100 text-slate-900 dark:bg-slate-800 dark:text-slate-100\"\n  }\n};\n\nfunction normalizeStatus(status: string | undefined): Status {\n  const s = String(status ?? \"operational\").toLowerCase();\n  if (s === \"ok\" || s === \"healthy\" || s === \"up\") return \"operational\";\n  if (s === \"warn\" || s === \"warning\" || s === \"partial\") return \"degraded\";\n  if (s === \"down\" || s === \"critical\") return \"outage\";\n  return STATUS_META[s as Status] ? (s as Status) : \"operational\";\n}\n\nfunction formatTimestamp(ts: string | Date | undefined): string {\n  if (!ts) return \"\";\n  try {\n    const d = ts instanceof Date ? ts : new Date(ts);\n    if (Number.isNaN(d.getTime())) return String(ts);\n    return d.toLocaleString(undefined, { dateStyle: \"medium\", timeStyle: \"short\" });\n  } catch {\n    return String(ts);\n  }\n}\n\ninterface StatusChipProps {\n  status: string | undefined;\n}\n\nfunction StatusChip({ status }: StatusChipProps) {\n  const key = normalizeStatus(status);\n  const meta = STATUS_META[key];\n  return (\n    <span className={[\"inline-flex items-center gap-2 rounded-full px-2.5 py-1 text-xs font-semibold\", meta.chip].join(\" \")}>\n      <span className={[\"h-2 w-2 rounded-full\", meta.dot].join(\" \")} aria-hidden=\"true\" />\n      {meta.label}\n    </span>\n  );\n}\n\nexport interface StatusItem {\n  id?: string | number;\n  title?: string;\n  name?: string;\n  description?: string;\n  status?: string;\n  timestamp?: string | Date;\n  value?: string | number;\n  unit?: string;\n}\n\ninterface ItemRowProps {\n  item: StatusItem;\n  showTimestamp: boolean;\n}\n\nfunction ItemRow({ item, showTimestamp }: ItemRowProps) {\n  const name = item?.title ?? item?.name ?? \"Item\";\n  const desc = item?.description;\n  const value = item?.value;\n  const unit = item?.unit;\n  const ts = item?.timestamp;\n  const status = item?.status;\n\n  return (\n    <div className=\"flex items-start justify-between gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900\">\n      <div className=\"min-w-0\">\n        <div className=\"flex items-center gap-2\">\n          <div className=\"truncate text-sm font-semibold text-slate-900 dark:text-slate-50\">{name}</div>\n          {status ? <StatusChip status={status} /> : null}\n        </div>\n        {desc ? (\n          <div className=\"mt-1 text-sm text-slate-600 dark:text-slate-300\">{desc}</div>\n        ) : null}\n        {showTimestamp && ts ? (\n          <div className=\"mt-1 text-xs text-slate-500 dark:text-slate-400\">{formatTimestamp(ts)}</div>\n        ) : null}\n      </div>\n      {value != null ? (\n        <div className=\"shrink-0 text-right\">\n          <div className=\"text-sm font-semibold text-slate-900 dark:text-slate-50\">\n            {String(value)}\n            {unit ? <span className=\"ml-1 text-xs font-medium text-slate-500 dark:text-slate-400\">{unit}</span> : null}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\ninterface TimelineProps {\n  items: StatusItem[];\n  showTimestamp: boolean;\n}\n\nfunction Timeline({ items, showTimestamp }: TimelineProps) {\n  return (\n    <div className=\"relative mt-4\">\n      <div className=\"absolute left-3 top-0 h-full w-px bg-slate-200 dark:bg-slate-800\" aria-hidden=\"true\" />\n      <div className=\"space-y-3\">\n        {items.map((item, idx) => {\n          const key = item?.id ?? idx;\n          const status = item?.status;\n          const meta = STATUS_META[normalizeStatus(status)];\n          return (\n            <div key={key} className=\"relative pl-8\">\n              <div className={[\"absolute left-[9px] top-3 h-2.5 w-2.5 rounded-full\", meta.dot].join(\" \")} aria-hidden=\"true\" />\n              <ItemRow item={item} showTimestamp={showTimestamp} />\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nexport interface StatusCardProps extends Omit<BaseCardProps, \"variant\" | \"header\" | \"body\"> {\n  title?: string;\n  subtitle?: string;\n  status?: string;\n  items?: StatusItem[];\n  layout?: Layout;\n  showProgress?: boolean;\n  showTimestamp?: boolean;\n  actions?: React.ReactNode;\n  loading?: boolean;\n  error?: string | Error;\n  emptyMessage?: string;\n  maxBodyHeight?: string | number;\n}\n\nexport default function StatusCard({\n  title,\n  subtitle,\n  status = \"operational\",\n  items = [],\n  layout = \"list\",\n  showProgress = false,\n  showTimestamp = true,\n  actions,\n  loading = false,\n  error,\n  emptyMessage = \"No status items.\",\n  maxBodyHeight,\n  ...cardProps\n}: StatusCardProps) {\n  const overall = normalizeStatus(status);\n  const header = (\n    <div className=\"flex items-start justify-between gap-3\">\n      <div className=\"min-w-0\">\n        {title ? (\n          <UIText as=\"div\" size=\"sm\" weight=\"medium\">\n            {title}\n          </UIText>\n        ) : null}\n        {subtitle ? (\n          <UIText as=\"div\" size=\"xs\" muted className=\"mt-1\">\n            {subtitle}\n          </UIText>\n        ) : null}\n      </div>\n      <div className=\"flex items-center gap-2\">\n        <StatusChip status={overall} />\n        {actions ? <div className=\"ml-1\">{actions}</div> : null}\n      </div>\n    </div>\n  );\n\n  if (error) {\n    return (\n      <BaseCard\n        variant=\"status\"\n        header={header}\n        body={\n          <div className=\"mt-4 rounded-xl border border-rose-200 bg-rose-50 p-4 text-sm text-rose-900 dark:border-rose-900/40 dark:bg-rose-950/30 dark:text-rose-100\">\n            {String(error)}\n          </div>\n        }\n        {...cardProps}\n      />\n    );\n  }\n\n  const total = items.length;\n  const okCount = items.filter((it) => normalizeStatus(it?.status) === \"operational\").length;\n  const percentOk = total > 0 ? Math.round((okCount / total) * 100) : 100;\n\n  const scrollStyle: React.CSSProperties = maxBodyHeight\n    ? { maxHeight: typeof maxBodyHeight === \"number\" ? `${maxBodyHeight}px` : maxBodyHeight, overflowY: \"auto\" }\n    : {};\n\n  const itemsContent = loading ? (\n    <div className=\"space-y-3\">\n      {Array.from({ length: 3 }).map((_, i) => (\n        <div key={i} className=\"flex items-center gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900\">\n          <div className=\"h-4 w-1/4 animate-pulse rounded bg-slate-200 dark:bg-slate-800\" />\n          <div className=\"h-4 w-1/3 animate-pulse rounded bg-slate-200 dark:bg-slate-800\" />\n        </div>\n      ))}\n    </div>\n  ) : items.length === 0 ? (\n    <div className=\"rounded-xl border border-dashed border-slate-300 bg-slate-50 p-6 text-center text-sm text-slate-600 dark:border-slate-700 dark:bg-slate-950/30 dark:text-slate-300\">\n      {emptyMessage}\n    </div>\n  ) : layout === \"grid\" ? (\n    <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n      {items.map((it, idx) => (\n        <ItemRow key={it?.id ?? idx} item={it} showTimestamp={showTimestamp} />\n      ))}\n    </div>\n  ) : layout === \"timeline\" ? (\n    <Timeline items={items} showTimestamp={showTimestamp} />\n  ) : (\n    <div className=\"space-y-3\">\n      {items.map((it, idx) => (\n        <ItemRow key={it?.id ?? idx} item={it} showTimestamp={showTimestamp} />\n      ))}\n    </div>\n  );\n\n  const body = (\n    <div className=\"mt-4\">\n      {showProgress && total > 0 ? (\n        <div className=\"mb-4\">\n          <div className=\"flex items-center justify-between text-xs text-slate-600 dark:text-slate-300\">\n            <span>{okCount} / {total} operational</span>\n            <span>{percentOk}%</span>\n          </div>\n          <div className=\"mt-2 h-2 w-full overflow-hidden rounded-full bg-slate-200 dark:bg-slate-800\">\n            <div className=\"h-full bg-emerald-500\" style={{ width: `${percentOk}%` }} />\n          </div>\n        </div>\n      ) : null}\n      <div style={scrollStyle}>{itemsContent}</div>\n    </div>\n  );\n\n  return <BaseCard variant=\"status\" header={header} body={body} {...cardProps} />;\n}\n"],"names":["STATUS_META","normalizeStatus","status","s","formatTimestamp","ts","d","StatusChip","key","meta","jsxs","jsx","ItemRow","item","showTimestamp","name","desc","value","unit","Timeline","items","idx","StatusCard","title","subtitle","layout","showProgress","actions","loading","error","emptyMessage","maxBodyHeight","cardProps","overall","header","UIText","BaseCard","total","okCount","it","percentOk","scrollStyle","itemsContent","_","i","body"],"mappings":"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"}
+{"version":3,"file":"StatusCard.js","sources":["../../../../src/components/library/cards/StatusCard.jsx"],"sourcesContent":["import React from \"react\";\nimport BaseCard from \"./BaseCard\";\nimport UIText from \"../ui/Text\";\n\nconst STATUS_META = {\n  operational: {\n    label: \"Operational\",\n    dot: \"bg-emerald-500\",\n    chip: \"bg-emerald-100 text-emerald-900 dark:bg-emerald-950/30 dark:text-emerald-200\"\n  },\n  degraded: {\n    label: \"Degraded\",\n    dot: \"bg-amber-500\",\n    chip: \"bg-amber-100 text-amber-900 dark:bg-amber-950/30 dark:text-amber-200\"\n  },\n  outage: {\n    label: \"Outage\",\n    dot: \"bg-rose-500\",\n    chip: \"bg-rose-100 text-rose-900 dark:bg-rose-950/30 dark:text-rose-200\"\n  },\n  maintenance: {\n    label: \"Maintenance\",\n    dot: \"bg-slate-500\",\n    chip: \"bg-slate-100 text-slate-900 dark:bg-slate-800 dark:text-slate-100\"\n  }\n};\n\nfunction normalizeStatus(status) {\n  const s = String(status ?? \"operational\").toLowerCase();\n  if (s === \"ok\" || s === \"healthy\" || s === \"up\") return \"operational\";\n  if (s === \"warn\" || s === \"warning\" || s === \"partial\") return \"degraded\";\n  if (s === \"down\" || s === \"critical\") return \"outage\";\n  return STATUS_META[s] ? s : \"operational\";\n}\n\nfunction formatTimestamp(ts) {\n  if (!ts) return \"\";\n  try {\n    const d = ts instanceof Date ? ts : new Date(ts);\n    if (Number.isNaN(d.getTime())) return String(ts);\n    return d.toLocaleString(undefined, { dateStyle: \"medium\", timeStyle: \"short\" });\n  } catch {\n    return String(ts);\n  }\n}\n\nfunction StatusChip({ status }) {\n  const key = normalizeStatus(status);\n  const meta = STATUS_META[key];\n  return (\n    <span className={[\"inline-flex items-center gap-2 rounded-full px-2.5 py-1 text-xs font-semibold\", meta.chip].join(\" \")}>\n      <span className={[\"h-2 w-2 rounded-full\", meta.dot].join(\" \")} aria-hidden=\"true\" />\n      {meta.label}\n    </span>\n  );\n}\n\nfunction ItemRow({ item, showTimestamp }) {\n  const name = item?.title ?? item?.name ?? \"Item\";\n  const desc = item?.description;\n  const value = item?.value;\n  const unit = item?.unit;\n  const ts = item?.timestamp;\n  const status = item?.status;\n\n  return (\n    <div className=\"flex items-start justify-between gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900\">\n      <div className=\"min-w-0\">\n        <div className=\"flex items-center gap-2\">\n          <div className=\"truncate text-sm font-semibold text-slate-900 dark:text-slate-50\">{name}</div>\n          {status ? <StatusChip status={status} /> : null}\n        </div>\n        {desc ? (\n          <div className=\"mt-1 text-sm text-slate-600 dark:text-slate-300\">{desc}</div>\n        ) : null}\n        {showTimestamp && ts ? (\n          <div className=\"mt-1 text-xs text-slate-500 dark:text-slate-400\">{formatTimestamp(ts)}</div>\n        ) : null}\n      </div>\n      {value != null ? (\n        <div className=\"shrink-0 text-right\">\n          <div className=\"text-sm font-semibold text-slate-900 dark:text-slate-50\">\n            {String(value)}\n            {unit ? <span className=\"ml-1 text-xs font-medium text-slate-500 dark:text-slate-400\">{unit}</span> : null}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nfunction Timeline({ items, showTimestamp }) {\n  return (\n    <div className=\"relative mt-4\">\n      <div className=\"absolute left-3 top-0 h-full w-px bg-slate-200 dark:bg-slate-800\" aria-hidden=\"true\" />\n      <div className=\"space-y-3\">\n        {items.map((item, idx) => {\n          const key = item?.id ?? idx;\n          const status = item?.status;\n          const meta = STATUS_META[normalizeStatus(status)];\n          return (\n            <div key={key} className=\"relative pl-8\">\n              <div className={[\"absolute left-[9px] top-3 h-2.5 w-2.5 rounded-full\", meta.dot].join(\" \")} aria-hidden=\"true\" />\n              <ItemRow item={item} showTimestamp={showTimestamp} />\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nexport default function StatusCard({\n  title,\n  subtitle,\n  status = \"operational\",\n  items = [],\n  layout = \"list\",\n  showProgress = false,\n  showTimestamp = true,\n  actions,\n  loading = false,\n  error,\n  emptyMessage = \"No status items.\",\n  maxBodyHeight,\n  ...cardProps\n}) {\n  const overall = normalizeStatus(status);\n  const header = (\n    <div className=\"flex items-start justify-between gap-3\">\n      <div className=\"min-w-0\">\n        {title ? (\n          <UIText as=\"div\" size=\"sm\" weight=\"medium\">\n            {title}\n          </UIText>\n        ) : null}\n        {subtitle ? (\n          <UIText as=\"div\" size=\"xs\" muted className=\"mt-1\">\n            {subtitle}\n          </UIText>\n        ) : null}\n      </div>\n      <div className=\"flex items-center gap-2\">\n        <StatusChip status={overall} />\n        {actions ? <div className=\"ml-1\">{actions}</div> : null}\n      </div>\n    </div>\n  );\n\n  if (error) {\n    return (\n      <BaseCard\n        variant=\"status\"\n        header={header}\n        body={\n          <div className=\"mt-4 rounded-xl border border-rose-200 bg-rose-50 p-4 text-sm text-rose-900 dark:border-rose-900/40 dark:bg-rose-950/30 dark:text-rose-100\">\n            {String(error)}\n          </div>\n        }\n        {...cardProps}\n      />\n    );\n  }\n\n  const total = items.length;\n  const okCount = items.filter((it) => normalizeStatus(it?.status) === \"operational\").length;\n  const percentOk = total > 0 ? Math.round((okCount / total) * 100) : 100;\n\n  const scrollStyle = maxBodyHeight ? { maxHeight: maxBodyHeight, overflowY: \"auto\" } : {};\n\n  const itemsContent = loading ? (\n    <div className=\"space-y-3\">\n      {Array.from({ length: 3 }).map((_, i) => (\n        <div key={i} className=\"flex items-center gap-3 rounded-xl border border-slate-200 bg-white p-3 dark:border-slate-800 dark:bg-slate-900\">\n          <div className=\"h-4 w-1/4 animate-pulse rounded bg-slate-200 dark:bg-slate-800\" />\n          <div className=\"h-4 w-1/3 animate-pulse rounded bg-slate-200 dark:bg-slate-800\" />\n        </div>\n      ))}\n    </div>\n  ) : items.length === 0 ? (\n    <div className=\"rounded-xl border border-dashed border-slate-300 bg-slate-50 p-6 text-center text-sm text-slate-600 dark:border-slate-700 dark:bg-slate-950/30 dark:text-slate-300\">\n      {emptyMessage}\n    </div>\n  ) : layout === \"grid\" ? (\n    <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n      {items.map((it, idx) => (\n        <ItemRow key={it?.id ?? idx} item={it} showTimestamp={showTimestamp} />\n      ))}\n    </div>\n  ) : layout === \"timeline\" ? (\n    <Timeline items={items} showTimestamp={showTimestamp} />\n  ) : (\n    <div className=\"space-y-3\">\n      {items.map((it, idx) => (\n        <ItemRow key={it?.id ?? idx} item={it} showTimestamp={showTimestamp} />\n      ))}\n    </div>\n  );\n\n  const body = (\n    <div className=\"mt-4\">\n      {showProgress && total > 0 ? (\n        <div className=\"mb-4\">\n          <div className=\"flex items-center justify-between text-xs text-slate-600 dark:text-slate-300\">\n            <span>{okCount} / {total} operational</span>\n            <span>{percentOk}%</span>\n          </div>\n          <div className=\"mt-2 h-2 w-full overflow-hidden rounded-full bg-slate-200 dark:bg-slate-800\">\n            <div className=\"h-full bg-emerald-500\" style={{ width: `${percentOk}%` }} />\n          </div>\n        </div>\n      ) : null}\n      <div style={scrollStyle}>{itemsContent}</div>\n    </div>\n  );\n\n  return <BaseCard variant=\"status\" header={header} body={body} {...cardProps} />;\n}\n\n\n"],"names":["STATUS_META","normalizeStatus","status","s","formatTimestamp","ts","d","StatusChip","key","meta","jsxs","jsx","ItemRow","item","showTimestamp","name","desc","value","unit","Timeline","items","idx","StatusCard","title","subtitle","layout","showProgress","actions","loading","error","emptyMessage","maxBodyHeight","cardProps","overall","header","UIText","BaseCard","total","okCount","it","percentOk","scrollStyle","itemsContent","_","i","body"],"mappings":"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"}

package/dist/components/library/cards/TableCard.d.ts

@@ -1,40 +1,23 @@
-import React from "react";
-import { BaseCardProps } from "./BaseCard";
-type ColumnType = "currency" | "percentage" | "number" | "text";
-export interface TableColumn {
-    key: string;
-    label: string;
-    type?: ColumnType;
-    sortable?: boolean;
-    mono?: boolean;
-    className?: string;
-    render?: (value: unknown, row: Record<string, unknown>) => React.ReactNode;
-}
-export interface SortState {
-    key: string;
-    direction: "asc" | "desc";
-}
-export interface TableCardProps extends Omit<BaseCardProps, "variant" | "header" | "body"> {
-    data?: Record<string, unknown>[];
-    columns?: TableColumn[];
-    title?: string;
-    subtitle?: string;
-    searchable?: boolean;
-    sortable?: boolean;
-    paginated?: boolean;
-    selectable?: boolean;
-    pageSize?: number;
-    actions?: React.ReactNode;
-    rowActions?: (row: Record<string, unknown>) => React.ReactNode;
-    onRowSelect?: (row: Record<string, unknown>) => void;
-    onSort?: (sort: SortState) => void;
-    onSearch?: (query: string) => void;
-    loading?: boolean;
-    error?: string | Error;
-    emptyMessage?: string;
-    simulateInitialLoad?: boolean;
-    minInitialDelayMs?: number;
-    maxInitialDelayMs?: number;
-}
-export default function TableCard({ data, columns, title, subtitle, searchable, sortable, paginated, selectable, pageSize, actions, rowActions, onRowSelect, onSort, onSearch, loading, error, emptyMessage, simulateInitialLoad, minInitialDelayMs, maxInitialDelayMs, ...cardProps }: TableCardProps): import("react/jsx-runtime").JSX.Element;
-export {};
+export default function TableCard({ data, columns, title, subtitle, searchable, sortable, paginated, selectable, pageSize, actions, rowActions, onRowSelect, onSort, onSearch, loading, error, emptyMessage, simulateInitialLoad, minInitialDelayMs, maxInitialDelayMs, ...cardProps }: {
+    [x: string]: any;
+    data?: never[] | undefined;
+    columns?: never[] | undefined;
+    title: any;
+    subtitle: any;
+    searchable?: boolean | undefined;
+    sortable?: boolean | undefined;
+    paginated?: boolean | undefined;
+    selectable?: boolean | undefined;
+    pageSize?: number | undefined;
+    actions: any;
+    rowActions: any;
+    onRowSelect: any;
+    onSort: any;
+    onSearch: any;
+    loading?: boolean | undefined;
+    error: any;
+    emptyMessage?: string | undefined;
+    simulateInitialLoad?: boolean | undefined;
+    minInitialDelayMs?: number | undefined;
+    maxInitialDelayMs?: number | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/library/cards/TableCard.js

@@ -1,10 +1,10 @@
 import { jsx as t, jsxs as d } from "react/jsx-runtime";
 import i from "react";
-import E from "./BaseCard.js";
-import re from "../ui/UIInput.js";
-import K from "../ui/UIButton.js";
+import I from "./BaseCard.js";
+import te from "../ui/Input.js";
+import K from "../ui/Button.js";
 import Q from "../ui/Text.js";
-function se(o, s) {
+function re(o, s) {
   if (s == null) return "";
   if (!o) return String(s);
   if (o === "currency") {
@@ -21,13 +21,13 @@ function se(o, s) {
   }
   return String(s);
 }
-function ae(o, s) {
+function se(o, s) {
   return o.map((r, u) => ({ item: r, idx: u })).sort((r, u) => {
     const b = s(r.item, u.item);
     return b !== 0 ? b : r.idx - u.idx;
   }).map((r) => r.item);
 }
-function me({
+function ce({
   data: o = [],
   columns: s = [],
   title: r,
@@ -38,60 +38,60 @@ function me({
   selectable: M = !1,
   pageSize: f = 10,
   actions: F,
-  rowActions: p,
+  rowActions: h,
   onRowSelect: R,
-  onSort: G,
-  onSearch: H,
-  loading: J = !1,
+  onSort: _,
+  onSearch: G,
+  loading: H = !1,
   error: P,
-  emptyMessage: O = "No results.",
+  emptyMessage: J = "No results.",
   simulateInitialLoad: B = !1,
   minInitialDelayMs: L = 350,
   maxInitialDelayMs: U = 900,
   ...$
 }) {
-  const [y, V] = i.useState(""), [x, W] = i.useState(null), [N, X] = i.useState("asc"), [T, k] = i.useState(1), [Y, Z] = i.useState(void 0), [z, A] = i.useState(B);
+  const [N, O] = i.useState(""), [x, V] = i.useState(null), [k, W] = i.useState("asc"), [T, y] = i.useState(1), [X, Y] = i.useState(null), [Z, z] = i.useState(B);
   i.useEffect(() => {
     if (!B) return;
-    const e = Math.floor(Math.random() * (U - L + 1)) + L, a = setTimeout(() => A(!1), e);
+    const e = Math.floor(Math.random() * (U - L + 1)) + L, a = setTimeout(() => z(!1), e);
     return () => clearTimeout(a);
   }, [B, L, U]);
-  const I = J || z, v = i.useMemo(() => {
-    if (!b || !y.trim()) return o;
-    const e = y.trim().toLowerCase();
+  const q = H || Z, v = i.useMemo(() => {
+    if (!b || !N.trim()) return o;
+    const e = N.trim().toLowerCase();
     return o.filter(
       (a) => s.some((n) => {
-        const m = a?.[n.key];
-        return m == null ? !1 : String(m).toLowerCase().includes(e);
+        const p = a?.[n.key];
+        return p == null ? !1 : String(p).toLowerCase().includes(e);
       })
     );
-  }, [o, s, y, b]), S = i.useMemo(() => {
+  }, [o, s, N, b]), S = i.useMemo(() => {
     if (!j || !x || !s.find((n) => n.key === x)) return v;
-    const a = N === "desc" ? -1 : 1;
-    return ae(v, (n, m) => {
-      const h = n?.[x], l = m?.[x];
-      return h == null && l == null ? 0 : h == null ? -1 * a : l == null ? 1 * a : typeof h == "number" && typeof l == "number" ? (h - l) * a : String(h).localeCompare(String(l)) * a;
+    const a = k === "desc" ? -1 : 1;
+    return se(v, (n, p) => {
+      const l = n?.[x], m = p?.[x];
+      return l == null && m == null ? 0 : l == null ? -1 * a : m == null ? 1 * a : typeof l == "number" && typeof m == "number" ? (l - m) * a : String(l).localeCompare(String(m)) * a;
     });
-  }, [v, j, x, N, s]), w = S.length, C = g ? Math.max(1, Math.ceil(w / f)) : 1, c = Math.min(T, C), _ = i.useMemo(() => {
+  }, [v, j, x, k, s]), w = S.length, C = g ? Math.max(1, Math.ceil(w / f)) : 1, c = Math.min(T, C), D = i.useMemo(() => {
     if (!g) return S;
     const e = (c - 1) * f;
     return S.slice(e, e + f);
   }, [S, g, c, f]);
   i.useEffect(() => {
-    T !== c && k(c);
+    T !== c && y(c);
   }, [T, c]);
-  const q = /* @__PURE__ */ d("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
+  const E = /* @__PURE__ */ d("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
     /* @__PURE__ */ d("div", { className: "min-w-0", children: [
       r ? /* @__PURE__ */ t(Q, { as: "div", size: "sm", weight: "medium", children: r }) : null,
       u ? /* @__PURE__ */ t(Q, { as: "div", size: "xs", muted: !0, className: "mt-1", children: u }) : null
     ] }),
     /* @__PURE__ */ d("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-end", children: [
       b ? /* @__PURE__ */ t("div", { className: "w-full sm:w-64", children: /* @__PURE__ */ t(
-        re,
+        te,
         {
-          value: y,
+          value: N,
           onChange: (e) => {
-            V(e.target.value), k(1), H?.(e.target.value);
+            O(e.target.value), y(1), G?.(e.target.value);
           },
           placeholder: "Search…",
           "aria-label": "Search table"
@@ -102,19 +102,19 @@ function me({
   ] });
   if (P)
     return /* @__PURE__ */ t(
-      E,
+      I,
       {
-        header: q,
+        header: E,
         body: /* @__PURE__ */ t("div", { className: "mt-4 rounded-xl border border-rose-200 bg-rose-50 p-4 text-sm text-rose-900 dark:border-rose-900/40 dark:bg-rose-950/30 dark:text-rose-100", children: String(P) }),
         ...$
       }
     );
-  const ee = (e) => j && (e.sortable ?? !0);
+  const A = (e) => j && (e.sortable ?? !0);
   return /* @__PURE__ */ t(
-    E,
+    I,
     {
       variant: "table",
-      header: q,
+      header: E,
       body: /* @__PURE__ */ d("div", { className: "mt-4 overflow-hidden rounded-xl border border-slate-200 dark:border-slate-800", children: [
         /* @__PURE__ */ t("div", { className: "w-full overflow-x-auto", children: /* @__PURE__ */ d("table", { className: "min-w-full border-separate border-spacing-0", children: [
           /* @__PURE__ */ t("thead", { className: "bg-slate-50 dark:bg-slate-950/30", children: /* @__PURE__ */ d("tr", { children: [
@@ -128,18 +128,18 @@ function me({
                     "whitespace-nowrap border-b border-slate-200 px-4 py-3 text-left text-xs font-semibold text-slate-600 dark:border-slate-800 dark:text-slate-300",
                     e.className ?? ""
                   ].filter(Boolean).join(" "),
-                  children: ee(e) ? /* @__PURE__ */ d(
+                  children: A(e) ? /* @__PURE__ */ d(
                     "button",
                     {
                       type: "button",
                       className: "inline-flex items-center gap-2 hover:text-slate-900 dark:hover:text-slate-50",
                       onClick: () => {
-                        const n = a && N === "asc" ? "desc" : "asc";
-                        W(e.key), X(n), G?.({ key: e.key, direction: n });
+                        const n = a && k === "asc" ? "desc" : "asc";
+                        V(e.key), W(n), _?.({ key: e.key, direction: n });
                       },
                       children: [
                         /* @__PURE__ */ t("span", { children: e.label }),
-                        /* @__PURE__ */ t("span", { className: "text-[10px] opacity-70", children: a ? N === "asc" ? "▲" : "▼" : "↕" })
+                        /* @__PURE__ */ t("span", { className: "text-[10px] opacity-70", children: a ? k === "asc" ? "▲" : "▼" : "↕" })
                       ]
                     }
                   ) : e.label
@@ -147,9 +147,9 @@ function me({
                 e.key
               );
             }),
-            p ? /* @__PURE__ */ t("th", { className: "border-b border-slate-200 px-4 py-3 text-right text-xs font-semibold text-slate-600 dark:border-slate-800 dark:text-slate-300", children: "Actions" }) : null
+            h ? /* @__PURE__ */ t("th", { className: "border-b border-slate-200 px-4 py-3 text-right text-xs font-semibold text-slate-600 dark:border-slate-800 dark:text-slate-300", children: "Actions" }) : null
           ] }) }),
-          /* @__PURE__ */ t("tbody", { className: "bg-white dark:bg-slate-900", children: I ? Array.from({ length: Math.min(f, 6) }).map((e, a) => /* @__PURE__ */ d("tr", { children: [
+          /* @__PURE__ */ t("tbody", { className: "bg-white dark:bg-slate-900", children: q ? Array.from({ length: Math.min(f, 6) }).map((e, a) => /* @__PURE__ */ d("tr", { children: [
             s.map((n) => /* @__PURE__ */ t(
               "td",
               {
@@ -158,30 +158,30 @@ function me({
               },
               n.key
             )),
-            p ? /* @__PURE__ */ t("td", { className: "border-b border-slate-200 px-4 py-3 dark:border-slate-800", children: /* @__PURE__ */ t("div", { className: "h-4 w-10 animate-pulse rounded bg-slate-200 dark:bg-slate-800" }) }) : null
-          ] }, a)) : _.length === 0 ? /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t(
+            h ? /* @__PURE__ */ t("td", { className: "border-b border-slate-200 px-4 py-3 dark:border-slate-800", children: /* @__PURE__ */ t("div", { className: "h-4 w-10 animate-pulse rounded bg-slate-200 dark:bg-slate-800" }) }) : null
+          ] }, a)) : D.length === 0 ? /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t(
             "td",
             {
-              colSpan: s.length + (p ? 1 : 0),
+              colSpan: s.length + (h ? 1 : 0),
               className: "px-4 py-10 text-center text-sm text-slate-600 dark:text-slate-300",
-              children: O
+              children: J
             }
-          ) }) : _.map((e, a) => {
-            const n = e?.id, m = typeof n == "string" || typeof n == "number" ? n : a;
+          ) }) : D.map((e, a) => {
+            const n = e?.id ?? a;
             return /* @__PURE__ */ d(
               "tr",
               {
                 className: [
                   "group",
                   M ? "cursor-pointer" : "",
-                  M && Y === m ? "bg-brand-50 dark:bg-brand-950/30" : ""
+                  M && X === n ? "bg-brand-50 dark:bg-brand-950/30" : ""
                 ].filter(Boolean).join(" "),
                 onClick: () => {
-                  M && (Z(m), R?.(e));
+                  M && (Y(n), R?.(e));
                 },
                 children: [
                   s.map((l) => {
-                    const D = e?.[l.key], te = l.render ? l.render(D, e) : se(l.type, D);
+                    const m = e?.[l.key], ee = l.render ? l.render(m, e) : re(l.type, m);
                     return /* @__PURE__ */ t(
                       "td",
                       {
@@ -190,19 +190,19 @@ function me({
                           l.mono ? "font-mono text-[13px]" : "",
                           l.className ?? ""
                         ].filter(Boolean).join(" "),
-                        children: te
+                        children: ee
                       },
                       l.key
                     );
                   }),
-                  p ? /* @__PURE__ */ t("td", { className: "border-b border-slate-200 px-4 py-3 text-right text-sm dark:border-slate-800", children: /* @__PURE__ */ t("div", { className: "inline-flex items-center justify-end gap-2 opacity-100 sm:opacity-0 sm:group-hover:opacity-100", children: p(e) }) }) : null
+                  h ? /* @__PURE__ */ t("td", { className: "border-b border-slate-200 px-4 py-3 text-right text-sm dark:border-slate-800", children: /* @__PURE__ */ t("div", { className: "inline-flex items-center justify-end gap-2 opacity-100 sm:opacity-0 sm:group-hover:opacity-100", children: h(e) }) }) : null
                 ]
               },
-              String(m)
+              n
             );
           }) })
         ] }) }),
-        g && !I ? /* @__PURE__ */ d("div", { className: "flex flex-col gap-2 border-t border-slate-200 bg-slate-50 px-4 py-3 dark:border-slate-800 dark:bg-slate-950/30 sm:flex-row sm:items-center sm:justify-between", children: [
+        g && !q ? /* @__PURE__ */ d("div", { className: "flex flex-col gap-2 border-t border-slate-200 bg-slate-50 px-4 py-3 dark:border-slate-800 dark:bg-slate-950/30 sm:flex-row sm:items-center sm:justify-between", children: [
           /* @__PURE__ */ t("div", { className: "text-xs text-slate-600 dark:text-slate-300", children: w === 0 ? "0 results" : `Showing ${(c - 1) * f + 1}-${Math.min(c * f, w)} of ${w}` }),
           /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ t(
@@ -211,7 +211,7 @@ function me({
                 variant: "outline",
                 size: "sm",
                 disabled: c <= 1,
-                onClick: () => k((e) => Math.max(1, e - 1)),
+                onClick: () => y((e) => Math.max(1, e - 1)),
                 children: "Prev"
               }
             ),
@@ -227,7 +227,7 @@ function me({
                 variant: "outline",
                 size: "sm",
                 disabled: c >= C,
-                onClick: () => k((e) => Math.min(C, e + 1)),
+                onClick: () => y((e) => Math.min(C, e + 1)),
                 children: "Next"
               }
             )
@@ -239,6 +239,6 @@ function me({
   );
 }
 export {
-  me as default
+  ce as default
 };
 //# sourceMappingURL=TableCard.js.map