Modal ReactJs usando Javascript y CSS

Cómo agregar la ventana modal reactjs con la etiqueta final del cuerpo para establecer el posicionamiento modal absoluto con la etiqueta corporal.

Aquí hay un ejemplo agregado dentro del otro componente.

<div className="modal">
  <p>Model Pop-up <button onClick={this.handleClick}>here</button></p>
    <div id="js-modal-inner" className="modal">
      <div className="modal__content js-dialog">
        <a className="modal__close" onClick={this.handleClose}>&times;</a>
        <header className="modal__header">
          <h2 className="modal__title">Split Ticket:</h2>
        </header>
        <div className="modal__content--inner">
          {this.props.children}
        </div>
      </div>
    </div>
    <div className="modal__overlay js-fade"></div>
  </div> 

Respuestas a la pregunta(1)

Su respuesta a la pregunta