Модальное окно Reactstrap под iframe в приложении response.js

Я создаю приложение в react.js, и я использовал response-frame-component для создания iframe. В этом iframe я написал код для Modal (reactstrap). Это модальное окно открывается в окне моего приложения. Я хочу, чтобы он открывался только в этом iframe.

Создана соответствующая проблема в репозитории responsestrap git. Сообщите мне, если вы знаете способ перезаписать объект документа Modal. выпуск: https://github.com/reactstrap/reactstrap/issues/1326

ссылка на приложение: https://q8lp3kyr5w.codesandbox.io/

код: https://codesandbox.io/s/q8lp3kyr5w

Компонент

import React from "react";
import ReactDOM from "react-dom";
import { Modal, ModalBody, Button } from "reactstrap";
import Frame from "react-frame-component";
import "bootstrap/dist/css/bootstrap.min.css";
import "./styles.css";

class ModalComp extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      modal: false
    };

    this.toggle = this.toggle.bind(this);
  }

  toggle() {
    this.setState({ modal: !this.state.modal });
  }

  render() {
    return (
      <div>
        <Frame>
          <Button onClick = {this.toggle}>Toggle Modal</Button>
          <Modal isOpen = {this.state.modal} toggle = {this.toggle}>
            <ModalBody>
              <br />
              Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum,
              ipsam? A id numquam inventore, cumque debitis similique eos
              maiores provident? Sed alias odit fuga, repellat ducimus
              voluptatum aliquid quis pariatur?
            </ModalBody>
          </Modal>
        </Frame>
      </div>
    );
  }
}

const App = () => (
  <div>
    <b>How to open modal in this iframe?</b>
    <ModalComp />
  </div>
);

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

css:

.App {
  font-family: sans-serif;
  text-align: center;
}