@tanstack/table-core 8.0.0-alpha.62 → 8.0.0-alpha.65

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/table-core",
   "author": "Tanner Linsley",
-  "version": "8.0.0-alpha.62",
+  "version": "8.0.0-alpha.65",
   "description": "Hooks for building lightweight, fast and extendable datagrids for React",
   "license": "MIT",
   "homepage": "https://github.com/tanstack/react-table#readme",
@@ -28,6 +28,7 @@
   "main": "build/cjs/index.js",
   "browser": "build/umd/index.production.min.js",
   "types": "build/types/index.d.ts",
+  "sideEffects": false,
   "engines": {
     "node": ">=12"
   },

package/src/core.ts

@@ -116,14 +116,15 @@ export function createTableInstance<TGenerics extends TableGenerics>(
     coreProgress: 1,
   }
 
-  const initialState = {
+  let initialState = {
     ...coreInitialState,
     ...(options.initialState ?? {}),
-    ...instance._features.reduce((obj, feature) => {
-      return Object.assign(obj, feature.getInitialState?.(options.initialState))
-    }, {}),
   } as TableState
 
+  instance._features.forEach(feature => {
+    initialState = feature.getInitialState?.(initialState) ?? initialState
+  })
+
   const queued: (() => void)[] = []
   let queuedTimeout = false
 
@@ -142,8 +143,8 @@ export function createTableInstance<TGenerics extends TableGenerics>(
         // the current call stack (render, etc) has finished.
         Promise.resolve()
           .then(() => {
-            console.log(queued)
             while (queued.length) {
+              console.log('queue')
               queued.shift()!()
             }
             queuedTimeout = false

package/src/features/Cells.ts

@@ -56,7 +56,9 @@ export const Cells = {
           }, {} as Record<string, Cell<TGenerics>>)
         },
         {
-          key: 'row.getAllCellsByColumnId',
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'row.getAllCellsByColumnId',
           debug: () => instance.options.debugAll ?? instance.options.debugRows,
         }
       ),

package/src/features/ColumnSizing.ts

@@ -98,7 +98,7 @@ export const ColumnSizing: TableFeature = {
   getDefaultColumn: (): ColumnSizingColumnDef => {
     return defaultColumnSizing
   },
-  getInitialState: (): ColumnSizingTableState => {
+  getInitialState: (state): ColumnSizingTableState => {
     return {
       columnSizing: {},
       columnSizingInfo: {
@@ -109,6 +109,7 @@ export const ColumnSizing: TableFeature = {
         isResizingColumn: false,
         columnSizingStart: [],
       },
+      ...state,
     }
   },
 

package/src/features/Columns.ts

@@ -108,7 +108,7 @@ export const Columns = {
         {
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
-          key: 'getDefaultColumn',
+          key: process.env.NODE_ENV === 'production' && 'getDefaultColumn',
         }
       ),
 
@@ -165,7 +165,9 @@ export const Columns = {
               ]
             },
             {
-              key: 'column.getFlatColumns',
+              key:
+                process.env.NODE_ENV === 'production' &&
+                'column.getFlatColumns',
               debug: () =>
                 instance.options.debugAll ?? instance.options.debugColumns,
             }
@@ -184,7 +186,9 @@ export const Columns = {
               return [column as Column<TGenerics>]
             },
             {
-              key: 'column.getLeafColumns',
+              key:
+                process.env.NODE_ENV === 'production' &&
+                'column.getLeafColumns',
               debug: () =>
                 instance.options.debugAll ?? instance.options.debugColumns,
             }
@@ -221,7 +225,7 @@ export const Columns = {
           return recurseColumns(columnDefs)
         },
         {
-          key: 'getAllColumns',
+          key: process.env.NODE_ENV === 'production' && 'getAllColumns',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }
@@ -235,7 +239,7 @@ export const Columns = {
           })
         },
         {
-          key: 'getAllFlatColumns',
+          key: process.env.NODE_ENV === 'production' && 'getAllFlatColumns',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }
@@ -250,7 +254,7 @@ export const Columns = {
           }, {} as Record<string, Column<TGenerics>>)
         },
         {
-          key: 'getAllFlatColumnsById',
+          key: process.env.NODE_ENV === 'production' && 'getAllFlatColumnsById',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }
@@ -265,7 +269,7 @@ export const Columns = {
           return orderColumns(leafColumns)
         },
         {
-          key: 'getAllLeafColumns',
+          key: process.env.NODE_ENV === 'production' && 'getAllLeafColumns',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }

package/src/features/Expanding.ts

@@ -5,6 +5,7 @@ import {
   TableInstance,
   Row,
   Updater,
+  TableFeature,
 } from '../types'
 import { makeStateUpdater } from '../utils'
 
@@ -57,10 +58,11 @@ export type ExpandedInstance<TGenerics extends TableGenerics> = {
 
 //
 
-export const Expanding = {
-  getInitialState: (): ExpandedTableState => {
+export const Expanding: TableFeature = {
+  getInitialState: (state): ExpandedTableState => {
     return {
       expanded: {},
+      ...state,
     }
   },
 

package/src/features/Filters.ts

@@ -7,6 +7,7 @@ import {
   TableInstance,
   Row,
   Updater,
+  TableFeature,
 } from '../types'
 import {
   functionalUpdate,
@@ -15,6 +16,7 @@ import {
   memo,
   Overwrite,
 } from '../utils'
+import { filterRows } from '../utils/filterRowsUtils'
 
 export type FiltersTableState = {
   columnFilters: ColumnFiltersState
@@ -30,17 +32,19 @@ export type ColumnFilter = {
   value: unknown
 }
 
-/*
-A filter function is any function that takes an array of rows and returns an array of rows. Because filter functions can be used for both column and global filters, they are passed an array of columnIds to filter on. 
-*/
-
 export type FilterFn<TGenerics extends TableGenerics> = {
-  (rows: Row<TGenerics>[], columnIds: string[], filterValue: any): any
+  (row: Row<TGenerics>, columnId: string, filterValue: any): boolean
+  resolveFilterValue?: TransformFilterValueFn<TGenerics>
   autoRemove?: ColumnFilterAutoRemoveTestFn<TGenerics>
 }
 
+export type TransformFilterValueFn<TGenerics extends TableGenerics> = (
+  value: any,
+  column?: Column<TGenerics>
+) => unknown
+
 export type ColumnFilterAutoRemoveTestFn<TGenerics extends TableGenerics> = (
-  value: unknown,
+  value: any,
   column?: Column<TGenerics>
 ) => boolean
 
@@ -57,12 +61,9 @@ export type FilterFnOption<TGenerics extends TableGenerics> =
 
 export type FiltersColumnDef<TGenerics extends TableGenerics> = {
   filterFn?: FilterFnOption<Overwrite<TGenerics, { Value: any }>>
-  enableAllFilters?: boolean
   enableColumnFilter?: boolean
   enableGlobalFilter?: boolean
-  defaultCanFilter?: boolean
-  defaultCanColumnFilter?: boolean
-  defaultCanGlobalFilter?: boolean
+  enableFaceting?: boolean
 }
 
 export type FiltersColumn<TGenerics extends TableGenerics> = {
@@ -73,31 +74,34 @@ export type FiltersColumn<TGenerics extends TableGenerics> = {
   getColumnIsFiltered: () => boolean
   getColumnFilterValue: () => unknown
   setColumnFilterValue: (updater: Updater<any>) => void
-  getPreFilteredRows: () => Row<TGenerics>[] | undefined
-  getPreFilteredUniqueValues: () => Map<any, number>
-  getPreFilteredMinMaxValues: () => [any, any]
+  getFacetedRowModel: () => RowModel<TGenerics>
+  getFacetedUniqueValues: () => Map<any, number>
+  getFacetedMinMaxValues: () => [any, any]
+}
+
+export type FiltersRow<TGenerics extends TableGenerics> = {
+  columnFilterMap: Record<string, boolean>
+  subRowsByFacetId: Record<string, Row<TGenerics>[]>
 }
 
 export type FiltersOptions<TGenerics extends TableGenerics> = {
+  enableFilters?: boolean
+  manualFiltering?: boolean
   filterFromLeafRows?: boolean
   filterFns?: TGenerics['FilterFns']
-  enableFilters?: boolean
+
   // Column
-  manualColumnFiltering?: boolean
   onColumnFiltersChange?: OnChangeFn<ColumnFiltersState>
   enableColumnFilters?: boolean
-  getColumnFilteredRowModel?: (
+  getFilteredRowModel?: (
     instance: TableInstance<TGenerics>
   ) => () => RowModel<TGenerics>
+
   // Global
-  manualGlobalFiltering?: boolean
   globalFilterFn?: FilterFnOption<TGenerics>
   onGlobalFilterChange?: OnChangeFn<any>
   enableGlobalFilter?: boolean
-  getGlobalFilteredRowModel?: (
-    instance: TableInstance<TGenerics>
-  ) => () => RowModel<TGenerics>
-  getColumnCanGlobalFilterFn?: (column: Column<TGenerics>) => boolean
+  getColumnCanGlobalFilter?: (column: Column<TGenerics>) => boolean
 }
 
 export type FiltersInstance<TGenerics extends TableGenerics> = {
@@ -109,15 +113,16 @@ export type FiltersInstance<TGenerics extends TableGenerics> = {
   setColumnFilterValue: (columnId: string, updater: Updater<any>) => void
   resetColumnFilters: () => void
   getColumnCanColumnFilter: (columnId: string) => boolean
+  getColumnFacetedRowModel: (columnId: string) => RowModel<TGenerics>
 
   getColumnIsFiltered: (columnId: string) => boolean
   getColumnFilterValue: (columnId: string) => unknown
   getColumnFilterIndex: (columnId: string) => number
 
   // Column Filters
-  getPreColumnFilteredRowModel: () => RowModel<TGenerics>
-  getColumnFilteredRowModel: () => RowModel<TGenerics>
-  _getColumnFilteredRowModel?: () => RowModel<TGenerics>
+  getPreFilteredRowModel: () => RowModel<TGenerics>
+  getFilteredRowModel: () => RowModel<TGenerics>
+  _getFilteredRowModel?: () => RowModel<TGenerics>
 
   // Global Filters
   setGlobalFilter: (updater: Updater<any>) => void
@@ -125,14 +130,14 @@ export type FiltersInstance<TGenerics extends TableGenerics> = {
   getGlobalAutoFilterFn: () => FilterFn<TGenerics> | undefined
   getGlobalFilterFn: () => FilterFn<TGenerics> | undefined
   getColumnCanGlobalFilter: (columnId: string) => boolean
-  getPreGlobalFilteredRowModel: () => RowModel<TGenerics>
-  getGlobalFilteredRowModel: () => RowModel<TGenerics>
-  _getGlobalFilteredRowModel?: () => RowModel<TGenerics>
+  getGlobalFacetedRowModel: () => RowModel<TGenerics>
+  getGlobalFacetedUniqueValues: () => Map<any, number>
+  getGlobalFacetedMinMaxValues: () => [number, number]
 }
 
 //
 
-export const Filters = {
+export const Filters: TableFeature = {
   getDefaultColumn: <
     TGenerics extends TableGenerics
   >(): FiltersColumnDef<TGenerics> => {
@@ -141,12 +146,13 @@ export const Filters = {
     }
   },
 
-  getInitialState: (): FiltersTableState => {
+  getInitialState: (state): FiltersTableState => {
     return {
       columnFilters: [],
       globalFilter: undefined,
       columnFiltersProgress: 1,
       globalFilterProgress: 1,
+      ...state,
     }
   },
 
@@ -158,7 +164,7 @@ export const Filters = {
       onGlobalFilterChange: makeStateUpdater('globalFilter', instance),
       filterFromLeafRows: true,
       globalFilterFn: 'auto',
-      getColumnCanGlobalFilterFn: column => {
+      getColumnCanGlobalFilter: column => {
         const value = instance
           .getCoreRowModel()
           .flatRows[0]?.getAllCellsByColumnId()[column.id]?.value
@@ -172,46 +178,6 @@ export const Filters = {
     column: Column<TGenerics>,
     instance: TableInstance<TGenerics>
   ): FiltersColumn<TGenerics> => {
-    const getFacetInfo = memo(
-      () => [column.getPreFilteredRows()],
-      (rows = []) => {
-        let preFilteredUniqueValues = new Map<any, number>()
-
-        let preFilteredMinMaxValues: [any, any] = [
-          rows[0]?.values[column.id] ?? null,
-          rows[0]?.values[column.id] ?? null,
-        ]
-
-        for (let i = 0; i < rows.length; i++) {
-          const value = rows[i]?.values[column.id]
-
-          if (preFilteredUniqueValues.has(value)) {
-            preFilteredUniqueValues.set(
-              value,
-              (preFilteredUniqueValues.get(value) ?? 0) + 1
-            )
-          } else {
-            preFilteredUniqueValues.set(value, 1)
-          }
-
-          if (value < preFilteredMinMaxValues[0]) {
-            preFilteredMinMaxValues[0] = value
-          } else if (value > preFilteredMinMaxValues[1]) {
-            preFilteredMinMaxValues[1] = value
-          }
-        }
-
-        return {
-          preFilteredUniqueValues,
-          preFilteredMinMaxValues,
-        }
-      },
-      {
-        key: 'column.getFacetInfo',
-        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
-      }
-    )
-
     return {
       filterFn: column.filterFn,
       getCanColumnFilter: () => instance.getColumnCanColumnFilter(column.id),
@@ -221,9 +187,68 @@ export const Filters = {
       getColumnFilterValue: () => instance.getColumnFilterValue(column.id),
       setColumnFilterValue: val =>
         instance.setColumnFilterValue(column.id, val),
-      getPreFilteredUniqueValues: () => getFacetInfo().preFilteredUniqueValues,
-      getPreFilteredMinMaxValues: () => getFacetInfo().preFilteredMinMaxValues,
-      getPreFilteredRows: () => undefined,
+      getFacetedRowModel: memo(
+        () => [
+          instance.getPreFilteredRowModel(),
+          instance.getState().columnFilters,
+          instance.getState().globalFilter,
+          // Include this to force the filtered facet info to be calculated
+          instance.getFilteredRowModel(),
+        ],
+        (rowModel, columnFilters, globalFilter, _) => {
+          if (!columnFilters?.length && !globalFilter) {
+            return rowModel
+          }
+
+          return filterRows(
+            rowModel.rows,
+            [
+              ...columnFilters.map(d => d.id).filter(d => d !== column.id),
+              globalFilter ? '__global__' : undefined,
+            ].filter(Boolean) as string[],
+            instance
+          )
+        },
+        {
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'getFacetedRowModel_' + column.id,
+          debug: () =>
+            instance.options.debugAll ?? instance.options.debugColumns,
+        }
+      ),
+      getFacetedUniqueValues: memo(
+        () => [column.getFacetedRowModel()],
+        facetedRowModel => getRowModelUniqueValues(facetedRowModel, column.id),
+        {
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'column.getFacetedUniqueValues',
+          debug: () =>
+            instance.options.debugAll ?? instance.options.debugColumns,
+        }
+      ),
+      getFacetedMinMaxValues: memo(
+        () => [column.getFacetedRowModel()],
+        facetedRowModel => getRowModelMinMaxValues(facetedRowModel, column.id),
+        {
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'column.getFacetedMinMaxValues',
+          debug: () =>
+            instance.options.debugAll ?? instance.options.debugColumns,
+        }
+      ),
+    }
+  },
+
+  createRow: <TGenerics extends TableGenerics>(
+    row: Row<TGenerics>,
+    instance: TableInstance<TGenerics>
+  ): FiltersRow<TGenerics> => {
+    return {
+      columnFilterMap: {},
+      subRowsByFacetId: {},
     }
   },
 
@@ -241,7 +266,7 @@ export const Filters = {
         }
 
         if (typeof value === 'number') {
-          return filterFns.betweenNumberRange
+          return filterFns.inNumberRange
         }
 
         if (value !== null && typeof value === 'object') {
@@ -254,6 +279,15 @@ export const Filters = {
 
         return filterFns.weakEquals
       },
+      getColumnFacetedRowModel: columnId => {
+        const column = instance.getColumn(columnId)
+
+        if (!column) {
+          throw new Error()
+        }
+
+        return column.getFacetedRowModel()
+      },
       getGlobalAutoFilterFn: () => {
         return filterFns.includesString
       },
@@ -331,12 +365,9 @@ export const Filters = {
         }
 
         return (
-          column.enableAllFilters ??
-          column.enableColumnFilter ??
-          instance.options.enableFilters ??
-          instance.options.enableColumnFilters ??
-          column.defaultCanColumnFilter ??
-          column.defaultCanFilter ??
+          (column.enableColumnFilter ?? true) &&
+          (instance.options.enableColumnFilters ?? true) &&
+          (instance.options.enableFilters ?? true) &&
           !!column.accessorFn
         )
       },
@@ -349,15 +380,11 @@ export const Filters = {
         }
 
         return (
-          ((instance.options.enableFilters ??
-            instance.options.enableGlobalFilter ??
-            column.enableAllFilters ??
-            column.enableGlobalFilter ??
-            column.defaultCanGlobalFilter ??
-            column.defaultCanFilter ??
-            !!column.accessorFn) &&
-            instance.options.getColumnCanGlobalFilterFn?.(column)) ??
-          true
+          (column.enableGlobalFilter ?? true) &&
+          (instance.options.enableGlobalFilter ?? true) &&
+          (instance.options.enableFilters ?? true) &&
+          (instance.options.getColumnCanGlobalFilter?.(column) ?? true) &&
+          !!column.accessorFn
         )
       },
 
@@ -430,44 +457,76 @@ export const Filters = {
         instance.setColumnFilters(instance.initialState?.columnFilters ?? [])
       },
 
-      getPreColumnFilteredRowModel: () => instance.getCoreRowModel(),
-      getColumnFilteredRowModel: () => {
+      getPreFilteredRowModel: () => instance.getCoreRowModel(),
+      getFilteredRowModel: () => {
         if (
-          !instance._getColumnFilteredRowModel &&
-          instance.options.getColumnFilteredRowModel
+          !instance._getFilteredRowModel &&
+          instance.options.getFilteredRowModel
         ) {
-          instance._getColumnFilteredRowModel =
-            instance.options.getColumnFilteredRowModel(instance)
+          instance._getFilteredRowModel =
+            instance.options.getFilteredRowModel(instance)
         }
 
         if (
-          instance.options.manualColumnFiltering ||
-          !instance._getColumnFilteredRowModel
+          instance.options.manualFiltering ||
+          !instance._getFilteredRowModel
         ) {
-          return instance.getPreColumnFilteredRowModel()
+          return instance.getPreFilteredRowModel()
         }
 
-        return instance._getColumnFilteredRowModel()
+        return instance._getFilteredRowModel()
       },
-      getPreGlobalFilteredRowModel: () => instance.getColumnFilteredRowModel(),
-      getGlobalFilteredRowModel: () => {
-        if (
-          !instance._getGlobalFilteredRowModel &&
-          instance.options.getGlobalFilteredRowModel
-        ) {
-          instance._getGlobalFilteredRowModel =
-            instance.options.getGlobalFilteredRowModel(instance)
-        }
 
-        if (
-          instance.options.manualGlobalFiltering ||
-          !instance._getGlobalFilteredRowModel
-        ) {
-          return instance.getPreGlobalFilteredRowModel()
-        }
+      getGlobalFacetedRowModel: memo(
+        () => [
+          instance.getPreFilteredRowModel(),
+          instance.getState().columnFilters,
+          instance.getState().globalFilter,
+          // Include this to force the filtered facet info to be calculated
+          instance.getFilteredRowModel(),
+        ],
+        (rowModel, columnFilters, globalFilter, _) => {
+          if (!columnFilters?.length && !globalFilter) {
+            return rowModel
+          }
 
-        return instance._getGlobalFilteredRowModel()
-      },
+          return filterRows(
+            rowModel.rows,
+            columnFilters.map(d => d.id),
+            instance
+          )
+        },
+        {
+          key:
+            process.env.NODE_ENV === 'production' && 'getGlobalFacetedRowModel',
+          debug: () =>
+            instance.options.debugAll ?? instance.options.debugColumns,
+        }
+      ),
+      getGlobalFacetedUniqueValues: memo(
+        () => [instance.getGlobalFacetedRowModel()],
+        facetedRowModel =>
+          getRowModelUniqueValues(facetedRowModel, '__global__'),
+        {
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'getGlobalFacetedUniqueValues',
+          debug: () =>
+            instance.options.debugAll ?? instance.options.debugColumns,
+        }
+      ),
+      getGlobalFacetedMinMaxValues: memo(
+        () => [instance.getGlobalFacetedRowModel()],
+        facetedRowModel =>
+          getRowModelMinMaxValues(facetedRowModel, '__global__'),
+        {
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'getGlobalFacetedMinMaxValues',
+          debug: () =>
+            instance.options.debugAll ?? instance.options.debugColumns,
+        }
+      ),
     }
   },
 }
@@ -485,3 +544,44 @@ export function shouldAutoRemoveFilter<TGenerics extends TableGenerics>(
     (typeof value === 'string' && !value)
   )
 }
+
+export function getRowModelMinMaxValues<TGenerics extends TableGenerics>(
+  rowModel: RowModel<TGenerics>,
+  columnId: string
+) {
+  let facetedMinMaxValues: [any, any] = [
+    rowModel.flatRows[0]?.values[columnId] ?? null,
+    rowModel.flatRows[0]?.values[columnId] ?? null,
+  ]
+
+  for (let i = 0; i < rowModel.flatRows.length; i++) {
+    const value = rowModel.flatRows[i]?.values[columnId]
+
+    if (value < facetedMinMaxValues[0]) {
+      facetedMinMaxValues[0] = value
+    } else if (value > facetedMinMaxValues[1]) {
+      facetedMinMaxValues[1] = value
+    }
+  }
+
+  return facetedMinMaxValues
+}
+
+export function getRowModelUniqueValues<TGenerics extends TableGenerics>(
+  rowModel: RowModel<TGenerics>,
+  columnId: string
+) {
+  let facetedUniqueValues = new Map<any, number>()
+
+  for (let i = 0; i < rowModel.flatRows.length; i++) {
+    const value = rowModel.flatRows[i]?.values[columnId]
+
+    if (facetedUniqueValues.has(value)) {
+      facetedUniqueValues.set(value, (facetedUniqueValues.get(value) ?? 0) + 1)
+    } else {
+      facetedUniqueValues.set(value, 1)
+    }
+  }
+
+  return facetedUniqueValues
+}