mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-03-11 21:27:05 +00:00
Modal component exports from common components
This commit is contained in:
parent
c554d78795
commit
1118393cf7
6 changed files with 34 additions and 32 deletions
27
src/common/Modal/Modal.js
Normal file
27
src/common/Modal/Modal.js
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
import { PureComponent } from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import classnames from 'classnames';
|
||||
import styles from './styles';
|
||||
|
||||
class Modal extends PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.root = document.createElement('div');
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
document.body.appendChild(this.root);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
document.body.removeChild(this.root);
|
||||
}
|
||||
|
||||
render() {
|
||||
this.root.className = classnames(styles['modal-container'], this.props.className);
|
||||
return ReactDOM.createPortal(this.props.children, this.root);
|
||||
}
|
||||
}
|
||||
|
||||
export default Modal;
|
||||
3
src/common/Modal/index.js
Normal file
3
src/common/Modal/index.js
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
import Modal from './Modal';
|
||||
|
||||
export default Modal;
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
.overlay-container {
|
||||
.modal-container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
import { PureComponent } from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import classnames from 'classnames';
|
||||
import styles from './styles';
|
||||
|
||||
class OverlayLayer extends PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.layerRoot = document.createElement('div');
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
document.body.appendChild(this.layerRoot);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
document.body.removeChild(this.layerRoot);
|
||||
}
|
||||
|
||||
render() {
|
||||
this.layerRoot.className = classnames(styles['overlay-container'], this.props.className);
|
||||
return ReactDOM.createPortal(this.props.children, this.layerRoot);
|
||||
}
|
||||
}
|
||||
|
||||
export default OverlayLayer;
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
import OverlayLayer from './OverlayLayer';
|
||||
|
||||
export default OverlayLayer;
|
||||
|
|
@ -1,9 +1,11 @@
|
|||
import Checkbox from './Checkbox';
|
||||
import PopupMenu from './PopupMenu';
|
||||
import NavBar from './NavBar';
|
||||
import Modal from './Modal';
|
||||
|
||||
export {
|
||||
Checkbox,
|
||||
PopupMenu,
|
||||
NavBar
|
||||
NavBar,
|
||||
Modal
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in a new issue