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

package/src/features/Sorting.ts

@@ -50,18 +50,19 @@ export type SortingColumnDef<TGenerics extends TableGenerics> = {
   sortDescFirst?: boolean
   enableSorting?: boolean
   enableMultiSort?: boolean
-  defaultCanSort?: boolean
   invertSorting?: boolean
   sortUndefined?: false | -1 | 1
 }
 
 export type SortingColumn<TGenerics extends TableGenerics> = {
-  sortingFn: SortingFnOption<Overwrite<TGenerics, { Value: any }>>
+  getAutoSortingFn: () => SortingFn<TGenerics>
+  getAutoSortDir: () => SortDirection
+  getSortingFn: () => SortingFn<TGenerics>
   getCanSort: () => boolean
   getCanMultiSort: () => boolean
   getSortIndex: () => number
   getIsSorted: () => false | SortDirection
-  resetSorting: () => void
+  clearSorting: () => void
   toggleSorting: (desc?: boolean, isMulti?: boolean) => void
   getToggleSortingHandler: () => undefined | ((event: unknown) => void)
 }
@@ -83,25 +84,8 @@ export type SortingOptions<TGenerics extends TableGenerics> = {
 }
 
 export type SortingInstance<TGenerics extends TableGenerics> = {
-  getColumnAutoSortingFn: (columnId: string) => SortingFn<TGenerics> | undefined
-  getColumnAutoSortDir: (columnId: string) => SortDirection
-
-  getColumnSortingFn: (columnId: string) => SortingFn<TGenerics> | undefined
-
   setSorting: (updater: Updater<SortingState>) => void
-  toggleColumnSorting: (
-    columnId: string,
-    desc?: boolean,
-    multi?: boolean
-  ) => void
-  resetSorting: (columnId?: string) => void
-  getColumnCanSort: (columnId: string) => boolean
-  getColumnCanMultiSort: (columnId: string) => boolean
-  getColumnIsSorted: (columnId: string) => false | 'asc' | 'desc'
-  getColumnSortIndex: (columnId: string) => number
-  getToggleSortingHandler: (
-    columnId: string
-  ) => undefined | ((event: unknown) => void)
+  resetSorting: (defaultState?: boolean) => void
   getPreSortedRowModel: () => RowModel<TGenerics>
   getSortedRowModel: () => RowModel<TGenerics>
   _getSortedRowModel?: () => RowModel<TGenerics>
@@ -141,32 +125,13 @@ export const Sorting: TableFeature = {
     instance: TableInstance<TGenerics>
   ): SortingColumn<TGenerics> => {
     return {
-      sortingFn: column.sortingFn,
-      getCanSort: () => instance.getColumnCanSort(column.id),
-      getCanMultiSort: () => instance.getColumnCanMultiSort(column.id),
-      getSortIndex: () => instance.getColumnSortIndex(column.id),
-      getIsSorted: () => instance.getColumnIsSorted(column.id),
-      resetSorting: () => instance.resetSorting(column.id),
-      toggleSorting: (desc, isMulti) =>
-        instance.toggleColumnSorting(column.id, desc, isMulti),
-      getToggleSortingHandler: () =>
-        instance.getToggleSortingHandler(column.id)!,
-    }
-  },
-
-  createInstance: <TGenerics extends TableGenerics>(
-    instance: TableInstance<TGenerics>
-  ): SortingInstance<TGenerics> => {
-    let registered = false
-
-    return {
-      getColumnAutoSortingFn: columnId => {
+      getAutoSortingFn: () => {
         const firstRows = instance.getFilteredRowModel().flatRows.slice(100)
 
         let isString = false
 
         for (const row of firstRows) {
-          const value = row?.values[columnId]
+          const value = row?.getValue(column.id)
 
           if (Object.prototype.toString.call(value) === '[object Date]') {
             return sortingFns.datetime
@@ -187,10 +152,10 @@ export const Sorting: TableFeature = {
 
         return sortingFns.basic
       },
-      getColumnAutoSortDir: columnId => {
+      getAutoSortDir: () => {
         const firstRow = instance.getFilteredRowModel().flatRows[0]
 
-        const value = firstRow?.values[columnId]
+        const value = firstRow?.getValue(column.id)
 
         if (typeof value === 'string') {
           return 'asc'
@@ -198,8 +163,7 @@ export const Sorting: TableFeature = {
 
         return 'desc'
       },
-      getColumnSortingFn: columnId => {
-        const column = instance.getColumn(columnId)
+      getSortingFn: () => {
         const userSortingFn = instance.options.sortingFns
 
         if (!column) {
@@ -209,7 +173,7 @@ export const Sorting: TableFeature = {
         return isFunction(column.sortingFn)
           ? column.sortingFn
           : column.sortingFn === 'auto'
-          ? instance.getColumnAutoSortingFn(columnId)
+          ? column.getAutoSortingFn()
           : (userSortingFn as Record<string, any>)?.[
               column.sortingFn as string
             ] ??
@@ -217,16 +181,7 @@ export const Sorting: TableFeature = {
               column.sortingFn as BuiltInSortingFn
             ] as SortingFn<TGenerics>)
       },
-
-      setSorting: updater => instance.options.onSortingChange?.(updater),
-
-      toggleColumnSorting: (columnId, desc, multi) => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
+      toggleSorting: (desc, multi) => {
         // if (column.columns.length) {
         //   column.columns.forEach((c, i) => {
         //     if (c.id) {
@@ -238,8 +193,8 @@ export const Sorting: TableFeature = {
 
         instance.setSorting(old => {
           // Find any existing sorting for this column
-          const existingSorting = old?.find(d => d.id === columnId)
-          const existingIndex = old?.findIndex(d => d.id === columnId)
+          const existingSorting = old?.find(d => d.id === column.id)
+          const existingIndex = old?.findIndex(d => d.id === column.id)
           const hasDescDefined = typeof desc !== 'undefined' && desc !== null
 
           let newSorting: SortingState = []
@@ -267,7 +222,7 @@ export const Sorting: TableFeature = {
           const sortDescFirst =
             column.sortDescFirst ??
             instance.options.sortDescFirst ??
-            instance.getColumnAutoSortDir(columnId) === 'desc'
+            column.getAutoSortDir() === 'desc'
 
           // Handle toggle states that will remove the sorting
           if (
@@ -285,7 +240,7 @@ export const Sorting: TableFeature = {
           if (sortAction === 'replace') {
             newSorting = [
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -293,7 +248,7 @@ export const Sorting: TableFeature = {
             newSorting = [
               ...old,
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -307,7 +262,7 @@ export const Sorting: TableFeature = {
           } else if (sortAction === 'toggle' && old?.length) {
             // This flips (or sets) the
             newSorting = old.map(d => {
-              if (d.id === columnId) {
+              if (d.id === column.id) {
                 return {
                   ...d,
                   desc: hasDescDefined ? desc! : !existingSorting?.desc,
@@ -316,38 +271,22 @@ export const Sorting: TableFeature = {
               return d
             })
           } else if (sortAction === 'remove' && old?.length) {
-            newSorting = old.filter(d => d.id !== columnId)
+            newSorting = old.filter(d => d.id !== column.id)
           }
 
           return newSorting
         })
       },
 
-      getColumnCanSort: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
+      getCanSort: () => {
         return (
-          column.enableSorting ??
-          instance.options.enableSorting ??
-          column.defaultCanSort ??
+          (column.enableSorting ?? true) &&
+          (instance.options.enableSorting ?? true) &&
           !!column.accessorFn
-          // (!!column.accessorFn ||
-          //   column.columns?.some(c => c.id && instance.getColumnCanSort(c.id))) ??
-          // false
         )
       },
 
-      getColumnCanMultiSort: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
+      getCanMultiSort: () => {
         return (
           column.enableMultiSort ??
           instance.options.enableMultiSort ??
@@ -355,34 +294,25 @@ export const Sorting: TableFeature = {
         )
       },
 
-      getColumnIsSorted: columnId => {
+      getIsSorted: () => {
         const columnSort = instance
           .getState()
-          .sorting?.find(d => d.id === columnId)
+          .sorting?.find(d => d.id === column.id)
 
         return !columnSort ? false : columnSort.desc ? 'desc' : 'asc'
       },
 
-      getColumnSortIndex: columnId =>
-        instance.getState().sorting?.findIndex(d => d.id === columnId) ?? -1,
+      getSortIndex: () =>
+        instance.getState().sorting?.findIndex(d => d.id === column.id) ?? -1,
 
-      resetSorting: (columnId?: string) => {
-        if (columnId) {
-          instance.setSorting(old =>
-            old?.length ? old.filter(d => d.id !== columnId) : []
-          )
-        } else {
-          instance.setSorting(instance.initialState?.sorting ?? [])
-        }
+      clearSorting: () => {
+        //clear sorting for just 1 column
+        instance.setSorting(old =>
+          old?.length ? old.filter(d => d.id !== column.id) : []
+        )
       },
 
-      getToggleSortingHandler: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
+      getToggleSortingHandler: () => {
         const canSort = column.getCanSort()
 
         return (e: unknown) => {
@@ -396,7 +326,21 @@ export const Sorting: TableFeature = {
           )
         }
       },
+    }
+  },
+
+  createInstance: <TGenerics extends TableGenerics>(
+    instance: TableInstance<TGenerics>
+  ): SortingInstance<TGenerics> => {
+    let registered = false
 
+    return {
+      setSorting: updater => instance.options.onSortingChange?.(updater),
+      resetSorting: defaultState => {
+        instance.setSorting(
+          defaultState ? [] : instance.initialState?.sorting ?? []
+        )
+      },
       getPreSortedRowModel: () => instance.getFilteredRowModel(),
       getSortedRowModel: () => {
         if (

package/src/features/Visibility.ts

@@ -32,10 +32,8 @@ export type VisibilityInstance<TGenerics extends TableGenerics> = {
   getRightVisibleLeafColumns: () => Column<TGenerics>[]
   getCenterVisibleLeafColumns: () => Column<TGenerics>[]
   setColumnVisibility: (updater: Updater<VisibilityState>) => void
-  toggleColumnVisibility: (columnId: string, value?: boolean) => void
+  resetColumnVisibility: (defaultState?: boolean) => void
   toggleAllColumnsVisible: (value?: boolean) => void
-  getColumnIsVisible: (columId: string) => boolean
-  getColumnCanHide: (columnId: string) => boolean
   getIsAllColumnsVisible: () => boolean
   getIsSomeColumnsVisible: () => boolean
   getToggleAllColumnsVisibilityHandler: () =>
@@ -45,7 +43,6 @@ export type VisibilityInstance<TGenerics extends TableGenerics> = {
 
 export type VisibilityColumnDef = {
   enableHiding?: boolean
-  defaultCanHide?: boolean
   defaultIsVisible?: boolean
 }
 
@@ -90,10 +87,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?.(
@@ -134,7 +145,7 @@ export const Visibility: TableFeature = {
         ],
         (left, center, right) => [...left, ...center, ...right],
         {
-          key: process.env.NODE_ENV === 'production' && 'row.getVisibleCells',
+          key: process.env.NODE_ENV === 'development' && 'row.getVisibleCells',
           debug: () => instance.options.debugAll ?? instance.options.debugRows,
         }
       ),
@@ -192,15 +203,10 @@ 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),
-          }))
-        }
+      resetColumnVisibility: defaultState => {
+        instance.setColumnVisibility(
+          defaultState ? {} : instance.initialState.columnVisibility ?? {}
+        )
       },
 
       toggleAllColumnsVisible: value => {
@@ -217,35 +223,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

@@ -6,7 +6,7 @@ const includesString: FilterFn<any> = (
   filterValue: string
 ) => {
   const search = filterValue.toLowerCase()
-  return row.values[columnId].toLowerCase().includes(search)
+  return row.getValue(columnId).toLowerCase().includes(search)
 }
 
 includesString.autoRemove = (val: any) => testFalsey(val)
@@ -16,7 +16,7 @@ const includesStringSensitive: FilterFn<any> = (
   columnId: string,
   filterValue: string
 ) => {
-  return row.values[columnId].includes(filterValue)
+  return row.getValue(columnId).includes(filterValue)
 }
 
 includesStringSensitive.autoRemove = (val: any) => testFalsey(val)
@@ -26,7 +26,7 @@ const equalsString: FilterFn<any> = (
   columnId: string,
   filterValue: string
 ) => {
-  return row.values[columnId].toLowerCase() === filterValue.toLowerCase()
+  return row.getValue(columnId).toLowerCase() === filterValue.toLowerCase()
 }
 
 equalsString.autoRemove = (val: any) => testFalsey(val)
@@ -36,7 +36,7 @@ const arrIncludes: FilterFn<any> = (
   columnId: string,
   filterValue: unknown
 ) => {
-  return row.values[columnId].includes(filterValue)
+  return row.getValue(columnId).includes(filterValue)
 }
 
 arrIncludes.autoRemove = (val: any) => testFalsey(val) || !val?.length
@@ -46,7 +46,7 @@ const arrIncludesAll: FilterFn<any> = (
   columnId: string,
   filterValue: unknown[]
 ) => {
-  return !filterValue.some(val => !row.values[columnId].includes(val))
+  return !filterValue.some(val => !row.getValue(columnId).includes(val))
 }
 
 arrIncludesAll.autoRemove = (val: any) => testFalsey(val) || !val?.length
@@ -56,13 +56,13 @@ const arrIncludesSome: FilterFn<any> = (
   columnId: string,
   filterValue: unknown[]
 ) => {
-  return filterValue.some(val => row.values[columnId].includes(val))
+  return filterValue.some(val => row.getValue(columnId).includes(val))
 }
 
 arrIncludesSome.autoRemove = (val: any) => testFalsey(val) || !val?.length
 
 const equals: FilterFn<any> = (row, columnId: string, filterValue: unknown) => {
-  return row.values[columnId] === filterValue
+  return row.getValue(columnId) === filterValue
 }
 
 equals.autoRemove = (val: any) => testFalsey(val)
@@ -72,7 +72,7 @@ const weakEquals: FilterFn<any> = (
   columnId: string,
   filterValue: unknown
 ) => {
-  return row.values[columnId] == filterValue
+  return row.getValue(columnId) == filterValue
 }
 
 weakEquals.autoRemove = (val: any) => testFalsey(val)
@@ -84,7 +84,7 @@ const inNumberRange: FilterFn<any> = (
 ) => {
   let [min, max] = filterValue
 
-  const rowValue = row.values[columnId]
+  const rowValue = row.getValue(columnId)
   return rowValue >= min && rowValue <= max
 }
 

package/src/index.ts

@@ -15,10 +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/getFilteredRowModelSync'
-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,
@@ -107,7 +107,7 @@ export type TableFeature = {
 }
 
 export type TableInstance<TGenerics extends TableGenerics> =
-  TableCore<TGenerics> &
+  CoreInstance<TGenerics> &
     ColumnsInstance<TGenerics> &
     RowsInstance<TGenerics> &
     CellsInstance<TGenerics> &
@@ -214,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']
@@ -228,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
@@ -251,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]