import * as React from 'react' ; import * as PropTypes from 'prop-types' ; import { BoxProps as ReakitBoxProps } from 'reakit/ts/Box/Box' ; import _get from 'lodash/get' ; import { TableCell as _TableCell } from './styled' ; export type LocalTableCellProps = { children ? : React . ReactNode ; } ; export type TableCellProps = ReakitBoxProps & LocalTableCellProps ; export type TableCellState = { title : string | undefined ; } ; export const tableCellPropTypes = { children : PropTypes . node } ; export const tableCellDefaultProps = { children : undefined } ; export class TableCell extends React . Component < LocalTableCellProps , TableCellState > { static propTypes = tableCellPropTypes ; static defaultProps = tableCellDefaultProps ; state = { title : undefined } ; tableCellRef = React . createRef ( ) ; componentDidMount = ( ) => { if ( _get ( this , 'tableCellRef.current' ) ) { const cellIndex = this . tableCellRef . current . cellIndex ; const rowElement = this . tableCellRef . current . parentNode ; const bodyElement = rowElement . parentNode ; const tableElement = bodyElement . parentNode ; const tableElementChildren = _get ( tableElement , 'childNodes' , [ ] ) ; if ( tableElementChildren . length > 0 ) { NodeList . prototype . find = Array . prototype . find ; const headElement = tableElementChildren . find ( ( child ) => child . tagName === 'THEAD' ) ; if ( headElement && headElement . childNodes ) { const headRowElement = _get ( headElement , 'childNodes[0]' ) ; const headCellElement = _get ( headRowElement , `childNodes[${ cellIndex }]` ) ; this . setState ( { title : _get ( headCellElement , 'innerText' ) } ) ; } } } } ; render = ( ) => { const { children , ... props } = this . props ; const { title } = this . state ; return ( < _TableCell use = "td" data - content = { title } { ... props } elementRef = { this . tableCellRef } > { children } < /_TableCell>); } ; } const C = TableCell ; export default C ;