@omniviewdev/base-ui 0.2.1 → 0.2.2

package/dist/index.d.ts

@@ -69,6 +69,7 @@ import { Ref } from 'react';
 import { RefAttributes } from 'react';
 import { RefCallback } from 'react';
 import { RefObject } from 'react';
+import { Row } from '@tanstack/react-table';
 import { RowSelectionState } from '@tanstack/react-table';
 import { Select as Select_2 } from '@base-ui/react/select';
 import { SelectArrowProps } from '@base-ui/react';
@@ -1482,6 +1483,14 @@ export declare interface DataTableVirtualBodyProps extends HTMLAttributes<HTMLTa
      * to avoid forced reflow on mount — a significant perf win for large tables.
      */
     fixedRowHeight?: boolean;
+    /** Called when a row is clicked. Not called if a `getRowProps` onClick prevents default. */
+    onRowClick?: (row: Row<any>, event: MouseEvent_2<HTMLTableRowElement>) => void;
+    /**
+     * Extra props for each `<tr>` (className, aria/data attributes, handlers).
+     * Positioning styles and data attributes owned by the table take precedence.
+     * Memoize it (e.g. `useCallback`): a new function re-renders every row.
+     */
+    getRowProps?: (row: Row<any>) => HTMLAttributes<HTMLTableRowElement>;
 }
 
 /**

package/dist/index.js

@@ -31945,7 +31945,7 @@ const h1 = Gn(function({
     ...e,
     ...a
   }, "data-ov-pinned": t.column.getIsPinned() || void 0, "data-ov-align": r, children: /* @__PURE__ */ h.jsx("span", { className: Me.CellContent, children: na(t.column.columnDef.cell, t.getContext()) }) });
-}, (n, t) => n.contentKey === t.contentKey);
+}, (n, t) => n.contentKey === t.contentKey && n.original === t.original && n.cell.column.columnDef.cell === t.cell.column.columnDef.cell);
 h1.displayName = "DataTable.DataCell";
 const Px = /* @__PURE__ */ new Set(["select"]);
 function Bx({
@@ -31954,13 +31954,25 @@ function Bx({
   stateRevision: a,
   dataIndex: e,
   rowHeight: o,
-  measureRef: r
+  measureRef: r,
+  getRowProps: i,
+  onRowClick: s
 }) {
   "use no memo";
-  const i = n.getIsSelected(), s = n.getIsExpanded(), l = Y(null), c = (u) => {
-    l.current = u, r?.(u);
+  const l = n.getIsSelected(), c = n.getIsExpanded(), u = Y(null), d = (y) => {
+    u.current = y, r?.(y);
   };
-  return l.current && (l.current.dataset.ovSelected = i ? "true" : "false", l.current.dataset.ovExpanded = s ? "true" : "false"), /* @__PURE__ */ h.jsx("tr", { "data-index": e, ref: c, className: Me.Row, "data-ov-selected": i ? "true" : "false", "data-ov-expanded": s ? "true" : "false", style: {
+  u.current && (u.current.dataset.ovSelected = l ? "true" : "false", u.current.dataset.ovExpanded = c ? "true" : "false");
+  const {
+    className: p,
+    style: g,
+    onClick: f,
+    ...m
+  } = i?.(n) ?? {}, b = f || s ? (y) => {
+    f?.(y), y.defaultPrevented || s?.(n, y);
+  } : void 0;
+  return /* @__PURE__ */ h.jsx("tr", { ...m, "data-index": e, ref: d, className: j(Me.Row, p), "data-ov-selected": l ? "true" : "false", "data-ov-expanded": c ? "true" : "false", onClick: b, style: {
+    ...g,
     display: "flex",
     position: "absolute",
     transform: `translateY(${t}px)`,
@@ -31969,47 +31981,55 @@ function Bx({
       height: o,
       overflow: "hidden"
     }
-  }, children: n.getVisibleCells().map((u) => {
-    const d = Px.has(u.column.id) ? `${u.id}-${a}` : u.id;
-    return /* @__PURE__ */ h.jsx(h1, { cell: u, contentKey: d }, u.id);
+  }, children: n.getVisibleCells().map((y) => {
+    const v = Px.has(y.column.id) ? `${y.id}-${a}` : y.id;
+    return /* @__PURE__ */ h.jsx(h1, { cell: y, contentKey: v, original: n.original }, y.id);
   }) });
 }
-const y1 = Gn(Bx, (n, t) => n.row === t.row && n.virtualStart === t.virtualStart && n.stateRevision === t.stateRevision && n.dataIndex === t.dataIndex && n.rowHeight === t.rowHeight);
+const y1 = Gn(Bx, (n, t) => n.row === t.row && n.virtualStart === t.virtualStart && n.stateRevision === t.stateRevision && n.dataIndex === t.dataIndex && n.rowHeight === t.rowHeight && n.columns === t.columns && n.getRowProps === t.getRowProps && n.onRowClick === t.onRowClick);
 y1.displayName = "DataTable.VirtualRow";
 const v1 = k(function({
   className: t,
   estimateRowSize: a = ZC,
   overscan: e = QC,
   fixedRowHeight: o = !1,
-  ...r
-}, i) {
+  onRowClick: r,
+  getRowProps: i,
+  ...s
+}, l) {
   "use no memo";
   const {
-    table: s
-  } = wn(), l = nT(), {
-    rows: c
-  } = s.getRowModel(), u = Wm({
-    count: c.length,
+    table: c
+  } = wn(), u = nT(), {
+    rows: d
+  } = c.getRowModel(), p = Y(r);
+  p.current = r;
+  const g = r != null, f = ee(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (v, S) => p.current?.(v, S),
+    []
+  ), m = Wm({
+    count: d.length,
     estimateSize: () => a,
-    getScrollElement: () => l,
-    measureElement: o ? void 0 : typeof window < "u" && navigator.userAgent.indexOf("Firefox") === -1 ? (g) => g.getBoundingClientRect().height : void 0,
+    getScrollElement: () => u,
+    measureElement: o ? void 0 : typeof window < "u" && navigator.userAgent.indexOf("Firefox") === -1 ? (v) => v.getBoundingClientRect().height : void 0,
     overscan: e
   });
   pe(() => {
-    u.measure();
-  }, [c.length]);
-  const d = s.getState().rowSelection, p = s.getState().expanded;
-  return c.length === 0 ? null : /* @__PURE__ */ h.jsx("tbody", { ref: i, className: j(Me.Body, t), style: {
+    m.measure();
+  }, [d.length]);
+  const b = c.getState().rowSelection, y = c.getState().expanded;
+  return d.length === 0 ? null : /* @__PURE__ */ h.jsx("tbody", { ref: l, className: j(Me.Body, t), style: {
     display: "grid",
-    height: `${u.getTotalSize()}px`,
+    height: `${m.getTotalSize()}px`,
     position: "relative"
-  }, ...r, children: u.getVirtualItems().map((g) => {
-    const f = c[g.index];
-    if (!f) return null;
-    const m = (d[f.id] ? 1 : 0) | (typeof p == "boolean" ? p ? 2 : 0 : p?.[f.id] ? 2 : 0);
-    return /* @__PURE__ */ h.jsx(y1, { row: f, virtualStart: g.start, stateRevision: m, dataIndex: g.index, rowHeight: o ? a : void 0, measureRef: o ? void 0 : (b) => {
-      b && u.measureElement(b);
-    } }, f.id);
+  }, ...s, children: m.getVirtualItems().map((v) => {
+    const S = d[v.index];
+    if (!S) return null;
+    const E = (b[S.id] ? 1 : 0) | (typeof y == "boolean" ? y ? 2 : 0 : y?.[S.id] ? 2 : 0);
+    return /* @__PURE__ */ h.jsx(y1, { row: S, virtualStart: v.start, stateRevision: E, dataIndex: v.index, rowHeight: o ? a : void 0, columns: c.options.columns, getRowProps: i, onRowClick: g ? f : void 0, measureRef: o ? void 0 : (_) => {
+      _ && m.measureElement(_);
+    } }, S.id);
   }) });
 });
 v1.displayName = "DataTable.VirtualBody";