@tanstack/react-table 8.0.0-alpha.2 → 8.0.0-alpha.20

package/src/features/Visibility.ts

@@ -1,281 +0,0 @@
-import {
-  Cell,
-  Column,
-  Getter,
-  OnChangeFn,
-  PropGetterValue,
-  ReactTable,
-  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<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> = {
-  getVisibleFlatColumns: () => Column<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-  getVisibleLeafColumns: () => Column<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-  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<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
-> = {
-  getVisibleCells: () => Cell<
-    TData,
-    TValue,
-    TFilterFns,
-    TSortingFns,
-    TAggregationFns
-  >[]
-}
-
-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<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): VisibilityDefaultOptions {
-  return {
-    onColumnVisibilityChange: makeStateUpdater('columnVisibility', instance),
-  }
-}
-
-export function getDefaultColumn() {
-  return {
-    defaultIsVisible: true,
-  }
-}
-
-export function createColumn<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  column: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>,
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): 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<
-  TData,
-  TValue,
-  TFilterFns,
-  TSortingFns,
-  TAggregationFns
->(
-  instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>
-): VisibilityInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> {
-  return {
-    getVisibleFlatColumns: memo(
-      () => [
-        instance.getAllFlatColumns(),
-        instance
-          .getAllFlatColumns()
-          .filter(d => d.getIsVisible?.())
-          .map(d => d.id)
-          .join('_'),
-      ],
-      allFlatColumns => {
-        return allFlatColumns.filter(d => d.getIsVisible?.())
-      },
-      'getVisibleFlatColumns',
-      instance.options.debug
-    ),
-
-    getVisibleLeafColumns: memo(
-      () => [
-        instance.getAllLeafColumns(),
-        instance
-          .getAllLeafColumns()
-          .filter(d => d.getIsVisible?.())
-          .map(d => d.id)
-          .join('_'),
-      ],
-      allFlatColumns => {
-        return allFlatColumns.filter(d => d.getIsVisible?.())
-      },
-      'getVisibleLeafColumns',
-      instance.options.debug
-    ),
-
-    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)
-    },
-  }
-}

package/src/features/withPagination.oldts

@@ -1,208 +0,0 @@
-import React from 'react'
-
-import {
-  functionalUpdate,
-  expandRows,
-  useLazyMemo,
-  useMountedLayoutEffect,
-  makeStateUpdater,
-} from '../utils'
-
-import {
-  withPagination as name,
-  withColumnVisibility,
-  withColumnFilters,
-  withGlobalFilter,
-  withGrouping,
-  withSorting,
-  withExpanding,
-} from '../Constants'
-import { MakeInstance, GetDefaultOptions } from '../types'
-
-const getDefaultOptions: GetDefaultOptions = options => {
-  return {
-    onPageIndexChange: React.useCallback(makeStateUpdater('pageIndex'), []),
-    onPageSizeChange: React.useCallback(makeStateUpdater('pageSize'), []),
-    onPageCountChange: React.useCallback(makeStateUpdater('pageCount'), []),
-    autoResetPageIndex: true,
-    paginateExpandedRows: true,
-    ...options,
-    initialState: {
-      pageIndex: 0,
-      pageSize: 10,
-      pageCount: 0,
-      ...options.initialState,
-    },
-  }
-}
-
-const extendInstance: MakeInstance = instance => {
-  const pageResetDeps = [
-    instance.options.manualPagination ? null : instance.options.data,
-    instance.state.globalFilter,
-    instance.state.columnFilters,
-    instance.state.grouping,
-    instance.state.sorting,
-  ]
-  React.useMemo(() => {
-    if (instance.options.autoResetPageIndex) {
-      instance.state.pageIndex = instance.options.initialState?.pageIndex ?? 0
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, pageResetDeps)
-
-  useMountedLayoutEffect(() => {
-    if (instance.options.autoResetPageIndex) {
-      instance.resetPageIndex?.()
-    }
-  }, pageResetDeps)
-
-  instance.setPageIndex = React.useCallback(
-    updater =>
-      instance.options.onPageIndexChange?.(old => {
-        const newPageIndex = functionalUpdate(updater, old)
-        const pageCount = instance.getPageCount?.() ?? 0
-        const maxPageIndex =
-          pageCount > 0 ? pageCount - 1 : Number.MAX_SAFE_INTEGER
-
-        return Math.min(Math.max(0, newPageIndex), maxPageIndex)
-      }, instance),
-    [instance]
-  )
-
-  instance.setPageSize = React.useCallback(
-    updater =>
-      instance.options.onPageSizeChange?.(old => {
-        const newPageSize = Math.max(1, functionalUpdate(updater, old))
-        const topRowIndex = old! * instance.state.pageIndex!
-        const pageIndex = Math.floor(topRowIndex / newPageSize)
-
-        if (instance.state.pageIndex !== pageIndex) {
-          instance.setPageIndex?.(pageIndex)
-        }
-
-        return newPageSize
-      }, instance),
-    [instance]
-  )
-
-  instance.setPageCount = React.useCallback(
-    updater =>
-      instance.options.onPageCountChange?.(
-        old => Math.max(0, functionalUpdate(updater, old)),
-        instance
-      ),
-    [instance]
-  )
-
-  instance.resetPageIndex = React.useCallback(
-    () =>
-      instance.setPageIndex?.(instance.options.initialState?.pageIndex ?? 0),
-    [instance]
-  )
-
-  instance.resetPageSize = React.useCallback(
-    () => instance.setPageSize?.(instance.options.initialState?.pageSize ?? 10),
-    [instance]
-  )
-
-  instance.resetPageCount = React.useCallback(
-    () =>
-      instance.setPageCount?.(instance.options.initialState?.pageCount ?? 0),
-    [instance]
-  )
-
-  instance.getPageCount = React.useCallback(
-    () =>
-      instance.options.manualPagination
-        ? instance.state.pageCount!
-        : instance.rows
-        ? Math.ceil(instance.rows.length / instance.state.pageSize!)
-        : -1,
-    [
-      instance.options.manualPagination,
-      instance.rows,
-      instance.state.pageCount,
-      instance.state.pageSize,
-    ]
-  )
-
-  const pageCount = instance.getPageCount?.()
-
-  instance.getPageOptions = useLazyMemo(() => {
-    let pageOptions: number[] = []
-    if (pageCount > 0) {
-      pageOptions = [...new Array(pageCount)].fill(null).map((_, i) => i)
-    }
-    return pageOptions
-  }, [pageCount])
-
-  instance.getPageRows = React.useCallback(() => {
-    const {
-      rows,
-      state: { pageIndex, pageSize },
-      options: { manualPagination },
-    } = instance
-    let page
-
-    if (manualPagination) {
-      page = rows
-    } else {
-      const pageStart = pageSize! * pageIndex!
-      const pageEnd = pageStart + pageSize!
-
-      page = rows.slice(pageStart, pageEnd)
-    }
-
-    if (instance.options.paginateExpandedRows) {
-      return page
-    }
-
-    return expandRows(page, instance)
-  }, [instance])
-
-  instance.getCanPreviousPage = React.useCallback(
-    () => instance.state.pageIndex! > 0,
-    [instance.state.pageIndex]
-  )
-
-  instance.getCanNextPage = React.useCallback(() => {
-    const {
-      state: { pageSize, pageIndex },
-      getPageRows,
-      getPageCount,
-    } = instance
-
-    const pageCount = getPageCount?.() ?? 0
-
-    return pageCount === 0
-      ? (getPageRows?.().length ?? 0) >= pageSize!
-      : pageIndex! < (pageCount ?? 0) - 1
-  }, [instance])
-
-  instance.gotoPreviousPage = React.useCallback(() => {
-    return instance.setPageIndex?.(old => old! - 1)
-  }, [instance])
-
-  instance.gotoNextPage = React.useCallback(() => {
-    return instance.setPageIndex?.(old => old! + 1)
-  }, [instance])
-
-  return instance
-}
-
-export const withPagination = {
-  name,
-  after: [
-    withColumnVisibility,
-    withColumnFilters,
-    withGlobalFilter,
-    withGrouping,
-    withSorting,
-    withExpanding,
-  ],
-  plugs: {
-    getDefaultOptions,
-    extendInstance,
-  },
-}