From 66735656d18c5317fce3d54c56d2e8ce68406fa4 Mon Sep 17 00:00:00 2001 From: Kalle Ott Date: Fri, 24 Feb 2017 11:32:47 +0100 Subject: [PATCH 1/6] added header row renderer with this prop it is possible to inject a cusotm header row with higher order componencts (sortable) --- index.d.ts | 355 +++++++++++++++++++++++ package.json | 3 +- source/Table/Table.js | 36 ++- source/Table/defaultHeaderRowRenderer.js | 26 ++ source/Table/index.js | 1 + source/Table/types.js | 12 +- source/index.js | 1 + 7 files changed, 420 insertions(+), 14 deletions(-) create mode 100644 index.d.ts create mode 100644 source/Table/defaultHeaderRowRenderer.js diff --git a/index.d.ts b/index.d.ts new file mode 100644 index 000000000..308175ede --- /dev/null +++ b/index.d.ts @@ -0,0 +1,355 @@ +import * as React from "react"; + +export interface MultiGridProps { + fixedColumnCount: number; + fixedRowCount: number; + style: React.CSSProperties; + styleBottomLeftGrid: React.CSSProperties; + styleBottomRightGrid: React.CSSProperties; + styleTopLeftGrid: React.CSSProperties; + styleTopRightGrid: React.CSSProperties; +} +export const MultiGrid: React.ComponentClass; + +export type DefaultCellRangeRendererParams = { + cellCache: Object, + cellRenderer: Function, + columnSizeAndPositionManager: Object, + columnStartIndex: number, + columnStopIndex: number, + horizontalOffsetAdjustment: number, + isScrolling: boolean, + rowSizeAndPositionManager: Object, + rowStartIndex: number, + rowStopIndex: number, + scrollLeft: number, + scrollTop: number, + styleCache: Object, + verticalOffsetAdjustment: number, + visibleColumnIndices: Object, + visibleRowIndices: Object +}; + +export default function defaultCellRangeRenderer(params: DefaultCellRangeRendererParams): React.ReactElement; +/* + * Components + */ + +export interface VirtualScrollProps { + className?: string; + autoHeight?: boolean; + estimatedRowSize?: number; + height: number; + noRowsRenderer?: Function; + onRowsRendered?: (info: { overscanStartIndex: number, overscanStopIndex: number, startIndex: number, stopIndex: number }) => void; + onScroll?: (info: { clientHeight: number, scrollHeight: number, scrollTop: number }) => void; + overscanRowCount?: number; + rowHeight: number | ((info: { index: number }) => number); + rowRenderer: RowRenderer; + rowClassName?: string | ((info: { index: number }) => string); + rowCount: number; + rowStyle?: React.CSSProperties | ((info: { index: number }) => React.CSSProperties); + scrollToAlignment?: string; + scrollToIndex?: number; + scrollTop?: number; + style?: React.CSSProperties; + tabIndex?: number; + width: number; +} +export class VirtualScroll extends React.Component { } +// TODO +export type CollectionProps = any; +export class Collection extends React.Component { } +// TODO +export type FlexTableProps = any; +export class FlexTable extends React.Component { } +// TODO +export type FlexColumnProps = any; +export class FlexColumn extends React.Component { } +// TODO +export type SortDirectionProps = any; +export class SortDirection extends React.Component { } +// TODO +export type GridProps = any; +export class Grid extends React.Component { } + +export interface ListProps { + className?: string; + autoHeight?: boolean; + estimatedRowSize?: number; + height: number; + noRowsRenderer?: Function; + onRowsRendered?: (info: { overscanStartIndex: number, overscanStopIndex: number, startIndex: number, stopIndex: number }) => void; + onScroll?: (info: { clientHeight: number, scrollHeight: number, scrollTop: number }) => void; + overscanRowCount?: number; + rowHeight: number | ((info: { index: number }) => number); + rowRenderer: RowRenderer; + rowCount: number; + scrollToAlignment?: string; + scrollToIndex?: number; + scrollTop?: number; + style?: React.CSSProperties; + tabIndex?: number; + width: number; +} +export class List extends React.Component { } + +export type CellDataGetterParams = { + columnData?: any, + dataKey: string, + rowData: any +}; +export type CellRendererParams = { + cellData?: any, + columnData?: any, + dataKey: string, + rowData: any, + rowIndex: number +}; + +export type HeaderRendererParams = { + columnData?: any, + dataKey: string, + disableSort?: boolean, + label?: string, + sortBy?: string, + sortDirection?: SortDirectionType +}; + +export type HeaderRowRendererParams = { + className: string, + columns: React.ReactNode[], + style: React.CSSProperties, + scrollbarWidth: number, + height: number, + width: number +}; + +export type RowRendererParams = { + className: string, + columns: Array, + index: number, + isScrolling: boolean, + onRowClick?: Function, + onRowDoubleClick?: Function, + onRowMouseOver?: Function, + onRowMouseOut?: Function, + rowData: any, + style: any +}; + +export type CellDataGetter = (params: CellDataGetterParams) => React.ReactNode; +export type CellRenderer = (params: CellRendererParams) => React.ReactNode; +export type HeaderRenderer = (params: HeaderRendererParams) => React.ReactNode; +export type HeaderRowRenderer = (params: HeaderRowRendererParams) => React.ReactNode; +export type RowRenderer = (params: RowRendererParams) => React.ReactNode; + +// https://github.com/bvaughn/react-virtualized/blob/master/docs/Column.md +export interface ColumnProps { + cellDataGetter?: CellDataGetter; + cellRenderer?: CellRenderer; + className?: string; + columnData?: any; + dataKey: any; + disableSort?: boolean; + flexGrow?: number; + flexShrink?: number; + headerClassName?: string; + headerRenderer?: HeaderRenderer; + label?: string; + maxWidth?: number; + minWidth?: number; + style?: React.CSSProperties; + width: number; +} + +export class Column extends React.Component { } + +// ref: https://github.com/bvaughn/react-virtualized/blob/master/docs/Table.md +export interface TableProps { + autoHeight?: boolean; + children?: React.ReactNode; + className?: string; + disableHeader?: boolean; + estimatedRowSize?: number; + gridClassName?: string; + gridStyle?: any; + headerClassName?: string; + headerHeight: number; + headerStyle?: any; + height: number; + id?: string; + noRowsRender?: () => void; + onHeaderClick?: (dataKey: string, columnData: any) => void; + onRowClick?: (info: { index: number }) => void; + onRowDoubleClick?: (info: { index: number }) => void; + onRowMouseOut?: (info: { index: number }) => void; + onRowMouseOver?: (info: { index: number }) => void; + onRowsRendered?: (info: { index: number }) => void; + overscanRowCount?: number; + onScroll?: (info: { clientHeight: number, scrollHeight: number, scrollTop: number }) => void; + rowClassName?: string | ((info: { index: number }) => string); + rowCount: number; + rowGetter?: (info: { index: number }) => any; + rowHeight: number | ((info: { index: number }) => number); + rowRenderer?: RowRenderer; + rowStyle?: React.CSSProperties | ((info: { index: number }) => React.CSSProperties); + scrollToAlignment?: string; + scrollToIndex?: number; + scrollTop?: number; + sort?: (info: { sortBy: string, sortDirection: SortDirectionType }) => void; + sortBy?: string; + sortDirection?: SortDirectionType; + style?: React.CSSProperties; + tabIndex?: number; + width: number; +} + +export class Table extends React.Component { } + +/* + * Higher-Order Components + */ + +export interface AutoSizerProps { + disableHeight?: boolean; + disableWidth?: boolean; + onResize?: (info: { height: number, width: number }) => any; +} +export class AutoSizer extends React.Component { } + +export interface ArrowKeyStepperProps { + children?: React.StatelessComponent<{ + onSectionRendered: Function, + scrollToColumn: number, + scrollToRow: number + }>; + className?: string; + columnCount: number; + rowCount: number; +} +export class ArrowKeyStepper extends React.Component { } + +export interface CellMeasurerProps { + cellRenderer: (info: { columnIndex: number, rowIndex: number }) => React.ReactNode; + cellSizeCache?: { + clearAllColumnWidths(): void; + clearAllRowHeights(): void; + clearColumnWidth(index: number): void; + clearRowHeight(index: number): void; + getColumnWidth(index: number): number; + getRowHeight(index: number): number; + hasColumnWidth(index: number): boolean; + hasRowHeight(index: number): boolean; + setColumnWidth(index: number, width: number): void; + setRowHeight(index: number, height: number): void; + }; + children?: React.StatelessComponent<{ + getColumnWidth: () => number, + getRowHeight: () => number, + resetMeasurements: () => any, + resetMeasurementsForColumn: (index: number) => any, + resetMeasurementsForRow: (index: number) => any, + }>; + columnCount: number; + container?: React.ReactType; + height?: number; + rowCount: number; + width?: number; +} +export class CellMeasurer extends React.Component { } + +export interface ColumnSizerProps { + children?: React.StatelessComponent<{ adjustedWidth: number, getColumnWidth: () => number, registerChild: any }>; + columnMaxWidth?: number; + columnMinWidth?: number; + columnCount?: number; + width: number; +} +export class ColumnSizer extends React.Component { } + +export type InfiniteLoaderProps = any; +export class InfiniteLoader extends React.Component { } + +export type ScrollSyncProps = any; +export class ScrollSync extends React.Component { } + +export module WindowScroller { + export type OnResizeArg = { + height: number; + } + export type OnScrollArg = { + scrollTop: number; + } + export type RenderCallbackArg = { + height: number; + scrollTop: number; + isScrolling: boolean; + } + export type Props = { + onScroll?: (arg: OnScrollArg) => void; + onResize?: (arg: OnResizeArg) => void; + // TODO `children` should be typed here + }; +} +export class WindowScroller extends React.Component { } + + +declare class DefaultCellSizeCache { + constructor({ + uniformRowHeight, + uniformColumnWidth + }?: { uniformColumnWidth: boolean, uniformRowHeight: boolean }); + + clearAllColumnWidths(): void; + + clearAllRowHeights(): void; + + clearColumnWidth(index: any): void; + + clearRowHeight(index: any): void; + + getColumnWidth(index: any): number | undefined; + + getRowHeight(index: any): number | undefined; + + setColumnWidth(index: any, width: number): void; + + setRowHeight(index: any, height: number): void; +} + +export type IdCellSizeCacheConstructorParams = { + indexToIdMap: Function, + uniformRowHeight?: boolean, + uniformColumnWidth?: boolean +}; +declare function idCellSizeCache({ + indexToIdMap, + uniformColumnWidth, + uniformRowHeight +}: IdCellSizeCacheConstructorParams): DefaultCellSizeCache; + +export { + DefaultCellSizeCache as defaultCellMeasurerCellSizeCache, + DefaultCellSizeCache as uniformSizeCellMeasurerCellSizeCache, // 7.21 backwards compatible export + idCellSizeCache as idCellMeasurerCellSizeCache +}; + +declare const defaultCellDataGetter: CellDataGetter; +declare const defaultCellRenderer: CellRenderer; +declare const defaultHeaderRowRenderer: HeaderRowRenderer; +declare const defaultHeaderRenderer: HeaderRenderer; +declare const defaultRowRenderer: RowRenderer; + +export type SortDirectionType = 'ASC' | 'DESC' + +declare function SortIndicator({ sortDirection }: { sortDirection: SortDirectionType }): React.StatelessComponent<{ sortDirection: SortDirectionType }> + +export { + defaultCellDataGetter as defaultTableCellDataGetter, + defaultCellRenderer as defaultTableCellRenderer, + defaultHeaderRenderer as defaultTableHeaderRenderer, + defaultHeaderRowRenderer as defaultTableHeaderRowRenderer, + defaultRowRenderer as defaultTableRowRenderer, + SortIndicator +} \ No newline at end of file diff --git a/package.json b/package.json index 1f7a84b22..aee1b3a04 100644 --- a/package.json +++ b/package.json @@ -160,5 +160,6 @@ "transform": [ "loose-envify" ] - } + }, + "types": "" } diff --git a/source/Table/Table.js b/source/Table/Table.js index 02329e217..019c15890 100644 --- a/source/Table/Table.js +++ b/source/Table/Table.js @@ -5,6 +5,7 @@ import React, { PropTypes, PureComponent } from 'react' import { findDOMNode } from 'react-dom' import Grid from '../Grid' import defaultRowRenderer from './defaultRowRenderer' +import defaultHeaderRowRenderer from './defaultHeaderRowRenderer' import SortDirection from './SortDirection' /** @@ -155,6 +156,20 @@ export default class Table extends PureComponent { */ rowRenderer: PropTypes.func, + /** + * Responsible for rendering a table row given an array of columns: + * Should implement the following interface: ({ + * className: string, + * columns: any[], + * rowData: any, + * style: any, + * scrollbarWidth: number, + * height: number, + * width: number + * }): PropTypes.node + */ + headerRowRenderer: PropTypes.func, + /** Optional custom inline style to attach to table rows. */ rowStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired, @@ -199,6 +214,7 @@ export default class Table extends PureComponent { onScroll: () => null, overscanRowCount: 10, rowRenderer: defaultRowRenderer, + headerRowRenderer: defaultHeaderRowRenderer, rowStyle: {}, scrollToAlignment: 'auto', style: {} @@ -295,18 +311,14 @@ export default class Table extends PureComponent { style={style} > {!disableHeader && ( -
- {this._getRenderedHeaderRow()} -
+ this.props.headerRowRenderer({ + className:cn('ReactVirtualized__Table__headerRow', rowClass), + style: rowStyleObject, + height: headerHeight, + scrollbarWidth, + width, + columns: this._getRenderedHeaderRow() + }) )} + {columns} + +} diff --git a/source/Table/index.js b/source/Table/index.js index a91ee8774..45dcca9b6 100644 --- a/source/Table/index.js +++ b/source/Table/index.js @@ -2,6 +2,7 @@ export default from './Table' export defaultCellDataGetter from './defaultCellDataGetter' export defaultCellRenderer from './defaultCellRenderer' +export defaultHeaderRowRenderer from './defaultHeaderRowRenderer.js' export defaultHeaderRenderer from './defaultHeaderRenderer' export defaultRowRenderer from './defaultRowRenderer' export Table from './Table' diff --git a/source/Table/types.js b/source/Table/types.js index a8ad7966e..0f51b6f8f 100644 --- a/source/Table/types.js +++ b/source/Table/types.js @@ -1,4 +1,5 @@ /** @flow */ +import Column from './Column'; export type CellDataGetterParams = { columnData: ?any, @@ -14,6 +15,15 @@ export type CellRendererParams = { rowIndex: number }; +export type HeaderRowRendererParams = { + className: string, + columns: any[], + style: any, + scrollbarWidth: number, + height: number, + width: number +}; + export type HeaderRendererParams = { columnData: ?any, dataKey: string, @@ -25,7 +35,7 @@ export type HeaderRendererParams = { export type RowRendererParams = { className: string, - columns: Array, + columns: any[], index: number, isScrolling: boolean, onRowClick: ?Function, diff --git a/source/index.js b/source/index.js index bd7516cc2..8ea24c422 100644 --- a/source/index.js +++ b/source/index.js @@ -11,6 +11,7 @@ export { defaultCellDataGetter as defaultTableCellDataGetter, defaultCellRenderer as defaultTableCellRenderer, defaultHeaderRenderer as defaultTableHeaderRenderer, + defaultHeaderRowRenderer as defaultTableHeaderRowRenderer, defaultRowRenderer as defaultTableRowRenderer, Table, Column, From ee8d4289d39356765d7fc80037a49f6cdbea67a3 Mon Sep 17 00:00:00 2001 From: Kalle Ott Date: Tue, 28 Feb 2017 10:27:57 +0100 Subject: [PATCH 2/6] some code cleanup --- index.d.ts | 1 + source/Table/Column.js | 2 +- source/Table/Table.js | 2 +- source/Table/defaultHeaderRowRenderer.js | 7 +++---- source/Table/types.js | 2 -- 5 files changed, 6 insertions(+), 8 deletions(-) diff --git a/index.d.ts b/index.d.ts index 308175ede..be4fade1a 100644 --- a/index.d.ts +++ b/index.d.ts @@ -193,6 +193,7 @@ export interface TableProps { rowGetter?: (info: { index: number }) => any; rowHeight: number | ((info: { index: number }) => number); rowRenderer?: RowRenderer; + headerRowRenderer?: HeaderRowRenderer; rowStyle?: React.CSSProperties | ((info: { index: number }) => React.CSSProperties); scrollToAlignment?: string; scrollToIndex?: number; diff --git a/source/Table/Column.js b/source/Table/Column.js index d18bf0d23..8edbd0c84 100644 --- a/source/Table/Column.js +++ b/source/Table/Column.js @@ -21,7 +21,7 @@ export default class Column extends Component { /** * Callback responsible for rendering a cell's contents. * ({ cellData: any, columnData: any, dataKey: string, rowData: any, rowIndex: number }): node - */ + */ cellRenderer: PropTypes.func, /** Optional CSS class to apply to cell */ diff --git a/source/Table/Table.js b/source/Table/Table.js index 019c15890..a74b87cb0 100644 --- a/source/Table/Table.js +++ b/source/Table/Table.js @@ -312,7 +312,7 @@ export default class Table extends PureComponent { > {!disableHeader && ( this.props.headerRowRenderer({ - className:cn('ReactVirtualized__Table__headerRow', rowClass), + className: cn('ReactVirtualized__Table__headerRow', rowClass), style: rowStyleObject, height: headerHeight, scrollbarWidth, diff --git a/source/Table/defaultHeaderRowRenderer.js b/source/Table/defaultHeaderRowRenderer.js index 859345c7e..1a395bf28 100644 --- a/source/Table/defaultHeaderRowRenderer.js +++ b/source/Table/defaultHeaderRowRenderer.js @@ -1,16 +1,15 @@ /** @flow */ import React from 'react' -import type { HeaderRendererParams, HeaderRowRendererParams } from './types' -import Column from './Column' +import type { HeaderRowRendererParams } from './types' -export default function defaultHeaderRowRenderer({ +export default function defaultHeaderRowRenderer ({ className, style, height, width, scrollbarWidth, columns -}:HeaderRowRendererParams) { +}: HeaderRowRendererParams) { return
Date: Tue, 28 Feb 2017 10:46:42 +0100 Subject: [PATCH 3/6] removed unnecessary types property in package.json --- package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/package.json b/package.json index 7f042de74..a90164ed4 100644 --- a/package.json +++ b/package.json @@ -160,6 +160,5 @@ "transform": [ "loose-envify" ] - }, - "types": "" + } } From eda5e8d1d317f7cfd49b5232314b7cea05fc68da Mon Sep 17 00:00:00 2001 From: Kalle Ott Date: Tue, 28 Feb 2017 14:25:34 +0100 Subject: [PATCH 4/6] removed blank space --- source/Table/Column.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/Table/Column.js b/source/Table/Column.js index 8edbd0c84..d18bf0d23 100644 --- a/source/Table/Column.js +++ b/source/Table/Column.js @@ -21,7 +21,7 @@ export default class Column extends Component { /** * Callback responsible for rendering a cell's contents. * ({ cellData: any, columnData: any, dataKey: string, rowData: any, rowIndex: number }): node - */ + */ cellRenderer: PropTypes.func, /** Optional CSS class to apply to cell */ From d0f2f3e9816729a1782308ca6cffc5bffd814477 Mon Sep 17 00:00:00 2001 From: Kalle Ott Date: Tue, 28 Feb 2017 14:29:01 +0100 Subject: [PATCH 5/6] specified TODOs in declaration file --- index.d.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/index.d.ts b/index.d.ts index be4fade1a..32420a6c3 100644 --- a/index.d.ts +++ b/index.d.ts @@ -57,19 +57,19 @@ export interface VirtualScrollProps { width: number; } export class VirtualScroll extends React.Component { } -// TODO +// TODO add proper typing export type CollectionProps = any; export class Collection extends React.Component { } -// TODO +// TODO add proper typing export type FlexTableProps = any; export class FlexTable extends React.Component { } -// TODO +// TODO add proper typing export type FlexColumnProps = any; export class FlexColumn extends React.Component { } -// TODO +// TODO add proper typing export type SortDirectionProps = any; export class SortDirection extends React.Component { } -// TODO +// TODO add proper typing export type GridProps = any; export class Grid extends React.Component { } From d5fb07b16a74d5bfad7c2d238482214efaf9559a Mon Sep 17 00:00:00 2001 From: Kalle Ott Date: Wed, 1 Mar 2017 09:12:19 +0100 Subject: [PATCH 6/6] removed type declarations the work on declarations will continue in the definitely typed repo --- index.d.ts | 356 ----------------------------------------------------- 1 file changed, 356 deletions(-) delete mode 100644 index.d.ts diff --git a/index.d.ts b/index.d.ts deleted file mode 100644 index 32420a6c3..000000000 --- a/index.d.ts +++ /dev/null @@ -1,356 +0,0 @@ -import * as React from "react"; - -export interface MultiGridProps { - fixedColumnCount: number; - fixedRowCount: number; - style: React.CSSProperties; - styleBottomLeftGrid: React.CSSProperties; - styleBottomRightGrid: React.CSSProperties; - styleTopLeftGrid: React.CSSProperties; - styleTopRightGrid: React.CSSProperties; -} -export const MultiGrid: React.ComponentClass; - -export type DefaultCellRangeRendererParams = { - cellCache: Object, - cellRenderer: Function, - columnSizeAndPositionManager: Object, - columnStartIndex: number, - columnStopIndex: number, - horizontalOffsetAdjustment: number, - isScrolling: boolean, - rowSizeAndPositionManager: Object, - rowStartIndex: number, - rowStopIndex: number, - scrollLeft: number, - scrollTop: number, - styleCache: Object, - verticalOffsetAdjustment: number, - visibleColumnIndices: Object, - visibleRowIndices: Object -}; - -export default function defaultCellRangeRenderer(params: DefaultCellRangeRendererParams): React.ReactElement; -/* - * Components - */ - -export interface VirtualScrollProps { - className?: string; - autoHeight?: boolean; - estimatedRowSize?: number; - height: number; - noRowsRenderer?: Function; - onRowsRendered?: (info: { overscanStartIndex: number, overscanStopIndex: number, startIndex: number, stopIndex: number }) => void; - onScroll?: (info: { clientHeight: number, scrollHeight: number, scrollTop: number }) => void; - overscanRowCount?: number; - rowHeight: number | ((info: { index: number }) => number); - rowRenderer: RowRenderer; - rowClassName?: string | ((info: { index: number }) => string); - rowCount: number; - rowStyle?: React.CSSProperties | ((info: { index: number }) => React.CSSProperties); - scrollToAlignment?: string; - scrollToIndex?: number; - scrollTop?: number; - style?: React.CSSProperties; - tabIndex?: number; - width: number; -} -export class VirtualScroll extends React.Component { } -// TODO add proper typing -export type CollectionProps = any; -export class Collection extends React.Component { } -// TODO add proper typing -export type FlexTableProps = any; -export class FlexTable extends React.Component { } -// TODO add proper typing -export type FlexColumnProps = any; -export class FlexColumn extends React.Component { } -// TODO add proper typing -export type SortDirectionProps = any; -export class SortDirection extends React.Component { } -// TODO add proper typing -export type GridProps = any; -export class Grid extends React.Component { } - -export interface ListProps { - className?: string; - autoHeight?: boolean; - estimatedRowSize?: number; - height: number; - noRowsRenderer?: Function; - onRowsRendered?: (info: { overscanStartIndex: number, overscanStopIndex: number, startIndex: number, stopIndex: number }) => void; - onScroll?: (info: { clientHeight: number, scrollHeight: number, scrollTop: number }) => void; - overscanRowCount?: number; - rowHeight: number | ((info: { index: number }) => number); - rowRenderer: RowRenderer; - rowCount: number; - scrollToAlignment?: string; - scrollToIndex?: number; - scrollTop?: number; - style?: React.CSSProperties; - tabIndex?: number; - width: number; -} -export class List extends React.Component { } - -export type CellDataGetterParams = { - columnData?: any, - dataKey: string, - rowData: any -}; -export type CellRendererParams = { - cellData?: any, - columnData?: any, - dataKey: string, - rowData: any, - rowIndex: number -}; - -export type HeaderRendererParams = { - columnData?: any, - dataKey: string, - disableSort?: boolean, - label?: string, - sortBy?: string, - sortDirection?: SortDirectionType -}; - -export type HeaderRowRendererParams = { - className: string, - columns: React.ReactNode[], - style: React.CSSProperties, - scrollbarWidth: number, - height: number, - width: number -}; - -export type RowRendererParams = { - className: string, - columns: Array, - index: number, - isScrolling: boolean, - onRowClick?: Function, - onRowDoubleClick?: Function, - onRowMouseOver?: Function, - onRowMouseOut?: Function, - rowData: any, - style: any -}; - -export type CellDataGetter = (params: CellDataGetterParams) => React.ReactNode; -export type CellRenderer = (params: CellRendererParams) => React.ReactNode; -export type HeaderRenderer = (params: HeaderRendererParams) => React.ReactNode; -export type HeaderRowRenderer = (params: HeaderRowRendererParams) => React.ReactNode; -export type RowRenderer = (params: RowRendererParams) => React.ReactNode; - -// https://github.com/bvaughn/react-virtualized/blob/master/docs/Column.md -export interface ColumnProps { - cellDataGetter?: CellDataGetter; - cellRenderer?: CellRenderer; - className?: string; - columnData?: any; - dataKey: any; - disableSort?: boolean; - flexGrow?: number; - flexShrink?: number; - headerClassName?: string; - headerRenderer?: HeaderRenderer; - label?: string; - maxWidth?: number; - minWidth?: number; - style?: React.CSSProperties; - width: number; -} - -export class Column extends React.Component { } - -// ref: https://github.com/bvaughn/react-virtualized/blob/master/docs/Table.md -export interface TableProps { - autoHeight?: boolean; - children?: React.ReactNode; - className?: string; - disableHeader?: boolean; - estimatedRowSize?: number; - gridClassName?: string; - gridStyle?: any; - headerClassName?: string; - headerHeight: number; - headerStyle?: any; - height: number; - id?: string; - noRowsRender?: () => void; - onHeaderClick?: (dataKey: string, columnData: any) => void; - onRowClick?: (info: { index: number }) => void; - onRowDoubleClick?: (info: { index: number }) => void; - onRowMouseOut?: (info: { index: number }) => void; - onRowMouseOver?: (info: { index: number }) => void; - onRowsRendered?: (info: { index: number }) => void; - overscanRowCount?: number; - onScroll?: (info: { clientHeight: number, scrollHeight: number, scrollTop: number }) => void; - rowClassName?: string | ((info: { index: number }) => string); - rowCount: number; - rowGetter?: (info: { index: number }) => any; - rowHeight: number | ((info: { index: number }) => number); - rowRenderer?: RowRenderer; - headerRowRenderer?: HeaderRowRenderer; - rowStyle?: React.CSSProperties | ((info: { index: number }) => React.CSSProperties); - scrollToAlignment?: string; - scrollToIndex?: number; - scrollTop?: number; - sort?: (info: { sortBy: string, sortDirection: SortDirectionType }) => void; - sortBy?: string; - sortDirection?: SortDirectionType; - style?: React.CSSProperties; - tabIndex?: number; - width: number; -} - -export class Table extends React.Component { } - -/* - * Higher-Order Components - */ - -export interface AutoSizerProps { - disableHeight?: boolean; - disableWidth?: boolean; - onResize?: (info: { height: number, width: number }) => any; -} -export class AutoSizer extends React.Component { } - -export interface ArrowKeyStepperProps { - children?: React.StatelessComponent<{ - onSectionRendered: Function, - scrollToColumn: number, - scrollToRow: number - }>; - className?: string; - columnCount: number; - rowCount: number; -} -export class ArrowKeyStepper extends React.Component { } - -export interface CellMeasurerProps { - cellRenderer: (info: { columnIndex: number, rowIndex: number }) => React.ReactNode; - cellSizeCache?: { - clearAllColumnWidths(): void; - clearAllRowHeights(): void; - clearColumnWidth(index: number): void; - clearRowHeight(index: number): void; - getColumnWidth(index: number): number; - getRowHeight(index: number): number; - hasColumnWidth(index: number): boolean; - hasRowHeight(index: number): boolean; - setColumnWidth(index: number, width: number): void; - setRowHeight(index: number, height: number): void; - }; - children?: React.StatelessComponent<{ - getColumnWidth: () => number, - getRowHeight: () => number, - resetMeasurements: () => any, - resetMeasurementsForColumn: (index: number) => any, - resetMeasurementsForRow: (index: number) => any, - }>; - columnCount: number; - container?: React.ReactType; - height?: number; - rowCount: number; - width?: number; -} -export class CellMeasurer extends React.Component { } - -export interface ColumnSizerProps { - children?: React.StatelessComponent<{ adjustedWidth: number, getColumnWidth: () => number, registerChild: any }>; - columnMaxWidth?: number; - columnMinWidth?: number; - columnCount?: number; - width: number; -} -export class ColumnSizer extends React.Component { } - -export type InfiniteLoaderProps = any; -export class InfiniteLoader extends React.Component { } - -export type ScrollSyncProps = any; -export class ScrollSync extends React.Component { } - -export module WindowScroller { - export type OnResizeArg = { - height: number; - } - export type OnScrollArg = { - scrollTop: number; - } - export type RenderCallbackArg = { - height: number; - scrollTop: number; - isScrolling: boolean; - } - export type Props = { - onScroll?: (arg: OnScrollArg) => void; - onResize?: (arg: OnResizeArg) => void; - // TODO `children` should be typed here - }; -} -export class WindowScroller extends React.Component { } - - -declare class DefaultCellSizeCache { - constructor({ - uniformRowHeight, - uniformColumnWidth - }?: { uniformColumnWidth: boolean, uniformRowHeight: boolean }); - - clearAllColumnWidths(): void; - - clearAllRowHeights(): void; - - clearColumnWidth(index: any): void; - - clearRowHeight(index: any): void; - - getColumnWidth(index: any): number | undefined; - - getRowHeight(index: any): number | undefined; - - setColumnWidth(index: any, width: number): void; - - setRowHeight(index: any, height: number): void; -} - -export type IdCellSizeCacheConstructorParams = { - indexToIdMap: Function, - uniformRowHeight?: boolean, - uniformColumnWidth?: boolean -}; -declare function idCellSizeCache({ - indexToIdMap, - uniformColumnWidth, - uniformRowHeight -}: IdCellSizeCacheConstructorParams): DefaultCellSizeCache; - -export { - DefaultCellSizeCache as defaultCellMeasurerCellSizeCache, - DefaultCellSizeCache as uniformSizeCellMeasurerCellSizeCache, // 7.21 backwards compatible export - idCellSizeCache as idCellMeasurerCellSizeCache -}; - -declare const defaultCellDataGetter: CellDataGetter; -declare const defaultCellRenderer: CellRenderer; -declare const defaultHeaderRowRenderer: HeaderRowRenderer; -declare const defaultHeaderRenderer: HeaderRenderer; -declare const defaultRowRenderer: RowRenderer; - -export type SortDirectionType = 'ASC' | 'DESC' - -declare function SortIndicator({ sortDirection }: { sortDirection: SortDirectionType }): React.StatelessComponent<{ sortDirection: SortDirectionType }> - -export { - defaultCellDataGetter as defaultTableCellDataGetter, - defaultCellRenderer as defaultTableCellRenderer, - defaultHeaderRenderer as defaultTableHeaderRenderer, - defaultHeaderRowRenderer as defaultTableHeaderRowRenderer, - defaultRowRenderer as defaultTableRowRenderer, - SortIndicator -} \ No newline at end of file