1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00

update react-bootstrap first cut

This commit is contained in:
Tim Daubenschütz 2015-08-05 16:49:25 +02:00
parent c31acd4317
commit f3e378f221
4 changed files with 74 additions and 17 deletions

View File

@ -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>
);
}
});

View File

@ -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;

View File

@ -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>
);
},

View File

@ -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",