@tanstack/table-core 9.0.0-alpha.4 → 9.0.0-alpha.42

package/src/features/row-pagination/rowPaginationFeature.utils.ts

@@ -0,0 +1,208 @@
+import { cloneState, functionalUpdate } from '../../utils'
+import type { RowData, Updater } from '../../types/type-utils'
+import type { TableFeatures } from '../../types/TableFeatures'
+import type { Table_Internal } from '../../types/Table'
+import type { PaginationState } from './rowPaginationFeature.types'
+
+const defaultPageIndex = 0
+const defaultPageSize = 10
+
+export function getDefaultPaginationState(): PaginationState {
+  return {
+    pageIndex: defaultPageIndex,
+    pageSize: defaultPageSize,
+  }
+}
+
+export function table_autoResetPageIndex<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  if (
+    table.options.autoResetAll ??
+    table.options.autoResetPageIndex ??
+    !table.options.manualPagination
+  ) {
+    table_resetPageIndex(table)
+  }
+}
+
+export function table_setPagination<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, updater: Updater<PaginationState>) {
+  const safeUpdater: Updater<PaginationState> = (old) => {
+    const newState = functionalUpdate(updater, old)
+
+    return newState
+  }
+
+  return table.options.onPaginationChange?.(safeUpdater)
+}
+
+export function table_resetPagination<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, defaultState?: boolean) {
+  table_setPagination(
+    table,
+    defaultState
+      ? getDefaultPaginationState()
+      : cloneState(
+          table.initialState.pagination ?? getDefaultPaginationState(),
+        ),
+  )
+}
+
+export function table_setPageIndex<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, updater: Updater<number>) {
+  table_setPagination(table, (old) => {
+    let pageIndex = functionalUpdate(updater, old.pageIndex)
+
+    const maxPageIndex =
+      typeof table.options.pageCount === 'undefined' ||
+      table.options.pageCount === -1
+        ? Number.MAX_SAFE_INTEGER
+        : table.options.pageCount - 1
+
+    pageIndex = Math.max(0, Math.min(pageIndex, maxPageIndex))
+
+    return {
+      ...old,
+      pageIndex,
+    }
+  })
+}
+
+export function table_resetPageIndex<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, defaultState?: boolean) {
+  const currentPageIndex =
+    table.atoms.pagination?.get()?.pageIndex ?? defaultPageIndex
+  const newPageIndex = defaultState
+    ? defaultPageIndex
+    : (table.initialState.pagination?.pageIndex ?? defaultPageIndex)
+  if (newPageIndex === currentPageIndex) return
+  table_setPageIndex(table, newPageIndex)
+}
+
+export function table_resetPageSize<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, defaultState?: boolean) {
+  const currentPageSize =
+    table.atoms.pagination?.get()?.pageSize ?? defaultPageSize
+  const newPageSize = defaultState
+    ? defaultPageSize
+    : (table.initialState.pagination?.pageSize ?? defaultPageSize)
+  if (newPageSize === currentPageSize) return
+  table_setPageSize(table, newPageSize)
+}
+
+export function table_setPageSize<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, updater: Updater<number>) {
+  table_setPagination(table, (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,
+    }
+  })
+}
+
+export function table_getPageOptions<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  const pageCount = table_getPageCount(table)
+  let pageOptions: Array<number> = []
+  if (pageCount && pageCount > 0) {
+    pageOptions = [...new Array(pageCount)].fill(null).map((_, i) => i)
+  }
+  return pageOptions
+}
+
+export function table_getCanPreviousPage<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return (table.atoms.pagination?.get()?.pageIndex ?? 0) > 0
+}
+
+export function table_getCanNextPage<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  const pageIndex = table.atoms.pagination?.get()?.pageIndex ?? defaultPageIndex
+
+  const pageCount = table_getPageCount(table)
+
+  if (pageCount === -1) {
+    return true
+  }
+
+  if (pageCount === 0) {
+    return false
+  }
+
+  return pageIndex < pageCount - 1
+}
+
+export function table_previousPage<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return table_setPageIndex(table, (old) => old - 1)
+}
+
+export function table_nextPage<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return table_setPageIndex(table, (old) => {
+    return old + 1
+  })
+}
+
+export function table_firstPage<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return table_setPageIndex(table, 0)
+}
+
+export function table_lastPage<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return table_setPageIndex(table, table_getPageCount(table) - 1)
+}
+
+export function table_getPageCount<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return (
+    table.options.pageCount ??
+    Math.ceil(
+      table_getRowCount(table) /
+        (table.atoms.pagination?.get()?.pageSize ?? defaultPageSize),
+    )
+  )
+}
+
+export function table_getRowCount<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>) {
+  return table.options.rowCount ?? table.getPrePaginatedRowModel().rows.length
+}

package/src/features/row-pinning/rowPinningFeature.ts

@@ -0,0 +1,121 @@
+import {
+  assignPrototypeAPIs,
+  assignTableAPIs,
+  makeStateUpdater,
+} from '../../utils'
+import {
+  getDefaultRowPinningState,
+  row_getCanPin,
+  row_getIsPinned,
+  row_getPinnedIndex,
+  row_pin,
+  table_getBottomRows,
+  table_getCenterRows,
+  table_getIsSomeRowsPinned,
+  table_getTopRows,
+  table_resetRowPinning,
+  table_setRowPinning,
+} from './rowPinningFeature.utils'
+import type { RowData } from '../../types/type-utils'
+import type { TableFeature, TableFeatures } from '../../types/TableFeatures'
+// import type {
+//   Row_RowPinning,
+//   TableOptions_RowPinning,
+//   TableState_RowPinning,
+//   Table_RowPinning,
+// } from './rowPinningFeature.types'
+
+export interface RowPinningFeatureConstructors<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+> {
+  // Row: Row_RowPinning
+  // Table: Table_RowPinning<TFeatures, RowData>
+  // TableOptions: TableOptions_RowPinning<TFeatures, RowData>
+  // TableState: TableState_RowPinning
+}
+
+export function constructRowPinningFeature<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(): TableFeature<RowPinningFeatureConstructors<TFeatures, TData>> {
+  return {
+    getInitialState: (initialState) => {
+      return {
+        ...initialState,
+        rowPinning: {
+          ...getDefaultRowPinningState(),
+          ...initialState.rowPinning,
+        },
+      }
+    },
+
+    getDefaultTableOptions: (table) => {
+      return {
+        onRowPinningChange: makeStateUpdater('rowPinning', table),
+      }
+    },
+
+    assignRowPrototype: (prototype, table) => {
+      assignPrototypeAPIs('rowPinningFeature', prototype, table, {
+        row_getCanPin: {
+          fn: (row) => row_getCanPin(row),
+        },
+        row_getIsPinned: {
+          fn: (row) => row_getIsPinned(row),
+        },
+        row_getPinnedIndex: {
+          fn: (row) => row_getPinnedIndex(row),
+          memoDeps: (row) => [
+            row.table.getRowModel().rows,
+            row.table.atoms.rowPinning?.get(),
+          ],
+        },
+        row_pin: {
+          fn: (row, position, includeLeafRows, includeParentRows) =>
+            row_pin(row, position, includeLeafRows, includeParentRows),
+        },
+      })
+    },
+
+    constructTableAPIs: (table) => {
+      assignTableAPIs('rowPinningFeature', table, {
+        table_setRowPinning: {
+          fn: (updater) => table_setRowPinning(table, updater),
+        },
+        table_resetRowPinning: {
+          fn: (defaultState) => table_resetRowPinning(table, defaultState),
+        },
+        table_getIsSomeRowsPinned: {
+          fn: (position) => table_getIsSomeRowsPinned(table, position),
+        },
+        table_getTopRows: {
+          fn: () => table_getTopRows(table),
+          memoDeps: () => [
+            table.getRowModel().rows,
+            table.atoms.rowPinning?.get()?.top,
+          ],
+        },
+        table_getBottomRows: {
+          fn: () => table_getBottomRows(table),
+          memoDeps: () => [
+            table.getRowModel().rows,
+            table.atoms.rowPinning?.get()?.bottom,
+          ],
+        },
+        table_getCenterRows: {
+          fn: () => table_getCenterRows(table),
+          memoDeps: () => [
+            table.getRowModel().rows,
+            table.atoms.rowPinning?.get(),
+          ],
+        },
+      })
+    },
+  }
+}
+
+/**
+ * The Row Pinning feature adds row pinning state and APIs to the table and row objects.
+ */
+export const rowPinningFeature = constructRowPinningFeature()

package/src/features/row-pinning/rowPinningFeature.types.ts

@@ -0,0 +1,89 @@
+import type { OnChangeFn, RowData, Updater } from '../../types/type-utils'
+import type { TableFeatures } from '../../types/TableFeatures'
+import type { Row } from '../../types/Row'
+
+export type RowPinningPosition = false | 'top' | 'bottom'
+
+export interface RowPinningState {
+  bottom: Array<string>
+  top: Array<string>
+}
+
+export interface TableState_RowPinning {
+  rowPinning: RowPinningState
+}
+
+export interface TableOptions_RowPinning<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+> {
+  /**
+   * Enables/disables row pinning for the table. Defaults to `true`.
+   */
+  enableRowPinning?: boolean | ((row: Row<TFeatures, TData>) => boolean)
+  /**
+   * When `false`, pinned rows will not be visible if they are filtered or paginated out of the table. When `true`, pinned rows will always be visible regardless of filtering or pagination. Defaults to `true`.
+   */
+  keepPinnedRows?: boolean
+  /**
+   * If provided, this function will be called with an `updaterFn` when `state.rowPinning` changes. This overrides the default internal state management, so you will also need to supply `state.rowPinning` from your own managed state.
+   */
+  onRowPinningChange?: OnChangeFn<RowPinningState>
+}
+
+export interface RowPinningDefaultOptions {
+  onRowPinningChange: OnChangeFn<RowPinningState>
+}
+
+export interface Row_RowPinning {
+  /**
+   * Returns whether or not the row can be pinned.
+   */
+  getCanPin: () => boolean
+  /**
+   * Returns the pinned position of the row. (`'top'`, `'bottom'` or `false`)
+   */
+  getIsPinned: () => RowPinningPosition
+  /**
+   * Returns the numeric pinned index of the row within a pinned row group.
+   */
+  getPinnedIndex: () => number
+  /**
+   * Pins a row to the `'top'` or `'bottom'`, or unpins the row to the center if `false` is passed.
+   */
+  pin: (
+    position: RowPinningPosition,
+    includeLeafRows?: boolean,
+    includeParentRows?: boolean,
+  ) => void
+}
+
+export interface Table_RowPinning<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+> {
+  /**
+   * Returns all bottom pinned rows.
+   */
+  getBottomRows: () => Array<Row<TFeatures, TData>>
+  /**
+   * Returns all rows that are not pinned to the top or bottom.
+   */
+  getCenterRows: () => Array<Row<TFeatures, TData>>
+  /**
+   * Returns whether or not any rows are pinned. Optionally specify to only check for pinned rows in either the `top` or `bottom` position.
+   */
+  getIsSomeRowsPinned: (position?: RowPinningPosition) => boolean
+  /**
+   * Returns all top pinned rows.
+   */
+  getTopRows: () => Array<Row<TFeatures, TData>>
+  /**
+   * Resets the **rowPinning** state to `initialState.rowPinning`, or `true` can be passed to force a default blank state reset to `{ top: [], bottom: [], }`.
+   */
+  resetRowPinning: (defaultState?: boolean) => void
+  /**
+   * Sets or updates the `state.rowPinning` state.
+   */
+  setRowPinning: (updater: Updater<RowPinningState>) => void
+}

package/src/features/row-pinning/rowPinningFeature.utils.ts

@@ -0,0 +1,199 @@
+import { row_getIsAllParentsExpanded } from '../row-expanding/rowExpandingFeature.utils'
+import { callMemoOrStaticFn, cloneState } from '../../utils'
+import type { RowData, Updater } from '../../types/type-utils'
+import type { TableFeatures } from '../../types/TableFeatures'
+import type { Table_Internal } from '../../types/Table'
+import type { Row } from '../../types/Row'
+import type {
+  RowPinningPosition,
+  RowPinningState,
+} from './rowPinningFeature.types'
+
+// State Utils
+
+export function getDefaultRowPinningState(): RowPinningState {
+  return {
+    top: [],
+    bottom: [],
+  }
+}
+
+export function table_setRowPinning<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(
+  table: Table_Internal<TFeatures, TData>,
+  updater: Updater<RowPinningState>,
+): void {
+  table.options.onRowPinningChange?.(updater)
+}
+
+export function table_resetRowPinning<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>, defaultState?: boolean): void {
+  table_setRowPinning(
+    table,
+    defaultState
+      ? getDefaultRowPinningState()
+      : cloneState(
+          table.initialState.rowPinning ?? getDefaultRowPinningState(),
+        ),
+  )
+}
+
+// Table Utils
+
+export function table_getIsSomeRowsPinned<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(
+  table: Table_Internal<TFeatures, TData>,
+  position?: RowPinningPosition,
+): boolean {
+  const rowPinning = table.atoms.rowPinning?.get()
+
+  if (!position) {
+    return Boolean(rowPinning?.top.length || rowPinning?.bottom.length)
+  }
+  return Boolean(rowPinning?.[position].length)
+}
+
+function table_getPinnedRows<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(
+  table: Table_Internal<TFeatures, TData>,
+  position: 'top' | 'bottom',
+): Array<Row<TFeatures, TData>> {
+  const visibleRows = table.getRowModel().rows
+  const pinnedRowIds = table.atoms.rowPinning?.get()?.[position] ?? []
+
+  const rows =
+    (table.options.keepPinnedRows ?? true)
+      ? // get all rows that are pinned even if they would not be otherwise visible
+        // account for expanded parent rows, but not pagination or filtering
+        pinnedRowIds.map((rowId) => {
+          const row = table.getRow(rowId, true)
+          return row_getIsAllParentsExpanded(row) ? row : null
+        })
+      : // else get only visible rows that are pinned
+        pinnedRowIds.map(
+          (rowId) => visibleRows.find((row) => row.id === rowId)!,
+        )
+
+  const filteredRows = rows.filter((r) => !!r)
+  // Assign position property directly to preserve prototype chain
+  filteredRows.forEach((row) => {
+    ;(row as any).position = position
+  })
+  return filteredRows
+}
+
+export function table_getTopRows<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>): Array<Row<TFeatures, TData>> {
+  return table_getPinnedRows(table, 'top')
+}
+
+export function table_getBottomRows<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>): Array<Row<TFeatures, TData>> {
+  return table_getPinnedRows(table, 'bottom')
+}
+
+export function table_getCenterRows<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(table: Table_Internal<TFeatures, TData>): Array<Row<TFeatures, TData>> {
+  const { top, bottom } =
+    table.atoms.rowPinning?.get() ?? getDefaultRowPinningState()
+  const allRows = table.getRowModel().rows
+
+  const topAndBottom = new Set([...top, ...bottom])
+  return allRows.filter((d) => !topAndBottom.has(d.id))
+}
+
+// Row Utils
+
+export function row_getCanPin<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(row: Row<TFeatures, TData>): boolean {
+  const { enableRowPinning } = row.table.options
+  if (typeof enableRowPinning === 'function') {
+    return enableRowPinning(row)
+  }
+  return enableRowPinning ?? true
+}
+
+export function row_getIsPinned<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(row: Row<TFeatures, TData>): RowPinningPosition {
+  const { top, bottom } =
+    row.table.atoms.rowPinning?.get() ?? getDefaultRowPinningState()
+
+  return top.includes(row.id)
+    ? 'top'
+    : bottom.includes(row.id)
+      ? 'bottom'
+      : false
+}
+
+export function row_getPinnedIndex<
+  TFeatures extends TableFeatures,
+  TData extends RowData,
+>(row: Row<TFeatures, TData>): number {
+  const position = row_getIsPinned(row)
+  if (!position) return -1
+
+  const visiblePinnedRowIds = (
+    position === 'top'
+      ? callMemoOrStaticFn(row.table, 'getTopRows', table_getTopRows)
+      : callMemoOrStaticFn(row.table, 'getBottomRows', table_getBottomRows)
+  ).map(({ id }) => id)
+
+  return visiblePinnedRowIds.indexOf(row.id)
+}
+
+export function row_pin<TFeatures extends TableFeatures, TData extends RowData>(
+  row: Row<TFeatures, TData>,
+  position: RowPinningPosition,
+  includeLeafRows?: boolean,
+  includeParentRows?: boolean,
+): void {
+  const leafRowIds = includeLeafRows
+    ? row.getLeafRows().map(({ id }) => id)
+    : []
+  const parentRowIds = includeParentRows
+    ? row.getParentRows().map(({ id }) => id)
+    : []
+  const rowIds: Set<string> = new Set([...parentRowIds, row.id, ...leafRowIds])
+
+  table_setRowPinning(row.table, (old) => {
+    if (position === 'bottom') {
+      return {
+        top: old.top.filter((d) => !rowIds.has(d)),
+        bottom: [
+          ...old.bottom.filter((d) => !rowIds.has(d)),
+          ...Array.from(rowIds),
+        ],
+      }
+    }
+
+    if (position === 'top') {
+      return {
+        top: [...old.top.filter((d) => !rowIds.has(d)), ...Array.from(rowIds)],
+        bottom: old.bottom.filter((d) => !rowIds.has(d)),
+      }
+    }
+
+    return {
+      top: old.top.filter((d) => !rowIds.has(d)),
+      bottom: old.bottom.filter((d) => !rowIds.has(d)),
+    }
+  })
+}