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

package/src/features/RowSelection.ts

@@ -44,25 +44,16 @@ export type RowSelectionRow = {
   getIsSomeSelected: () => boolean
   getCanSelect: () => boolean
   getCanMultiSelect: () => boolean
+  getCanSelectSubRows: () => boolean
   toggleSelected: (value?: boolean) => void
   getToggleSelectedHandler: () => (event: unknown) => void
 }
 
 export type RowSelectionInstance<TGenerics extends TableGenerics> = {
-  getToggleRowSelectedHandler: (
-    rowId: string
-  ) => undefined | ((e: unknown) => void)
   getToggleAllRowsSelectedHandler: () => (event: unknown) => void
   getToggleAllPageRowsSelectedHandler: () => (event: unknown) => void
   setRowSelection: (updater: Updater<RowSelectionState>) => void
   resetRowSelection: () => void
-  toggleRowSelected: (rowId: string, value?: boolean) => void
-  getRowCanSelect: (rowId: string) => boolean
-  getRowCanSelectSubRows: (rowId: string) => boolean
-  getRowCanMultiSelect: (rowId: string) => boolean
-  // getGroupingRowCanSelect: (rowId: string) => boolean
-  getRowIsSelected: (rowId: string) => boolean
-  getRowIsSomeSelected: (rowId: string) => boolean
   getIsAllRowsSelected: () => boolean
   getIsAllPageRowsSelected: () => boolean
   getIsSomeRowsSelected: () => boolean
@@ -148,24 +139,7 @@ export const RowSelection: TableFeature = {
 
           return rowSelection
         }),
-      toggleRowSelected: (rowId, value) => {
-        const row = instance.getRow(rowId)
-        const isSelected = row.getIsSelected()
-
-        instance.setRowSelection(old => {
-          value = typeof value !== 'undefined' ? value : !isSelected
-
-          if (isSelected === value) {
-            return old
-          }
 
-          const selectedRowIds = { ...old }
-
-          mutateRowIsSelected(selectedRowIds, rowId, value, instance)
-
-          return selectedRowIds
-        })
-      },
       // addRowSelectionRange: rowId => {
       //   const {
       //     rows,
@@ -239,7 +213,7 @@ export const RowSelection: TableFeature = {
           return selectRowsFn(instance, rowModel)
         },
         {
-          key: 'getSelectedRowModel',
+          key: process.env.NODE_ENV === 'development' && 'getSelectedRowModel',
           debug: () => instance.options.debugAll ?? instance.options.debugTable,
         }
       ),
@@ -247,7 +221,7 @@ export const RowSelection: TableFeature = {
       getFilteredSelectedRowModel: memo(
         () => [
           instance.getState().rowSelection,
-          instance.getGlobalFilteredRowModel(),
+          instance.getFilteredRowModel(),
         ],
         (rowSelection, rowModel) => {
           if (!Object.keys(rowSelection).length) {
@@ -261,7 +235,9 @@ export const RowSelection: TableFeature = {
           return selectRowsFn(instance, rowModel)
         },
         {
-          key: 'getFilteredSelectedRowModel',
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'getFilteredSelectedRowModel',
           debug: () => instance.options.debugAll ?? instance.options.debugTable,
         }
       ),
@@ -280,77 +256,15 @@ export const RowSelection: TableFeature = {
           return selectRowsFn(instance, rowModel)
         },
         {
-          key: 'getGroupedSelectedRowModel',
+          key:
+            process.env.NODE_ENV === 'production' &&
+            'getGroupedSelectedRowModel',
           debug: () => instance.options.debugAll ?? instance.options.debugTable,
         }
       ),
 
       ///
 
-      getRowIsSelected: rowId => {
-        const { rowSelection } = instance.getState()
-        const row = instance.getRow(rowId)
-
-        if (!row) {
-          throw new Error()
-        }
-
-        return isRowSelected(row, rowSelection, instance) === true
-      },
-
-      getRowIsSomeSelected: rowId => {
-        const { rowSelection } = instance.getState()
-        const row = instance.getRow(rowId)
-
-        if (!row) {
-          throw new Error()
-        }
-
-        return isRowSelected(row, rowSelection, instance) === 'some'
-      },
-
-      getRowCanSelect: rowId => {
-        const row = instance.getRow(rowId)
-
-        if (!row) {
-          throw new Error()
-        }
-
-        if (typeof instance.options.enableRowSelection === 'function') {
-          return instance.options.enableRowSelection(row)
-        }
-
-        return instance.options.enableRowSelection ?? true
-      },
-
-      getRowCanSelectSubRows: rowId => {
-        const row = instance.getRow(rowId)
-
-        if (!row) {
-          throw new Error()
-        }
-
-        if (typeof instance.options.enableSubRowSelection === 'function') {
-          return instance.options.enableSubRowSelection(row)
-        }
-
-        return instance.options.enableSubRowSelection ?? true
-      },
-
-      getRowCanMultiSelect: rowId => {
-        const row = instance.getRow(rowId)
-
-        if (!row) {
-          throw new Error()
-        }
-
-        if (typeof instance.options.enableMultiRowSelection === 'function') {
-          return instance.options.enableMultiRowSelection(row)
-        }
-
-        return instance.options.enableMultiRowSelection ?? true
-      },
-
       // getGroupingRowCanSelect: rowId => {
       //   const row = instance.getRow(rowId)
 
@@ -366,8 +280,7 @@ export const RowSelection: TableFeature = {
       // },
 
       getIsAllRowsSelected: () => {
-        const preFilteredFlatRows =
-          instance.getPreGlobalFilteredRowModel().flatRows
+        const preFilteredFlatRows = instance.getPreFilteredRowModel().flatRows
         const { rowSelection } = instance.getState()
 
         let isAllRowsSelected = Boolean(
@@ -413,21 +326,6 @@ export const RowSelection: TableFeature = {
           : !!paginationFlatRows?.length
       },
 
-      getToggleRowSelectedHandler: rowId => {
-        const row = instance.getRow(rowId)
-
-        const isSelected = row.getIsSelected()
-        const isSomeSelected = row.getIsSomeSelected()
-        const canSelect = row.getCanSelect()
-
-        return (e: unknown) => {
-          if (!canSelect) return
-          row.toggleSelected(
-            ((e as MouseEvent).target as HTMLInputElement)?.checked
-          )
-        }
-      },
-
       getToggleAllRowsSelectedHandler: () => {
         return (e: unknown) => {
           instance.toggleAllRowsSelected(
@@ -451,13 +349,66 @@ export const RowSelection: TableFeature = {
     instance: TableInstance<TGenerics>
   ): RowSelectionRow => {
     return {
-      getIsSelected: () => instance.getRowIsSelected(row.id),
-      getIsSomeSelected: () => instance.getRowIsSomeSelected(row.id),
-      toggleSelected: value => instance.toggleRowSelected(row.id, value),
-      getToggleSelectedHandler: () =>
-        instance.getToggleRowSelectedHandler(row.id)!,
-      getCanMultiSelect: () => instance.getRowCanMultiSelect(row.id),
-      getCanSelect: () => instance.getRowCanSelect(row.id),
+      toggleSelected: value => {
+        const isSelected = row.getIsSelected()
+
+        instance.setRowSelection(old => {
+          value = typeof value !== 'undefined' ? value : !isSelected
+
+          if (isSelected === value) {
+            return old
+          }
+
+          const selectedRowIds = { ...old }
+
+          mutateRowIsSelected(selectedRowIds, row.id, value, instance)
+
+          return selectedRowIds
+        })
+      },
+      getIsSelected: () => {
+        const { rowSelection } = instance.getState()
+        return isRowSelected(row, rowSelection, instance) === true
+      },
+
+      getIsSomeSelected: () => {
+        const { rowSelection } = instance.getState()
+        return isRowSelected(row, rowSelection, instance) === 'some'
+      },
+
+      getCanSelect: () => {
+        if (typeof instance.options.enableRowSelection === 'function') {
+          return instance.options.enableRowSelection(row)
+        }
+
+        return instance.options.enableRowSelection ?? true
+      },
+
+      getCanSelectSubRows: () => {
+        if (typeof instance.options.enableSubRowSelection === 'function') {
+          return instance.options.enableSubRowSelection(row)
+        }
+
+        return instance.options.enableSubRowSelection ?? true
+      },
+
+      getCanMultiSelect: () => {
+        if (typeof instance.options.enableMultiRowSelection === 'function') {
+          return instance.options.enableMultiRowSelection(row)
+        }
+
+        return instance.options.enableMultiRowSelection ?? true
+      },
+      getToggleSelectedHandler: () => {
+        const canSelect = row.getCanSelect()
+
+        return (e: unknown) => {
+          if (!canSelect) return
+          row.toggleSelected(
+            ((e as MouseEvent).target as HTMLInputElement)?.checked
+          )
+        }
+      },
     }
   },
 }
@@ -483,7 +434,7 @@ const mutateRowIsSelected = <TGenerics extends TableGenerics>(
   }
   // }
 
-  if (row.subRows?.length && instance.getRowCanSelectSubRows(row.id)) {
+  if (row.subRows?.length && row.getCanSelectSubRows()) {
     row.subRows.forEach(row =>
       mutateRowIsSelected(selectedRowIds, row.id, value, instance)
     )

package/src/features/Rows.ts

@@ -12,7 +12,8 @@ export type CoreRow<TGenerics extends TableGenerics> = {
   index: number
   original?: TGenerics['Row']
   depth: number
-  values: RowValues
+  valuesCache: Record<string, any>
+  getValue: (columnId: string) => any
   subRows: Row<TGenerics>[]
   getLeafRows: () => Row<TGenerics>[]
   originalSubRows?: TGenerics['Row'][]
@@ -44,7 +45,7 @@ export type RowsInstance<TGenerics extends TableGenerics> = {
     original: TGenerics['Row'] | undefined,
     rowIndex: number,
     depth: number,
-    values: Record<string, any>
+    subRows?: Row<TGenerics>[]
   ) => Row<TGenerics>
   getCoreRowModel: () => RowModel<TGenerics>
   _getCoreRowModel?: () => RowModel<TGenerics>
@@ -73,20 +74,34 @@ export const Rows = {
       ) =>
         instance.options.getRowId?.(row, index, parent) ??
         `${parent ? [parent.id, index].join('.') : index}`,
-      createRow: (id, original, rowIndex, depth, values) => {
+      createRow: (id, original, rowIndex, depth, subRows) => {
         let row: CoreRow<TGenerics> = {
           id,
           index: rowIndex,
           original,
           depth,
-          values,
-          subRows: [],
+          valuesCache: {},
+          getValue: columnId => {
+            if (row.valuesCache.hasOwnProperty(columnId)) {
+              return row.valuesCache[columnId]
+            }
+            const column = instance.getColumn(columnId)
+            if (!column.accessorFn) {
+              throw new Error()
+            }
+            row.valuesCache[columnId] = column.accessorFn(
+              row.original,
+              rowIndex
+            )
+            return row.valuesCache[columnId]
+          },
+          subRows: subRows ?? [],
           getLeafRows: () => flattenBy(row.subRows, d => d.subRows),
         }
 
         for (let i = 0; i < instance._features.length; i++) {
           const feature = instance._features[i]
-          Object.assign(row, feature.createRow?.(row, instance))
+          Object.assign(row, feature?.createRow?.(row, instance))
         }
 
         return row as Row<TGenerics>

package/src/features/Sorting.ts

@@ -50,13 +50,14 @@ 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
@@ -83,25 +84,7 @@ 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)
   getPreSortedRowModel: () => RowModel<TGenerics>
   getSortedRowModel: () => RowModel<TGenerics>
   _getSortedRowModel?: () => RowModel<TGenerics>
@@ -141,34 +124,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 => {
-        const firstRows = instance
-          .getGlobalFilteredRowModel()
-          .flatRows.slice(100)
+      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
@@ -189,10 +151,10 @@ export const Sorting: TableFeature = {
 
         return sortingFns.basic
       },
-      getColumnAutoSortDir: columnId => {
-        const firstRow = instance.getGlobalFilteredRowModel().flatRows[0]
+      getAutoSortDir: () => {
+        const firstRow = instance.getFilteredRowModel().flatRows[0]
 
-        const value = firstRow?.values[columnId]
+        const value = firstRow?.getValue(column.id)
 
         if (typeof value === 'string') {
           return 'asc'
@@ -200,8 +162,7 @@ export const Sorting: TableFeature = {
 
         return 'desc'
       },
-      getColumnSortingFn: columnId => {
-        const column = instance.getColumn(columnId)
+      getSortingFn: () => {
         const userSortingFn = instance.options.sortingFns
 
         if (!column) {
@@ -211,7 +172,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
             ] ??
@@ -219,16 +180,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) {
@@ -240,8 +192,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 = []
@@ -269,7 +221,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 (
@@ -287,7 +239,7 @@ export const Sorting: TableFeature = {
           if (sortAction === 'replace') {
             newSorting = [
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -295,7 +247,7 @@ export const Sorting: TableFeature = {
             newSorting = [
               ...old,
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -309,7 +261,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,
@@ -318,38 +270,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 ??
@@ -357,16 +293,16 @@ 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) {
@@ -378,13 +314,7 @@ export const Sorting: TableFeature = {
         }
       },
 
-      getToggleSortingHandler: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
+      getToggleSortingHandler: () => {
         const canSort = column.getCanSort()
 
         return (e: unknown) => {
@@ -398,8 +328,18 @@ export const Sorting: TableFeature = {
           )
         }
       },
+    }
+  },
+
+  createInstance: <TGenerics extends TableGenerics>(
+    instance: TableInstance<TGenerics>
+  ): SortingInstance<TGenerics> => {
+    let registered = false
+
+    return {
+      setSorting: updater => instance.options.onSortingChange?.(updater),
 
-      getPreSortedRowModel: () => instance.getGlobalFilteredRowModel(),
+      getPreSortedRowModel: () => instance.getFilteredRowModel(),
       getSortedRowModel: () => {
         if (
           !instance._getSortedRowModel &&