Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-19 18:02:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

menuMatchLabelWidth prop added to Popup

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-08-21 15:20:28 +03:00
parent 77b79e468a
commit 98870bf296
1 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/common/Popup/Popup.js
View file

@ -3,7 +3,7 @@ const PropTypes = require('prop-types');
const { Modal } = require('stremio-router');
const styles = require('./styles');
const Popup = ({ open = false, renderLabel, renderMenu, onCloseRequest }) => {
const Popup = ({ open = false, menuMatchLabelWidth = false, renderLabel, renderMenu, onCloseRequest }) => {
const labelRef = React.useRef(null);
const menuRef = React.useRef(null);
React.useEffect(() => {
@ -28,6 +28,8 @@ const Popup = ({ open = false, renderLabel, renderMenu, onCloseRequest }) => {
return;
}
menuRef.current.removeAttribute('style');
const documentRect = document.documentElement.getBoundingClientRect();
const labelRect = labelRef.current.getBoundingClientRect();
const menuRect = menuRef.current.getBoundingClientRect();
@ -82,8 +84,13 @@ const Popup = ({ open = false, renderLabel, renderMenu, onCloseRequest }) => {
menuRef.current.style.maxWidth = leftMenuStyles.maxWidth;
}
if (menuMatchLabelWidth) {
menuRef.current.style.width = `${labelRect.width}px`;
menuRef.current.style.maxWidth = `${labelRect.width}px`;
}
menuRef.current.style.visibility = 'visible';
}, [open]);
}, [open, menuMatchLabelWidth]);
return (
<React.Fragment>
{renderLabel(labelRef)}
@ -103,6 +110,7 @@ const Popup = ({ open = false, renderLabel, renderMenu, onCloseRequest }) => {
Popup.propTypes = {
open: PropTypes.bool,
menuMatchLabelWidth: PropTypes.bool,
renderLabel: PropTypes.func.isRequired,
renderMenu: PropTypes.func.isRequired,
onCloseRequest: PropTypes.func.isRequired