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

package/src/features/Pinning.ts

@@ -50,10 +50,6 @@ export type ColumnPinningRow<TGenerics extends TableGenerics> = {
 export type ColumnPinningInstance<TGenerics extends TableGenerics> = {
   setColumnPinning: (updater: Updater<ColumnPinningState>) => void
   resetColumnPinning: () => void
-  pinColumn: (columnId: string, position: ColumnPinningPosition) => void
-  getColumnCanPin: (columnId: string) => boolean
-  getColumnIsPinned: (columnId: string) => ColumnPinningPosition
-  getColumnPinnedIndex: (columnId: string) => number
   getIsSomeColumnsPinned: () => boolean
   getLeftLeafColumns: () => Column<TGenerics>[]
   getRightLeafColumns: () => Column<TGenerics>[]
@@ -86,10 +82,69 @@ export const Pinning: TableFeature = {
     instance: TableInstance<TGenerics>
   ): ColumnPinningColumn => {
     return {
-      getCanPin: () => instance.getColumnCanPin(column.id),
-      getPinnedIndex: () => instance.getColumnPinnedIndex(column.id),
-      getIsPinned: () => instance.getColumnIsPinned(column.id),
-      pin: position => instance.pinColumn(column.id, position),
+      pin: position => {
+        const columnIds = column
+          .getLeafColumns()
+          .map(d => d.id)
+          .filter(Boolean) as string[]
+
+        instance.setColumnPinning(old => {
+          if (position === 'right') {
+            return {
+              left: (old?.left ?? []).filter(d => !columnIds?.includes(d)),
+              right: [
+                ...(old?.right ?? []).filter(d => !columnIds?.includes(d)),
+                ...columnIds,
+              ],
+            }
+          }
+
+          if (position === 'left') {
+            return {
+              left: [
+                ...(old?.left ?? []).filter(d => !columnIds?.includes(d)),
+                ...columnIds,
+              ],
+              right: (old?.right ?? []).filter(d => !columnIds?.includes(d)),
+            }
+          }
+
+          return {
+            left: (old?.left ?? []).filter(d => !columnIds?.includes(d)),
+            right: (old?.right ?? []).filter(d => !columnIds?.includes(d)),
+          }
+        })
+      },
+
+      getCanPin: () => {
+        const leafColumns = column.getLeafColumns()
+
+        return leafColumns.some(
+          d =>
+            (d.enablePinning ?? true) &&
+            (instance.options.enablePinning ?? true)
+        )
+      },
+
+      getIsPinned: () => {
+        const leafColumnIds = column.getLeafColumns().map(d => d.id)
+
+        const { left, right } = instance.getState().columnPinning
+
+        const isLeft = leafColumnIds.some(d => left?.includes(d))
+        const isRight = leafColumnIds.some(d => right?.includes(d))
+
+        return isLeft ? 'left' : isRight ? 'right' : false
+      },
+
+      getPinnedIndex: () => {
+        const position = column.getIsPinned()
+
+        return position
+          ? instance.getState().columnPinning?.[position]?.indexOf(column.id) ??
+              -1
+          : 0
+      },
     }
   },
 
@@ -168,84 +223,6 @@ export const Pinning: TableFeature = {
       resetColumnPinning: () =>
         instance.setColumnPinning(instance.initialState?.columnPinning ?? {}),
 
-      pinColumn: (columnId, position) => {
-        const column = instance.getColumn(columnId)
-
-        const columnIds = column
-          ?.getLeafColumns()
-          .map(d => d.id)
-          .filter(Boolean) as string[]
-
-        instance.setColumnPinning(old => {
-          if (position === 'right') {
-            return {
-              left: (old?.left ?? []).filter(d => !columnIds?.includes(d)),
-              right: [
-                ...(old?.right ?? []).filter(d => !columnIds?.includes(d)),
-                ...columnIds,
-              ],
-            }
-          }
-
-          if (position === 'left') {
-            return {
-              left: [
-                ...(old?.left ?? []).filter(d => !columnIds?.includes(d)),
-                ...columnIds,
-              ],
-              right: (old?.right ?? []).filter(d => !columnIds?.includes(d)),
-            }
-          }
-
-          return {
-            left: (old?.left ?? []).filter(d => !columnIds?.includes(d)),
-            right: (old?.right ?? []).filter(d => !columnIds?.includes(d)),
-          }
-        })
-      },
-
-      getColumnCanPin: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
-        const leafColumns = column.getLeafColumns()
-
-        return leafColumns.some(
-          d =>
-            (d.enablePinning ?? true) &&
-            (instance.options.enablePinning ?? true)
-        )
-      },
-
-      getColumnIsPinned: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
-        const leafColumnIds = column.getLeafColumns().map(d => d.id)
-
-        const { left, right } = instance.getState().columnPinning
-
-        const isLeft = leafColumnIds.some(d => left?.includes(d))
-        const isRight = leafColumnIds.some(d => right?.includes(d))
-
-        return isLeft ? 'left' : isRight ? 'right' : false
-      },
-
-      getColumnPinnedIndex: columnId => {
-        const position = instance.getColumnIsPinned(columnId)
-
-        return position
-          ? instance.getState().columnPinning?.[position]?.indexOf(columnId) ??
-              -1
-          : 0
-      },
-
       getIsSomeColumnsPinned: () => {
         const { left, right } = instance.getState().columnPinning
 
@@ -263,7 +240,7 @@ export const Pinning: TableFeature = {
             .filter(Boolean)
         },
         {
-          key: process.env.NODE_ENV === 'production' && 'getLeftLeafColumns',
+          key: process.env.NODE_ENV === 'development' && 'getLeftLeafColumns',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }
@@ -280,7 +257,7 @@ export const Pinning: TableFeature = {
             .filter(Boolean)
         },
         {
-          key: process.env.NODE_ENV === 'production' && 'getRightLeafColumns',
+          key: process.env.NODE_ENV === 'development' && 'getRightLeafColumns',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }
@@ -298,7 +275,7 @@ export const Pinning: TableFeature = {
           return allColumns.filter(d => !leftAndRight.includes(d.id))
         },
         {
-          key: process.env.NODE_ENV === 'production' && 'getCenterLeafColumns',
+          key: process.env.NODE_ENV === 'development' && 'getCenterLeafColumns',
           debug: () =>
             instance.options.debugAll ?? instance.options.debugColumns,
         }

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: process.env.NODE_ENV === 'production' && 'getSelectedRowModel',
+          key: process.env.NODE_ENV === 'development' && 'getSelectedRowModel',
           debug: () => instance.options.debugAll ?? instance.options.debugTable,
         }
       ),
@@ -291,70 +265,6 @@ export const RowSelection: TableFeature = {
 
       ///
 
-      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)
 
@@ -416,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(
@@ -454,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
+          )
+        }
+      },
     }
   },
 }
@@ -486,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/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,32 +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 => {
+      getAutoSortingFn: () => {
         const firstRows = instance.getFilteredRowModel().flatRows.slice(100)
 
         let isString = false
 
         for (const row of firstRows) {
-          const value = row?.values[columnId]
+          const value = row?.values[column.id]
 
           if (Object.prototype.toString.call(value) === '[object Date]') {
             return sortingFns.datetime
@@ -187,10 +151,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?.values[column.id]
 
         if (typeof value === 'string') {
           return 'asc'
@@ -198,8 +162,7 @@ export const Sorting: TableFeature = {
 
         return 'desc'
       },
-      getColumnSortingFn: columnId => {
-        const column = instance.getColumn(columnId)
+      getSortingFn: () => {
         const userSortingFn = instance.options.sortingFns
 
         if (!column) {
@@ -209,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
             ] ??
@@ -217,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) {
@@ -238,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 = []
@@ -267,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 (
@@ -285,7 +239,7 @@ export const Sorting: TableFeature = {
           if (sortAction === 'replace') {
             newSorting = [
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -293,7 +247,7 @@ export const Sorting: TableFeature = {
             newSorting = [
               ...old,
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -307,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,
@@ -316,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 ??
@@ -355,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) {
@@ -376,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) => {
@@ -396,6 +328,16 @@ 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.getFilteredRowModel(),
       getSortedRowModel: () => {