mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-04-21 15:52:02 +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;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 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 Checkbox from './Checkbox';
|
||||||
import PopupMenu from './PopupMenu';
|
import PopupMenu from './PopupMenu';
|
||||||
import NavBar from './NavBar';
|
import NavBar from './NavBar';
|
||||||
|
import Modal from './Modal';
|
||||||
|
|
||||||
export {
|
export {
|
||||||
Checkbox,
|
Checkbox,
|
||||||
PopupMenu,
|
PopupMenu,
|
||||||
NavBar
|
NavBar,
|
||||||
|
Modal
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue