@tanstack/react-table 8.0.0-alpha.1 → 8.0.0-alpha.11

package/src/features/Ordering.ts

@@ -1,134 +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: string[]
-}
-
-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
-        )
-      },
-      'getOrderColumnsFn',
-      instance.options.debug
-    ),
-  }
-}

package/src/features/Pinning.ts

@@ -1,213 +0,0 @@
-import { OnChangeFn, Updater, ReactTable, Column } from '../types'
-import { functionalUpdate, makeStateUpdater } from '../utils'
-
-type ColumnPinningPosition = 'left' | 'right' | 'both'
-
-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: () => false | 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) => false | 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))
-
-      if (isLeft && isRight) {
-        return 'both'
-      }
-
-      return isLeft ? 'left' : isRight ? 'right' : false
-    },
-
-    getColumnPinnedIndex: columnId => {
-      const position = instance.getColumnIsPinned(columnId)
-
-      if (position === 'both') {
-        if (process.env.NODE_ENV !== 'production') {
-          console.warn(
-            `Column ${columnId} has leaf columns that are pinned on both sides`
-          )
-        }
-        throw new Error()
-      }
-
-      return position
-        ? instance.getState().columnPinning?.[position]?.indexOf(columnId) ?? -1
-        : 0
-    },
-  }
-}