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

package/src/features/Sorting.ts

@@ -12,6 +12,7 @@ import {
   TableInstance,
   Row,
   Updater,
+  TableFeature,
 } from '../types'
 
 import { isFunction, makeStateUpdater, Overwrite } from '../utils'
@@ -49,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
@@ -82,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>
@@ -108,18 +92,19 @@ export type SortingInstance<TGenerics extends TableGenerics> = {
 
 //
 
-export const Sorting = {
-  getDefaultColumn: <
-    TGenerics extends TableGenerics
-  >(): SortingColumnDef<TGenerics> => {
+export const Sorting: TableFeature = {
+  getInitialState: (state): SortingTableState => {
     return {
-      sortingFn: 'auto',
+      sorting: [],
+      ...state,
     }
   },
 
-  getInitialState: (): SortingTableState => {
+  getDefaultColumn: <
+    TGenerics extends TableGenerics
+  >(): SortingColumnDef<TGenerics> => {
     return {
-      sorting: [],
+      sortingFn: 'auto',
     }
   },
 
@@ -139,34 +124,13 @@ export const Sorting = {
     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?.values[column.id]
 
           if (Object.prototype.toString.call(value) === '[object Date]') {
             return sortingFns.datetime
@@ -187,10 +151,10 @@ export const Sorting = {
 
         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?.values[column.id]
 
         if (typeof value === 'string') {
           return 'asc'
@@ -198,8 +162,7 @@ export const Sorting = {
 
         return 'desc'
       },
-      getColumnSortingFn: columnId => {
-        const column = instance.getColumn(columnId)
+      getSortingFn: () => {
         const userSortingFn = instance.options.sortingFns
 
         if (!column) {
@@ -209,7 +172,7 @@ export const Sorting = {
         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 = {
               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 = {
 
         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 = {
           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 = {
           if (sortAction === 'replace') {
             newSorting = [
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -293,7 +247,7 @@ export const Sorting = {
             newSorting = [
               ...old,
               {
-                id: columnId,
+                id: column.id,
                 desc: hasDescDefined ? desc! : !!sortDescFirst,
               },
             ]
@@ -307,7 +261,7 @@ export const Sorting = {
           } 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 = {
               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 = {
         )
       },
 
-      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 = {
         }
       },
 
-      getToggleSortingHandler: columnId => {
-        const column = instance.getColumn(columnId)
-
-        if (!column) {
-          throw new Error()
-        }
-
+      getToggleSortingHandler: () => {
         const canSort = column.getCanSort()
 
         return (e: unknown) => {
@@ -396,8 +328,18 @@ export const Sorting = {
           )
         }
       },
+    }
+  },
+
+  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 &&

package/src/features/Visibility.ts

@@ -6,6 +6,7 @@ import {
   TableInstance,
   Updater,
   Row,
+  TableFeature,
 } from '../types'
 import { makeStateUpdater, memo } from '../utils'
 
@@ -31,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: () =>
@@ -44,7 +42,6 @@ export type VisibilityInstance<TGenerics extends TableGenerics> = {
 
 export type VisibilityColumnDef = {
   enableHiding?: boolean
-  defaultCanHide?: boolean
   defaultIsVisible?: boolean
 }
 
@@ -62,10 +59,11 @@ export type VisibilityColumn = {
 
 //
 
-export const Visibility = {
-  getInitialState: (): VisibilityTableState => {
+export const Visibility: TableFeature = {
+  getInitialState: (state): VisibilityTableState => {
     return {
       columnVisibility: {},
+      ...state,
     }
   },
 
@@ -88,10 +86,24 @@ export const Visibility = {
     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?.(
@@ -119,7 +131,8 @@ export const Visibility = {
           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,
         }
       ),
@@ -131,7 +144,7 @@ export const Visibility = {
         ],
         (left, center, right) => [...left, ...center, ...right],
         {
-          key: 'row.getVisibleCells',
+          key: process.env.NODE_ENV === 'development' && 'row.getVisibleCells',
           debug: () => instance.options.debugAll ?? instance.options.debugRows,
         }
       ),
@@ -189,17 +202,6 @@ export const Visibility = {
       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()
 
@@ -214,35 +216,6 @@ export const Visibility = {
         )
       },
 
-      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?.()),