diff --git a/types/react-table/index.d.ts b/types/react-table/index.d.ts index 8461d74c9c..28f128ab68 100644 --- a/types/react-table/index.d.ts +++ b/types/react-table/index.d.ts @@ -6,7 +6,7 @@ // Jason Clark // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 3.5 -// reflects react-table@7.0.0-rc.15 +// reflects react-table@7.0.0-rc.16 // tslint:disable:no-empty-interface // no-empty-interface is disabled to allow easy extension with declaration merging @@ -15,7 +15,7 @@ // no-unnecessary-generics is disabled because many of these definitions are either used in a generic // context or the signatures are required to match for declaration merging -import { ComponentType, DependencyList, EffectCallback, MouseEvent, ReactElement, ReactNode, ReactText, ReactFragment } from 'react'; +import { ComponentType, DependencyList, EffectCallback, MouseEvent, ReactElement, ReactNode, ReactText, ReactFragment, CSSProperties } from 'react'; export {}; @@ -54,7 +54,8 @@ export interface HeaderGroup extends ColumnInstance, U export interface Row extends UseTableRowProps {} export interface TableCommonProps { - style?: React.CSSProperties; + style?: CSSProperties; + className?: string; } export interface TableProps extends TableCommonProps {} @@ -77,9 +78,8 @@ export interface TableRowProps extends TableKeyedProps {} export interface TableCellProps extends TableKeyedProps {} -export interface TableToggleCommonProps { +export interface TableToggleCommonProps extends TableCommonProps { onChange?: () => void; - style?: { cursor: string }; checked?: boolean; title?: string; indeterminate?: boolean; @@ -152,13 +152,14 @@ export interface UseTableHooks extends Record { >; columns: Array<(columns: Array>, meta: Meta) => Array>>; columnsDeps: Array<(deps: any[], meta: Meta) => any[]>; - flatColumns: Array<(flatColumns: Array>, meta: Meta) => Array>>; - flatColumnsDeps: Array<(deps: any[], meta: Meta) => any[]>; - headerGroups: Array<(flatColumns: Array>, meta: Meta) => Array>>; - headerGroupDeps: Array<(deps: any[], meta: Meta) => any[]>; + allColumns: Array<(allColumns: Array>, meta: Meta) => Array>>; + allColumnsDeps: Array<(deps: any[], meta: Meta) => any[]>; + visibleColumns: Array<(allColumns: Array>, meta: Meta) => Array>>; + visibleColumnsDeps: Array<(deps: any[], meta: Meta) => any[]>; + headerGroups: Array<(allColumns: Array>, meta: Meta) => Array>>; + headerGroupsDeps: Array<(deps: any[], meta: Meta) => any[]>; useInstanceBeforeDimensions: Array<(instance: TableInstance) => void>; useInstance: Array<(instance: TableInstance) => void>; - useRows: Array<(rows: Array>, meta: Meta) => Array>>; prepareRow: Array<(row: Row, meta: Meta) => void>; useControlledState: Array<(state: TableState, meta: Meta) => TableState>; @@ -177,7 +178,6 @@ export interface UseTableColumnOptions extends Accessor, Partial<{ columns: Array>; - show: boolean | ((instance: TableInstance) => boolean); Header: Renderer>; Cell: Renderer>; width?: number | string; @@ -191,25 +191,28 @@ export interface TableToggleHideAllColumnProps extends TableToggleCommonProps {} export interface UseTableInstanceProps { state: TableState; - hooks: Hooks; plugins: Array>; dispatch: TableDispatch; columns: Array>; - flatColumns: Array>; + allColumns: Array>; + visibleColumns: Array>; headerGroups: Array>; footerGroups: Array>; headers: Array>; flatHeaders: Array>; rows: Array>; + rowsById: Record>; getTableProps: (propGetter?: TablePropGetter) => TableProps; getTableBodyProps: (propGetter?: TableBodyPropGetter) => TableBodyProps; prepareRow: (row: Row) => void; flatRows: Array>; totalColumnsWidth: number; + allColumnsHidden: boolean; toggleHideColumn: (columnId: IdType, value?: boolean) => void; setHiddenColumns: (param: Array> | UpdateHiddenColumns) => void; toggleHideAllColumns: (value?: boolean) => void; getToggleHideAllColumnsProps: (props?: Partial) => TableToggleHideAllColumnProps; + getHooks: () => Hooks; } export interface UseTableHeaderGroupProps { @@ -335,7 +338,8 @@ export type UseExpandedOptions = Partial<{ }>; export interface UseExpandedHooks { - getExpandedToggleProps: Array<(row: Row, instance: TableInstance) => object>; + getToggleRowsExpandedProps: Array>; + getToggleAllRowsExpandedProps: Array>; } export interface UseExpandedState { @@ -343,17 +347,21 @@ export interface UseExpandedState { } export interface UseExpandedInstanceProps { + preExpandedRows: Array>; + expandedRows: Array>; rows: Array>; - toggleExpanded: (id: Array>, isExpanded: boolean) => void; expandedDepth: number; + isAllRowsExpanded: boolean; + toggleRowExpanded: (id: Array>, value?: boolean) => void; + toggleAllRowsExpanded: (value?: boolean) => void; } export interface UseExpandedRowProps { isExpanded: boolean; canExpand: boolean; subRows: Array>; - toggleExpanded: (isExpanded?: boolean) => void; - getExpandedToggleProps: (props?: Partial) => TableExpandedToggleProps; + toggleRowExpanded: (value?: boolean) => void; + getToggleRowExpandedProps: (props?: Partial) => TableExpandedToggleProps; } //#endregion @@ -385,8 +393,15 @@ export type UseFiltersColumnOptions = Partial<{ }>; export interface UseFiltersInstanceProps { - rows: Array>; preFilteredRows: Array>; + preFilteredFlatRows: Array>; + preFilteredRowsById: Record>; + filteredRows: Array>; + filteredFlatRows: Array>; + filteredRowsById: Record>; + rows: Array>; + flatRows: Array>; + rowsById: Record>; setFilter: (columnId: IdType, updater: ((filterValue: FilterValue) => FilterValue) | FilterValue) => void; setAllFilters: (updater: Filters | ((filters: Filters) => Filters)) => void; } @@ -449,8 +464,15 @@ export interface UseGlobalFiltersState { } export interface UseGlobalFiltersInstanceProps { - rows: Array>; preGlobalFilteredRows: Array>; + preGlobalFilteredFlatRows: Array>; + preGlobalFilteredRowsById: Record>; + globalFilteredRows: Array>; + globalFilteredFlatRows: Array>; + globalFilteredRowsById: Record>; + rows: Array>; + flatRows: Array>; + rowsById: Record>; setGlobalFilter: (filterValue: FilterValue) => void; } @@ -475,7 +497,7 @@ export type UseGroupByOptions = Partial<{ }>; export interface UseGroupByHooks { - getGroupByToggleProps: Array<(header: HeaderGroup, instance: TableInstance) => object>; + getGroupByToggleProps: Array>; } export interface UseGroupByState { @@ -483,7 +505,7 @@ export interface UseGroupByState { } export type UseGroupByColumnOptions = Partial<{ - aggregate: Aggregator | Array>; + aggregate: Aggregator; Aggregated: Renderer>; disableGroupBy: boolean; defaultCanGroupBy: boolean; @@ -491,9 +513,20 @@ export type UseGroupByColumnOptions = Partial<{ }>; export interface UseGroupByInstanceProps { - rows: Array>; preGroupedRows: Array>; - toggleGroupBy: (columnId: IdType, toggle: boolean) => void; + preGroupedFlatRows: Array>; + preGroupedRowsById: Record>; + groupedRows: Array>; + groupedFlatRows: Array>; + groupedRowsById: Record>; + onlyGroupedFlatRows: Array>; + onlyGroupedRowsById: Record>; + nonGroupedFlatRows: Array>; + nonGroupedRowsById: Record>; + rows: Array>; + flatRows: Array>; + rowsById: Record>; + toggleGroupBy: (columnId: IdType, value?: boolean) => void; } export interface UseGroupByColumnProps { @@ -517,7 +550,7 @@ export interface UseGroupByRowProps { export interface UseGroupByCellProps { isGrouped: boolean; - isRepeatedValue: boolean; + isPlaceholder: boolean; isAggregated: boolean; } @@ -614,11 +647,12 @@ export interface TableToggleRowsSelectedProps extends TableToggleCommonProps {} export type UseRowSelectOptions = Partial<{ manualRowSelectedKey: IdType; autoResetSelectedRows: boolean; + selectSubRows: boolean; }>; export interface UseRowSelectHooks { - getToggleRowSelectedProps: Array<(row: Row, instance: TableInstance) => object>; - getToggleAllRowsSelectedProps: Array<(instance: TableInstance) => object>; + getToggleRowSelectedProps: Array>; + getToggleAllRowsSelectedProps: Array>; } export interface UseRowSelectState { @@ -627,7 +661,7 @@ export interface UseRowSelectState { export interface UseRowSelectInstanceProps { toggleRowSelected: (rowId: IdType, set?: boolean) => void; - toggleAllRowsSelected: (set?: boolean) => void; + toggleAllRowsSelected: (value?: boolean) => void; getToggleAllRowsSelectedProps: ( props?: Partial, ) => TableToggleAllRowsSelectedProps; @@ -704,7 +738,7 @@ export type UseSortByOptions = Partial<{ }>; export interface UseSortByHooks { - getSortByToggleProps: Array<(column: Column, instance: TableInstance) => object>; + getSortByToggleProps: Array>; } export interface UseSortByState { @@ -786,8 +820,7 @@ export function loopHooks(hooks: Hooks, ...args: any[]): void; export function ensurePluginOrder( plugins: Array>, befores: string[], - pluginName: string, - afters: string[], + pluginName: string ): void; export function functionalUpdate( @@ -803,6 +836,4 @@ export function useMountedLayoutEffect(effect: EffectCallback, deps?: Dependency export function useAsyncDebounce any>(defaultFn: F, defaultWait?: number): F; -export function useConsumeHookGetter(hooks: Hooks, hookName: string): any; - export function makeRenderer(instance: TableInstance, column: ColumnInstance, meta?: any): ReactElement; diff --git a/types/react-table/react-table-tests.tsx b/types/react-table/react-table-tests.tsx index 68975317aa..3e24153400 100644 --- a/types/react-table/react-table-tests.tsx +++ b/types/react-table/react-table-tests.tsx @@ -365,7 +365,7 @@ function Table({ columns, data, updateMyData, skipPageReset }: Table) { usePagination, useRowSelect, (hooks: Hooks) => { - hooks.flatColumns.push(columns => [ + hooks.allColumns.push(columns => [ { id: 'selection', // Make this column a groupByBoundary. This ensures that groupBy columns @@ -430,7 +430,7 @@ function Table({ columns, data, updateMyData, skipPageReset }: Table) { {cell.isGrouped ? ( <> - + {row.isExpanded ? '👇' : '👉'} {' '} {cell.render('Cell', { editable: false })} ({row.subRows.length}) @@ -439,7 +439,7 @@ function Table({ columns, data, updateMyData, skipPageReset }: Table) { // If the cell is aggregated, use the Aggregated // renderer for cell cell.render('Aggregated') - ) : cell.isRepeatedValue ? null : (// For cells with repeated values, render null + ) : cell.isPlaceholder ? null : (// For cells with repeated values, render null // Otherwise, just render the regular cell cell.render('Cell', { editable: true }) )} @@ -597,7 +597,7 @@ const Component = (props: {}) => { // count the total rows being aggregated, // then sum any of those counts if they are // aggregated further - aggregate: ['sum', 'count'], + aggregate: 'count', Aggregated: ({ cell: { value } }: CellProps) => `${value} Names`, }, { @@ -609,7 +609,7 @@ const Component = (props: {}) => { // first count the UNIQUE values from the rows // being aggregated, then sum those counts if // they are aggregated further - aggregate: ['sum', 'uniqueCount'], + aggregate: 'uniqueCount', Aggregated: ({ cell: { value } }: CellProps) => `${value} Unique Names`, }, ],