fix: Prevent potential page scroll on context menu open

This commit is contained in:
Tom Moor
2023-10-11 22:17:18 -04:00
parent b63cd67c24
commit ffbe4c1b80

View File

@@ -137,7 +137,8 @@ const InnerContextMenu = (props: InnerContextMenuProps) => {
// kind of hacky, but this is an effective way of telling which way
// the menu will _actually_ be placed when taking into account screen
// positioning.
const topAnchor = menuProps.style?.top === "0";
const topAnchor =
menuProps.style?.top === "0" || menuProps.style?.position === "fixed";
const rightAnchor = menuProps.placement === "bottom-end";
const backgroundRef = React.useRef<HTMLDivElement>(null);
const isMobile = useMobile();
@@ -162,6 +163,13 @@ const InnerContextMenu = (props: InnerContextMenuProps) => {
};
}, [props.isSubMenu, props.visible]);
const style =
topAnchor && !isMobile
? {
maxHeight,
}
: undefined;
return (
<>
{isMobile && (
@@ -181,13 +189,7 @@ const InnerContextMenu = (props: InnerContextMenuProps) => {
rightAnchor={rightAnchor}
ref={backgroundRef}
hiddenScrollbars
style={
topAnchor && !isMobile
? {
maxHeight,
}
: undefined
}
style={style}
>
{props.visible || props.animating ? props.children : null}
</Background>