@tanstack/react-table 8.0.0-alpha.9 → 8.0.0-beta.2

package/src/features/Sorting.ts

@@ -1,453 +0,0 @@
-import { MouseEvent, TouchEvent } from 'react'
-import { RowModel } from '..'
-import { BuiltInSortType, reSplitAlphaNumeric, sortTypes } from '../sortTypes'
-
-import {
-  Column,
-  Getter,
-  Header,
-  OnChangeFn,
-  PartialGenerics,
-  PropGetterValue,
-  TableInstance,
-  Row,
-  Updater,
-} from '../types'
-
-import {
-  functionalUpdate,
-  isFunction,
-  makeStateUpdater,
-  memo,
-  Overwrite,
-  propGetter,
-} from '../utils'
-
-export type SortDirection = 'asc' | 'desc'
-
-export type ColumnSort = {
-  id: string
-  desc: boolean
-}
-
-export type SortingState = ColumnSort[]
-
-export type SortingFn<TGenerics extends PartialGenerics> = {
-  (rowA: Row<TGenerics>, rowB: Row<TGenerics>, columnId: string): number
-}
-
-export type CustomSortingTypes<TGenerics extends PartialGenerics> = Record<
-  string,
-  SortingFn<TGenerics>
->
-
-export type SortingTableState = {
-  sorting: SortingState
-}
-
-export type SortType<TGenerics extends PartialGenerics> =
-  | 'auto'
-  | BuiltInSortType
-  | keyof TGenerics['SortingFns']
-  | SortingFn<TGenerics>
-
-export type SortingColumnDef<TGenerics extends PartialGenerics> = {
-  sortType?: SortType<Overwrite<TGenerics, { Value: any }>>
-  sortDescFirst?: boolean
-  enableSorting?: boolean
-  enableMultiSort?: boolean
-  defaultCanSort?: boolean
-  invertSorting?: boolean
-  sortUndefined?: false | -1 | 1
-}
-
-export type SortingColumn<TGenerics extends PartialGenerics> = {
-  sortType: SortType<Overwrite<TGenerics, { Value: any }>>
-  getCanSort: () => boolean
-  getCanMultiSort: () => boolean
-  getSortIndex: () => number
-  getIsSorted: () => false | SortDirection
-  toggleSorting: (desc?: boolean, isMulti?: boolean) => void
-  getToggleSortingProps: <TGetter extends Getter<ToggleSortingProps>>(
-    userProps?: TGetter
-  ) => undefined | PropGetterValue<ToggleSortingProps, TGetter>
-}
-
-export type SortingOptions<TGenerics extends PartialGenerics> = {
-  sortTypes?: TGenerics['SortingFns']
-  onSortingChange?: OnChangeFn<SortingState>
-  autoResetSorting?: boolean
-  enableSorting?: boolean
-  enableSortingRemoval?: boolean
-  enableMultiRemove?: boolean
-  enableMultiSort?: boolean
-  sortDescFirst?: boolean
-  sortRowsFn?: (
-    instance: TableInstance<TGenerics>,
-    rowModel: RowModel<TGenerics>
-  ) => RowModel<TGenerics>
-  maxMultiSortColCount?: number
-  isMultiSortEvent?: (e: MouseEvent | TouchEvent) => boolean
-}
-
-export type ToggleSortingProps = {
-  title?: string
-  onClick?: (event: MouseEvent | TouchEvent) => void
-}
-
-export type SortingInstance<TGenerics extends PartialGenerics> = {
-  _notifySortingReset: () => void
-  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: () => void
-  getColumnCanSort: (columnId: string) => boolean
-  getColumnCanMultiSort: (columnId: string) => boolean
-  getColumnIsSorted: (columnId: string) => false | 'asc' | 'desc'
-  getColumnSortIndex: (columnId: string) => number
-  getToggleSortingProps: <TGetter extends Getter<ToggleSortingProps>>(
-    columnId: string,
-    userProps?: TGetter
-  ) => undefined | PropGetterValue<ToggleSortingProps, TGetter>
-  getPreSortedRowModel: () => RowModel<TGenerics>
-  getSortedRowModel: () => RowModel<TGenerics>
-}
-
-//
-
-export function getDefaultColumn<
-  TGenerics extends PartialGenerics
->(): SortingColumnDef<TGenerics> {
-  return {
-    sortType: 'auto',
-  }
-}
-
-export function getInitialState(): SortingTableState {
-  return {
-    sorting: [],
-  }
-}
-
-export function getDefaultOptions<TGenerics extends PartialGenerics>(
-  instance: TableInstance<TGenerics>
-): SortingOptions<TGenerics> {
-  return {
-    onSortingChange: makeStateUpdater('sorting', instance),
-    autoResetSorting: true,
-    isMultiSortEvent: (e: MouseEvent | TouchEvent) => {
-      return e.shiftKey
-    },
-  }
-}
-
-export function createColumn<TGenerics extends PartialGenerics>(
-  column: Column<TGenerics>,
-  instance: TableInstance<TGenerics>
-): SortingColumn<TGenerics> {
-  return {
-    sortType: column.sortType,
-    getCanSort: () => instance.getColumnCanSort(column.id),
-    getCanMultiSort: () => instance.getColumnCanMultiSort(column.id),
-    getSortIndex: () => instance.getColumnSortIndex(column.id),
-    getIsSorted: () => instance.getColumnIsSorted(column.id),
-    toggleSorting: (desc, isMulti) =>
-      instance.toggleColumnSorting(column.id, desc, isMulti),
-    getToggleSortingProps: userProps =>
-      instance.getToggleSortingProps(column.id, userProps),
-  }
-}
-
-export function getInstance<TGenerics extends PartialGenerics>(
-  instance: TableInstance<TGenerics>
-): SortingInstance<TGenerics> {
-  let registered = false
-
-  return {
-    _notifySortingReset: () => {
-      if (!registered) {
-        registered = true
-        return
-      }
-
-      if (instance.options.autoResetAll === false) {
-        return
-      }
-
-      if (
-        instance.options.autoResetAll === true ||
-        instance.options.autoResetSorting
-      ) {
-        instance.resetSorting()
-      }
-    },
-    getColumnAutoSortingFn: columnId => {
-      const firstRows = instance.getGlobalFilteredRowModel().flatRows.slice(100)
-
-      let isString = false
-
-      for (const row of firstRows) {
-        const value = row?.values[columnId]
-
-        if (Object.prototype.toString.call(value) === '[object Date]') {
-          return sortTypes.datetime
-        }
-
-        if (typeof value === 'string') {
-          isString = true
-
-          if (value.split(reSplitAlphaNumeric).length > 1) {
-            return sortTypes.alphanumeric
-          }
-        }
-      }
-
-      if (isString) {
-        return sortTypes.text
-      }
-
-      return sortTypes.basic
-    },
-    getColumnAutoSortDir: columnId => {
-      const firstRow = instance.getGlobalFilteredRowModel().flatRows[0]
-
-      const value = firstRow?.values[columnId]
-
-      if (typeof value === 'string') {
-        return 'asc'
-      }
-
-      return 'desc'
-    },
-    getColumnSortingFn: columnId => {
-      const column = instance.getColumn(columnId)
-      const userSortTypes = instance.options.sortTypes
-
-      if (!column) {
-        throw new Error()
-      }
-
-      return isFunction(column.sortType)
-        ? column.sortType
-        : column.sortType === 'auto'
-        ? instance.getColumnAutoSortingFn(columnId)
-        : (userSortTypes as Record<string, any>)?.[column.sortType as string] ??
-          (sortTypes[
-            column.sortType as BuiltInSortType
-          ] as SortingFn<TGenerics>)
-    },
-
-    setSorting: updater =>
-      instance.options.onSortingChange?.(
-        updater,
-        functionalUpdate(updater, instance.getState().sorting)
-      ),
-
-    toggleColumnSorting: (columnId, desc, multi) => {
-      const column = instance.getColumn(columnId)
-
-      if (!column) {
-        throw new Error()
-      }
-
-      // if (column.columns.length) {
-      //   column.columns.forEach((c, i) => {
-      //     if (c.id) {
-      //       instance.toggleColumnSorting(c.id, undefined, multi || !!i)
-      //     }
-      //   })
-      //   return
-      // }
-
-      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 hasDescDefined = typeof desc !== 'undefined' && desc !== null
-
-        let newSorting: SortingState = []
-
-        // What should we do with this sort action?
-        let sortAction
-
-        if (column.getCanMultiSort() && multi) {
-          if (existingSorting) {
-            sortAction = 'toggle'
-          } else {
-            sortAction = 'add'
-          }
-        } else {
-          // Normal mode
-          if (old?.length && existingIndex !== old.length - 1) {
-            sortAction = 'replace'
-          } else if (existingSorting) {
-            sortAction = 'toggle'
-          } else {
-            sortAction = 'replace'
-          }
-        }
-
-        const sortDescFirst =
-          column.sortDescFirst ??
-          instance.options.sortDescFirst ??
-          instance.getColumnAutoSortDir(columnId) === 'desc'
-
-        // Handle toggle states that will remove the sorting
-        if (
-          sortAction === 'toggle' && // Must be toggling
-          (instance.options.enableSortingRemoval ?? true) && // If enableSortRemove, enable in general
-          !hasDescDefined && // Must not be setting desc
-          (multi ? instance.options.enableMultiRemove ?? true : true) && // If multi, don't allow if enableMultiRemove
-          (existingSorting?.desc // Finally, detect if it should indeed be removed
-            ? !sortDescFirst
-            : sortDescFirst)
-        ) {
-          sortAction = 'remove'
-        }
-
-        if (sortAction === 'replace') {
-          newSorting = [
-            {
-              id: columnId,
-              desc: hasDescDefined ? desc! : !!sortDescFirst,
-            },
-          ]
-        } else if (sortAction === 'add' && old?.length) {
-          newSorting = [
-            ...old,
-            {
-              id: columnId,
-              desc: hasDescDefined ? desc! : !!sortDescFirst,
-            },
-          ]
-          // Take latest n columns
-          newSorting.splice(
-            0,
-            newSorting.length -
-              (instance.options.maxMultiSortColCount ?? Number.MAX_SAFE_INTEGER)
-          )
-        } else if (sortAction === 'toggle' && old?.length) {
-          // This flips (or sets) the
-          newSorting = old.map(d => {
-            if (d.id === columnId) {
-              return {
-                ...d,
-                desc: hasDescDefined ? desc! : !existingSorting?.desc,
-              }
-            }
-            return d
-          })
-        } else if (sortAction === 'remove' && old?.length) {
-          newSorting = old.filter(d => d.id !== columnId)
-        }
-
-        return newSorting
-      })
-    },
-
-    getColumnCanSort: columnId => {
-      const column = instance.getColumn(columnId)
-
-      if (!column) {
-        throw new Error()
-      }
-
-      return (
-        column.enableSorting ??
-        instance.options.enableSorting ??
-        column.defaultCanSort ??
-        !!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()
-      }
-
-      return (
-        column.enableMultiSort ??
-        instance.options.enableMultiSort ??
-        !!column.accessorFn
-      )
-    },
-
-    getColumnIsSorted: columnId => {
-      const columnSort = instance
-        .getState()
-        .sorting?.find(d => d.id === columnId)
-
-      return !columnSort ? false : columnSort.desc ? 'desc' : 'asc'
-    },
-
-    getColumnSortIndex: columnId =>
-      instance.getState().sorting?.findIndex(d => d.id === columnId) ?? -1,
-
-    resetSorting: () => {
-      instance.setSorting(instance.initialState?.sorting ?? [])
-    },
-
-    getToggleSortingProps: (columnId, userProps) => {
-      const column = instance.getColumn(columnId)
-
-      if (!column) {
-        throw new Error()
-      }
-
-      const canSort = column.getCanSort()
-
-      const initialProps: ToggleSortingProps = {
-        title: canSort ? 'Toggle Sorting' : undefined,
-        onClick: canSort
-          ? (e: MouseEvent | TouchEvent) => {
-              e.persist()
-              column.toggleSorting?.(
-                undefined,
-                column.getCanMultiSort()
-                  ? instance.options.isMultiSortEvent?.(e)
-                  : false
-              )
-            }
-          : undefined,
-      }
-
-      return propGetter(initialProps, userProps)
-    },
-
-    getPreSortedRowModel: () => instance.getGlobalFilteredRowModel(),
-    getSortedRowModel: memo(
-      () => [
-        instance.getState().sorting,
-        instance.getGlobalFilteredRowModel(),
-        instance.options.sortRowsFn,
-      ],
-      (sorting, rowModel, sortingFn) => {
-        if (!sortingFn || !sorting?.length) {
-          return rowModel
-        }
-
-        return sortingFn(instance, rowModel)
-      },
-      {
-        key: 'getSortedRowModel',
-        debug: () => instance.options.debugAll ?? instance.options.debugTable,
-        onChange: () => {
-          instance._notifyGroupingReset()
-        },
-      }
-    ),
-  }
-}

package/src/features/Visibility.ts

@@ -1,238 +0,0 @@
-import {
-  Cell,
-  Column,
-  Getter,
-  OnChangeFn,
-  PartialGenerics,
-  PropGetterValue,
-  TableInstance,
-  Updater,
-} from '../types'
-import { functionalUpdate, makeStateUpdater, memo, propGetter } from '../utils'
-
-export type VisibilityOptions = {
-  onColumnVisibilityChange?: OnChangeFn<VisibilityState>
-  enableHiding?: boolean
-}
-
-export type VisibilityDefaultOptions = {
-  onColumnVisibilityChange: OnChangeFn<VisibilityState>
-}
-
-export type VisibilityState = Record<string, boolean>
-
-export type VisibilityTableState = {
-  columnVisibility: VisibilityState
-}
-
-export type VisibilityInstance<TGenerics extends PartialGenerics> = {
-  getVisibleFlatColumns: () => Column<TGenerics>[]
-  getVisibleLeafColumns: () => 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
-  getToggleAllColumnsVisibilityProps: <
-    TGetter extends Getter<ToggleAllColumnsVisibilityProps>
-  >(
-    userProps?: TGetter
-  ) => undefined | PropGetterValue<ToggleAllColumnsVisibilityProps, TGetter>
-}
-
-type ToggleVisibilityProps = {}
-type ToggleAllColumnsVisibilityProps = {}
-
-export type VisibilityColumnDef = {
-  enableHiding?: boolean
-  defaultCanHide?: boolean
-}
-
-export type VisibilityRow<TGenerics extends PartialGenerics> = {
-  getVisibleCells: () => Cell<TGenerics>[]
-}
-
-export type VisibilityColumn = {
-  getCanHide: () => boolean
-  getIsVisible: () => boolean
-  toggleVisibility: (value?: boolean) => void
-  getToggleVisibilityProps: <TGetter extends Getter<ToggleVisibilityProps>>(
-    userProps?: TGetter
-  ) => PropGetterValue<ToggleVisibilityProps, TGetter>
-}
-
-//
-
-export function getInitialState(): VisibilityTableState {
-  return {
-    columnVisibility: {},
-  }
-}
-
-export function getDefaultOptions<TGenerics extends PartialGenerics>(
-  instance: TableInstance<TGenerics>
-): VisibilityDefaultOptions {
-  return {
-    onColumnVisibilityChange: makeStateUpdater('columnVisibility', instance),
-  }
-}
-
-export function getDefaultColumn() {
-  return {
-    defaultIsVisible: true,
-  }
-}
-
-export function createColumn<TGenerics extends PartialGenerics>(
-  column: Column<TGenerics>,
-  instance: TableInstance<TGenerics>
-): VisibilityColumn {
-  return {
-    getCanHide: () => instance.getColumnCanHide(column.id),
-    getIsVisible: () => instance.getColumnIsVisible(column.id),
-    toggleVisibility: value =>
-      instance.toggleColumnVisibility(column.id, value),
-    getToggleVisibilityProps: userProps => {
-      const props: ToggleVisibilityProps = {
-        type: 'checkbox',
-        checked: column.getIsVisible?.(),
-        title: 'Toggle Column Visibility',
-        onChange: (e: MouseEvent | TouchEvent) => {
-          column.toggleVisibility?.((e.target as HTMLInputElement).checked)
-        },
-      }
-
-      return propGetter(props, userProps)
-    },
-  }
-}
-
-export function getInstance<TGenerics extends PartialGenerics>(
-  instance: TableInstance<TGenerics>
-): VisibilityInstance<TGenerics> {
-  return {
-    getVisibleFlatColumns: memo(
-      () => [
-        instance.getAllFlatColumns(),
-        instance
-          .getAllFlatColumns()
-          .filter(d => d.getIsVisible?.())
-          .map(d => d.id)
-          .join('_'),
-      ],
-      allFlatColumns => {
-        return allFlatColumns.filter(d => d.getIsVisible?.())
-      },
-      {
-        key: 'getVisibleFlatColumns',
-        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
-      }
-    ),
-
-    getVisibleLeafColumns: memo(
-      () => [
-        instance.getAllLeafColumns(),
-        instance
-          .getAllLeafColumns()
-          .filter(d => d.getIsVisible?.())
-          .map(d => d.id)
-          .join('_'),
-      ],
-      allFlatColumns => {
-        return allFlatColumns.filter(d => d.getIsVisible?.())
-      },
-      {
-        key: 'getVisibleLeafColumns',
-        debug: () => instance.options.debugAll ?? instance.options.debugColumns,
-      }
-    ),
-
-    setColumnVisibility: updater =>
-      instance.options.onColumnVisibilityChange?.(
-        updater,
-        functionalUpdate(updater, instance.getState().columnVisibility)
-      ),
-
-    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()
-
-      instance.setColumnVisibility(
-        instance.getAllLeafColumns().reduce(
-          (obj, column) => ({
-            ...obj,
-            [column.id]: !value ? !column.getCanHide?.() : value,
-          }),
-          {}
-        )
-      )
-    },
-
-    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?.()),
-
-    getIsSomeColumnsVisible: () =>
-      instance.getAllLeafColumns().some(column => column.getIsVisible?.()),
-
-    getToggleAllColumnsVisibilityProps: userProps => {
-      const props: ToggleAllColumnsVisibilityProps = {
-        onChange: (e: MouseEvent) => {
-          instance.toggleAllColumnsVisible(
-            (e.target as HTMLInputElement)?.checked
-          )
-        },
-        type: 'checkbox',
-        title: 'Toggle visibility for all columns',
-        checked: instance.getIsAllColumnsVisible(),
-        indeterminate:
-          !instance.getIsAllColumnsVisible() &&
-          instance.getIsSomeColumnsVisible()
-            ? 'indeterminate'
-            : undefined,
-      }
-
-      return propGetter(props, userProps)
-    },
-  }
-}