@snack-uikit/table 0.25.13-preview-03091779.0 → 0.25.13

package/dist/esm/components/types.d.ts

@@ -1,6 +1,5 @@
 import { PaginationState, Row, RowPinningState, RowSelectionOptions, RowSelectionState, SortingState } from '@tanstack/react-table';
-import { useVirtualizer, Virtualizer } from '@tanstack/react-virtual';
-import { MutableRefObject, ReactNode, RefObject } from 'react';
+import { ReactNode, RefObject } from 'react';
 import { ToolbarProps } from '@snack-uikit/toolbar';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { EmptyStateProps, ExportButtonProps, RowClickHandler } from '../helperComponents';
@@ -130,9 +129,6 @@ export type TableProps<TData extends object> = WithSupportProps<{
         id: string;
         resize?: boolean;
     };
-    enableRowVirtualization?: boolean;
-    rowVirtualizerOptions?: Parameters<typeof useVirtualizer>[0];
-    rowVirtualizerInstanceRef?: MutableRefObject<Virtualizer<Element, Element> | null>;
 }>;
 export type ServerTableProps<TData extends object> = Omit<TableProps<TData>, 'pageSize' | 'pageCount' | 'pagination' | 'search' | 'data'> & {
     /** Данные для отрисовки */

package/dist/esm/helperComponents/Rows/BodyRow.d.ts

@@ -1,5 +1,5 @@
 import { Row as TableRow } from '@tanstack/react-table';
-import { CSSProperties, MouseEvent } from 'react';
+import { MouseEvent } from 'react';
 export type RowInfo<TData> = {
     id: string;
     data: TData;
@@ -10,7 +10,6 @@ export type RowClickHandler<TData> = (e: MouseEvent<HTMLDivElement>, row: RowInf
 type BodyRowProps<TData> = {
     row: TableRow<TData>;
     onRowClick?: RowClickHandler<TData>;
-    style?: CSSProperties;
 };
-export declare const BodyRow: import("react").ForwardRefExoticComponent<BodyRowProps<any> & import("react").RefAttributes<HTMLDivElement>>;
+export declare function BodyRow<TData>({ row, onRowClick }: BodyRowProps<TData>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/helperComponents/Rows/BodyRow.js

@@ -1,16 +1,5 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useState } from 'react';
+import { useState } from 'react';
 import { COLUMN_PIN_POSITION, TEST_IDS } from '../../constants';
 import { BodyCell } from '../Cells';
 import { RowContext } from '../contexts';
@@ -18,9 +7,7 @@ import { useRowCells } from '../hooks';
 import { PinnedCells } from './PinnedCells';
 import { Row } from './Row';
 import styles from './styles.module.css';
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const BodyRow = forwardRef((_a, ref) => {
-    var { row, onRowClick } = _a, attributes = __rest(_a, ["row", "onRowClick"]);
+export function BodyRow({ row, onRowClick }) {
     const { pinnedLeft, pinnedRight, unpinned } = useRowCells(row);
     const [dropListOpened, setDropListOpen] = useState(false);
     const disabled = !row.getCanSelect();
@@ -34,5 +21,5 @@ export const BodyRow = forwardRef((_a, ref) => {
             toggleSelected: row.toggleSelected,
         });
     };
-    return (_jsx(RowContext.Provider, { value: { dropListOpened, setDropListOpen }, children: _jsxs(Row, Object.assign({}, attributes, { ref: ref, onClick: handleRowClick, "data-clickable": Boolean(onRowClick) || undefined, "data-disabled": disabled || undefined, "data-selected": row.getIsSelected() || undefined, "data-actions-opened": dropListOpened || undefined, "data-test-id": TEST_IDS.bodyRow, "data-row-id": row.id, className: styles.bodyRow, children: [pinnedLeft && (_jsx(PinnedCells, { position: COLUMN_PIN_POSITION.Left, children: pinnedLeft.map(cell => (_jsx(BodyCell, { cell: cell }, cell.id))) })), unpinned.map(cell => (_jsx(BodyCell, { cell: cell }, cell.id))), pinnedRight && (_jsx(PinnedCells, { position: COLUMN_PIN_POSITION.Right, children: pinnedRight.map(cell => (_jsx(BodyCell, { cell: cell }, cell.id))) }))] })) }));
-});
+    return (_jsx(RowContext.Provider, { value: { dropListOpened, setDropListOpen }, children: _jsxs(Row, { onClick: handleRowClick, "data-clickable": Boolean(onRowClick) || undefined, "data-disabled": disabled || undefined, "data-selected": row.getIsSelected() || undefined, "data-actions-opened": dropListOpened || undefined, "data-test-id": TEST_IDS.bodyRow, "data-row-id": row.id, className: styles.bodyRow, children: [pinnedLeft && (_jsx(PinnedCells, { position: COLUMN_PIN_POSITION.Left, children: pinnedLeft.map(cell => (_jsx(BodyCell, { cell: cell }, cell.id))) })), unpinned.map(cell => (_jsx(BodyCell, { cell: cell }, cell.id))), pinnedRight && (_jsx(PinnedCells, { position: COLUMN_PIN_POSITION.Right, children: pinnedRight.map(cell => (_jsx(BodyCell, { cell: cell }, cell.id))) }))] }) }));
+}

package/dist/esm/helperComponents/Rows/Row.d.ts

@@ -1,8 +1,9 @@
-import { CSSProperties, MouseEvent, ReactNode } from 'react';
+import { MouseEvent, ReactNode } from 'react';
 import { DataAttributes } from '../types';
-export declare const Row: import("react").ForwardRefExoticComponent<{
+type RowProps = {
     children: ReactNode;
     onClick?(e: MouseEvent<HTMLDivElement>): void;
     className?: string;
-    style?: CSSProperties;
-} & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;
+} & DataAttributes;
+export declare function Row({ onClick, children, className, ...attributes }: RowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/helperComponents/Rows/Row.js

@@ -11,11 +11,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import cn from 'classnames';
-import { forwardRef } from 'react';
 import styles from './styles.module.css';
-export const Row = forwardRef((_a, ref) => {
+export function Row(_a) {
     var { onClick, children, className } = _a, attributes = __rest(_a, ["onClick", "children", "className"]);
     return (
     // eslint-disable-next-line jsx-a11y/interactive-supports-focus
-    _jsx("div", Object.assign({ ref: ref, onClick: onClick, className: cn(styles.tableRow, className), role: 'row' }, attributes, { children: children })));
-});
+    _jsx("div", Object.assign({ onClick: onClick, className: cn(styles.tableRow, className), role: 'row' }, attributes, { children: children })));
+}

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Table",
-  "version": "0.25.13-preview-03091779.0",
+  "version": "0.25.13",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -37,31 +37,29 @@
   "scripts": {},
   "dependencies": {
     "@snack-uikit/button": "0.19.3",
-    "@snack-uikit/chips": "0.22.1",
+    "@snack-uikit/chips": "0.22.2",
     "@snack-uikit/icon-predefined": "0.7.1",
     "@snack-uikit/icons": "0.24.0",
     "@snack-uikit/info-block": "0.6.4",
-    "@snack-uikit/list": "0.21.8",
+    "@snack-uikit/list": "0.21.9",
     "@snack-uikit/pagination": "0.9.3",
     "@snack-uikit/scroll": "0.9.1",
     "@snack-uikit/skeleton": "0.6.0",
     "@snack-uikit/toggles": "0.13.1",
-    "@snack-uikit/toolbar": "0.9.10",
+    "@snack-uikit/toolbar": "0.9.11",
     "@snack-uikit/truncate-string": "0.6.1",
     "@snack-uikit/typography": "0.8.2",
     "@snack-uikit/utils": "3.5.0",
     "@tanstack/match-sorter-utils": "8.11.8",
     "@tanstack/react-table": "8.12.0",
-    "@tanstack/react-virtual": "3.10.9",
     "classnames": "2.5.1",
     "copy-to-clipboard": "3.3.3",
     "lodash.debounce": "4.0.8",
-    "merge-refs": "1.3.0",
     "uncontrollable": "8.0.4",
     "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
   },
   "peerDependencies": {
     "@snack-uikit/locale": "*"
   },
-  "gitHead": "cc2cae7b5e9b5d2e270688ae616269cd5b718123"
+  "gitHead": "597e832c119abc6347b5e4212268eca03d067d18"
 }

package/src/components/Table/Table.tsx

@@ -1,4 +1,5 @@
 import {
+  CellContext,
   ColumnPinningState,
   getCoreRowModel,
   getFilteredRowModel,
@@ -10,13 +11,13 @@ import {
   useReactTable,
 } from '@tanstack/react-table';
 import cn from 'classnames';
-import mergeRefs from 'merge-refs';
 import { RefObject, useCallback, useEffect, useMemo, useRef } from 'react';
 
 import { useLocale } from '@snack-uikit/locale';
 import { Scroll } from '@snack-uikit/scroll';
 import { SkeletonContextProvider } from '@snack-uikit/skeleton';
 import { Toolbar } from '@snack-uikit/toolbar';
+import { TruncateString } from '@snack-uikit/truncate-string';
 import { extractSupportProps } from '@snack-uikit/utils';
 
 import { DEFAULT_PAGE_SIZE } from '../../constants';
@@ -34,21 +35,17 @@ import {
   TablePagination,
   useEmptyState,
 } from '../../helperComponents';
-import { VirtualRow } from '../../helperComponents/Rows/VirtualRow';
 import { ColumnDefinition } from '../../types';
 import { fuzzyFilter } from '../../utils';
 import { TableProps } from '../types';
 import { useLoadingTable, useStateControl } from './hooks';
 import { usePageReset } from './hooks/usePageReset';
-import { useRowVirtualizer } from './hooks/useRowVirtualizer';
 import styles from './styles.module.scss';
 import {
   getColumnStyleVars,
   getCurrentlyConfiguredHeaderWidth,
   getInitColumnSizeFromLocalStorage,
-  isVirtualRow,
   saveStateToLocalStorage,
-  truncateCell,
 } from './utils';
 
 /** Компонент таблицы */
@@ -95,10 +92,6 @@ export function Table<TData extends object>({
   enableFuzzySearch,
   savedState,
 
-  enableRowVirtualization,
-  rowVirtualizerOptions,
-  rowVirtualizerInstanceRef,
-
   ...rest
 }: TableProps<TData>) {
   const { state: globalFilter, onStateChange: onGlobalFilterChange } = useStateControl<string>(search, '');
@@ -121,7 +114,6 @@ export function Table<TData extends object>({
     defaultPaginationState,
   );
   const enableSelection = Boolean(rowSelectionProp?.enable);
-  const tableContainerRef = useRef<HTMLElement>(null);
 
   const tableColumns: ColumnDefinition<TData>[] = useMemo(() => {
     let cols: ColumnDefinition<TData>[] = columnDefinitions;
@@ -145,7 +137,6 @@ export function Table<TData extends object>({
   const table = useReactTable<TData>({
     data,
     columns: tableColumns,
-
     state: {
       columnPinning,
       globalFilter,
@@ -159,7 +150,7 @@ export function Table<TData extends object>({
       enableSorting: false,
       enableResizing: false,
       minSize: 40,
-      cell: truncateCell,
+      cell: (cell: CellContext<TData, unknown>) => <TruncateString text={String(cell.getValue())} maxLines={1} />,
     },
 
     manualSorting,
@@ -186,12 +177,6 @@ export function Table<TData extends object>({
     getCoreRowModel: getCoreRowModel(),
     columnResizeMode: 'onEnd',
     keepPinnedRows,
-
-    meta: {
-      tableContainerRef,
-      rowVirtualizerInstanceRef,
-      rowVirtualizerOptions,
-    },
   });
 
   const { loadingTable } = useLoadingTable({
@@ -239,11 +224,9 @@ export function Table<TData extends object>({
   const columnSizeVarsRef = useRef<Record<string, string>>();
   const headers = table.getFlatHeaders();
 
-  const rowVirtualizer = useRowVirtualizer(table, Boolean(enableRowVirtualization));
-
-  const cssSizeVars = useMemo(() => {
+  const columnSizeVars = useMemo(() => {
     const originalColumnDefs = table._getColumnDefs();
-    const colSizes: Record<string, string> = rowVirtualizer ? { height: `${rowVirtualizer.getTotalSize()}px` } : {};
+    const colSizes: Record<string, string> = {};
 
     for (let i = 0; i < headers.length; i++) {
       const header = headers[i];
@@ -308,8 +291,8 @@ export function Table<TData extends object>({
   }, [table.getState().columnSizingInfo.isResizingColumn, headers, table.getTotalSize()]);
 
   useEffect(() => {
-    columnSizeVarsRef.current = cssSizeVars;
-  }, [cssSizeVars]);
+    columnSizeVarsRef.current = columnSizeVars;
+  }, [columnSizeVars]);
 
   const tableRows = table.getRowModel().rows;
   const tableCenterRows = table.getCenterRows();
@@ -333,8 +316,6 @@ export function Table<TData extends object>({
     return !tableRows.length ? Math.min(Math.max(tempPageSize, 5), DEFAULT_PAGE_SIZE) : tempPageSize;
   }, [filteredTopRows.length, pageSize, suppressPagination, tablePagination?.pageSize, tableRows.length]);
 
-  const tableCtx = useMemo(() => ({ table }), [table]);
-
   usePageReset({
     manualPagination,
     maximumAvailablePage: pageCount || data.length / pagination.pageSize,
@@ -394,9 +375,9 @@ export function Table<TData extends object>({
         )}
 
         <div className={styles.scrollWrapper} data-outline={outline || undefined}>
-          <Scroll size='s' className={styles.table} ref={mergeRefs(tableContainerRef, scrollContainerRef)}>
-            <div className={styles.tableContent} style={cssSizeVars}>
-              <TableContext.Provider value={tableCtx}>
+          <Scroll size='s' className={styles.table} ref={scrollContainerRef}>
+            <div className={styles.tableContent} style={columnSizeVars}>
+              <TableContext.Provider value={{ table }}>
                 {loading ? (
                   <SkeletonContextProvider loading>
                     <HeaderRow />
@@ -415,20 +396,9 @@ export function Table<TData extends object>({
                       </div>
                     ) : null}
 
-                    {(rowVirtualizer?.getVirtualItems() ?? centerRows).map((rowOrVirtualRow, index) => {
-                      const row = isVirtualRow(rowOrVirtualRow) ? centerRows[rowOrVirtualRow.index] : centerRows[index];
-
-                      return (
-                        <VirtualRow
-                          key={row.id}
-                          ref={rowVirtualizer?.measureElement}
-                          data-index={row.index}
-                          virtualRow={isVirtualRow(rowOrVirtualRow) ? rowOrVirtualRow : undefined}
-                        >
-                          <BodyRow row={row} onRowClick={onRowClick} />
-                        </VirtualRow>
-                      );
-                    })}
+                    {centerRows.map(row => (
+                      <BodyRow key={row.id} row={row} onRowClick={onRowClick} />
+                    ))}
 
                     <TableEmptyState
                       emptyStates={emptyStates}
@@ -459,5 +429,5 @@ export function Table<TData extends object>({
 }
 
 Table.getStatusColumnDef = getStatusColumnDef;
-Table.getRowActionsColumnDef = getRowActionsColumnDef;
 Table.statusAppearances = STATUS_APPEARANCE;
+Table.getRowActionsColumnDef = getRowActionsColumnDef;

package/src/components/Table/styles.module.scss

@@ -2,15 +2,11 @@
 
 .table {
   @include styles-tokens-table.composite-var(styles-tokens-table.$table-table-container);
-  
-  will-change: transform;
 
   position: relative;
   /* stylelint-disable-next-line declaration-property-value-allowed-list */
   z-index: 0;
 
-  contain: paint;
-
   /* stylelint-disable-next-line declaration-no-important */
   overflow: hidden !important;
   display: flex;
@@ -43,7 +39,6 @@
 }
 
 .tableContent {
-  content-visibility: auto;
   min-width: max-content;
 }
 

package/src/components/Table/{utils.tsx → utils.ts}

@@ -1,7 +1,3 @@
-import { CellContext } from '@tanstack/react-table';
-import { VirtualItem } from '@tanstack/react-virtual';
-
-import { TruncateString } from '@snack-uikit/truncate-string';
 import { isBrowser } from '@snack-uikit/utils';
 
 export function getCurrentlyConfiguredHeaderWidth(id: string): number {
@@ -62,17 +58,3 @@ export function saveStateToLocalStorage({ id, columnId, size }: SaveStateToLocal
 
   localStorage.setItem(id, JSON.stringify({ ...(savedStateFromStorage || {}), resizeState: newResizeState }));
 }
-
-/**
- * check the key, because index is contained in a common table row
- */
-export function isVirtualRow(row: unknown): row is VirtualItem {
-  return typeof row === 'object' && row != null && 'key' in row;
-}
-
-/**
- * @description prevent permanent recreation of the function on rerender
- */
-export function truncateCell<TData>(cell: CellContext<TData, unknown>) {
-  return <TruncateString text={String(cell.getValue())} maxLines={1} />;
-}

package/src/components/types.ts

@@ -6,8 +6,7 @@ import {
   RowSelectionState,
   SortingState,
 } from '@tanstack/react-table';
-import { useVirtualizer, Virtualizer } from '@tanstack/react-virtual';
-import { MutableRefObject, ReactNode, RefObject } from 'react';
+import { ReactNode, RefObject } from 'react';
 
 import { ToolbarProps } from '@snack-uikit/toolbar';
 import { WithSupportProps } from '@snack-uikit/utils';
@@ -162,13 +161,6 @@ export type TableProps<TData extends object> = WithSupportProps<{
     id: string;
     resize?: boolean;
   };
-
-  // Включение виртуализации для строк
-  enableRowVirtualization?: boolean;
-  // Кастомные параметры для виртуализации строк
-  rowVirtualizerOptions?: Parameters<typeof useVirtualizer>[0];
-  // Ссылка на экземпляр виртуализатора строк.
-  rowVirtualizerInstanceRef?: MutableRefObject<Virtualizer<Element, Element> | null>;
 }>;
 
 export type ServerTableProps<TData extends object> = Omit<

package/src/helperComponents/Rows/BodyRow.tsx

@@ -1,5 +1,5 @@
 import { Row as TableRow } from '@tanstack/react-table';
-import { CSSProperties, forwardRef, MouseEvent, Ref, useState } from 'react';
+import { MouseEvent, useState } from 'react';
 
 import { COLUMN_PIN_POSITION, TEST_IDS } from '../../constants';
 import { BodyCell } from '../Cells';
@@ -21,64 +21,58 @@ export type RowClickHandler<TData> = (e: MouseEvent<HTMLDivElement>, row: RowInf
 type BodyRowProps<TData> = {
   row: TableRow<TData>;
   onRowClick?: RowClickHandler<TData>;
-  style?: CSSProperties;
 };
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const BodyRow = forwardRef<HTMLDivElement, BodyRowProps<any>>(
-  <TData,>({ row, onRowClick, ...attributes }: BodyRowProps<TData>, ref: Ref<HTMLDivElement>) => {
-    const { pinnedLeft, pinnedRight, unpinned } = useRowCells(row);
+export function BodyRow<TData>({ row, onRowClick }: BodyRowProps<TData>) {
+  const { pinnedLeft, pinnedRight, unpinned } = useRowCells(row);
 
-    const [dropListOpened, setDropListOpen] = useState(false);
+  const [dropListOpened, setDropListOpen] = useState(false);
 
-    const disabled = !row.getCanSelect();
+  const disabled = !row.getCanSelect();
 
-    const handleRowClick = (e: MouseEvent<HTMLDivElement>) => {
-      if (disabled) return;
+  const handleRowClick = (e: MouseEvent<HTMLDivElement>) => {
+    if (disabled) return;
 
-      onRowClick?.(e, {
-        id: row.id,
-        data: row.original,
-        selected: row.getIsSelected(),
-        toggleSelected: row.toggleSelected,
-      });
-    };
+    onRowClick?.(e, {
+      id: row.id,
+      data: row.original,
+      selected: row.getIsSelected(),
+      toggleSelected: row.toggleSelected,
+    });
+  };
 
-    return (
-      <RowContext.Provider value={{ dropListOpened, setDropListOpen }}>
-        <Row
-          {...attributes}
-          ref={ref}
-          onClick={handleRowClick}
-          data-clickable={Boolean(onRowClick) || undefined}
-          data-disabled={disabled || undefined}
-          data-selected={row.getIsSelected() || undefined}
-          data-actions-opened={dropListOpened || undefined}
-          data-test-id={TEST_IDS.bodyRow}
-          data-row-id={row.id}
-          className={styles.bodyRow}
-        >
-          {pinnedLeft && (
-            <PinnedCells position={COLUMN_PIN_POSITION.Left}>
-              {pinnedLeft.map(cell => (
-                <BodyCell key={cell.id} cell={cell} />
-              ))}
-            </PinnedCells>
-          )}
+  return (
+    <RowContext.Provider value={{ dropListOpened, setDropListOpen }}>
+      <Row
+        onClick={handleRowClick}
+        data-clickable={Boolean(onRowClick) || undefined}
+        data-disabled={disabled || undefined}
+        data-selected={row.getIsSelected() || undefined}
+        data-actions-opened={dropListOpened || undefined}
+        data-test-id={TEST_IDS.bodyRow}
+        data-row-id={row.id}
+        className={styles.bodyRow}
+      >
+        {pinnedLeft && (
+          <PinnedCells position={COLUMN_PIN_POSITION.Left}>
+            {pinnedLeft.map(cell => (
+              <BodyCell key={cell.id} cell={cell} />
+            ))}
+          </PinnedCells>
+        )}
 
-          {unpinned.map(cell => (
-            <BodyCell key={cell.id} cell={cell} />
-          ))}
+        {unpinned.map(cell => (
+          <BodyCell key={cell.id} cell={cell} />
+        ))}
 
-          {pinnedRight && (
-            <PinnedCells position={COLUMN_PIN_POSITION.Right}>
-              {pinnedRight.map(cell => (
-                <BodyCell key={cell.id} cell={cell} />
-              ))}
-            </PinnedCells>
-          )}
-        </Row>
-      </RowContext.Provider>
-    );
-  },
-);
+        {pinnedRight && (
+          <PinnedCells position={COLUMN_PIN_POSITION.Right}>
+            {pinnedRight.map(cell => (
+              <BodyCell key={cell.id} cell={cell} />
+            ))}
+          </PinnedCells>
+        )}
+      </Row>
+    </RowContext.Provider>
+  );
+}

package/src/helperComponents/Rows/Row.tsx

@@ -1,5 +1,5 @@
 import cn from 'classnames';
-import { CSSProperties, forwardRef, MouseEvent, ReactNode } from 'react';
+import { MouseEvent, ReactNode } from 'react';
 
 import { DataAttributes } from '../types';
 import styles from './styles.module.scss';
@@ -8,12 +8,13 @@ type RowProps = {
   children: ReactNode;
   onClick?(e: MouseEvent<HTMLDivElement>): void;
   className?: string;
-  style?: CSSProperties;
 } & DataAttributes;
 
-export const Row = forwardRef<HTMLDivElement, RowProps>(({ onClick, children, className, ...attributes }, ref) => (
-  // eslint-disable-next-line jsx-a11y/interactive-supports-focus
-  <div ref={ref} onClick={onClick} className={cn(styles.tableRow, className)} role='row' {...attributes}>
-    {children}
-  </div>
-));
+export function Row({ onClick, children, className, ...attributes }: RowProps) {
+  return (
+    // eslint-disable-next-line jsx-a11y/interactive-supports-focus
+    <div onClick={onClick} className={cn(styles.tableRow, className)} role='row' {...attributes}>
+      {children}
+    </div>
+  );
+}

package/dist/cjs/components/Table/hooks/useRowVirtualizer.d.ts

@@ -1,2 +0,0 @@
-import { Table } from '@tanstack/react-table';
-export declare function useRowVirtualizer(table: Table<any>, enabled: boolean): import("@tanstack/virtual-core").Virtualizer<Element, Element> | undefined;

package/dist/cjs/components/Table/hooks/useRowVirtualizer.js

@@ -1,45 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useRowVirtualizer = useRowVirtualizer;
-const react_virtual_1 = require("@tanstack/react-virtual");
-const react_1 = require("react");
-const utils_1 = require("@snack-uikit/utils");
-/**
- * If virtualization is disabled
- */
-const useNoopVirtualizerFn = () => undefined;
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function useRowVirtualizer(table, enabled) {
-  var _a;
-  const {
-    getRowModel,
-    options
-  } = table;
-  const {
-    rowVirtualizerInstanceRef,
-    rowVirtualizerOptions,
-    tableContainerRef
-  } = (_a = options.meta) !== null && _a !== void 0 ? _a : {};
-  // TODO
-  const [_, forceUpdate] = (0, react_1.useReducer)(x => x + 1, 0);
-  const useVirtualizerFn = enabled ? react_virtual_1.useVirtualizer : useNoopVirtualizerFn;
-  const normalRowHeight = 40;
-  const rowVirtualizer = useVirtualizerFn(Object.assign({
-    count: getRowModel().rows.length,
-    estimateSize: () => normalRowHeight,
-    getScrollElement: () => tableContainerRef.current,
-    measureElement: typeof window !== 'undefined' && navigator.userAgent.indexOf('Firefox') === -1 ? element => element === null || element === void 0 ? void 0 : element.getBoundingClientRect().height : undefined,
-    overscan: 28
-  }, rowVirtualizerOptions));
-  // TODO
-  (0, utils_1.useLayoutEffect)(() => {
-    if (enabled) forceUpdate();
-  }, [enabled]);
-  if ((rowVirtualizerInstanceRef === null || rowVirtualizerInstanceRef === void 0 ? void 0 : rowVirtualizerInstanceRef.current) && rowVirtualizer) {
-    rowVirtualizerInstanceRef.current = rowVirtualizer;
-  }
-  return rowVirtualizer;
-}

package/dist/cjs/helperComponents/Rows/VirtualRow.d.ts

@@ -1,7 +0,0 @@
-import { VirtualItem } from '@tanstack/react-virtual';
-import { HTMLAttributes } from 'react';
-export declare const VirtualRow: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
-    virtualRow?: VirtualItem;
-} & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/helperComponents/Rows/VirtualRow.js

@@ -1,40 +0,0 @@
-"use strict";
-
-var __rest = void 0 && (void 0).__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VirtualRow = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-exports.VirtualRow = (0, react_1.forwardRef)((_a, ref) => {
-  var {
-      virtualRow,
-      children
-    } = _a,
-    attributes = __rest(_a, ["virtualRow", "children"]);
-  if (!virtualRow) {
-    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-      children: children
-    });
-  }
-  return (0, jsx_runtime_1.jsx)("div", Object.assign({
-    ref: ref,
-    style: virtualRow ? {
-      position: 'absolute',
-      top: 0,
-      left: 0,
-      width: '100%',
-      transform: `translateY(${virtualRow.start}px)`
-    } : undefined
-  }, attributes, {
-    children: children
-  }));
-});

package/dist/esm/components/Table/hooks/useRowVirtualizer.d.ts

@@ -1,2 +0,0 @@
-import { Table } from '@tanstack/react-table';
-export declare function useRowVirtualizer(table: Table<any>, enabled: boolean): import("@tanstack/virtual-core").Virtualizer<Element, Element> | undefined;