Vulcan/packages/vulcan-ui-bootstrap/lib/components/ui/Modal.jsx

41 lines
1.3 KiB
React
Raw Normal View History

2018-05-01 01:22:49 +01:00
import { registerComponent } from 'meteor/vulcan:lib';
import React from 'react';
import PropTypes from 'prop-types';
import Modal from 'react-bootstrap/lib/Modal'
2018-12-28 08:52:40 +09:00
const BootstrapModal = ({ children, size = 'lg', show = false, onHide, title, showCloseButton = true, header, footer, ...rest }) => {
2018-05-01 01:22:49 +01:00
let headerComponent;
if (header) {
headerComponent = <Modal.Header>{header}</Modal.Header>;
} else if (title) {
headerComponent = <Modal.Header closeButton={showCloseButton}><Modal.Title>{title}</Modal.Title></Modal.Header>;
} else {
headerComponent = <Modal.Header closeButton={showCloseButton}></Modal.Header>;
}
const footerComonent = footer ? <Modal.Footer>{footer}</Modal.Footer> : null;
2018-05-01 01:22:49 +01:00
return (
2018-12-28 08:52:40 +09:00
<Modal size={size} show={show} onHide={onHide} {...rest}>
{headerComponent}
2018-05-01 01:22:49 +01:00
<Modal.Body>
{children}
</Modal.Body>
{footerComonent}
2018-05-01 01:22:49 +01:00
</Modal>
);
};
BootstrapModal.propTypes = {
size: PropTypes.string,
show: PropTypes.bool,
showCloseButton: PropTypes.bool,
onHide: PropTypes.func,
title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
header: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
footer: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
2018-05-01 01:22:49 +01:00
}
registerComponent('Modal', BootstrapModal);