/
ConfirmDialoglComponent.jsx
75 lines (67 loc) · 2.03 KB
/
ConfirmDialoglComponent.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
import React from "react/addons";
import classNames from "classnames";
import DialogSeverity from "../constants/DialogSeverity";
import Util from "../helpers/Util";
import ModalComponent from "../components/ModalComponent";
var ConfirmDialogComponent = React.createClass({
displayName: "ConfirmDialogComponent",
propTypes: {
data: React.PropTypes.shape({
actionButtonLabel: React.PropTypes.string.isRequired,
message: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.node
]).isRequired,
severity: React.PropTypes.string.isRequired,
title: React.PropTypes.string.isRequired
}).isRequired,
onAccept: React.PropTypes.func,
onDismiss: React.PropTypes.func
},
getDefaultProps: function () {
return {
onAccept: Util.noop,
onDismiss: Util.noop
};
},
componentDidMount: function () {
if (this.props.data.severity === DialogSeverity.INFO) {
React.findDOMNode(this.refs.acceptButton).focus();
}
},
render: function () {
var props = this.props;
var data = props.data;
var className = classNames("dialog", data.severity);
return (
<ModalComponent
className={className}
dismissOnClickOutside={false}
ref="modalComponent"
onDestroy={props.onDismiss}>
<div className="modal-header">
{data.title}
</div>
<div className="modal-body">
{data.message}
</div>
<div className="modal-footer">
<button className="btn btn-lg btn-success btn-inverse"
ref="acceptButton"
tabIndex="2"
type="button"
onClick={props.onAccept}>
{data.actionButtonLabel}
</button>
<button className="btn btn-lg btn-default btn-inverse"
tabIndex="1"
type="button"
onClick={props.onDismiss}>
Cancel
</button>
</div>
</ModalComponent>
);
}
});
export default ConfirmDialogComponent;