From cc467c3f570c2593ced783a35e6c026053f80f1f Mon Sep 17 00:00:00 2001 From: Raymond Jacobson Date: Tue, 6 Aug 2024 22:47:04 -0700 Subject: [PATCH 1/2] [QA-1446] Fix popup alignment --- packages/harmony/src/components/popup/Popup.tsx | 7 +++---- packages/web/src/components/menu/Menu.tsx | 1 + 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/harmony/src/components/popup/Popup.tsx b/packages/harmony/src/components/popup/Popup.tsx index b9b0ca96e44..ad84b35b2aa 100644 --- a/packages/harmony/src/components/popup/Popup.tsx +++ b/packages/harmony/src/components/popup/Popup.tsx @@ -55,12 +55,11 @@ const getComputedOrigins = ( let containerWidth, containerHeight if (containerRef && containerRef.current) { + const containerRect = containerRef.current.getBoundingClientRect() containerWidth = - containerRef.current.getBoundingClientRect().width - - CONTAINER_INSET_PADDING + containerRect.width + containerRect.x - CONTAINER_INSET_PADDING containerHeight = - containerRef.current.getBoundingClientRect().height - - CONTAINER_INSET_PADDING + containerRect.height + containerRect.y - CONTAINER_INSET_PADDING } else { containerWidth = portal.getBoundingClientRect().width - CONTAINER_INSET_PADDING diff --git a/packages/web/src/components/menu/Menu.tsx b/packages/web/src/components/menu/Menu.tsx index 79d9f66f698..d98d40d25c4 100644 --- a/packages/web/src/components/menu/Menu.tsx +++ b/packages/web/src/components/menu/Menu.tsx @@ -31,6 +31,7 @@ const Menu = forwardRef((props, ref) => { items={items} onClose={onClose} anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }} + transformOrigin={{ vertical: 'top', horizontal: 'left' }} ref={ref} renderTrigger={children} zIndex={zIndex} From 5b904fe18e1bb22c131e0705e92c9cc7e51cce69 Mon Sep 17 00:00:00 2001 From: Raymond Jacobson Date: Tue, 6 Aug 2024 22:50:16 -0700 Subject: [PATCH 2/2] Update portal version --- packages/harmony/src/components/popup/Popup.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/harmony/src/components/popup/Popup.tsx b/packages/harmony/src/components/popup/Popup.tsx index ad84b35b2aa..8e6344f92a4 100644 --- a/packages/harmony/src/components/popup/Popup.tsx +++ b/packages/harmony/src/components/popup/Popup.tsx @@ -61,10 +61,9 @@ const getComputedOrigins = ( containerHeight = containerRect.height + containerRect.y - CONTAINER_INSET_PADDING } else { - containerWidth = - portal.getBoundingClientRect().width - CONTAINER_INSET_PADDING - containerHeight = - portal.getBoundingClientRect().height - CONTAINER_INSET_PADDING + const portalRect = portal.getBoundingClientRect() + containerWidth = portalRect.width + portalRect.x - CONTAINER_INSET_PADDING + containerHeight = portalRect.height + portalRect.y - CONTAINER_INSET_PADDING } // Get new wrapper position