import { memo , useContext } from 'react' ; import type { GridChildComponentProps } from 'react-window' ; import styles from './MatrixVis.module.css' ; import { SettingsContext } from './context' ; function Cell ( props ) { const { rowIndex , columnIndex , style } = props ; const { cellFormatter } = useContext ( SettingsContext ) ; if ( rowIndex * columnIndex === 0 ) { return null ; } return ( < div className = { styles . cell } style = { style } role = "cell" aria - rowindex = { rowIndex } aria - colindex = { columnIndex } data - bg = { ( rowIndex + columnIndex ) % 2 === 1 || undefined } > { cellFormatter ( rowIndex - 1 , columnIndex - 1 ) } < /div>); } export default memo ( Cell ) ;