@dmsi/wedgekit-react 0.0.551 → 0.0.552

package/src/components/DataGrid/TableBody/index.tsx

@@ -1,185 +0,0 @@
-import { HeaderGroup, Row, RowData, Table } from "@tanstack/react-table";
-import { useVirtualizer, Virtualizer } from "@tanstack/react-virtual";
-import { DataGridPagination } from "../types";
-import { DataGridCell, DragAlongCell, Search } from "../..";
-import clsx from "clsx";
-import { TableBodyRow } from "./TableBodyRow";
-import { LoadingCell } from "./LoadingCell";
-
-interface TableBodyProps<TData extends RowData> {
-  id?: string;
-  testid?: string;
-  columnVirtualizer?: Virtualizer<HTMLDivElement, HTMLTableCellElement>;
-  table: Table<TData>;
-  tableContainerRef: React.RefObject<HTMLDivElement | null>;
-  virtualPaddingLeft?: number | undefined;
-  virtualPaddingRight?: number | undefined;
-  pagination: DataGridPagination | undefined;
-  isLoadingMore: boolean;
-  hasMore: boolean;
-  showFilterRow: boolean;
-  enableColumnSelector?: boolean;
-  locked?: boolean;
-  pinDirection?: "left" | "right";
-  rowDisabled?: boolean;
-  rowDisabledAccessor?: (row: TData) => boolean;
-}
-export function TableBody<T>({
-  id,
-  testid,
-  columnVirtualizer,
-  table,
-  tableContainerRef,
-  virtualPaddingLeft,
-  virtualPaddingRight,
-  pagination,
-  isLoadingMore,
-  hasMore,
-  showFilterRow,
-  enableColumnSelector = false,
-  locked,
-  pinDirection,
-  rowDisabled,
-  rowDisabledAccessor,
-}: TableBodyProps<T>) {
-  const { rows } = table.getRowModel();
-
-  const rowVirtualizer = useVirtualizer<HTMLDivElement, HTMLTableRowElement>({
-    count: rows.length,
-    estimateSize: () => 40,
-    getScrollElement: () => tableContainerRef.current,
-    overscan: 8,
-  });
-
-  const virtualRows = rowVirtualizer.getVirtualItems();
-  const CellElement = locked ? DataGridCell : DragAlongCell;
-
-  let headerGroups: HeaderGroup<T>[];
-  if (pinDirection === "left") {
-    headerGroups = table.getLeftHeaderGroups();
-  } else if (pinDirection === "right") {
-    headerGroups = table.getRightHeaderGroups();
-  } else {
-    headerGroups = table.getCenterHeaderGroups();
-  }
-
-  return (
-    <tbody
-      className={clsx(locked ? "shadow-16" : "")}
-      style={{
-        display: "grid",
-        height: `${
-          showFilterRow
-            ? rowVirtualizer.getTotalSize() + 40
-            : rowVirtualizer.getTotalSize()
-        }px`, // tells scrollbar how big the table is
-        position: "relative", // needed for absolute positioning of rows
-      }}
-    >
-      {showFilterRow && (
-        <tr
-          style={{
-            display: "flex",
-            position: "sticky",
-            top: "40px",
-            width: "100%",
-            height: "40px",
-            zIndex: 10,
-          }}
-          className="even:bg-background-grouped-primary-normal odd:bg-background-grouped-secondary-normal"
-          data-testid={testid ? `${testid}-filter-row` : undefined}
-        >
-          {headerGroups.flatMap((x) =>
-            x.headers.map((header) => (
-              <CellElement
-                id={id ? `${id}-filter-cell-${header.id}` : undefined}
-                testid={
-                  testid ? `${testid}-filter-cell-${header.id}` : undefined
-                }
-                noPadding
-                key={header.id}
-                cell={header}
-                width={
-                  header.column.columnDef.meta?.headerWidth ||
-                  (locked ? `${header.column.getSize()}px` : "")
-                }
-              >
-                {header.column.getCanFilter() &&
-                  (header.column.columnDef.meta?.filterRowCell?.({
-                    header,
-                    table,
-                  }) ?? (
-                    <Search
-                      id={id ? `${id}-filter-search-${header.id}` : undefined}
-                      testid={
-                        testid
-                          ? `${testid}-filter-search-${header.id}`
-                          : undefined
-                      }
-                      removeRoundness
-                      onChange={(e) =>
-                        header.column.setFilterValue(e.target.value)
-                      }
-                      value={(header.column.getFilterValue() ?? "") as string}
-                      placeholder=""
-                      removeSearchIcon
-                    />
-                  ))}
-              </CellElement>
-            )),
-          )}
-        </tr>
-      )}
-
-      {virtualRows.map((virtualRow) => {
-        const row = rows[virtualRow.index] as Row<T>;
-
-        return (
-          <TableBodyRow
-            id={id}
-            testid={testid}
-            columnVirtualizer={columnVirtualizer}
-            key={row.id}
-            row={row}
-            rowVirtualizer={rowVirtualizer}
-            virtualPaddingLeft={virtualPaddingLeft}
-            virtualPaddingRight={virtualPaddingRight}
-            virtualRow={virtualRow}
-            showFilterRow={showFilterRow}
-            enableColumnSelector={enableColumnSelector}
-            locked={locked}
-            pinDirection={pinDirection}
-            disabled={
-              rowDisabledAccessor
-                ? rowDisabledAccessor(row.original as T)
-                : rowDisabled
-            }
-          />
-        );
-      })}
-
-      {!pagination && isLoadingMore && hasMore && (
-        <tr
-          style={{
-            display: "flex",
-            position: "absolute",
-            width: "100%",
-            transform: `translateY(${
-              virtualRows[virtualRows.length - 1].start + 40
-            }px)`,
-          }}
-          className="odd:bg-background-grouped-primary-normal even:bg-background-grouped-secondary-normal"
-        >
-          {table.getAllLeafColumns().map((column) => (
-            <LoadingCell
-              id={id}
-              testid={testid}
-              key={column.id}
-              column={column.columnDef}
-            />
-          ))}
-        </tr>
-      )}
-    </tbody>
-  );
-}