@tanstack/table-core 8.0.0-alpha.80 → 8.0.0-alpha.84

package/src/core/instance.ts

@@ -0,0 +1,361 @@
+import { flattenBy, functionalUpdate, memo, RequiredKeys } from '../utils'
+
+import {
+  Updater,
+  TableOptionsResolved,
+  TableState,
+  TableInstance,
+  Renderable,
+  TableGenerics,
+  InitialTableState,
+  Row,
+  Column,
+  RowModel,
+  ColumnDef,
+} from '../types'
+
+//
+import { createColumn } from './column'
+import { Headers } from './headers'
+//
+
+import { ColumnSizing } from '../features/ColumnSizing'
+import { Expanding } from '../features/Expanding'
+import { Filters } from '../features/Filters'
+import { Grouping } from '../features/Grouping'
+import { Ordering } from '../features/Ordering'
+import { Pagination } from '../features/Pagination'
+import { Pinning } from '../features/Pinning'
+import { RowSelection } from '../features/RowSelection'
+import { Sorting } from '../features/Sorting'
+import { Visibility } from '../features/Visibility'
+
+export type TableFeature = {
+  getDefaultOptions?: (instance: any) => any
+  getInitialState?: (initialState?: InitialTableState) => any
+  createInstance?: (instance: any) => any
+  getDefaultColumnDef?: () => any
+  createColumn?: (column: any, instance: any) => any
+  createHeader?: (column: any, instance: any) => any
+  createCell?: (cell: any, column: any, row: any, instance: any) => any
+  createRow?: (row: any, instance: any) => any
+}
+
+const features = [
+  Headers,
+  Visibility,
+  Ordering,
+  Pinning,
+  Filters,
+  Sorting,
+  Grouping,
+  Expanding,
+  Pagination,
+  RowSelection,
+  ColumnSizing,
+] as const
+
+//
+
+export type CoreTableState = {}
+
+export type CoreOptions<TGenerics extends TableGenerics> = {
+  data: TGenerics['Row'][]
+  state: Partial<TableState>
+  onStateChange: (updater: Updater<TableState>) => void
+  render: TGenerics['Renderer']
+  debugAll?: boolean
+  debugTable?: boolean
+  debugHeaders?: boolean
+  debugColumns?: boolean
+  debugRows?: boolean
+  initialState?: InitialTableState
+  autoResetAll?: boolean
+  mergeOptions?: <T>(defaultOptions: T, options: Partial<T>) => T
+  meta?: TGenerics['TableMeta']
+  getCoreRowModel: (
+    instance: TableInstance<TGenerics>
+  ) => () => RowModel<TGenerics>
+  getSubRows?: (
+    originalRow: TGenerics['Row'],
+    index: number
+  ) => undefined | TGenerics['Row'][]
+  getRowId?: (
+    originalRow: TGenerics['Row'],
+    index: number,
+    parent?: Row<TGenerics>
+  ) => string
+  columns: ColumnDef<TGenerics>[]
+  defaultColumn?: Partial<ColumnDef<TGenerics>>
+}
+
+export type CoreInstance<TGenerics extends TableGenerics> = {
+  initialState: TableState
+  reset: () => void
+  options: RequiredKeys<TableOptionsResolved<TGenerics>, 'state'>
+  setOptions: (newOptions: Updater<TableOptionsResolved<TGenerics>>) => void
+  getState: () => TableState
+  setState: (updater: Updater<TableState>) => void
+  _features: readonly TableFeature[]
+  _queue: (cb: () => void) => void
+  _render: <TProps>(
+    template: Renderable<TGenerics, TProps>,
+    props: TProps
+  ) => string | null | TGenerics['Rendered']
+  _getRowId: (
+    _: TGenerics['Row'],
+    index: number,
+    parent?: Row<TGenerics>
+  ) => string
+  getCoreRowModel: () => RowModel<TGenerics>
+  _getCoreRowModel?: () => RowModel<TGenerics>
+  getRowModel: () => RowModel<TGenerics>
+  getRow: (id: string) => Row<TGenerics>
+  _getDefaultColumnDef: () => Partial<ColumnDef<TGenerics>>
+  _getColumnDefs: () => ColumnDef<TGenerics>[]
+  _getAllFlatColumnsById: () => Record<string, Column<TGenerics>>
+  getAllColumns: () => Column<TGenerics>[]
+  getAllFlatColumns: () => Column<TGenerics>[]
+  getAllLeafColumns: () => Column<TGenerics>[]
+  getColumn: (columnId: string) => Column<TGenerics>
+}
+
+export function createTableInstance<TGenerics extends TableGenerics>(
+  options: TableOptionsResolved<TGenerics>
+): TableInstance<TGenerics> {
+  if (options.debugAll || options.debugTable) {
+    console.info('Creating Table Instance...')
+  }
+
+  let instance = { _features: features } as unknown as TableInstance<TGenerics>
+
+  const defaultOptions = instance._features.reduce((obj, feature) => {
+    return Object.assign(obj, feature.getDefaultOptions?.(instance))
+  }, {}) as TableOptionsResolved<TGenerics>
+
+  const mergeOptions = (options: TableOptionsResolved<TGenerics>) => {
+    if (instance.options.mergeOptions) {
+      return instance.options.mergeOptions(defaultOptions, options)
+    }
+
+    return {
+      ...defaultOptions,
+      ...options,
+    }
+  }
+
+  const coreInitialState: CoreTableState = {}
+
+  let initialState = {
+    ...coreInitialState,
+    ...(options.initialState ?? {}),
+  } as TableState
+
+  instance._features.forEach(feature => {
+    initialState = feature.getInitialState?.(initialState) ?? initialState
+  })
+
+  const queued: (() => void)[] = []
+  let queuedTimeout = false
+
+  const coreInstance: CoreInstance<TGenerics> = {
+    _features: features,
+    options: {
+      ...defaultOptions,
+      ...options,
+    },
+    initialState,
+    _queue: cb => {
+      queued.push(cb)
+
+      if (!queuedTimeout) {
+        queuedTimeout = true
+
+        // Schedule a microtask to run the queued callbacks after
+        // the current call stack (render, etc) has finished.
+        Promise.resolve()
+          .then(() => {
+            while (queued.length) {
+              queued.shift()!()
+            }
+            queuedTimeout = false
+          })
+          .catch(error =>
+            setTimeout(() => {
+              throw error
+            })
+          )
+      }
+    },
+    reset: () => {
+      instance.setState(instance.initialState)
+    },
+    setOptions: updater => {
+      const newOptions = functionalUpdate(updater, instance.options)
+      instance.options = mergeOptions(newOptions)
+    },
+    _render: (template, props) => {
+      if (typeof instance.options.render === 'function') {
+        return instance.options.render(template, props)
+      }
+
+      if (typeof template === 'function') {
+        return (template as Function)(props)
+      }
+
+      return template
+    },
+
+    getState: () => {
+      return instance.options.state as TableState
+    },
+
+    setState: (updater: Updater<TableState>) => {
+      instance.options.onStateChange?.(updater)
+    },
+
+    _getRowId: (
+      row: TGenerics['Row'],
+      index: number,
+      parent?: Row<TGenerics>
+    ) =>
+      instance.options.getRowId?.(row, index, parent) ??
+      `${parent ? [parent.id, index].join('.') : index}`,
+
+    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
+    },
+    _getDefaultColumnDef: memo(
+      () => [instance.options.defaultColumn],
+      defaultColumn => {
+        defaultColumn = (defaultColumn ?? {}) as Partial<ColumnDef<TGenerics>>
+
+        return {
+          header: props => props.header.column.id,
+          footer: props => props.header.column.id,
+          cell: props => props.getValue().toString?.() ?? null,
+          ...instance._features.reduce((obj, feature) => {
+            return Object.assign(obj, feature.getDefaultColumnDef?.())
+          }, {}),
+          ...defaultColumn,
+        } as Partial<ColumnDef<TGenerics>>
+      },
+      {
+        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
+        key: process.env.NODE_ENV === 'development' && 'getDefaultColumnDef',
+      }
+    ),
+
+    _getColumnDefs: () => instance.options.columns,
+
+    getAllColumns: memo(
+      () => [instance._getColumnDefs()],
+      columnDefs => {
+        const recurseColumns = (
+          columnDefs: ColumnDef<TGenerics>[],
+          parent?: Column<TGenerics>,
+          depth = 0
+        ): Column<TGenerics>[] => {
+          return columnDefs.map(columnDef => {
+            const column = createColumn(instance, columnDef, depth, parent)
+
+            column.columns = columnDef.columns
+              ? recurseColumns(columnDef.columns, column, depth + 1)
+              : []
+
+            return column
+          })
+        }
+
+        return recurseColumns(columnDefs)
+      },
+      {
+        key: process.env.NODE_ENV === 'development' && 'getAllColumns',
+        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
+      }
+    ),
+
+    getAllFlatColumns: memo(
+      () => [instance.getAllColumns()],
+      allColumns => {
+        return allColumns.flatMap(column => {
+          return column.getFlatColumns()
+        })
+      },
+      {
+        key: process.env.NODE_ENV === 'development' && 'getAllFlatColumns',
+        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
+      }
+    ),
+
+    _getAllFlatColumnsById: memo(
+      () => [instance.getAllFlatColumns()],
+      flatColumns => {
+        return flatColumns.reduce((acc, column) => {
+          acc[column.id] = column
+          return acc
+        }, {} as Record<string, Column<TGenerics>>)
+      },
+      {
+        key: process.env.NODE_ENV === 'development' && 'getAllFlatColumnsById',
+        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
+      }
+    ),
+
+    getAllLeafColumns: memo(
+      () => [instance.getAllColumns(), instance._getOrderColumnsFn()],
+      (allColumns, orderColumns) => {
+        let leafColumns = allColumns.flatMap(column => column.getLeafColumns())
+        return orderColumns(leafColumns)
+      },
+      {
+        key: process.env.NODE_ENV === 'development' && 'getAllLeafColumns',
+        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
+      }
+    ),
+
+    getColumn: columnId => {
+      const column = instance._getAllFlatColumnsById()[columnId]
+
+      if (!column) {
+        if (process.env.NODE_ENV !== 'production') {
+          console.warn(`[Table] Column with id ${columnId} does not exist.`)
+        }
+        throw new Error()
+      }
+
+      return column
+    },
+  }
+
+  Object.assign(instance, coreInstance)
+
+  instance._features.forEach(feature => {
+    return Object.assign(instance, feature.createInstance?.(instance))
+  })
+
+  return instance
+}

package/src/core/row.ts

@@ -0,0 +1,85 @@
+import { Cell, Row, TableGenerics, TableInstance } from '../types'
+import { flattenBy, memo } from '../utils'
+import { createCell } from './cell'
+
+export type CoreRow<TGenerics extends TableGenerics> = {
+  id: string
+  index: number
+  original?: TGenerics['Row']
+  depth: number
+  _valuesCache: Record<string, any>
+  getValue: (columnId: string) => any
+  subRows: Row<TGenerics>[]
+  getLeafRows: () => Row<TGenerics>[]
+  originalSubRows?: TGenerics['Row'][]
+  getAllCells: () => Cell<TGenerics>[]
+  _getAllCellsByColumnId: () => Record<string, Cell<TGenerics>>
+}
+
+export const createRow = <TGenerics extends TableGenerics>(
+  instance: TableInstance<TGenerics>,
+  id: string,
+  original: TGenerics['Row'] | undefined,
+  rowIndex: number,
+  depth: number,
+  subRows?: Row<TGenerics>[]
+): Row<TGenerics> => {
+  let row: CoreRow<TGenerics> = {
+    id,
+    index: rowIndex,
+    original,
+    depth,
+    _valuesCache: {},
+    getValue: columnId => {
+      if (row._valuesCache.hasOwnProperty(columnId)) {
+        return row._valuesCache[columnId]
+      }
+
+      const column = instance.getColumn(columnId)
+
+      if (!column.accessorFn) {
+        return undefined
+      }
+
+      row._valuesCache[columnId] = column.accessorFn(row.original, rowIndex)
+
+      return row._valuesCache[columnId]
+    },
+    subRows: subRows ?? [],
+    getLeafRows: () => flattenBy(row.subRows, d => d.subRows),
+    getAllCells: memo(
+      () => [instance.getAllLeafColumns()],
+      leafColumns => {
+        return leafColumns.map(column => {
+          return createCell(instance, row as Row<TGenerics>, column, column.id)
+        })
+      },
+      {
+        key: process.env.NODE_ENV === 'development' && 'row.getAllCells',
+        debug: () => instance.options.debugAll ?? instance.options.debugRows,
+      }
+    ),
+
+    _getAllCellsByColumnId: memo(
+      () => [row.getAllCells()],
+      allCells => {
+        return allCells.reduce((acc, cell) => {
+          acc[cell.column.id] = cell
+          return acc
+        }, {} as Record<string, Cell<TGenerics>>)
+      },
+      {
+        key:
+          process.env.NODE_ENV === 'production' && 'row.getAllCellsByColumnId',
+        debug: () => instance.options.debugAll ?? instance.options.debugRows,
+      }
+    ),
+  }
+
+  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>
+}

package/src/createTable.ts

@@ -6,6 +6,7 @@ import {
   AccessorFn,
   AnyRender,
   TableGenerics,
+  TableOptionsResolved,
   TableOptions,
 } from './types'
 import { IfDefined, Overwrite } from './utils'
@@ -26,15 +27,15 @@ export type CreateTableOptions<
     sortingFns?: TSortingFns
     aggregationFns?: TAggregationFns
   } & Omit<
-    TableOptions<TGenerics>,
+    TableOptionsResolved<TGenerics>,
     'filterFns' | 'sortingFns' | 'aggregationFns'
   >
 >
 
 export type Table<TGenerics extends TableGenerics> = {
   generics: TGenerics
-  options: Partial<TableOptions<TGenerics>>
-  setGenerics: <T extends TableGenerics>() => Table<T>
+  options: Partial<TableOptionsResolved<TGenerics>>
+  // setGenerics: <T extends TableGenerics>() => Table<T>
   setRowType: <TRow>() => Table<Overwrite<TGenerics, { Row: TRow }>>
   setTableMetaType: <TTableMeta>() => Table<
     Overwrite<TGenerics, { TableMeta: TTableMeta }>
@@ -42,10 +43,13 @@ export type Table<TGenerics extends TableGenerics> = {
   setColumnMetaType: <TColumnMeta>() => Table<
     Overwrite<TGenerics, { ColumnMeta: TColumnMeta }>
   >
+  setFilterMetaType: <TFilterMeta>() => Table<
+    Overwrite<TGenerics, { FilterMeta: TFilterMeta }>
+  >
   setOptions: <
-    TFilterFns extends Record<string, FilterFn<any>>,
-    TSortingFns extends Record<string, SortingFn<any>>,
-    TAggregationFns extends Record<string, AggregationFn<any>>
+    TFilterFns extends Record<string, FilterFn<TGenerics>>,
+    TSortingFns extends Record<string, SortingFn<TGenerics>>,
+    TAggregationFns extends Record<string, AggregationFn<TGenerics>>
   >(
     options: CreateTableOptions<
       any,
@@ -116,6 +120,7 @@ export type Table<TGenerics extends TableGenerics> = {
       }
     >
   ) => ColumnDef<TGenerics>
+  createOptions: (options: TableOptions<TGenerics>) => TableOptions<TGenerics>
 }
 
 //
@@ -140,10 +145,11 @@ function createTable<TGenerics extends TableGenerics>(
         throw new Error('')
       })(),
     },
-    setGenerics: () => table as any,
+    // setGenerics: () => table as any,
     setRowType: () => table as any,
     setTableMetaType: () => table as any,
     setColumnMetaType: () => table as any,
+    setFilterMetaType: () => table as any,
     setOptions: newOptions =>
       createTable(_, __, {
         ...options,
@@ -175,6 +181,7 @@ function createTable<TGenerics extends TableGenerics>(
 
       throw new Error('Invalid accessor')
     },
+    createOptions: options => options,
   }
 
   return table

package/src/features/ColumnSizing.ts

@@ -1,3 +1,4 @@
+import { TableFeature } from '../core/instance'
 import {
   Column,
   Header,
@@ -5,7 +6,6 @@ import {
   TableGenerics,
   TableInstance,
   Updater,
-  TableFeature,
 } from '../types'
 import { makeStateUpdater } from '../utils'
 import { ColumnPinningPosition } from './Pinning'
@@ -93,7 +93,7 @@ const getDefaultColumnSizingInfoState = (): ColumnSizingInfoState => ({
 })
 
 export const ColumnSizing: TableFeature = {
-  getDefaultColumn: (): ColumnSizingColumnDef => {
+  getDefaultColumnDef: (): ColumnSizingColumnDef => {
     return defaultColumnSizing
   },
   getInitialState: (state): ColumnSizingTableState => {
@@ -124,10 +124,10 @@ export const ColumnSizing: TableFeature = {
 
         return Math.min(
           Math.max(
-            column.minSize ?? defaultColumnSizing.minSize,
-            columnSize ?? column.size ?? defaultColumnSizing.size
+            column.columnDef.minSize ?? defaultColumnSizing.minSize,
+            columnSize ?? column.columnDef.size ?? defaultColumnSizing.size
           ),
-          column.maxSize ?? defaultColumnSizing.maxSize
+          column.columnDef.maxSize ?? defaultColumnSizing.maxSize
         )
       },
       getStart: position => {
@@ -156,7 +156,7 @@ export const ColumnSizing: TableFeature = {
       },
       getCanResize: () => {
         return (
-          (column.enableResizing ?? true) &&
+          (column.columnDef.enableResizing ?? true) &&
           (instance.options.enableColumnResizing ?? true)
         )
       },

package/src/features/Expanding.ts

@@ -1,14 +1,13 @@
 import { RowModel } from '..'
+import { TableFeature } from '../core/instance'
 import {
   OnChangeFn,
   TableGenerics,
   TableInstance,
   Row,
   Updater,
-  TableFeature,
 } from '../types'
 import { makeStateUpdater } from '../utils'
-import { Rows } from './Rows'
 
 export type ExpandedStateList = Record<string, boolean>
 export type ExpandedState = true | Record<string, boolean>

package/src/features/Filters.ts

@@ -1,4 +1,5 @@
 import { RowModel } from '..'
+import { TableFeature } from '../core/instance'
 import { BuiltInFilterFn, filterFns } from '../filterFns'
 import {
   Column,
@@ -7,7 +8,6 @@ import {
   TableInstance,
   Row,
   Updater,
-  TableFeature,
 } from '../types'
 import {
   functionalUpdate,
@@ -38,7 +38,13 @@ export type ResolvedColumnFilter<TGenerics extends TableGenerics> = {
 }
 
 export type FilterFn<TGenerics extends TableGenerics> = {
-  (row: Row<TGenerics>, columnId: string, filterValue: any): boolean
+  (
+    row: Row<TGenerics>,
+    columnId: string,
+    filterValue: any,
+    addMeta: (meta: TGenerics['FilterMeta']) => void
+  ): boolean
+
   resolveFilterValue?: TransformFilterValueFn<TGenerics>
   autoRemove?: ColumnFilterAutoRemoveTestFn<TGenerics>
 }
@@ -90,7 +96,8 @@ export type FiltersColumn<TGenerics extends TableGenerics> = {
 }
 
 export type FiltersRow<TGenerics extends TableGenerics> = {
-  columnFilterMap: Record<string, boolean>
+  columnFilters: Record<string, boolean>
+  columnFiltersMeta: Record<string, TGenerics['FilterMeta']>
   subRowsByFacetId: Record<string, Row<TGenerics>[]>
 }
 
@@ -154,7 +161,7 @@ export type FiltersInstance<TGenerics extends TableGenerics> = {
 //
 
 export const Filters: TableFeature = {
-  getDefaultColumn: <
+  getDefaultColumnDef: <
     TGenerics extends TableGenerics
   >(): FiltersColumnDef<TGenerics> => {
     return {
@@ -183,7 +190,7 @@ export const Filters: TableFeature = {
       getColumnCanGlobalFilter: column => {
         const value = instance
           .getCoreRowModel()
-          .flatRows[0]?.getAllCellsByColumnId()
+          .flatRows[0]?._getAllCellsByColumnId()
           [column.id]?.getValue()
 
         return typeof value === 'string'
@@ -210,6 +217,10 @@ export const Filters: TableFeature = {
           return filterFns.inNumberRange
         }
 
+        if (typeof value === 'boolean') {
+          return filterFns.equals
+        }
+
         if (value !== null && typeof value === 'object') {
           return filterFns.equals
         }
@@ -236,7 +247,7 @@ export const Filters: TableFeature = {
       },
       getCanFilter: () => {
         return (
-          (column.enableColumnFilter ?? true) &&
+          (column.columnDef.enableColumnFilter ?? true) &&
           (instance.options.enableColumnFilters ?? true) &&
           (instance.options.enableFilters ?? true) &&
           !!column.accessorFn
@@ -245,7 +256,7 @@ export const Filters: TableFeature = {
 
       getCanGlobalFilter: () => {
         return (
-          (column.enableGlobalFilter ?? true) &&
+          (column.columnDef.enableGlobalFilter ?? true) &&
           (instance.options.enableGlobalFilter ?? true) &&
           (instance.options.enableFilters ?? true) &&
           (instance.options.getColumnCanGlobalFilter?.(column) ?? true) &&
@@ -343,7 +354,8 @@ export const Filters: TableFeature = {
     instance: TableInstance<TGenerics>
   ): FiltersRow<TGenerics> => {
     return {
-      columnFilterMap: {},
+      columnFilters: {},
+      columnFiltersMeta: {},
       subRowsByFacetId: {},
     }
   },