import classNames from "classnames" ; import * as React from "react" ; import * as Classes from "../common/classes" ; import { IRowIndices } from "../common/grid" ; import { IClientCoordinates } from "../interactions/dragTypes" ; import { IIndexedResizeCallback } from "../interactions/resizable" ; import { Orientation } from "../interactions/resizeHandle" ; import { RegionCardinality , Regions } from "../regions" ; import { Header , IHeaderProps } from "./header" ; import { IRowHeaderCellProps , RowHeaderCell } from "./rowHeaderCell" ; deprecated export type IRowHeaderRenderer = ( rowIndex : number ) => React . ReactElement < IRowHeaderCellProps > ; export type RowHeaderRenderer = IRowHeaderRenderer ; export interface IRowHeights { minRowHeight ? : number ; maxRowHeight ? : number ; defaultRowHeight ? : number ; } export interface IRowHeaderProps extends IHeaderProps , IRowHeights , IRowIndices { /**
     * A callback invoked when user is done resizing the column
     */ onRowHeightChanged : IIndexedResizeCallback ; /**
     * Renders the cell for each row header
     */ rowHeaderCellRenderer ? : RowHeaderRenderer ; } export class RowHeader extends React . Component < IRowHeaderProps > { public static defaultProps = { rowHeaderCellRenderer : renderDefaultRowHeader , } ; public render ( ) { const { onRowHeightChanged , rowHeaderCellRenderer : renderHeaderCell , minRowHeight : minSize , maxRowHeight : maxSize , defaultRowHeight , rowIndexStart : indexStart , rowIndexEnd : indexEnd , ... spreadableProps } = this . props ; return ( < Header convertPointToIndex = { this . convertPointToRow } fullRegionCardinality = { RegionCardinality . FULL_ROWS } getCellExtremaClasses = { this . getCellExtremaClasses } getCellIndexClass = { Classes . rowCellIndexClass } getCellSize = { this . getRowHeight } getDragCoordinate = { this . getDragCoordinate } getIndexClass = { Classes . rowIndexClass } getMouseCoordinate = { this . getMouseCoordinate } ghostCellRenderer = { this . renderGhostCell } handleResizeEnd = { this . handleResizeEnd } handleSizeChanged = { this . handleSizeChanged } headerCellIsReorderablePropName = { "enableRowReordering" } headerCellIsSelectedPropName = { "isRowSelected" } headerCellRenderer = { renderHeaderCell } indexEnd = { indexEnd } indexStart = { indexStart } isCellSelected = { this . isCellSelected } isGhostIndex = { this . isGhostIndex } maxSize = { maxSize } minSize = { minSize } resizeOrientation = { Orientation . HORIZONTAL } selectedRegions = { [ ] } toRegion = { this . toRegion } wrapCells = { this . wrapCells } { ... spreadableProps } />); } private wrapCells = ( cells ) => { const { rowIndexStart , grid } = this . props ; const tableHeight = grid . getRect ( ) . height ; const scrollTopCorrection = this . props . grid . getCumulativeHeightBefore ( rowIndexStart ) ; const style = { height : tableHeight - scrollTopCorrection , transform : `translateY(${ scrollTopCorrection || 0 }px)` , } ; return ( < div style = { { height : tableHeight } } > < div className = { Classes . TABLE_ROW_HEADERS_CELLS_CONTAINER } style = { style } > { cells } < /div> < /div>); } ; private convertPointToRow = ( clientXOrY , useMidpoint ? ) => { const { locator } = this . props ; return locator != null ? locator . convertPointToRow ( clientXOrY , useMidpoint ) : null ; } ; private getCellExtremaClasses = ( index , indexEnd ) => { return this . props . grid . getExtremaClasses ( index , 0 , indexEnd , 1 ) ; } ; private getRowHeight = ( index ) => { return this . props . grid . getRowRect ( index ) . height ; } ; private getDragCoordinate = ( clientCoords ) => { return clientCoords [ 1 ] ; } ; private getMouseCoordinate = ( event ) => { return event . clientY ; } ; private handleResizeEnd = ( index , size ) => { this . props . onResizeGuide ( null ) ; this . props . onRowHeightChanged ( index , size ) ; } ; private handleSizeChanged = ( index , size ) => { const rect = this . props . grid . getRowRect ( index ) ; this . props . onResizeGuide ( [ rect . top + size ] ) ; } ; private isCellSelected = ( index ) => { return Regions . hasFullRow ( this . props . selectedRegions , index ) ; } ; private isGhostIndex = ( index ) => { return this . props . grid . isGhostIndex ( index , - 1 ) ; } ; private renderGhostCell = ( index , extremaClasses ) => { const rect = this . props . grid . getGhostCellRect ( index , 0 ) ; return ( < RowHeaderCell className = { classNames ( extremaClasses ) } index = { index } key = { Classes . rowIndexClass ( index ) } loading = { this . props . loading } style = { { height : `${ rect . height }px` } } />); } ; private toRegion = ( index1 , index2 ? ) => { return Regions . row ( index1 , index2 ) ; } ; } /**
 * A default implementation of `IRowHeaderRenderer` that displays 1-indexed
 * numbers for each row.
 */ export function renderDefaultRowHeader ( rowIndex ) { return < RowHeaderCell index = { rowIndex } name = { `${ rowIndex + 1 }` } />; }