@tanstack/table-core 8.0.0-alpha.64 → 8.0.0-alpha.68

package/src/features/Visibility.ts

@@ -32,10 +32,7 @@ export type VisibilityInstance<TGenerics extends TableGenerics> = {
   getRightVisibleLeafColumns: () => Column<TGenerics>[]
   getCenterVisibleLeafColumns: () => Column<TGenerics>[]
   setColumnVisibility: (updater: Updater<VisibilityState>) => void
-  toggleColumnVisibility: (columnId: string, value?: boolean) => void
   toggleAllColumnsVisible: (value?: boolean) => void
-  getColumnIsVisible: (columId: string) => boolean
-  getColumnCanHide: (columnId: string) => boolean
   getIsAllColumnsVisible: () => boolean
   getIsSomeColumnsVisible: () => boolean
   getToggleAllColumnsVisibilityHandler: () =>
@@ -45,7 +42,6 @@ export type VisibilityInstance<TGenerics extends TableGenerics> = {
 
 export type VisibilityColumnDef = {
   enableHiding?: boolean
-  defaultCanHide?: boolean
   defaultIsVisible?: boolean
 }
 
@@ -90,10 +86,24 @@ export const Visibility: TableFeature = {
     instance: TableInstance<TGenerics>
   ): VisibilityColumn => {
     return {
-      getCanHide: () => instance.getColumnCanHide(column.id),
-      getIsVisible: () => instance.getColumnIsVisible(column.id),
-      toggleVisibility: value =>
-        instance.toggleColumnVisibility(column.id, value),
+      toggleVisibility: value => {
+        if (column.getCanHide()) {
+          instance.setColumnVisibility(old => ({
+            ...old,
+            [column.id]: value ?? !column.getIsVisible(),
+          }))
+        }
+      },
+      getIsVisible: () => {
+        return instance.getState().columnVisibility?.[column.id] ?? true
+      },
+
+      getCanHide: () => {
+        return (
+          (column.enableHiding ?? true) &&
+          (instance.options.enableHiding ?? true)
+        )
+      },
       getToggleVisibilityHandler: () => {
         return (e: unknown) => {
           column.toggleVisibility?.(
@@ -121,7 +131,8 @@ export const Visibility: TableFeature = {
           return row.getAllCells().filter(cell => cell.column.getIsVisible())
         },
         {
-          key: 'row._getAllVisibleCells',
+          key:
+            process.env.NODE_ENV === 'production' && 'row._getAllVisibleCells',
           debug: () => instance.options.debugAll ?? instance.options.debugRows,
         }
       ),
@@ -133,7 +144,7 @@ export const Visibility: TableFeature = {
         ],
         (left, center, right) => [...left, ...center, ...right],
         {
-          key: 'row.getVisibleCells',
+          key: process.env.NODE_ENV === 'development' && 'row.getVisibleCells',
           debug: () => instance.options.debugAll ?? instance.options.debugRows,
         }
       ),
@@ -191,17 +202,6 @@ export const Visibility: TableFeature = {
       setColumnVisibility: updater =>
         instance.options.onColumnVisibilityChange?.(updater),
 
-      toggleColumnVisibility: (columnId, value) => {
-        if (!columnId) return
-
-        if (instance.getColumnCanHide(columnId)) {
-          instance.setColumnVisibility(old => ({
-            ...old,
-            [columnId]: value ?? !instance.getColumnIsVisible(columnId),
-          }))
-        }
-      },
-
       toggleAllColumnsVisible: value => {
         value = value ?? !instance.getIsAllColumnsVisible()
 
@@ -216,35 +216,6 @@ export const Visibility: TableFeature = {
         )
       },
 
-      getColumnIsVisible: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
-        return (
-          instance.getState().columnVisibility?.[columnId] ??
-          column.defaultIsVisible ??
-          true
-        )
-      },
-
-      getColumnCanHide: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
-        return (
-          instance.options.enableHiding ??
-          column.enableHiding ??
-          column.defaultCanHide ??
-          true
-        )
-      },
-
       getIsAllColumnsVisible: () =>
         !instance.getAllLeafColumns().some(column => !column.getIsVisible?.()),
 

package/src/filterFns.ts

@@ -1,179 +1,95 @@
-import { TableGenerics, Row } from './types'
-
-export const filterFns = {
-  includesString,
-  includesStringSensitive,
-  equalsString,
-  equalsStringSensitive,
-  arrIncludes,
-  arrIncludesAll,
-  arrIncludesSome,
-  equals,
-  weakEquals,
-  betweenNumberRange,
-}
-
-export type BuiltInFilterFn = keyof typeof filterFns
-
-function includesString<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
-  filterValue: unknown
-) {
-  const search = String(filterValue).toLowerCase()
-
-  rows = rows.filter(row => {
-    return columnIds.some(id => {
-      return String(row.values[id]).toLowerCase().includes(search)
-    })
-  })
-  return rows
+import { FilterFn } from './features/Filters'
+
+const includesString: FilterFn<any> = (
+  row,
+  columnId: string,
+  filterValue: string
+) => {
+  const search = filterValue.toLowerCase()
+  return row.getValue(columnId).toLowerCase().includes(search)
 }
 
 includesString.autoRemove = (val: any) => testFalsey(val)
 
-function includesStringSensitive<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
-  filterValue: unknown
-) {
-  const search = String(filterValue)
-
-  rows = rows.filter(row => {
-    return columnIds.some(id => {
-      return String(row.values[id]).includes(search)
-    })
-  })
-  return rows
+const includesStringSensitive: FilterFn<any> = (
+  row,
+  columnId: string,
+  filterValue: string
+) => {
+  return row.getValue(columnId).includes(filterValue)
 }
 
 includesStringSensitive.autoRemove = (val: any) => testFalsey(val)
 
-function equalsString<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
-  filterValue: unknown
-) {
-  const search = String(filterValue).toLowerCase()
-
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return rowValue !== undefined
-        ? String(rowValue).toLowerCase() === search
-        : true
-    })
-  })
+const equalsString: FilterFn<any> = (
+  row,
+  columnId: string,
+  filterValue: string
+) => {
+  return row.getValue(columnId).toLowerCase() === filterValue.toLowerCase()
 }
 
 equalsString.autoRemove = (val: any) => testFalsey(val)
 
-function equalsStringSensitive<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
+const arrIncludes: FilterFn<any> = (
+  row,
+  columnId: string,
   filterValue: unknown
-) {
-  const search = String(filterValue)
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return rowValue !== undefined ? String(rowValue) === search : true
-    })
-  })
-}
-
-equalsStringSensitive.autoRemove = (val: any) => testFalsey(val)
-
-function arrIncludes<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
-  filterValue: unknown
-) {
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return rowValue.includes(filterValue)
-    })
-  })
+) => {
+  return row.getValue(columnId).includes(filterValue)
 }
 
 arrIncludes.autoRemove = (val: any) => testFalsey(val) || !val?.length
 
-function arrIncludesAll<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
+const arrIncludesAll: FilterFn<any> = (
+  row,
+  columnId: string,
   filterValue: unknown[]
-) {
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return (
-        rowValue &&
-        rowValue.length &&
-        filterValue.every(val => rowValue.includes(val))
-      )
-    })
-  })
+) => {
+  return !filterValue.some(val => !row.getValue(columnId).includes(val))
 }
 
 arrIncludesAll.autoRemove = (val: any) => testFalsey(val) || !val?.length
 
-function arrIncludesSome<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
+const arrIncludesSome: FilterFn<any> = (
+  row,
+  columnId: string,
   filterValue: unknown[]
-) {
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return (
-        rowValue &&
-        rowValue.length &&
-        filterValue.some(val => rowValue.includes(val))
-      )
-    })
-  })
+) => {
+  return filterValue.some(val => row.getValue(columnId).includes(val))
 }
 
 arrIncludesSome.autoRemove = (val: any) => testFalsey(val) || !val?.length
 
-function equals<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
-  filterValue: unknown
-) {
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return rowValue === filterValue
-    })
-  })
+const equals: FilterFn<any> = (row, columnId: string, filterValue: unknown) => {
+  return row.getValue(columnId) === filterValue
 }
 
 equals.autoRemove = (val: any) => testFalsey(val)
 
-function weakEquals<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
+const weakEquals: FilterFn<any> = (
+  row,
+  columnId: string,
   filterValue: unknown
-) {
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      // eslint-disable-next-line eqeqeq
-      return rowValue == filterValue
-    })
-  })
+) => {
+  return row.getValue(columnId) == filterValue
 }
 
 weakEquals.autoRemove = (val: any) => testFalsey(val)
 
-function betweenNumberRange<TGenerics extends TableGenerics>(
-  rows: Row<TGenerics>[],
-  columnIds: string[],
-  filterValue: [unknown, unknown]
-) {
-  let [unsafeMin, unsafeMax] = filterValue || []
+const inNumberRange: FilterFn<any> = (
+  row,
+  columnId: string,
+  filterValue: [number, number]
+) => {
+  let [min, max] = filterValue
+
+  const rowValue = row.getValue(columnId)
+  return rowValue >= min && rowValue <= max
+}
+
+inNumberRange.resolveFilterValue = (val: [any, any]) => {
+  let [unsafeMin, unsafeMax] = val
 
   let parsedMin =
     typeof unsafeMin !== 'number' ? parseFloat(unsafeMin as string) : unsafeMin
@@ -190,17 +106,28 @@ function betweenNumberRange<TGenerics extends TableGenerics>(
     max = temp
   }
 
-  return rows.filter(row => {
-    return columnIds.some(id => {
-      const rowValue = row.values[id]
-      return rowValue >= min && rowValue <= max
-    })
-  })
+  return [min, max] as const
 }
 
-betweenNumberRange.autoRemove = (val: any) =>
+inNumberRange.autoRemove = (val: any) =>
   testFalsey(val) || (testFalsey(val[0]) && testFalsey(val[1]))
 
+// Export
+
+export const filterFns = {
+  includesString,
+  includesStringSensitive,
+  equalsString,
+  arrIncludes,
+  arrIncludesAll,
+  arrIncludesSome,
+  equals,
+  weakEquals,
+  inNumberRange,
+}
+
+export type BuiltInFilterFn = keyof typeof filterFns
+
 // Utils
 
 function testFalsey(val: any) {

package/src/index.ts

@@ -15,11 +15,18 @@ export * from './features/Sorting'
 export * from './features/Visibility'
 export * from './features/Expanding'
 export * from './utils'
-export * from './utils/getCoreRowModelSync'
-export * from './utils/getCoreRowModelAsync'
-export * from './utils/getColumnFilteredRowModelSync'
-export * from './utils/getGlobalFilteredRowModelSync'
-export * from './utils/getSortedRowModelSync'
+export * from './utils/getCoreRowModel'
+export * from './utils/getFilteredRowModel'
+export * from './utils/getFacetedRowModel'
+export * from './utils/getFacetedUniqueValues'
+export * from './utils/getFacetedMinMaxValues'
+export * from './utils/getSortedRowModel'
 export * from './utils/getGroupedRowModel'
 export * from './utils/getExpandedRowModel'
 export * from './utils/getPaginationRowModel'
+// Experimental Async
+// export * from './utils/getCoreRowModelAsync'
+// export * from './utils/getFilteredRowModelAsync'
+// export * from './utils/getFacetedRowModelAsync'
+// export * from './utils/getFacetedUniqueValuesAsync'
+// export * from './utils/getFacetedMinMaxValuesAsync'

package/src/sortingFns.ts

@@ -19,8 +19,8 @@ function alphanumeric<TGenerics extends TableGenerics>(
   columnId: string
 ) {
   return compareAlphanumeric(
-    toString(rowA.values[columnId]).toLowerCase(),
-    toString(rowB.values[columnId]).toLowerCase()
+    toString(rowA.getValue(columnId)).toLowerCase(),
+    toString(rowB.getValue(columnId)).toLowerCase()
   )
 }
 
@@ -30,8 +30,8 @@ function alphanumericCaseSensitive<TGenerics extends TableGenerics>(
   columnId: string
 ) {
   return compareAlphanumeric(
-    toString(rowA.values[columnId]),
-    toString(rowB.values[columnId])
+    toString(rowA.getValue(columnId)),
+    toString(rowB.getValue(columnId))
   )
 }
 
@@ -90,8 +90,8 @@ function text<TGenerics extends TableGenerics>(
   columnId: string
 ) {
   return compareBasic(
-    toString(rowA.values[columnId]).toLowerCase(),
-    toString(rowB.values[columnId]).toLowerCase()
+    toString(rowA.getValue(columnId)).toLowerCase(),
+    toString(rowB.getValue(columnId)).toLowerCase()
   )
 }
 
@@ -103,8 +103,8 @@ function textCaseSensitive<TGenerics extends TableGenerics>(
   columnId: string
 ) {
   return compareBasic(
-    toString(rowA.values[columnId]),
-    toString(rowB.values[columnId])
+    toString(rowA.getValue(columnId)),
+    toString(rowB.getValue(columnId))
   )
 }
 
@@ -114,8 +114,8 @@ function datetime<TGenerics extends TableGenerics>(
   columnId: string
 ) {
   return compareBasic(
-    (rowA.values[columnId] as Date).getTime(),
-    (rowB.values[columnId] as Date).getTime()
+    (rowA.getValue(columnId) as Date).getTime(),
+    (rowB.getValue(columnId) as Date).getTime()
   )
 }
 
@@ -124,7 +124,7 @@ function basic<TGenerics extends TableGenerics>(
   rowB: Row<TGenerics>,
   columnId: string
 ) {
-  return compareBasic(rowA.values[columnId], rowB.values[columnId])
+  return compareBasic(rowA.getValue(columnId), rowB.getValue(columnId))
 }
 
 // Utils

package/src/types.ts

@@ -1,4 +1,4 @@
-import { CoreOptions, CoreTableState, TableCore } from './core'
+import { CoreOptions, CoreTableState, CoreInstance } from './core'
 import { ColumnsOptions, CoreColumn, CoreColumnDef } from './features/Columns'
 import {
   VisibilityInstance,
@@ -28,6 +28,7 @@ import {
   FiltersColumnDef,
   FiltersInstance,
   FiltersOptions,
+  FiltersRow,
   FiltersTableState,
 } from './features/Filters'
 import {
@@ -106,7 +107,7 @@ export type TableFeature = {
 }
 
 export type TableInstance<TGenerics extends TableGenerics> =
-  TableCore<TGenerics> &
+  CoreInstance<TGenerics> &
     ColumnsInstance<TGenerics> &
     RowsInstance<TGenerics> &
     CellsInstance<TGenerics> &
@@ -167,6 +168,7 @@ export type Row<TGenerics extends TableGenerics> = CoreRow<TGenerics> &
   CellsRow<TGenerics> &
   VisibilityRow<TGenerics> &
   ColumnPinningRow<TGenerics> &
+  FiltersRow<TGenerics> &
   GroupingRow &
   RowSelectionRow &
   ExpandedRow
@@ -212,7 +214,7 @@ export type CoreCell<TGenerics extends TableGenerics> = {
   id: string
   rowId: string
   columnId: string
-  value: TGenerics['Value']
+  getValue: () => TGenerics['Value']
   row: Row<TGenerics>
   column: Column<TGenerics>
   renderCell: () => string | null | TGenerics['Rendered']
@@ -226,8 +228,6 @@ export type CoreHeader<TGenerics extends TableGenerics> = {
   index: number
   depth: number
   column: Column<TGenerics>
-  getStart: () => number
-  getSize: () => number
   headerGroup: HeaderGroup<TGenerics>
   subHeaders: Header<TGenerics>[]
   colSpan?: number
@@ -249,17 +249,4 @@ export type HeaderGroup<TGenerics extends TableGenerics> = {
   headers: Header<TGenerics>[]
 }
 
-export type HeaderRenderProps<THeader> = {
-  header: THeader
-}
-
-export type FooterRenderProps<THeader> = {
-  header: THeader
-}
-
-export type CellRenderProps<TCell, TRow> = {
-  cell: TCell
-  row: TRow
-}
-
 export type NoInfer<A extends any> = [A][A extends any ? 0 : never]