Component using props instead of state

props.js

type Hexagon = {
  active: bool,
  col: number,
  row: number
};

type Props = {
  hexData: Array<Hexagon>,
  onClick: (Array<Hexagon>) => void
};

export default class Hexagons extends Component<Props> {
  componentDidMount() {
    this.hexGroup = d3.select(this.svg).append('g');
    this.hexGroup.selectAll('.hex')
      .data(this.props.hexData)
      .enter()
        .append('path')
          ...
          .on('click', d => {
            d3.event.preventDefault();
            d3.event.stopPropagation();
            this.props.onClick(this.props.hexData.map(hex => toggleHex(d, hex)));
          })
    
  }

  render() {
    ...
  }
}