/**

* You will want to include this bit of css

*

* .modal-container {

* position: relative;

* }

* .modal-container .modal, .modal-container .modal-backdrop {

* position: absolute;

* }

*/

const Trigger = React.createClass({

getInitialState() {

return { show: false };

},

render() {

let close = () => this.setState({ show: false});

return (

<div className="modal-container" style={{height: 200}}>

<Button

bsStyle="primary"

bsSize="large"

onClick={() => this.setState({ show: true})}

>

Launch contained modal

</Button>

<Modal

show={this.state.show}

onHide={close}

container={this}

aria-labelledby="contained-modal-title"

>

<Modal.Header closeButton>

<Modal.Title id="contained-modal-title">Contained Modal</Modal.Title>

</Modal.Header>

<Modal.Body>

Elit est explicabo ipsum eaque dolorem blanditiis doloribus sed id ipsam, beatae, rem fuga id earum? Inventore et facilis obcaecati.

</Modal.Body>

<Modal.Footer>

<Button onClick={close}>Close</Button>

</Modal.Footer>

</Modal>

</div>

);

}

});

ReactDOM.render(<Trigger />, mountNode);