@ledgerhq/lumen-ui-react 0.1.59 → 0.1.60

package/dist/lib/Components/core/AmountInput/useAmountInputValue/useAmountInputValue.js

@@ -1,11 +1,11 @@
 import { textFormatter as m } from "../../../../../libs/utils-shared/dist/index.js";
-import { useCallback as d, useState as g, useRef as i, useEffect as f } from "react";
+import { useCallback as i, useState as g, useRef as d, useEffect as f } from "react";
 const I = ({
   value: r,
   onChange: o,
   formatOptions: t
 }) => {
-  const a = d(
+  const a = i(
     (e) => m(String(e), t),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
@@ -15,13 +15,13 @@ const I = ({
       t.maxDecimalLength,
       t.decimalSeparator
     ]
-  ), [s, c] = g(() => a(r)), [h, l] = g(!1), u = i(s);
+  ), [c, s] = g(() => a(r)), [h, l] = g(!1), u = d(c);
   return f(() => {
     const e = a(r);
-    c(e), u.current = e;
-  }, [r, a]), { inputValue: s, isChanging: h, setIsChanging: l, handleChange: (e) => {
+    s(e), u.current = e;
+  }, [r, a]), { inputValue: c, isChanging: h, setIsChanging: l, handleChange: (e) => {
     const n = a(e.target.value);
-    c(n), o({ ...e, target: { ...e.target, value: n } }), n !== u.current && l(!0), u.current = n;
+    s(n), o({ ...e, target: { ...e.target, value: n } }), n !== u.current && l(!0), u.current = n;
   } };
 };
 export {

package/dist/lib/Components/core/Avatar/resolveAvatarColor.js

@@ -27,10 +27,10 @@ const t = {
 function d(e) {
   return t[o(e)];
 }
-function g(e) {
+function s(e) {
   return e ? n[e] ?? c : v;
 }
 export {
-  g as getAvatarFallbackTextColor,
+  s as getAvatarFallbackTextColor,
   d as resolveAvatarColor
 };

package/dist/lib/Components/core/Banner/Banner.js

@@ -1,10 +1,10 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import { jsxs as a, jsx as r } from "react/jsx-runtime";
 import { cn as t } from "../../../../libs/utils-shared/dist/index.js";
 import { cva as b } from "class-variance-authority";
 import { useCommonTranslation as g } from "../../../../i18n/useCommonTranslation.js";
-import { IconButton as u } from "../IconButton/IconButton.js";
-import { Close as N } from "../../symbols/icons/Close.js";
-import { DeleteCircleFill as h } from "../../symbols/icons/DeleteCircleFill.js";
+import { IconButton as N } from "../IconButton/IconButton.js";
+import { Close as h } from "../../symbols/icons/Close.js";
+import { DeleteCircleFill as u } from "../../symbols/icons/DeleteCircleFill.js";
 import { WarningFill as v } from "../../symbols/icons/WarningFill.js";
 import { CheckmarkCircleFill as w } from "../../symbols/icons/CheckmarkCircleFill.js";
 import { InformationFill as C } from "../../symbols/icons/InformationFill.js";
@@ -12,7 +12,7 @@ const k = {
   info: /* @__PURE__ */ r(C, { className: "text-base" }),
   success: /* @__PURE__ */ r(w, { className: "text-success" }),
   warning: /* @__PURE__ */ r(v, { className: "text-warning" }),
-  error: /* @__PURE__ */ r(h, { className: "text-error" })
+  error: /* @__PURE__ */ r(u, { className: "text-error" })
 }, F = {
   root: b("flex w-full items-start gap-8 rounded-md p-12 text-base", {
     variants: {
@@ -27,7 +27,7 @@ const k = {
 }, W = ({
   ref: c,
   appearance: s = "info",
-  title: a,
+  title: e,
   description: n,
   primaryAction: o,
   secondaryAction: l,
@@ -37,7 +37,7 @@ const k = {
   ...f
 }) => {
   const { t: x } = g(), d = k[s];
-  return /* @__PURE__ */ e(
+  return /* @__PURE__ */ a(
     "div",
     {
       ref: c,
@@ -45,22 +45,22 @@ const k = {
       ...f,
       children: [
         /* @__PURE__ */ r("div", { className: "flex shrink-0 items-start py-4", children: d }),
-        /* @__PURE__ */ e("div", { className: "mr-8 flex flex-1 flex-col gap-8 py-4", children: [
-          /* @__PURE__ */ e("div", { className: "flex flex-col gap-4", children: [
-            a && /* @__PURE__ */ r("h3", { className: "line-clamp-2 body-1-semi-bold", children: a }),
-            n && /* @__PURE__ */ r("div", { className: t("line-clamp-5 body-2", !a && "mt-2"), children: n })
+        /* @__PURE__ */ a("div", { className: "mr-8 flex flex-1 flex-col gap-8 py-4", children: [
+          /* @__PURE__ */ a("div", { className: "flex flex-col gap-4", children: [
+            e && /* @__PURE__ */ r("h3", { className: "line-clamp-2 body-1-semi-bold", children: e }),
+            n && /* @__PURE__ */ r("div", { className: t("line-clamp-5 body-2", !e && "mt-2"), children: n })
           ] }),
-          (o || l) && /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-4", children: [
+          (o || l) && /* @__PURE__ */ a("div", { className: "flex flex-wrap gap-4", children: [
             o,
             l
           ] })
         ] }),
         i && /* @__PURE__ */ r(
-          u,
+          N,
           {
             appearance: "transparent",
             size: "xs",
-            icon: N,
+            icon: h,
             onClick: () => i(),
             "aria-label": p || x("components.banner.closeAriaLabel")
           }

package/dist/lib/Components/core/Button/Button.js

@@ -17,8 +17,8 @@ const l = e("", {
   ref: t,
   className: m,
   loading: s,
-  disabled: r,
-  children: a,
+  disabled: a,
+  children: r,
   size: o,
   icon: i,
   ...p
@@ -27,12 +27,12 @@ const l = e("", {
   {
     ref: t,
     size: o,
-    disabled: r,
+    disabled: a,
     icon: i,
     loading: s,
     className: d(l({ size: o }), "gap-8", m),
     ...p,
-    children: a
+    children: r
   }
 );
 export {

package/dist/lib/Components/core/Card/Card.js

@@ -71,31 +71,31 @@ const k = ({
       disabled: !1
     }
   }
-), D = ({
+), P = ({
   ref: r,
   className: t,
   type: a = "interactive",
   expanded: e,
   outlined: s = !1,
   disabled: i = !1,
-  onClick: l,
-  children: d,
+  onClick: d,
+  children: l,
   ...p
 }) => {
   const u = h(
     () => k({
       type: a,
       expanded: e,
-      onClick: l,
+      onClick: d,
       disabled: i
     }),
-    [a, e, l, i]
+    [a, e, d, i]
   );
   return /* @__PURE__ */ n(R, { value: u, children: /* @__PURE__ */ n(g, { value: { disabled: i }, children: /* @__PURE__ */ f(
     "div",
     {
       ref: r,
-      ...u.cardClickable && C({ onClick: l, disabled: i }),
+      ...u.cardClickable && C({ onClick: d, disabled: i }),
       className: o(
         E({
           interactive: u.cardClickable,
@@ -105,7 +105,7 @@ const k = ({
       ),
       ...p,
       children: [
-        d,
+        l,
         s && /* @__PURE__ */ n(
           "span",
           {
@@ -123,7 +123,7 @@ const k = ({
   className: a,
   ...e
 }) => {
-  const { disabled: s, headerClickable: i, footerExpanded: l, onHeaderClick: d } = c({
+  const { disabled: s, headerClickable: i, footerExpanded: d, onHeaderClick: l } = c({
     consumerName: "CardHeader",
     contextRequired: !1
   });
@@ -131,8 +131,8 @@ const k = ({
     "div",
     {
       ref: r,
-      "aria-expanded": d ? l : void 0,
-      ...C({ onClick: d, disabled: s }),
+      "aria-expanded": l ? d : void 0,
+      ...C({ onClick: l, disabled: s }),
       className: o(
         "flex items-center gap-12 p-12",
         i && "cursor-pointer -outline-offset-6 transition-colors hover:bg-surface-hover focus-visible:outline-2 focus-visible:outline-focus active:bg-surface-pressed",
@@ -141,9 +141,9 @@ const k = ({
       ...e,
       children: [
         t,
-        d && /* @__PURE__ */ f(b, { children: [
-          l && /* @__PURE__ */ n(N, { className: "text-muted", size: 20 }),
-          !l && /* @__PURE__ */ n(w, { className: "text-muted", size: 20 })
+        l && /* @__PURE__ */ f(b, { children: [
+          d && /* @__PURE__ */ n(N, { className: "text-muted", size: 20 }),
+          !d && /* @__PURE__ */ n(w, { className: "text-muted", size: 20 })
         ] })
       ]
     }
@@ -296,7 +296,7 @@ const k = ({
   appearance: e = "plain",
   ...s
 }) => {
-  const { disabled: i, footerExpanded: l } = c({
+  const { disabled: i, footerExpanded: d } = c({
     consumerName: "CardFooter",
     contextRequired: !1
   });
@@ -305,7 +305,7 @@ const k = ({
     {
       className: o(
         H({ appearance: e }),
-        l ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
+        d ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
       ),
       children: /* @__PURE__ */ n("div", { className: "overflow-hidden", children: /* @__PURE__ */ n(
         "div",
@@ -337,7 +337,7 @@ const k = ({
   }
 );
 export {
-  D as Card,
+  P as Card,
   B as CardContent,
   M as CardContentDescription,
   I as CardContentRow,

package/dist/lib/Components/core/CardButton/CardButton.js

@@ -18,31 +18,31 @@ const h = f(
 ), w = ({
   ref: i,
   className: o,
-  appearance: d,
-  icon: l,
+  appearance: l,
+  icon: d,
   title: n,
   description: t,
   hideChevron: r,
-  disabled: u,
-  ...b
+  disabled: b,
+  ...u
 }) => {
   const c = m({
     consumerName: "CardButton",
-    mergeWith: { disabled: u }
-  }), s = l;
+    mergeWith: { disabled: b }
+  }), s = d;
   return /* @__PURE__ */ a(
     "button",
     {
       ref: i,
       className: p(
         h({
-          appearance: d
+          appearance: l
         }),
         o
       ),
       disabled: c,
       type: "button",
-      ...b,
+      ...u,
       children: [
         s && /* @__PURE__ */ e(s, { size: 24 }),
         /* @__PURE__ */ a("div", { className: "flex min-w-0 flex-1 flex-col gap-4 text-left", children: [

package/dist/lib/Components/core/DataTable/DataTable.d.ts

@@ -11,7 +11,7 @@ import { DataTableProps, DataTableRootProps } from './types';
  *   <DataTable />
  * </DataTableRoot>
  */
-export declare const DataTableRoot: <TData extends RowData = RowData>({ table, appearance, paginationMode, loading, onScrollBottom, onRowClick, groupBy, renderGroupHeader, hideHeader, stickyHeader, children, className, ref, ...props }: DataTableRootProps<TData>) => import("react/jsx-runtime").JSX.Element;
+export declare const DataTableRoot: <TData extends RowData = RowData>({ table, appearance, paginationMode, loading, onScrollBottom, onRowClick, getRowProps, groupBy, renderGroupHeader, hideHeader, stickyHeader, children, className, ref, ...props }: DataTableRootProps<TData>) => import("react/jsx-runtime").JSX.Element;
 /**
  * Renders the full table (header + body) from the TanStack table instance
  * provided by `DataTableRoot`. Internally composes the pure-UI Table building blocks.

package/dist/lib/Components/core/DataTable/DataTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/core/DataTable/DataTable.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,OAAO,EAER,MAAM,uBAAuB,CAAC;AAI/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAkBvD,OAAO,KAAK,EAGV,cAAc,EACd,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAkBjB;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,GAAI,KAAK,SAAS,OAAO,GAAG,OAAO,EAAE,sKAe5D,kBAAkB,CAAC,KAAK,CAAC,4CAuB3B,CAAC;AAqFF;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS,GAAI,8BAA8B,cAAc,4CA8BrE,CAAC;AAyHF;;;GAGG;AACH,eAAO,MAAM,0BAA0B,GAAI,wBAGxC,gBAAgB,4CAqBlB,CAAC"}
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/core/DataTable/DataTable.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,OAAO,EAER,MAAM,uBAAuB,CAAC;AAI/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAkBvD,OAAO,KAAK,EAGV,cAAc,EACd,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAmBjB;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,GAAI,KAAK,SAAS,OAAO,GAAG,OAAO,EAAE,mLAgB5D,kBAAkB,CAAC,KAAK,CAAC,4CAwB3B,CAAC;AAqFF;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS,GAAI,8BAA8B,cAAc,4CA8BrE,CAAC;AA2HF;;;GAGG;AACH,eAAO,MAAM,0BAA0B,GAAI,wBAGxC,gBAAgB,4CAqBlB,CAAC"}

package/dist/lib/Components/core/DataTable/DataTable.js

@@ -1,204 +1,208 @@
-import { jsx as o, jsxs as m } from "react/jsx-runtime";
-import { createSafeContext as f, cn as w } from "../../../../libs/utils-shared/dist/index.js";
-import { flexRender as d } from "@tanstack/react-table";
-import { useCallback as R, Fragment as x } from "react";
-import { TableRoot as B, Table as N, TableLoadingRow as k, TableColGroup as y, TableCol as H, TableHeader as S, TableHeaderRow as G, TableHeaderCell as q, TableSortButton as v, TableBody as b, TableGroupHeaderRow as I, TableRow as V, TableCell as F } from "../Table/Table.js";
-import { SearchInput as M } from "../SearchInput/SearchInput.js";
-const [j, i] = f("DataTableContext"), X = ({
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+import { createSafeContext as w, cn as R } from "../../../../libs/utils-shared/dist/index.js";
+import { flexRender as m } from "@tanstack/react-table";
+import { useCallback as x, Fragment as B } from "react";
+import { TableRoot as N, Table as k, TableLoadingRow as y, TableColGroup as H, TableCol as S, TableHeader as G, TableHeaderRow as v, TableHeaderCell as q, TableSortButton as I, TableBody as b, TableGroupHeaderRow as V, TableRow as F, TableCell as M } from "../Table/Table.js";
+import { SearchInput as P } from "../SearchInput/SearchInput.js";
+const [j, i] = w("DataTableContext"), Y = ({
   table: l,
   appearance: n = "no-background",
-  paginationMode: t = "none",
+  paginationMode: o = "none",
   loading: e = !1,
-  onScrollBottom: a,
-  onRowClick: s,
-  groupBy: r,
-  renderGroupHeader: c,
-  hideHeader: u = !1,
-  stickyHeader: T = !0,
-  children: p,
-  className: D,
-  ref: h,
-  ...C
-}) => /* @__PURE__ */ o(
+  onScrollBottom: t,
+  onRowClick: r,
+  getRowProps: c,
+  groupBy: s,
+  renderGroupHeader: u,
+  hideHeader: T = !1,
+  stickyHeader: p = !0,
+  children: D,
+  className: h,
+  ref: C,
+  ...f
+}) => /* @__PURE__ */ a(
   j,
   {
     value: {
-      hideHeader: u,
-      stickyHeader: T,
-      paginationMode: t,
+      hideHeader: T,
+      stickyHeader: p,
+      paginationMode: o,
       table: l,
       appearance: n,
       loading: e,
-      onScrollBottom: a,
-      onRowClick: s,
-      groupBy: r,
-      renderGroupHeader: c
+      onScrollBottom: t,
+      onRowClick: r,
+      getRowProps: c,
+      groupBy: s,
+      renderGroupHeader: u
     },
-    children: /* @__PURE__ */ o("div", { ref: h, className: w("flex flex-col", D), ...C, children: p })
+    children: /* @__PURE__ */ a("div", { ref: C, className: R("flex flex-col", h), ...f, children: D })
   }
 ), L = () => {
   const { table: l } = i({
     consumerName: "DataTableColGroup",
     contextRequired: !0
   });
-  return /* @__PURE__ */ o(y, { children: l.getVisibleLeafColumns().map((n) => {
-    const t = n.columnDef.meta;
-    return /* @__PURE__ */ o(
-      H,
+  return /* @__PURE__ */ a(H, { children: l.getVisibleLeafColumns().map((n) => {
+    const o = n.columnDef.meta;
+    return /* @__PURE__ */ a(
+      S,
       {
-        hideBelow: t?.hideBelow,
-        className: t?.className
+        hideBelow: o?.hideBelow,
+        className: o?.className
       },
       n.id
     );
   }) });
-}, P = ({
+}, z = ({
   className: l,
   ref: n,
-  ...t
+  ...o
 }) => {
-  const { table: e, stickyHeader: a } = i({
+  const { table: e, stickyHeader: t } = i({
     consumerName: "DataTableHeader",
     contextRequired: !0
   });
-  return /* @__PURE__ */ o(S, { ref: n, className: l, ...t, children: e.getHeaderGroups().map((s) => /* @__PURE__ */ o(G, { stickyHeader: a, children: s.headers.map((r) => {
-    const c = r.column.columnDef.meta;
-    return /* @__PURE__ */ o(
+  return /* @__PURE__ */ a(G, { ref: n, className: l, ...o, children: e.getHeaderGroups().map((r) => /* @__PURE__ */ a(v, { stickyHeader: t, children: r.headers.map((c) => {
+    const s = c.column.columnDef.meta;
+    return /* @__PURE__ */ a(
       q,
       {
-        align: c?.align,
-        hideBelow: c?.hideBelow,
-        className: c?.className,
-        trailingContent: c?.headerTrailingContent,
-        children: r.isPlaceholder ? null : r.column.getCanSort() ? /* @__PURE__ */ o(
-          v,
+        align: s?.align,
+        hideBelow: s?.hideBelow,
+        className: s?.className,
+        trailingContent: s?.headerTrailingContent,
+        children: c.isPlaceholder ? null : c.column.getCanSort() ? /* @__PURE__ */ a(
+          I,
           {
-            sortDirection: r.column.getIsSorted() || void 0,
-            onClick: r.column.getToggleSortingHandler(),
-            align: c?.align,
-            children: d(
-              r.column.columnDef.header,
-              r.getContext()
+            sortDirection: c.column.getIsSorted() || void 0,
+            onClick: c.column.getToggleSortingHandler(),
+            align: s?.align,
+            children: m(
+              c.column.columnDef.header,
+              c.getContext()
             )
           }
-        ) : d(
-          r.column.columnDef.header,
-          r.getContext()
+        ) : m(
+          c.column.columnDef.header,
+          c.getContext()
         )
       },
-      r.id
+      c.id
     );
-  }) }, s.id)) });
-}, Y = ({ className: l, ref: n, ...t }) => {
+  }) }, r.id)) });
+}, Z = ({ className: l, ref: n, ...o }) => {
   const {
     appearance: e,
-    paginationMode: a,
-    hideHeader: s,
-    loading: r,
-    onScrollBottom: c,
+    paginationMode: t,
+    hideHeader: r,
+    loading: c,
+    onScrollBottom: s,
     groupBy: u
   } = i({
     consumerName: "DataTable",
     contextRequired: !0
   });
-  return /* @__PURE__ */ m(
-    B,
+  return /* @__PURE__ */ d(
+    N,
     {
       ref: n,
       appearance: e,
-      loading: r,
-      onScrollBottom: c,
+      loading: c,
+      onScrollBottom: s,
       className: l,
-      ...t,
+      ...o,
       children: [
-        /* @__PURE__ */ m(N, { children: [
-          /* @__PURE__ */ o(L, {}),
-          !s && /* @__PURE__ */ o(P, {}),
-          u ? /* @__PURE__ */ o(E, {}) : /* @__PURE__ */ o(z, {})
+        /* @__PURE__ */ d(k, { children: [
+          /* @__PURE__ */ a(L, {}),
+          !r && /* @__PURE__ */ a(z, {}),
+          u ? /* @__PURE__ */ a(J, {}) : /* @__PURE__ */ a(A, {})
         ] }),
-        a === "infinite-scroll" && /* @__PURE__ */ o(k, {})
+        t === "infinite-scroll" && /* @__PURE__ */ a(y, {})
       ]
     }
   );
-}, z = ({ className: l, ref: n, ...t }) => {
+}, A = ({ className: l, ref: n, ...o }) => {
   const { table: e } = i({
     consumerName: "DataTableBody",
     contextRequired: !0
   });
-  return /* @__PURE__ */ o(b, { ref: n, className: l, ...t, children: e.getRowModel().rows.map((a) => /* @__PURE__ */ o(g, { row: a }, a.id)) });
-}, A = (l, n) => {
-  const t = [];
+  return /* @__PURE__ */ a(b, { ref: n, className: l, ...o, children: e.getRowModel().rows.map((t) => /* @__PURE__ */ a(g, { row: t }, t.id)) });
+}, E = (l, n) => {
+  const o = [];
   let e = null;
-  for (const a of l) {
-    const s = n(a);
-    (!e || e.key !== s) && (e = { key: s, rows: [], count: 0 }, t.push(e)), e.rows.push(a), e.count++;
+  for (const t of l) {
+    const r = n(t);
+    (!e || e.key !== r) && (e = { key: r, rows: [], count: 0 }, o.push(e)), e.rows.push(t), e.count++;
   }
-  return t;
-}, E = ({
+  return o;
+}, J = ({
   className: l,
   ref: n,
-  ...t
+  ...o
 }) => {
-  const { table: e, groupBy: a, renderGroupHeader: s } = i({
+  const { table: e, groupBy: t, renderGroupHeader: r } = i({
     consumerName: "DataTableGroupedBody",
     contextRequired: !0
-  }), r = A(
+  }), c = E(
     e.getRowModel().rows,
-    a
+    t
   );
-  return /* @__PURE__ */ o(b, { ref: n, className: l, ...t, children: r.map((c) => /* @__PURE__ */ m(x, { children: [
-    /* @__PURE__ */ o(I, { colSpan: c.rows[0].getVisibleCells().length, children: s ? s({ row: c.rows[0], count: c.count }) : c.key }),
-    c.rows.map((u) => /* @__PURE__ */ o(g, { row: u }, u.id))
-  ] }, c.key)) });
+  return /* @__PURE__ */ a(b, { ref: n, className: l, ...o, children: c.map((s) => /* @__PURE__ */ d(B, { children: [
+    /* @__PURE__ */ a(V, { colSpan: s.rows[0].getVisibleCells().length, children: r ? r({ row: s.rows[0], count: s.count }) : s.key }),
+    s.rows.map((u) => /* @__PURE__ */ a(g, { row: u }, u.id))
+  ] }, s.key)) });
 }, g = ({ row: l }) => {
-  const { onRowClick: n } = i({
+  const { onRowClick: n, getRowProps: o } = i({
     consumerName: "DataTableRow",
     contextRequired: !0
-  }), t = !!n;
-  return /* @__PURE__ */ o(
-    V,
+  }), e = !!n;
+  return /* @__PURE__ */ a(
+    F,
     {
-      clickable: t,
-      onClick: t ? () => n?.(l) : void 0,
-      children: l.getVisibleCells().map((e) => {
-        const a = e.column.columnDef.meta;
-        return /* @__PURE__ */ o(
-          F,
+      ...o?.(l),
+      clickable: e,
+      onClick: e ? () => n?.(l) : void 0,
+      role: e ? "button" : void 0,
+      children: l.getVisibleCells().map((t) => {
+        const r = t.column.columnDef.meta;
+        return /* @__PURE__ */ a(
+          M,
           {
-            align: a?.align,
-            hideBelow: a?.hideBelow,
-            className: a?.className,
-            children: d(e.column.columnDef.cell, e.getContext())
+            align: r?.align,
+            hideBelow: r?.hideBelow,
+            className: r?.className,
+            children: m(t.column.columnDef.cell, t.getContext())
           },
-          e.id
+          t.id
         );
       })
     }
   );
-}, Z = ({
+}, _ = ({
   onChange: l,
   ...n
 }) => {
-  const { table: t } = i({
+  const { table: o } = i({
     consumerName: "DataTableGlobalSearchInput",
     contextRequired: !0
-  }), e = R(
-    (a) => {
-      t.setGlobalFilter(a.target.value), l?.(a);
+  }), e = x(
+    (t) => {
+      o.setGlobalFilter(t.target.value), l?.(t);
     },
-    [t, l]
+    [o, l]
   );
-  return /* @__PURE__ */ o(
-    M,
+  return /* @__PURE__ */ a(
+    P,
     {
-      value: t.getState().globalFilter ?? "",
+      value: o.getState().globalFilter ?? "",
       onChange: e,
       ...n
     }
   );
 };
 export {
-  Y as DataTable,
-  Z as DataTableGlobalSearchInput,
-  X as DataTableRoot
+  Z as DataTable,
+  _ as DataTableGlobalSearchInput,
+  Y as DataTableRoot
 };

package/dist/lib/Components/core/DataTable/types.d.ts

@@ -1,7 +1,7 @@
 import { Row, RowData, Table } from '@tanstack/react-table';
 import { ComponentPropsWithRef, ReactNode } from 'react';
 import { Breakpoints } from '../../../../types';
-import { TableRootProps } from '../Table/types';
+import { TableRootProps, TableRowProps } from '../Table/types';
 /**
  * Lumen-specific column metadata that extends TanStack's ColumnMeta.
  * These properties are picked up by DataTable's auto-rendering logic.
@@ -31,6 +31,7 @@ declare module '@tanstack/react-table' {
     interface ColumnMeta<TData extends RowData, TValue> extends LumenColumnMeta {
     }
 }
+export type DataTableRowProps = Omit<TableRowProps, 'children' | 'clickable' | 'dangerouslySetInnerHTML' | 'onClick' | 'onClickCapture' | 'role'> & Record<`data-${string}`, string | number | boolean | undefined>;
 export type DataTableRootProps<TData extends RowData = RowData> = {
     /**
      * The TanStack table instance returned by `useLumenDataTable`.
@@ -81,6 +82,11 @@ export type DataTableRootProps<TData extends RowData = RowData> = {
      * @default undefined
      */
     onRowClick?: (row: Row<TData>) => void;
+    /**
+     * Returns native props to apply to a rendered data row.
+     * @default undefined
+     */
+    getRowProps?: (row: Row<TData>) => DataTableRowProps | undefined;
     /**
      * Extracts a group key from a row. When provided, rows are visually
      * separated by group header rows whenever the key changes.