26 lines
714 B
JavaScript
26 lines
714 B
JavaScript
|
import React from 'react';
|
||
|
|
import { PropTypes } from 'prop-types';
|
||
|
|
import './style.scss';
|
||
|
|
|
||
|
|
const Modal = props => (
|
||
|
|
<div className={`modal ${props.isModalOpen ? 'modal-open' : ''} ${props.modalOnMobileOnly ? 'modal-on-mobile-only' : ''} `}>
|
||
|
|
<div className="modal-inner">
|
||
|
|
{props.children}
|
||
|
|
<div role="button" tabIndex="0" onClick={props.closeModal} className="modal-close">x</div> {/* eslint-disable-line */}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
|
||
|
|
Modal.propTypes = {
|
||
|
|
isModalOpen: PropTypes.bool.isRequired,
|
||
|
|
children: PropTypes.shape({}).isRequired,
|
||
|
|
closeModal: PropTypes.func.isRequired,
|
||
|
|
modalOnMobileOnly: PropTypes.bool,
|
||
|
|
};
|
||
|
|
|
||
|
|
Modal.defaultProps = {
|
||
|
|
modalOnMobileOnly: false,
|
||
|
|
};
|
||
|
|
|
||
|
|
export default Modal;
|