update react-bootstrap first cut

js/components/ascribe_buttons/delete_button.js

@@ -11,10 +11,10 @@ import PieceDeleteForm from '../ascribe_forms/form_delete_piece';
 import EditionRemoveFromCollectionForm from '../ascribe_forms/form_remove_editions_from_collection';
 import PieceRemoveFromCollectionForm from '../ascribe_forms/form_remove_piece_from_collection';
 
-import ModalWrapper from '../ascribe_modal/modal_wrapper';
+import AscribeModal from '../ascribe_modal/ascribe_modal';
 
 import { getAvailableAcls } from '../../utils/acl_utils';
-import { getLangText } from '../../utils/lang_utils.js';
+import { getLangText } from '../../utils/lang_utils';
 
 
 let DeleteButton = React.createClass({
@@ -66,12 +66,11 @@ let DeleteButton = React.createClass({
             return null;
         }
         return (
-            <ModalWrapper
-                button={btnDelete}
-                handleSuccess={this.props.handleSuccess}
+            <AscribeModal
+                trigger={btnDelete}
                 title={title}>
                 {content}
-            </ModalWrapper>
+            </AscribeModal>
         );
     }
 });

js/components/ascribe_modal/ascribe_modal.js

@@ -0,0 +1,63 @@
+'use strict';
+
+import React from 'react';
+
+import Modal from 'react-bootstrap/lib/Modal';
+
+let AscribeModal = React.createClass({
+
+    propTypes: {
+        trigger: React.PropTypes.element.isRequired,
+        title: React.PropTypes.oneOfType([
+            React.PropTypes.arrayOf(React.PropTypes.element),
+            React.PropTypes.element,
+            React.PropTypes.string
+        ]).isRequired,
+        children: React.PropTypes.oneOfType([
+            React.PropTypes.arrayOf(React.PropTypes.element),
+            React.PropTypes.element
+        ]).isRequired,
+        footer: React.PropTypes.oneOfType([
+            React.PropTypes.arrayOf(React.PropTypes.element),
+            React.PropTypes.element,
+            React.PropTypes.string
+        ]).isRequired
+    },
+
+    getInitialState(){
+        return {
+            modalBody: null
+        };
+    },
+
+    close() {
+        this.setState({ showModal: false });
+    },
+
+    open() {
+        this.setState({ showModal: true });
+    },
+
+    render() {
+
+        let trigger = React.cloneElement(this.props.trigger, {onClick: this.open});
+
+        return (
+            <span>
+                {trigger}
+                <Modal show={this.state.showModal} onHide={this.close}>
+                    <Modal.Header closeButton>
+                        <Modal.Title>
+                            {this.props.title}
+                        </Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body ref="modalBody">
+                        {this.props.children}
+                    </Modal.Body>
+                </Modal>
+            </span>
+        );
+    }
+});
+
+export default AscribeModal;

js/components/ascribe_modal/modal_wrapper.js

@@ -5,7 +5,6 @@ import ReactAddons from 'react/addons';
 
 import Modal from 'react-bootstrap/lib/Modal';
 import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger';
-import ModalTrigger from 'react-bootstrap/lib/ModalTrigger';
 import Tooltip from 'react-bootstrap/lib/Tooltip';
 
 import ModalMixin from '../../mixins/modal_mixin';
@@ -22,15 +21,11 @@ let ModalWrapper = React.createClass({
 
     getModalTrigger() {
         return (
-            <ModalTrigger modal={
-                <ModalBody
-                    title={this.props.title}
-                    handleSuccess={this.props.handleSuccess}>
-                    {this.props.children}
-                </ModalBody>
-            }>
-            {this.props.button}
-            </ModalTrigger>
+            <ModalBody
+                title={this.props.title}
+                handleSuccess={this.props.handleSuccess}>
+                {this.props.children}
+            </ModalBody>
         );
     },
 

package.json

@@ -71,7 +71,7 @@
     "q": "^1.4.1",
     "raven-js": "^1.1.19",
     "react": "^0.13.2",
-    "react-bootstrap": "~0.22.6",
+    "react-bootstrap": "^0.24.3",
     "react-datepicker": "~0.8.0",
     "react-progressbar": "^1.1.0",
     "react-router": "^0.13.3",