diff options
author | brunobar79 <brunobar79@gmail.com> | 2018-10-17 02:01:54 +0800 |
---|---|---|
committer | brunobar79 <brunobar79@gmail.com> | 2018-10-17 02:01:54 +0800 |
commit | 13820b6cc1801a420f39cdfecd7ccb5309dc597b (patch) | |
tree | c79832d7077ab03e0afe0c322cb32b204865d8b5 /ui/app/components/modal/modal.component.js | |
parent | eeecee01540fbad50c4c463a3b1a54142a63f168 (diff) | |
parent | 07ab613d4c647e3fe554bc06eab8cfb833315a88 (diff) | |
download | tangerine-wallet-browser-13820b6cc1801a420f39cdfecd7ccb5309dc597b.tar.gz tangerine-wallet-browser-13820b6cc1801a420f39cdfecd7ccb5309dc597b.tar.zst tangerine-wallet-browser-13820b6cc1801a420f39cdfecd7ccb5309dc597b.zip |
fix conflicts
Diffstat (limited to 'ui/app/components/modal/modal.component.js')
-rw-r--r-- | ui/app/components/modal/modal.component.js | 80 |
1 files changed, 80 insertions, 0 deletions
diff --git a/ui/app/components/modal/modal.component.js b/ui/app/components/modal/modal.component.js new file mode 100644 index 000000000..2a75b559b --- /dev/null +++ b/ui/app/components/modal/modal.component.js @@ -0,0 +1,80 @@ +import React, { PureComponent } from 'react' +import PropTypes from 'prop-types' +import Button from '../button' + +export default class Modal extends PureComponent { + static propTypes = { + children: PropTypes.node, + // Header text + headerText: PropTypes.string, + onClose: PropTypes.func, + // Submit button (right button) + onSubmit: PropTypes.func, + submitType: PropTypes.string, + submitText: PropTypes.string, + // Cancel button (left button) + onCancel: PropTypes.func, + cancelType: PropTypes.string, + cancelText: PropTypes.string, + } + + static defaultProps = { + submitType: 'primary', + cancelType: 'default', + } + + render () { + const { + children, + headerText, + onClose, + onSubmit, + submitType, + submitText, + onCancel, + cancelType, + cancelText, + } = this.props + + return ( + <div className="modal-container"> + { + headerText && ( + <div className="modal-container__header"> + <div className="modal-container__header-text"> + { headerText } + </div> + <div + className="modal-container__header-close" + onClick={onClose} + /> + </div> + ) + } + <div className="modal-container__content"> + { children } + </div> + <div className="modal-container__footer"> + { + onCancel && ( + <Button + type={cancelType} + onClick={onCancel} + className="modal-container__footer-button" + > + { cancelText } + </Button> + ) + } + <Button + type={submitType} + onClick={onSubmit} + className="modal-container__footer-button" + > + { submitText } + </Button> + </div> + </div> + ) + } +} |