@tanstack/react-table 8.0.0-alpha.3 → 8.0.0-alpha.30

package/src/features/Ordering.ts

@@ -1,133 +0,0 @@
-import { functionalUpdate, makeStateUpdater, memo } from '../utils'
-
-import { ReactTable, OnChangeFn, Updater, Column } from '../types'
-
-import * as Grouping from './Grouping'
-
-export type ColumnOrderState = string[]
-
-export type ColumnOrderTableState = {
-  columnOrder: ColumnOrderState
-}
-
-export type ColumnOrderOptions = {
-  onColumnOrderChange?: OnChangeFn<ColumnOrderState>
-}
-
-export type ColumnOrderDefaultOptions = {
-  onColumnOrderChange: OnChangeFn<ColumnOrderState>
-}
-
-export type ColumnOrderInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> = {
-  setColumnOrder: (updater: Updater<ColumnOrderState>) => void
-  resetColumnOrder: () => void
-  getOrderColumnsFn: () => (
-    columns: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>[]
-  ) => Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>[]
-}
-
-//
-
-export function getInitialState(): ColumnOrderTableState {
-  return {
-    columnOrder: [],
-  }
-}
-
-export function getDefaultOptions<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): ColumnOrderDefaultOptions {
-  return {
-    onColumnOrderChange: makeStateUpdater('columnOrder', instance),
-  }
-}
-
-export function getInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): ColumnOrderInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> {
-  return {
-    setColumnOrder: updater =>
-      instance.options.onColumnOrderChange?.(
-        updater,
-        functionalUpdate(updater, instance.getState().columnOrder)
-      ),
-    resetColumnOrder: () => {
-      instance.setColumnOrder(instance.initialState.columnOrder ?? [])
-    },
-    getOrderColumnsFn: memo(
-      () => [
-        instance.getState().columnOrder,
-        instance.getState().grouping,
-        instance.options.groupedColumnMode,
-      ],
-      (columnOrder, grouping, groupedColumnMode) => columns => {
-        // Sort grouped columns to the start of the column list
-        // before the headers are built
-        let orderedColumns: Column<
-          TData,
-          TValue,
-          TFilterFns,
-          TSortingFns,
-          TAggregationFns
-        >[] = []
-
-        // If there is no order, return the normal columns
-        if (!columnOrder?.length) {
-          orderedColumns = columns
-        } else {
-          const columnOrderCopy = [...columnOrder]
-
-          // If there is an order, make a copy of the columns
-          const columnsCopy = [...columns]
-
-          // And make a new ordered array of the columns
-
-          // Loop over the columns and place them in order into the new array
-          while (columnsCopy.length && columnOrderCopy.length) {
-            const targetColumnId = columnOrderCopy.shift()
-            const foundIndex = columnsCopy.findIndex(
-              d => d.id === targetColumnId
-            )
-            if (foundIndex > -1) {
-              orderedColumns.push(columnsCopy.splice(foundIndex, 1)[0]!)
-            }
-          }
-
-          // If there are any columns left, add them to the end
-          orderedColumns = [...orderedColumns, ...columnsCopy]
-        }
-
-        return Grouping.orderColumns(
-          orderedColumns,
-          grouping,
-          groupedColumnMode
-        )
-      },
-      { key: 'getOrderColumnsFn', debug: instance.options.debug }
-    ),
-  }
-}

package/src/features/Pagination.ts

@@ -1,314 +0,0 @@
-import {
-  Column,
-  OnChangeFn,
-  ReactTable,
-  Row,
-  RowModel,
-  TableState,
-  Updater,
-} from '../types'
-import { functionalUpdate, makeStateUpdater, memo } from '../utils'
-
-export type PaginationState = {
-  pageIndex: number
-  pageSize: number
-  pageCount: number
-}
-
-export type PaginationTableState = {
-  pagination: PaginationState
-}
-
-export type PaginationOptions<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> = {
-  onPaginationChange?: OnChangeFn<PaginationState>
-  autoResetPageIndex?: boolean
-  paginateRowsFn?: (
-    instance: ReactTable<
-      TData,
-      TValue,
-      TFilterFns,
-      TSortingFns,
-      TAggregationFns
-    >,
-    rowModel: RowModel<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-  ) => RowModel<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-}
-
-export type PaginationDefaultOptions = {
-  onPaginationChange: OnChangeFn<PaginationState>
-  autoResetPageIndex: boolean
-}
-
-export type PaginationInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> = {
-  _notifyPageIndexReset: () => void
-  setPagination: (updater: Updater<PaginationState>) => void
-  resetPagination: () => void
-  setPageIndex: (updater: Updater<number>) => void
-  resetPageIndex: () => void
-  setPageSize: (updater: Updater<number>) => void
-  resetPageSize: () => void
-  setPageCount: (updater: Updater<number>) => void
-  getPageOptions: () => number[]
-  getCanPreviousPage: () => boolean
-  getCanNextPage: () => boolean
-  gotoPreviousPage: () => void
-  gotoNextPage: () => void
-  getPaginationRowModel: () => RowModel<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >
-  getPrePaginationRows: () => Row<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-  getPrePaginationFlatRows: () => Row<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-  getPrePaginationRowsById: () => Record<
-    string,
-    Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-  >
-  getPaginationRows: () => Row<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-  getPaginationFlatRows: () => Row<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-  getPaginationRowsById: () => Record<
-    string,
-    Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-  >
-}
-
-//
-
-export function getInitialState(): PaginationTableState {
-  return {
-    pagination: {
-      pageIndex: 0,
-      pageSize: 10,
-      pageCount: -1,
-    },
-  }
-}
-
-export function getDefaultOptions<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): PaginationDefaultOptions {
-  return {
-    onPaginationChange: makeStateUpdater('pagination', instance),
-    autoResetPageIndex: true,
-  }
-}
-
-export function getInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): PaginationInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> {
-  let registered = false
-  return {
-    _notifyPageIndexReset: () => {
-      if (!registered) {
-        registered = true
-        return
-      }
-
-      if (instance.options.autoResetAll === false) {
-        return
-      }
-
-      if (
-        instance.options.autoResetAll === true ||
-        instance.options.autoResetPageIndex
-      ) {
-        instance.resetPageSize()
-      }
-    },
-    setPagination: updater => {
-      const safeUpdater: Updater<PaginationState> = old => {
-        const newState = functionalUpdate(old, updater)
-
-        if (!instance.options.paginateRowsFn) {
-          return {
-            ...old,
-            pageCount: instance.getPreExpandedRows()?.length
-              ? Math.ceil(
-                  instance.getPreExpandedRows().length /
-                    instance.getState().pagination.pageSize
-                )
-              : 0,
-          }
-        }
-
-        return old
-      }
-
-      return instance.options.onPaginationChange?.(
-        safeUpdater,
-        functionalUpdate(safeUpdater, instance.getState().pagination)
-      )
-    },
-    resetPagination: () => {
-      instance.setPagination(
-        instance.initialState.pagination ?? {
-          pageIndex: 0,
-          pageSize: 10,
-          pageCount: -1,
-        }
-      )
-    },
-    setPageIndex: updater => {
-      instance.setPagination(old => {
-        const newPageIndex = functionalUpdate(updater, old.pageIndex)
-        const maxPageIndex =
-          old.pageCount > 0 ? old.pageCount - 1 : Number.MAX_SAFE_INTEGER
-
-        return {
-          ...old,
-          pageIndex: Math.min(Math.max(0, newPageIndex), maxPageIndex),
-        }
-      })
-    },
-    resetPageIndex: () => {
-      instance.setPageIndex(0)
-    },
-    resetPageSize: () => {
-      instance.setPageSize(
-        instance.options.initialState?.pagination?.pageSize ?? 10
-      )
-    },
-    setPageSize: updater => {
-      instance.setPagination(old => {
-        const pageSize = Math.max(1, functionalUpdate(updater, old.pageSize))
-        const topRowIndex = old.pageSize * old.pageIndex!
-        const pageIndex = Math.floor(topRowIndex / pageSize)
-
-        return {
-          ...old,
-          pageIndex,
-          pageSize,
-        }
-      })
-    },
-    setPageCount: updater =>
-      instance.setPagination(old => ({
-        ...old,
-        pageCount: Math.max(-1, functionalUpdate(updater, old.pageCount)),
-      })),
-
-    getPageOptions: memo(
-      () => [
-        instance.getState().pagination.pageSize,
-        instance.getState().pagination.pageCount,
-      ],
-      (pageSize, pageCount) => {
-        let pageOptions: number[] = []
-        if (pageCount > 0) {
-          pageOptions = [...new Array(pageCount)].fill(null).map((_, i) => i)
-        }
-        return pageOptions
-      },
-      {
-        key: 'getPageOptions',
-        debug: instance.options.debug,
-      }
-    ),
-
-    getCanPreviousPage: () => instance.getState().pagination.pageIndex > 0,
-
-    getCanNextPage: () => {
-      const { pageIndex, pageCount, pageSize } = instance.getState().pagination
-
-      if (pageCount === -1) {
-        return true
-      }
-
-      if (pageCount === 0) {
-        return false
-      }
-
-      return (
-        pageIndex <
-        Math.ceil(instance.getPrePaginationRows().length / pageSize) - 1
-      )
-    },
-
-    gotoPreviousPage: () => {
-      return instance.setPageIndex?.(old => old! - 1)
-    },
-
-    gotoNextPage: () => {
-      return instance.setPageIndex?.(old => old! + 1)
-    },
-
-    getPaginationRowModel: memo(
-      () => [
-        instance.getState().pagination,
-        instance.getExpandedRowModel(),
-        instance.options.paginateRowsFn,
-      ],
-      (_pagination, rowModel, paginateRowsFn) => {
-        if (!paginateRowsFn || !rowModel.rows.length) {
-          return rowModel
-        }
-
-        if (process.env.NODE_ENV !== 'production' && instance.options.debug)
-          console.info('Paginating...')
-
-        return paginateRowsFn(instance, rowModel)
-      },
-      {
-        key: 'getPaginationRowModel',
-        debug: instance.options.debug,
-      }
-    ),
-
-    getPrePaginationRows: () => instance.getExpandedRowModel().rows,
-    getPrePaginationFlatRows: () => instance.getExpandedRowModel().flatRows,
-    getPrePaginationRowsById: () => instance.getExpandedRowModel().rowsById,
-    getPaginationRows: () => instance.getPaginationRowModel().rows,
-    getPaginationFlatRows: () => instance.getPaginationRowModel().flatRows,
-    getPaginationRowsById: () => instance.getPaginationRowModel().rowsById,
-  }
-}

package/src/features/Pinning.ts

@@ -1,200 +0,0 @@
-import { OnChangeFn, Updater, ReactTable, Column } from '../types'
-import { functionalUpdate, makeStateUpdater } from '../utils'
-
-type ColumnPinningPosition = false | 'left' | 'right'
-
-export type ColumnPinningState = {
-  left?: string[]
-  right?: string[]
-}
-
-export type ColumnPinningTableState = {
-  columnPinning: ColumnPinningState
-}
-
-export type ColumnPinningOptions = {
-  onColumnPinningChange?: OnChangeFn<ColumnPinningState>
-  enablePinning?: boolean
-}
-
-export type ColumnPinningDefaultOptions = {
-  onColumnPinningChange: OnChangeFn<ColumnPinningState>
-}
-
-export type ColumnPinningColumnDef = {
-  enablePinning?: boolean
-  defaultCanPin?: boolean
-}
-
-export type ColumnPinningColumn = {
-  getCanPin: () => boolean
-  getPinnedIndex: () => number
-  getIsPinned: () => ColumnPinningPosition
-  pin: (position: ColumnPinningPosition) => void
-}
-
-export type ColumnPinningInstance<
-  _TData,
-  _TValue,
-  _TFilterFns,
-  _TSortingFns,
-  _TAggregationFns
-> = {
-  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
-}
-
-//
-
-export function getInitialState(): ColumnPinningTableState {
-  return {
-    columnPinning: {
-      left: [],
-      right: [],
-    },
-  }
-}
-
-export function getDefaultOptions<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): ColumnPinningDefaultOptions {
-  return {
-    onColumnPinningChange: makeStateUpdater('columnPinning', instance),
-  }
-}
-
-export function createColumn<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  column: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>,
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): ColumnPinningColumn {
-  return {
-    getCanPin: () => instance.getColumnCanPin(column.id),
-    getPinnedIndex: () => instance.getColumnPinnedIndex(column.id),
-    getIsPinned: () => instance.getColumnIsPinned(column.id),
-    pin: position => instance.pinColumn(column.id, position),
-  }
-}
-
-export function getInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): ColumnPinningInstance<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> {
-  return {
-    setColumnPinning: updater =>
-      instance.options.onColumnPinningChange?.(
-        updater,
-        functionalUpdate(updater, instance.getState().columnPinning)
-      ),
-
-    resetColumnPinning: () =>
-      instance.setColumnPinning(
-        instance.options.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 ??
-          instance.options.enablePinning ??
-          d.defaultCanPin ??
-          !!d.accessorFn
-      )
-    },
-
-    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
-    },
-  }
-}