@yuno-payments/dashboard-design-system 2.8.1 → 2.8.3

package/dist/components/molecules/data-table-cells/data-table-amount-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 /**
  * Props for the DataTableAmountCell component
  */
@@ -12,6 +13,8 @@ export interface DataTableAmountCellProps {
     size?: "xs" | "sm" | "base";
     /** Whether to show the currency code @default true */
     showCurrencyCode?: boolean;
+    /** Content to render when value is empty/NaN @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-amount-cell.js

@@ -1,27 +1,28 @@
-import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as n } from "react";
-import { cn as s } from "../../../lib/utils.js";
-import { CurrencyField as f } from "../../atoms/currency-field/currency-field.js";
-const u = n(
+import { j as r } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as s } from "react";
+import { cn as f } from "../../../lib/utils.js";
+import { CurrencyField as x } from "../../atoms/currency-field/currency-field.js";
+const p = s(
   ({
-    value: r,
+    value: e,
     currency: t = "USD",
     locales: m,
     size: o = "xs",
-    showCurrencyCode: l = !0,
-    className: a
-  }, i) => r == null || Number.isNaN(r) ? null : /* @__PURE__ */ e.jsx("div", { ref: i, className: s("flex", a), children: /* @__PURE__ */ e.jsx(
-    f,
+    showCurrencyCode: a = !0,
+    emptyState: i = "-",
+    className: l
+  }, n) => e == null || Number.isNaN(e) ? /* @__PURE__ */ r.jsx(r.Fragment, { children: i }) : /* @__PURE__ */ r.jsx("div", { ref: n, className: f("flex", l), children: /* @__PURE__ */ r.jsx(
+    x,
     {
-      value: r,
+      value: e,
       currency: t,
       locales: m,
       size: o,
-      showCurrencyCode: l
+      showCurrencyCode: a
     }
   ) })
 );
-u.displayName = "DataTableAmountCell";
+p.displayName = "DataTableAmountCell";
 export {
-  u as DataTableAmountCell
+  p as DataTableAmountCell
 };

package/dist/components/molecules/data-table-cells/data-table-copy-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 import { IconName } from '../../atoms/icon';
 /**
  * Props for the DataTableCopyCell component
@@ -17,6 +18,8 @@ export interface DataTableCopyCellProps {
     onCopySuccess?: () => void;
     /** Custom callback on copy error */
     onCopyError?: () => void;
+    /** Content to render when value is empty @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-copy-cell.js

@@ -1,37 +1,38 @@
 import { j as r } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as f } from "react";
-import { cn as y } from "../../../lib/utils.js";
-import { Icon as c } from "../../atoms/icon/icon.js";
+import { forwardRef as y } from "react";
+import { cn as g } from "../../../lib/utils.js";
+import { Icon as p } from "../../atoms/icon/icon.js";
 import { TooltipProvider as i, Tooltip as o, TooltipTrigger as n, TooltipContent as l } from "../../../vendor/shadcn/tooltip.js";
-import { useCopyToClipboard as g } from "../../../hooks/use-copy-to-clipboard.js";
-const N = f(
+import { useCopyToClipboard as N } from "../../../hooks/use-copy-to-clipboard.js";
+const b = y(
   ({
     value: e,
     linkTo: t,
     startIcon: a,
-    startIconTooltip: p,
+    startIconTooltip: c,
     copyTooltip: d = "Copy",
     onCopySuccess: m,
     onCopyError: h,
-    className: x
-  }, j) => {
-    const { copyToClipboard: u } = g({
+    emptyState: x = "-",
+    className: j
+  }, C) => {
+    const { copyToClipboard: f } = N({
       onSuccess: m,
       onError: h
     });
-    if (!e) return null;
-    const C = (s) => {
-      s.stopPropagation(), u(e);
+    if (!e) return /* @__PURE__ */ r.jsx(r.Fragment, { children: x });
+    const u = (s) => {
+      s.stopPropagation(), f(e);
     };
     return /* @__PURE__ */ r.jsxs(
       "div",
       {
-        ref: j,
-        className: y("group flex items-center gap-2 w-full", x),
+        ref: C,
+        className: g("group flex items-center gap-2 w-full", j),
         children: [
           a && /* @__PURE__ */ r.jsx(i, { children: /* @__PURE__ */ r.jsxs(o, { children: [
             /* @__PURE__ */ r.jsx(n, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "shrink-0 inline-flex", children: /* @__PURE__ */ r.jsx(
-              c,
+              p,
               {
                 name: a,
                 weight: "fill",
@@ -39,7 +40,7 @@ const N = f(
                 className: "text-primary"
               }
             ) }) }),
-            p && /* @__PURE__ */ r.jsx(l, { children: /* @__PURE__ */ r.jsx("p", { children: p }) })
+            c && /* @__PURE__ */ r.jsx(l, { children: /* @__PURE__ */ r.jsx("p", { children: c }) })
           ] }) }),
           /* @__PURE__ */ r.jsx(i, { children: /* @__PURE__ */ r.jsxs(o, { children: [
             /* @__PURE__ */ r.jsx(n, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "truncate text-sm", children: t ? /* @__PURE__ */ r.jsx(
@@ -59,9 +60,9 @@ const N = f(
               {
                 type: "button",
                 className: "shrink-0 opacity-0 group-hover:opacity-100 transition-opacity p-1 hover:bg-muted rounded",
-                onClick: C,
+                onClick: u,
                 children: /* @__PURE__ */ r.jsx(
-                  c,
+                  p,
                   {
                     name: "CopySimple",
                     size: "sm",
@@ -77,7 +78,7 @@ const N = f(
     );
   }
 );
-N.displayName = "DataTableCopyCell";
+b.displayName = "DataTableCopyCell";
 export {
-  N as DataTableCopyCell
+  b as DataTableCopyCell
 };

package/dist/components/molecules/data-table-cells/data-table-country-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 export interface DataTableCountryCellProps {
     /** ISO 3166-1 alpha-2 country code (e.g., "US", "CO", "BR") */
     code: string | null | undefined;
@@ -7,6 +8,8 @@ export interface DataTableCountryCellProps {
     showName?: boolean;
     /** Custom function to resolve country name from code */
     getCountryName?: (code: string) => string;
+    /** Content to render when code is empty/invalid @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-country-cell.js

@@ -1,37 +1,47 @@
-import { j as r } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as m } from "react";
+import { j as t } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as x } from "react";
 import { cn as f } from "../../../lib/utils.js";
-import { TooltipProvider as u, Tooltip as x, TooltipTrigger as d, TooltipContent as h } from "../../../vendor/shadcn/tooltip.js";
-const j = (t) => !t || typeof t != "string" ? t : typeof String.fromCodePoint < "u" ? t.toUpperCase().replace(
-  /./g,
-  (n) => String.fromCodePoint(n.charCodeAt(0) + 127397)
-) : t, T = m(
-  ({ code: t, showFlag: n = !0, showName: o = !1, getCountryName: s, className: a }, i) => {
-    if (!t) return null;
-    const e = n ? j(t) : null, l = s ? s(t) : null, p = o && l ? l : t.toUpperCase(), c = l ?? t.toUpperCase();
-    return /* @__PURE__ */ r.jsx(u, { children: /* @__PURE__ */ r.jsxs(x, { children: [
-      /* @__PURE__ */ r.jsx(d, { asChild: !0, children: /* @__PURE__ */ r.jsxs(
+import { TooltipProvider as u, Tooltip as d, TooltipTrigger as h, TooltipContent as j } from "../../../vendor/shadcn/tooltip.js";
+const T = (r) => {
+  if (typeof r != "string") return "";
+  const e = r.trim().toUpperCase();
+  return /^[A-Z]{2}$/.test(e) ? String.fromCodePoint(
+    ...[...e].map((s) => s.charCodeAt(0) + 127397)
+  ) : "";
+}, C = x(
+  ({
+    code: r,
+    showFlag: e = !0,
+    showName: s = !1,
+    getCountryName: l,
+    emptyState: i = "-",
+    className: a
+  }, p) => {
+    if (!r) return /* @__PURE__ */ t.jsx(t.Fragment, { children: i });
+    const n = e ? T(r) : null, o = l ? l(r) : null, c = s && o ? o : r.toUpperCase(), m = o ?? r.toUpperCase();
+    return /* @__PURE__ */ t.jsx(u, { children: /* @__PURE__ */ t.jsxs(d, { children: [
+      /* @__PURE__ */ t.jsx(h, { asChild: !0, children: /* @__PURE__ */ t.jsxs(
         "div",
         {
-          ref: i,
+          ref: p,
           className: f(
             "flex items-center gap-1 truncate text-sm",
             a
           ),
           children: [
-            e && /* @__PURE__ */ r.jsx("span", { className: "shrink-0", children: e }),
-            /* @__PURE__ */ r.jsx("span", { className: "truncate", children: p })
+            n && /* @__PURE__ */ t.jsx("span", { className: "shrink-0", children: n }),
+            /* @__PURE__ */ t.jsx("span", { className: "truncate", children: c })
           ]
         }
       ) }),
-      /* @__PURE__ */ r.jsx(h, { children: /* @__PURE__ */ r.jsxs("p", { children: [
-        e && `${e} `,
-        c
+      /* @__PURE__ */ t.jsx(j, { children: /* @__PURE__ */ t.jsxs("p", { children: [
+        n && `${n} `,
+        m
       ] }) })
     ] }) });
   }
 );
-T.displayName = "DataTableCountryCell";
+C.displayName = "DataTableCountryCell";
 export {
-  T as DataTableCountryCell
+  C as DataTableCountryCell
 };

package/dist/components/molecules/data-table-cells/data-table-date-cell.d.ts

@@ -3,7 +3,7 @@ export interface DataTableDateCellProps {
     value: string | Date | null | undefined;
     /** Custom date formatter. If not provided, uses Intl.DateTimeFormat with date and time */
     formatFn?: (date: string | Date) => string;
-    /** Content to render when value is falsy @default null */
+    /** Content to render when value is falsy @default "-" */
     emptyState?: React.ReactNode;
     /** Additional CSS classes */
     className?: string;

package/dist/components/molecules/data-table-cells/data-table-date-cell.js

@@ -1,7 +1,7 @@
 import { j as t } from "../../../_virtual/jsx-runtime.js";
 import { forwardRef as s } from "react";
-import { cn as l } from "../../../lib/utils.js";
-import { TooltipProvider as m, Tooltip as c, TooltipTrigger as d, TooltipContent as f } from "../../../vendor/shadcn/tooltip.js";
+import { cn as m } from "../../../lib/utils.js";
+import { TooltipProvider as l, Tooltip as c, TooltipTrigger as d, TooltipContent as f } from "../../../vendor/shadcn/tooltip.js";
 const h = (r) => {
   try {
     const e = typeof r == "string" ? new Date(r) : r;
@@ -19,11 +19,11 @@ const h = (r) => {
     return String(r);
   }
 }, p = s(
-  ({ value: r, formatFn: e, emptyState: i = null, className: n }, a) => {
+  ({ value: r, formatFn: e, emptyState: i = "-", className: n }, a) => {
     if (!r) return /* @__PURE__ */ t.jsx(t.Fragment, { children: i });
     const o = (e ?? h)(r);
-    return /* @__PURE__ */ t.jsx(m, { children: /* @__PURE__ */ t.jsxs(c, { children: [
-      /* @__PURE__ */ t.jsx(d, { asChild: !0, children: /* @__PURE__ */ t.jsx("div", { ref: a, className: l("truncate text-sm", n), children: o }) }),
+    return /* @__PURE__ */ t.jsx(l, { children: /* @__PURE__ */ t.jsxs(c, { children: [
+      /* @__PURE__ */ t.jsx(d, { asChild: !0, children: /* @__PURE__ */ t.jsx("div", { ref: a, className: m("truncate text-sm", n), children: o }) }),
       /* @__PURE__ */ t.jsx(f, { children: /* @__PURE__ */ t.jsx("p", { children: o }) })
     ] }) });
   }

package/dist/components/molecules/data-table-cells/data-table-icon-text-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 export interface DataTableIconTextCellItem {
     /** Item name/label */
     name: string;
@@ -9,6 +10,8 @@ export interface DataTableIconTextCellProps {
     items: DataTableIconTextCellItem[];
     /** Maximum number of visible items @default 1 */
     maxVisible?: number;
+    /** Content to render when items is empty @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-icon-text-cell.js

@@ -1,20 +1,20 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as j } from "react";
-import { cn as u } from "../../../lib/utils.js";
-import { TooltipProvider as o, Tooltip as i, TooltipTrigger as d, TooltipContent as m } from "../../../vendor/shadcn/tooltip.js";
-import { Badge as f } from "../../atoms/badge/badge.js";
-const g = j(({ items: n, maxVisible: c = 1, className: x }, h) => {
-  if (!n || n.length === 0) return null;
-  const t = /* @__PURE__ */ new Set(), s = n.filter((r) => !r.name || t.has(r.name) ? !1 : (t.add(r.name), !0));
-  if (s.length === 0) return null;
-  const p = s.slice(0, c), a = s.slice(c);
+import { forwardRef as f } from "react";
+import { cn as g } from "../../../lib/utils.js";
+import { TooltipProvider as i, Tooltip as d, TooltipTrigger as m, TooltipContent as x } from "../../../vendor/shadcn/tooltip.js";
+import { Badge as u } from "../../atoms/badge/badge.js";
+const N = f(({ items: n, maxVisible: c = 1, emptyState: t = "-", className: h }, p) => {
+  if (!n || n.length === 0) return /* @__PURE__ */ e.jsx(e.Fragment, { children: t });
+  const o = /* @__PURE__ */ new Set(), s = n.filter((r) => !r.name || o.has(r.name) ? !1 : (o.add(r.name), !0));
+  if (s.length === 0) return /* @__PURE__ */ e.jsx(e.Fragment, { children: t });
+  const j = s.slice(0, c), a = s.slice(c);
   return /* @__PURE__ */ e.jsxs(
     "div",
     {
-      ref: h,
-      className: u("flex items-center gap-2", x),
+      ref: p,
+      className: g("flex items-center gap-2", h),
       children: [
-        p.map((r) => /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1.5 min-w-0", children: [
+        j.map((r) => /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1.5 min-w-0", children: [
           r.icon && /* @__PURE__ */ e.jsx(
             "img",
             {
@@ -26,14 +26,14 @@ const g = j(({ items: n, maxVisible: c = 1, className: x }, h) => {
               }
             }
           ),
-          /* @__PURE__ */ e.jsx(o, { children: /* @__PURE__ */ e.jsxs(i, { children: [
-            /* @__PURE__ */ e.jsx(d, { asChild: !0, children: /* @__PURE__ */ e.jsx("span", { className: "truncate text-sm", children: r.name }) }),
-            /* @__PURE__ */ e.jsx(m, { children: /* @__PURE__ */ e.jsx("p", { children: r.name }) })
+          /* @__PURE__ */ e.jsx(i, { children: /* @__PURE__ */ e.jsxs(d, { children: [
+            /* @__PURE__ */ e.jsx(m, { asChild: !0, children: /* @__PURE__ */ e.jsx("span", { className: "truncate text-sm", children: r.name }) }),
+            /* @__PURE__ */ e.jsx(x, { children: /* @__PURE__ */ e.jsx("p", { children: r.name }) })
           ] }) })
         ] }, r.name)),
-        a.length > 0 && /* @__PURE__ */ e.jsx(o, { delayDuration: 0, children: /* @__PURE__ */ e.jsxs(i, { children: [
-          /* @__PURE__ */ e.jsx(d, { className: "shrink-0", children: /* @__PURE__ */ e.jsxs(
-            f,
+        a.length > 0 && /* @__PURE__ */ e.jsx(i, { delayDuration: 0, children: /* @__PURE__ */ e.jsxs(d, { children: [
+          /* @__PURE__ */ e.jsx(m, { className: "shrink-0", children: /* @__PURE__ */ e.jsxs(
+            u,
             {
               variant: "outline",
               className: "text-xs cursor-pointer hover:border-primary hover:text-primary",
@@ -43,7 +43,7 @@ const g = j(({ items: n, maxVisible: c = 1, className: x }, h) => {
               ]
             }
           ) }),
-          /* @__PURE__ */ e.jsx(m, { className: "p-2", children: /* @__PURE__ */ e.jsx("div", { className: "space-y-2", children: a.map((r) => /* @__PURE__ */ e.jsxs(
+          /* @__PURE__ */ e.jsx(x, { className: "p-2", children: /* @__PURE__ */ e.jsx("div", { className: "space-y-2", children: a.map((r) => /* @__PURE__ */ e.jsxs(
             "div",
             {
               className: "flex items-center gap-3",
@@ -69,7 +69,7 @@ const g = j(({ items: n, maxVisible: c = 1, className: x }, h) => {
     }
   );
 });
-g.displayName = "DataTableIconTextCell";
+N.displayName = "DataTableIconTextCell";
 export {
-  g as DataTableIconTextCell
+  N as DataTableIconTextCell
 };

package/dist/components/molecules/data-table-cells/data-table-percentage-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 export interface DataTablePercentageCellProps {
     /** The decimal value (0-1 range, e.g. 0.85 for 85%) */
     value: number | null | undefined;
@@ -5,6 +6,8 @@ export interface DataTablePercentageCellProps {
     decimals?: number;
     /** Whether to show a progress bar @default false */
     showProgressBar?: boolean;
+    /** Content to render when value is empty @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-percentage-cell.js

@@ -1,27 +1,35 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as m } from "react";
-import { cn as o } from "../../../lib/utils.js";
-const c = m(({ value: t, decimals: r = 2, showProgressBar: l = !1, className: n }, i) => {
-  if (t == null) return null;
-  const a = t * 100, s = new Intl.NumberFormat("en-US", {
-    minimumFractionDigits: 0,
-    maximumFractionDigits: r
-  }).format(a);
-  return /* @__PURE__ */ e.jsxs("div", { ref: i, className: o("flex items-center gap-3", n), children: [
-    l && /* @__PURE__ */ e.jsx("div", { className: "h-1.5 flex-1 min-w-[50px] rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ e.jsx(
-      "div",
-      {
-        className: "h-full rounded-full bg-primary transition-all",
-        style: { width: `${Math.min(a, 100)}%` }
-      }
-    ) }),
-    /* @__PURE__ */ e.jsxs("span", { className: "text-sm whitespace-nowrap", children: [
-      s,
-      "%"
-    ] })
-  ] });
-});
-c.displayName = "DataTablePercentageCell";
+import { forwardRef as o } from "react";
+import { cn as c } from "../../../lib/utils.js";
+const d = o(
+  ({
+    value: t,
+    decimals: r = 2,
+    showProgressBar: n = !1,
+    emptyState: i = "-",
+    className: s
+  }, l) => {
+    if (t == null) return /* @__PURE__ */ e.jsx(e.Fragment, { children: i });
+    const a = t * 100, m = new Intl.NumberFormat("en-US", {
+      minimumFractionDigits: 0,
+      maximumFractionDigits: r
+    }).format(a);
+    return /* @__PURE__ */ e.jsxs("div", { ref: l, className: c("flex items-center gap-3", s), children: [
+      n && /* @__PURE__ */ e.jsx("div", { className: "h-1.5 flex-1 min-w-[50px] rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ e.jsx(
+        "div",
+        {
+          className: "h-full rounded-full bg-primary transition-all",
+          style: { width: `${Math.min(a, 100)}%` }
+        }
+      ) }),
+      /* @__PURE__ */ e.jsxs("span", { className: "text-sm whitespace-nowrap", children: [
+        m,
+        "%"
+      ] })
+    ] });
+  }
+);
+d.displayName = "DataTablePercentageCell";
 export {
-  c as DataTablePercentageCell
+  d as DataTablePercentageCell
 };

package/dist/components/molecules/data-table-cells/data-table-status-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 import { IconName } from '../../atoms/icon';
 /**
  * Configuration entry for mapping a status key to a Badge visual.
@@ -23,6 +24,8 @@ export interface DataTableStatusCellProps {
      * @default Capitalizes first letter, replaces underscores with spaces
      */
     formatLabel?: (status: string) => string;
+    /** Content to render when status is empty @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-status-cell.js

@@ -1,24 +1,32 @@
-import { j as n } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as m } from "react";
+import { j as e } from "../../../_virtual/jsx-runtime.js";
+import { forwardRef as d } from "react";
 import { cn as i } from "../../../lib/utils.js";
 import { Badge as l } from "../../atoms/badge/badge.js";
 const p = (r) => {
   if (!r) return r;
-  const e = r.replace(/[_.]/g, " ").toLowerCase();
-  return e.charAt(0).toUpperCase() + e.slice(1);
-}, d = m(({ status: r, statusMap: e, formatLabel: c = p, className: o }, t) => {
-  if (!r) return null;
-  const a = e?.[r] ?? e?.[r.toUpperCase()];
-  return a ? /* @__PURE__ */ n.jsx("div", { ref: t, className: i(o), children: /* @__PURE__ */ n.jsx(
-    l,
-    {
-      startIcon: a.icon ?? "Info",
-      variant: a.variant,
-      children: a.label
-    }
-  ) }) : /* @__PURE__ */ n.jsx("div", { ref: t, className: i(o), children: /* @__PURE__ */ n.jsx(l, { startIcon: "Info", variant: "info", children: c(r) }) });
-});
-d.displayName = "DataTableStatusCell";
+  const a = r.replace(/[_.]/g, " ").toLowerCase();
+  return a.charAt(0).toUpperCase() + a.slice(1);
+}, f = d(
+  ({
+    status: r,
+    statusMap: a,
+    formatLabel: c = p,
+    emptyState: m = "-",
+    className: o
+  }, t) => {
+    if (!r) return /* @__PURE__ */ e.jsx(e.Fragment, { children: m });
+    const n = a?.[r] ?? a?.[r.toUpperCase()];
+    return n ? /* @__PURE__ */ e.jsx("div", { ref: t, className: i(o), children: /* @__PURE__ */ e.jsx(
+      l,
+      {
+        startIcon: n.icon ?? "Info",
+        variant: n.variant,
+        children: n.label
+      }
+    ) }) : /* @__PURE__ */ e.jsx("div", { ref: t, className: i(o), children: /* @__PURE__ */ e.jsx(l, { startIcon: "Info", variant: "info", children: c(r) }) });
+  }
+);
+f.displayName = "DataTableStatusCell";
 export {
-  d as DataTableStatusCell
+  f as DataTableStatusCell
 };

package/dist/components/molecules/data-table-cells/data-table-tags-cell.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 export interface DataTableTagsCellProps {
     /** Array of tag labels to display */
     tags: string[];
@@ -5,6 +6,8 @@ export interface DataTableTagsCellProps {
     maxVisible?: number;
     /** Badge variant for all tags @default "outline" */
     variant?: "outline" | "secondary" | "info" | "success" | "error" | "warning" | "alert";
+    /** Content to render when tags is empty @default "-" */
+    emptyState?: ReactNode;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/molecules/data-table-cells/data-table-tags-cell.js

@@ -1,39 +1,45 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as m } from "react";
-import { cn as p } from "../../../lib/utils.js";
-import { TooltipProvider as x, Tooltip as d, TooltipTrigger as h, TooltipContent as f } from "../../../vendor/shadcn/tooltip.js";
-import { Badge as i } from "../../atoms/badge/badge.js";
-const j = m(
-  ({ tags: l, maxVisible: o = 2, variant: t = "outline", className: a }, n) => {
-    if (!l || l.length === 0) return null;
-    const c = l.slice(0, o), s = l.slice(o);
+import { forwardRef as p } from "react";
+import { cn as x } from "../../../lib/utils.js";
+import { TooltipProvider as d, Tooltip as h, TooltipTrigger as j, TooltipContent as f } from "../../../vendor/shadcn/tooltip.js";
+import { Badge as o } from "../../atoms/badge/badge.js";
+const T = p(
+  ({
+    tags: s,
+    maxVisible: i = 2,
+    variant: t = "outline",
+    emptyState: a = "-",
+    className: n
+  }, c) => {
+    if (!s || s.length === 0) return /* @__PURE__ */ e.jsx(e.Fragment, { children: a });
+    const m = s.slice(0, i), l = s.slice(i);
     return /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: n,
-        className: p("flex items-center gap-1 flex-wrap", a),
+        ref: c,
+        className: x("flex items-center gap-1 flex-wrap", n),
         children: [
-          c.map((r) => /* @__PURE__ */ e.jsx(i, { variant: t, className: "text-xs", children: r }, r)),
-          s.length > 0 && /* @__PURE__ */ e.jsx(x, { delayDuration: 0, children: /* @__PURE__ */ e.jsxs(d, { children: [
-            /* @__PURE__ */ e.jsx(h, { children: /* @__PURE__ */ e.jsxs(
-              i,
+          m.map((r) => /* @__PURE__ */ e.jsx(o, { variant: t, className: "text-xs", children: r }, r)),
+          l.length > 0 && /* @__PURE__ */ e.jsx(d, { delayDuration: 0, children: /* @__PURE__ */ e.jsxs(h, { children: [
+            /* @__PURE__ */ e.jsx(j, { children: /* @__PURE__ */ e.jsxs(
+              o,
               {
                 variant: "outline",
                 className: "text-xs cursor-pointer hover:border-primary hover:text-primary",
                 children: [
                   "+",
-                  s.length
+                  l.length
                 ]
               }
             ) }),
-            /* @__PURE__ */ e.jsx(f, { className: "p-2", children: /* @__PURE__ */ e.jsx("div", { className: "space-y-1", children: s.map((r) => /* @__PURE__ */ e.jsx("p", { className: "text-sm", children: r }, r)) }) })
+            /* @__PURE__ */ e.jsx(f, { className: "p-2", children: /* @__PURE__ */ e.jsx("div", { className: "space-y-1", children: l.map((r) => /* @__PURE__ */ e.jsx("p", { className: "text-sm", children: r }, r)) }) })
           ] }) })
         ]
       }
     );
   }
 );
-j.displayName = "DataTableTagsCell";
+T.displayName = "DataTableTagsCell";
 export {
-  j as DataTableTagsCell
+  T as DataTableTagsCell
 };

package/dist/components/molecules/data-table-cells/data-table-text-cell.d.ts

@@ -19,8 +19,7 @@ export interface DataTableTextCellProps {
     tooltip?: string | false;
     /**
      * Content to render when value is falsy.
-     * Defaults to null (renders nothing).
-     * @example "-" or "--"
+     * @default "-"
      */
     emptyState?: ReactNode;
     /**

package/dist/components/molecules/data-table-cells/data-table-text-cell.js

@@ -3,13 +3,13 @@ import { forwardRef as c } from "react";
 import { cn as x } from "../../../lib/utils.js";
 import { TooltipProvider as d, Tooltip as m, TooltipTrigger as p, TooltipContent as j } from "../../../vendor/shadcn/tooltip.js";
 const T = c(
-  ({ value: r, formatFn: i, tooltip: l, emptyState: a = null, className: o }, n) => {
+  ({ value: r, formatFn: i, tooltip: o, emptyState: a = "-", className: l }, s) => {
     if (!r) return /* @__PURE__ */ t.jsx(t.Fragment, { children: a });
-    const e = i ? i(r) : r, s = l === !1 ? null : l ?? e;
-    return s ? /* @__PURE__ */ t.jsx(d, { children: /* @__PURE__ */ t.jsxs(m, { children: [
-      /* @__PURE__ */ t.jsx(p, { asChild: !0, children: /* @__PURE__ */ t.jsx("div", { ref: n, className: x("truncate text-sm", o), children: e }) }),
-      /* @__PURE__ */ t.jsx(j, { children: /* @__PURE__ */ t.jsx("p", { children: s }) })
-    ] }) }) : /* @__PURE__ */ t.jsx("div", { ref: n, className: x("truncate text-sm", o), children: e });
+    const e = i ? i(r) : r, n = o === !1 ? null : o ?? e;
+    return n ? /* @__PURE__ */ t.jsx(d, { children: /* @__PURE__ */ t.jsxs(m, { children: [
+      /* @__PURE__ */ t.jsx(p, { asChild: !0, children: /* @__PURE__ */ t.jsx("div", { ref: s, className: x("truncate text-sm", l), children: e }) }),
+      /* @__PURE__ */ t.jsx(j, { children: /* @__PURE__ */ t.jsx("p", { children: n }) })
+    ] }) }) : /* @__PURE__ */ t.jsx("div", { ref: s, className: x("truncate text-sm", l), children: e });
   }
 );
 T.displayName = "DataTableTextCell";