title: Closing a react bootstrap modal with escape key
body: <p>I have 6 buttons which, when clicked, activate a modal. This is written in React. </p>
  
  <pre><code>//Since I have 6 different modals, giving each of them an id would distinguish them
  onCloseModal(id) {
      this.setState({
          open: false,
          modalShown: id
      })
  }
  
  render() {
      return (
          &lt;Modal onHide={this.onCloseModal.bind(this, item.id)} keyboard={true}&gt;
              &lt;Modal.Header closeButton={true} onHide={this.onCloseModal.bind(this)}&gt;
              &lt;/Modal.Header&gt;
          &lt;/Modal&gt;
      )
  }
  </code></pre>
  
  <p>I have <code>keyboard={true}</code>, which according to the documentation at <a href="https://react-bootstrap.github.io/components.html#modals-props" rel="noreferrer">https://react-bootstrap.github.io/components.html#modals-props</a>, pressing the Escape key would exit the modal. It isn't working however. I believe that I have everything set up because each of my buttons has a unique ID - why isn't the escape key responding?</p>
  
  <p>Here's an image of the modal in action.</p>
  
  <p><a href="https://i.stack.imgur.com/LriZ3.png" rel="noreferrer"><img src="https://i.stack.imgur.com/LriZ3.png" alt="enter image description here"></a></p>