@tanstack/table-core 8.0.0-alpha.53 → 8.0.0-alpha.57

package/src/features/RowSelection.ts

@@ -1,8 +1,7 @@
 import {
   Getter,
   OnChangeFn,
-  AnyGenerics,
-  PartialGenerics,
+  TableGenerics,
   PropGetterValue,
   TableInstance,
   Row,
@@ -17,7 +16,7 @@ export type RowSelectionTableState = {
   rowSelection: RowSelectionState
 }
 
-export type RowSelectionOptions<TGenerics extends AnyGenerics> = {
+export type RowSelectionOptions<TGenerics extends TableGenerics> = {
   onRowSelectionChange?: OnChangeFn<RowSelectionState>
   autoResetRowSelection?: boolean
   enableRowSelection?: boolean | ((row: Row<TGenerics>) => boolean)
@@ -60,7 +59,7 @@ export type RowSelectionRow = {
   ) => undefined | PropGetterValue<ToggleRowSelectedProps, TGetter>
 }
 
-export type RowSelectionInstance<TGenerics extends AnyGenerics> = {
+export type RowSelectionInstance<TGenerics extends TableGenerics> = {
   queueResetRowSelection: () => void
   getToggleRowSelectedProps: <TGetter extends Getter<ToggleRowSelectedProps>>(
     rowId: string,
@@ -106,7 +105,7 @@ export const RowSelection = {
     }
   },
 
-  getDefaultOptions: <TGenerics extends AnyGenerics>(
+  getDefaultOptions: <TGenerics extends TableGenerics>(
     instance: TableInstance<TGenerics>
   ): RowSelectionOptions<TGenerics> => {
     return {
@@ -121,7 +120,7 @@ export const RowSelection = {
     }
   },
 
-  getInstance: <TGenerics extends AnyGenerics>(
+  createInstance: <TGenerics extends TableGenerics>(
     instance: TableInstance<TGenerics>
   ): RowSelectionInstance<TGenerics> => {
     let registered = false
@@ -536,7 +535,7 @@ export const RowSelection = {
     }
   },
 
-  createRow: <TGenerics extends AnyGenerics>(
+  createRow: <TGenerics extends TableGenerics>(
     row: Row<TGenerics>,
     instance: TableInstance<TGenerics>
   ): RowSelectionRow => {
@@ -552,7 +551,7 @@ export const RowSelection = {
   },
 }
 
-const mutateRowIsSelected = <TGenerics extends AnyGenerics>(
+const mutateRowIsSelected = <TGenerics extends TableGenerics>(
   selectedRowIds: Record<string, boolean>,
   id: string,
   value: boolean,
@@ -580,7 +579,7 @@ const mutateRowIsSelected = <TGenerics extends AnyGenerics>(
   }
 }
 
-export function selectRowsFn<TGenerics extends AnyGenerics>(
+export function selectRowsFn<TGenerics extends TableGenerics>(
   instance: TableInstance<TGenerics>,
   rowModel: RowModel<TGenerics>
 ): RowModel<TGenerics> {
@@ -621,7 +620,7 @@ export function selectRowsFn<TGenerics extends AnyGenerics>(
   }
 }
 
-export function isRowSelected<TGenerics extends AnyGenerics>(
+export function isRowSelected<TGenerics extends TableGenerics>(
   row: Row<TGenerics>,
   selection: Record<string, boolean>,
   instance: TableInstance<TGenerics>

package/src/features/Rows.ts

@@ -0,0 +1,151 @@
+import {
+  Cell,
+  TableGenerics,
+  TableInstance,
+  Row,
+  Column,
+  CoreCell,
+  Getter,
+  CellProps,
+  PropGetterValue,
+  RowProps,
+  RowModel,
+  RowValues,
+  PropGetter,
+} from '../types'
+import { flattenBy, memo, propGetter } from '../utils'
+
+export type CoreRow<TGenerics extends TableGenerics> = {
+  id: string
+  index: number
+  original?: TGenerics['Row']
+  depth: number
+  values: RowValues
+  subRows: Row<TGenerics>[]
+  getLeafRows: () => Row<TGenerics>[]
+  getRowProps: PropGetter<RowProps>
+  originalSubRows?: TGenerics['Row'][]
+}
+
+export type RowsOptions<TGenerics extends TableGenerics> = {
+  getCoreRowModel: (
+    instance: TableInstance<TGenerics>
+  ) => () => RowModel<TGenerics>
+  getSubRows?: (
+    originalRow: TGenerics['Row'],
+    index: number
+  ) => TGenerics['Row'][]
+  getRowId?: (
+    originalRow: TGenerics['Row'],
+    index: number,
+    parent?: Row<TGenerics>
+  ) => string
+}
+
+export type RowsInstance<TGenerics extends TableGenerics> = {
+  getRowId: (
+    _: TGenerics['Row'],
+    index: number,
+    parent?: Row<TGenerics>
+  ) => string
+  createRow: (
+    id: string,
+    original: TGenerics['Row'] | undefined,
+    rowIndex: number,
+    depth: number,
+    values: Record<string, any>
+  ) => Row<TGenerics>
+  getCoreRowModel: () => RowModel<TGenerics>
+  _getCoreRowModel?: () => RowModel<TGenerics>
+  getRowModel: () => RowModel<TGenerics>
+  getRow: (id: string) => Row<TGenerics>
+  getRowProps: <TGetter extends Getter<RowProps>>(
+    rowId: string,
+    userProps?: TGetter
+  ) => undefined | PropGetterValue<RowProps, TGetter>
+}
+
+//
+
+export const Rows = {
+  // createRow: <TGenerics extends TableGenerics>(
+  //   row: Row<TGenerics>,
+  //   instance: TableInstance<TGenerics>
+  // ): CellsRow<TGenerics> => {
+  //   return {}
+  // },
+
+  createInstance: <TGenerics extends TableGenerics>(
+    instance: TableInstance<TGenerics>
+  ): RowsInstance<TGenerics> => {
+    return {
+      getRowId: (
+        row: TGenerics['Row'],
+        index: number,
+        parent?: Row<TGenerics>
+      ) =>
+        instance.options.getRowId?.(row, index, parent) ??
+        `${parent ? [parent.id, index].join('.') : index}`,
+      createRow: (id, original, rowIndex, depth, values) => {
+        let row: CoreRow<TGenerics> = {
+          id,
+          index: rowIndex,
+          original,
+          depth,
+          values,
+          subRows: [],
+          getLeafRows: () => flattenBy(row.subRows, d => d.subRows),
+          getRowProps: userProps => instance.getRowProps(row.id, userProps)!,
+        }
+
+        for (let i = 0; i < instance._features.length; i++) {
+          const feature = instance._features[i]
+          Object.assign(row, feature.createRow?.(row, instance))
+        }
+
+        return row as Row<TGenerics>
+      },
+
+      getCoreRowModel: () => {
+        if (!instance._getCoreRowModel) {
+          instance._getCoreRowModel = instance.options.getCoreRowModel(instance)
+        }
+
+        return instance._getCoreRowModel()
+      },
+
+      // The final calls start at the bottom of the model,
+      // expanded rows, which then work their way up
+
+      getRowModel: () => {
+        return instance.getPaginationRowModel()
+      },
+      getRow: (id: string) => {
+        const row = instance.getRowModel().rowsById[id]
+
+        if (!row) {
+          if (process.env.NODE_ENV !== 'production') {
+            throw new Error(`getRow expected an ID, but got ${id}`)
+          }
+          throw new Error()
+        }
+
+        return row
+      },
+      getRowProps: (rowId, userProps) => {
+        const row = instance.getRow(rowId)
+        if (!row) {
+          return
+        }
+
+        return propGetter(
+          {
+            key: row.id,
+            role: 'row',
+          },
+          userProps
+        )
+      },
+    }
+  },
+}

package/src/features/Sorting.ts

@@ -10,8 +10,7 @@ import {
   Getter,
   Header,
   OnChangeFn,
-  AnyGenerics,
-  PartialGenerics,
+  TableGenerics,
   PropGetterValue,
   TableInstance,
   Row,
@@ -36,11 +35,11 @@ export type ColumnSort = {
 
 export type SortingState = ColumnSort[]
 
-export type SortingFn<TGenerics extends AnyGenerics> = {
+export type SortingFn<TGenerics extends TableGenerics> = {
   (rowA: Row<TGenerics>, rowB: Row<TGenerics>, columnId: string): number
 }
 
-export type CustomSortingFns<TGenerics extends AnyGenerics> = Record<
+export type CustomSortingFns<TGenerics extends TableGenerics> = Record<
   string,
   SortingFn<TGenerics>
 >
@@ -49,13 +48,13 @@ export type SortingTableState = {
   sorting: SortingState
 }
 
-export type SortingFnOption<TGenerics extends AnyGenerics> =
+export type SortingFnOption<TGenerics extends TableGenerics> =
   | 'auto'
   | BuiltInSortingFn
   | keyof TGenerics['SortingFns']
   | SortingFn<TGenerics>
 
-export type SortingColumnDef<TGenerics extends AnyGenerics> = {
+export type SortingColumnDef<TGenerics extends TableGenerics> = {
   sortingFn?: SortingFnOption<Overwrite<TGenerics, { Value: any }>>
   sortDescFirst?: boolean
   enableSorting?: boolean
@@ -65,7 +64,7 @@ export type SortingColumnDef<TGenerics extends AnyGenerics> = {
   sortUndefined?: false | -1 | 1
 }
 
-export type SortingColumn<TGenerics extends AnyGenerics> = {
+export type SortingColumn<TGenerics extends TableGenerics> = {
   sortingFn: SortingFnOption<Overwrite<TGenerics, { Value: any }>>
   getCanSort: () => boolean
   getCanMultiSort: () => boolean
@@ -78,7 +77,7 @@ export type SortingColumn<TGenerics extends AnyGenerics> = {
   ) => undefined | PropGetterValue<ToggleSortingProps, TGetter>
 }
 
-export type SortingOptions<TGenerics extends AnyGenerics> = {
+export type SortingOptions<TGenerics extends TableGenerics> = {
   sortingFns?: TGenerics['SortingFns']
   onSortingChange?: OnChangeFn<SortingState>
   autoResetSorting?: boolean
@@ -99,7 +98,7 @@ export type ToggleSortingProps = {
   onClick?: (event: unknown) => void
 }
 
-export type SortingInstance<TGenerics extends AnyGenerics> = {
+export type SortingInstance<TGenerics extends TableGenerics> = {
   queueResetSorting: () => void
   getColumnAutoSortingFn: (columnId: string) => SortingFn<TGenerics> | undefined
   getColumnAutoSortDir: (columnId: string) => SortDirection
@@ -130,7 +129,7 @@ export type SortingInstance<TGenerics extends AnyGenerics> = {
 
 export const Sorting = {
   getDefaultColumn: <
-    TGenerics extends AnyGenerics
+    TGenerics extends TableGenerics
   >(): SortingColumnDef<TGenerics> => {
     return {
       sortingFn: 'auto',
@@ -143,7 +142,7 @@ export const Sorting = {
     }
   },
 
-  getDefaultOptions: <TGenerics extends AnyGenerics>(
+  getDefaultOptions: <TGenerics extends TableGenerics>(
     instance: TableInstance<TGenerics>
   ): SortingOptions<TGenerics> => {
     return {
@@ -155,7 +154,7 @@ export const Sorting = {
     }
   },
 
-  createColumn: <TGenerics extends AnyGenerics>(
+  createColumn: <TGenerics extends TableGenerics>(
     column: Column<TGenerics>,
     instance: TableInstance<TGenerics>
   ): SortingColumn<TGenerics> => {
@@ -173,7 +172,7 @@ export const Sorting = {
     }
   },
 
-  getInstance: <TGenerics extends AnyGenerics>(
+  createInstance: <TGenerics extends TableGenerics>(
     instance: TableInstance<TGenerics>
   ): SortingInstance<TGenerics> => {
     let registered = false

package/src/features/Visibility.ts

@@ -3,13 +3,13 @@ import {
   Column,
   Getter,
   OnChangeFn,
-  AnyGenerics,
-  PartialGenerics,
+  TableGenerics,
   PropGetterValue,
   TableInstance,
   Updater,
+  Row,
 } from '../types'
-import { functionalUpdate, makeStateUpdater, memo, propGetter } from '../utils'
+import { makeStateUpdater, memo, propGetter } from '../utils'
 
 export type VisibilityOptions = {
   onColumnVisibilityChange?: OnChangeFn<VisibilityState>
@@ -26,9 +26,12 @@ export type VisibilityTableState = {
   columnVisibility: VisibilityState
 }
 
-export type VisibilityInstance<TGenerics extends AnyGenerics> = {
+export type VisibilityInstance<TGenerics extends TableGenerics> = {
   getVisibleFlatColumns: () => Column<TGenerics>[]
   getVisibleLeafColumns: () => Column<TGenerics>[]
+  getLeftVisibleLeafColumns: () => Column<TGenerics>[]
+  getRightVisibleLeafColumns: () => Column<TGenerics>[]
+  getCenterVisibleLeafColumns: () => Column<TGenerics>[]
   setColumnVisibility: (updater: Updater<VisibilityState>) => void
   toggleColumnVisibility: (columnId: string, value?: boolean) => void
   toggleAllColumnsVisible: (value?: boolean) => void
@@ -52,7 +55,8 @@ export type VisibilityColumnDef = {
   defaultIsVisible?: boolean
 }
 
-export type VisibilityRow<TGenerics extends AnyGenerics> = {
+export type VisibilityRow<TGenerics extends TableGenerics> = {
+  _getAllVisibleCells: () => Cell<TGenerics>[]
   getVisibleCells: () => Cell<TGenerics>[]
 }
 
@@ -74,7 +78,7 @@ export const Visibility = {
     }
   },
 
-  getDefaultOptions: <TGenerics extends AnyGenerics>(
+  getDefaultOptions: <TGenerics extends TableGenerics>(
     instance: TableInstance<TGenerics>
   ): VisibilityDefaultOptions => {
     return {
@@ -88,7 +92,7 @@ export const Visibility = {
     }
   },
 
-  createColumn: <TGenerics extends AnyGenerics>(
+  createColumn: <TGenerics extends TableGenerics>(
     column: Column<TGenerics>,
     instance: TableInstance<TGenerics>
   ): VisibilityColumn => {
@@ -114,46 +118,88 @@ export const Visibility = {
     }
   },
 
-  getInstance: <TGenerics extends AnyGenerics>(
+  createRow: <TGenerics extends TableGenerics>(
+    row: Row<TGenerics>,
     instance: TableInstance<TGenerics>
-  ): VisibilityInstance<TGenerics> => {
+  ): VisibilityRow<TGenerics> => {
     return {
-      getVisibleFlatColumns: memo(
+      _getAllVisibleCells: memo(
         () => [
-          instance.getAllFlatColumns(),
-          instance
-            .getAllFlatColumns()
-            .filter(d => d.getIsVisible?.())
+          row
+            .getAllCells()
+            .filter(cell => cell.column.getIsVisible())
             .map(d => d.id)
             .join('_'),
         ],
-        allFlatColumns => {
-          return allFlatColumns.filter(d => d.getIsVisible?.())
+        _ => {
+          return row.getAllCells().filter(cell => cell.column.getIsVisible())
         },
         {
-          key: 'getVisibleFlatColumns',
-          debug: () =>
-            instance.options.debugAll ?? instance.options.debugColumns,
+          key: 'row._getAllVisibleCells',
+          debug: () => instance.options.debugAll ?? instance.options.debugRows,
+        }
+      ),
+      getVisibleCells: memo(
+        () => [
+          row.getLeftVisibleCells(),
+          row.getCenterVisibleCells(),
+          row.getRightVisibleCells(),
+        ],
+        (left, center, right) => [...left, ...center, ...right],
+        {
+          key: 'row.getVisibleCells',
+          debug: () => instance.options.debugAll ?? instance.options.debugRows,
         }
       ),
+    }
+  },
 
-      getVisibleLeafColumns: memo(
+  createInstance: <TGenerics extends TableGenerics>(
+    instance: TableInstance<TGenerics>
+  ): VisibilityInstance<TGenerics> => {
+    const makeVisibleColumnsMethod = (
+      key: string,
+      getColumns: () => Column<TGenerics>[]
+    ): (() => Column<TGenerics>[]) => {
+      return memo(
         () => [
-          instance.getAllLeafColumns(),
-          instance
-            .getAllLeafColumns()
-            .filter(d => d.getIsVisible?.())
+          getColumns(),
+          getColumns()
+            .filter(d => d.getIsVisible())
             .map(d => d.id)
             .join('_'),
         ],
-        allFlatColumns => {
-          return allFlatColumns.filter(d => d.getIsVisible?.())
+        columns => {
+          return columns.filter(d => d.getIsVisible?.())
         },
         {
-          key: 'getVisibleLeafColumns',
+          key,
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }
+      )
+    }
+
+    return {
+      getVisibleFlatColumns: makeVisibleColumnsMethod(
+        'getVisibleFlatColumns',
+        () => instance.getAllFlatColumns()
+      ),
+      getVisibleLeafColumns: makeVisibleColumnsMethod(
+        'getVisibleLeafColumns',
+        () => instance.getAllLeafColumns()
+      ),
+      getLeftVisibleLeafColumns: makeVisibleColumnsMethod(
+        'getLeftVisibleLeafColumns',
+        () => instance.getLeftLeafColumns()
+      ),
+      getRightVisibleLeafColumns: makeVisibleColumnsMethod(
+        'getRightVisibleLeafColumns',
+        () => instance.getRightLeafColumns()
+      ),
+      getCenterVisibleLeafColumns: makeVisibleColumnsMethod(
+        'getCenterVisibleLeafColumns',
+        () => instance.getCenterLeafColumns()
       ),
 
       setColumnVisibility: updater =>

package/src/filterFns.ts

@@ -1,4 +1,4 @@
-import { PartialGenerics, AnyGenerics, Row } from './types'
+import { TableGenerics, Row } from './types'
 
 export const filterFns = {
   includesString,
@@ -14,7 +14,7 @@ export const filterFns = {
 
 export type BuiltInFilterFn = keyof typeof filterFns
 
-function includesString<TGenerics extends AnyGenerics>(
+function includesString<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -31,7 +31,7 @@ function includesString<TGenerics extends AnyGenerics>(
 
 includesString.autoRemove = (val: any) => testFalsey(val)
 
-function includesStringSensitive<TGenerics extends AnyGenerics>(
+function includesStringSensitive<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -48,7 +48,7 @@ function includesStringSensitive<TGenerics extends AnyGenerics>(
 
 includesStringSensitive.autoRemove = (val: any) => testFalsey(val)
 
-function equalsString<TGenerics extends AnyGenerics>(
+function equalsString<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -67,7 +67,7 @@ function equalsString<TGenerics extends AnyGenerics>(
 
 equalsString.autoRemove = (val: any) => testFalsey(val)
 
-function equalsStringSensitive<TGenerics extends AnyGenerics>(
+function equalsStringSensitive<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -83,7 +83,7 @@ function equalsStringSensitive<TGenerics extends AnyGenerics>(
 
 equalsStringSensitive.autoRemove = (val: any) => testFalsey(val)
 
-function arrIncludes<TGenerics extends AnyGenerics>(
+function arrIncludes<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -98,7 +98,7 @@ function arrIncludes<TGenerics extends AnyGenerics>(
 
 arrIncludes.autoRemove = (val: any) => testFalsey(val) || !val?.length
 
-function arrIncludesAll<TGenerics extends AnyGenerics>(
+function arrIncludesAll<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown[]
@@ -117,7 +117,7 @@ function arrIncludesAll<TGenerics extends AnyGenerics>(
 
 arrIncludesAll.autoRemove = (val: any) => testFalsey(val) || !val?.length
 
-function equals<TGenerics extends AnyGenerics>(
+function equals<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -132,7 +132,7 @@ function equals<TGenerics extends AnyGenerics>(
 
 equals.autoRemove = (val: any) => testFalsey(val)
 
-function weakEquals<TGenerics extends AnyGenerics>(
+function weakEquals<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: unknown
@@ -148,7 +148,7 @@ function weakEquals<TGenerics extends AnyGenerics>(
 
 weakEquals.autoRemove = (val: any) => testFalsey(val)
 
-function betweenNumberRange<TGenerics extends AnyGenerics>(
+function betweenNumberRange<TGenerics extends TableGenerics>(
   rows: Row<TGenerics>[],
   columnIds: string[],
   filterValue: [unknown, unknown]

package/src/sortingFns.ts

@@ -1,4 +1,4 @@
-import { AnyGenerics, Row } from './types'
+import { TableGenerics, Row } from './types'
 
 export const reSplitAlphaNumeric = /([0-9]+)/gm
 
@@ -13,7 +13,7 @@ export const sortingFns = {
 
 export type BuiltInSortingFn = keyof typeof sortingFns
 
-function alphanumeric<TGenerics extends AnyGenerics>(
+function alphanumeric<TGenerics extends TableGenerics>(
   rowA: Row<TGenerics>,
   rowB: Row<TGenerics>,
   columnId: string
@@ -24,7 +24,7 @@ function alphanumeric<TGenerics extends AnyGenerics>(
   )
 }
 
-function alphanumericCaseSensitive<TGenerics extends AnyGenerics>(
+function alphanumericCaseSensitive<TGenerics extends TableGenerics>(
   rowA: Row<TGenerics>,
   rowB: Row<TGenerics>,
   columnId: string
@@ -84,7 +84,7 @@ function compareAlphanumeric(aStr: string, bStr: string) {
 
 // The text filter is more basic (less numeric support)
 // but is much faster
-function text<TGenerics extends AnyGenerics>(
+function text<TGenerics extends TableGenerics>(
   rowA: Row<TGenerics>,
   rowB: Row<TGenerics>,
   columnId: string
@@ -97,7 +97,7 @@ function text<TGenerics extends AnyGenerics>(
 
 // The text filter is more basic (less numeric support)
 // but is much faster
-function textCaseSensitive<TGenerics extends AnyGenerics>(
+function textCaseSensitive<TGenerics extends TableGenerics>(
   rowA: Row<TGenerics>,
   rowB: Row<TGenerics>,
   columnId: string
@@ -108,7 +108,7 @@ function textCaseSensitive<TGenerics extends AnyGenerics>(
   )
 }
 
-function datetime<TGenerics extends AnyGenerics>(
+function datetime<TGenerics extends TableGenerics>(
   rowA: Row<TGenerics>,
   rowB: Row<TGenerics>,
   columnId: string
@@ -119,7 +119,7 @@ function datetime<TGenerics extends AnyGenerics>(
   )
 }
 
-function basic<TGenerics extends AnyGenerics>(
+function basic<TGenerics extends TableGenerics>(
   rowA: Row<TGenerics>,
   rowB: Row<TGenerics>,
   columnId: string