diff --git a/src/js/sw/primitives/menu.js b/src/js/sw/primitives/menu.js index b939c46..b7cba2f 100644 --- a/src/js/sw/primitives/menu.js +++ b/src/js/sw/primitives/menu.js @@ -17,13 +17,20 @@ export function Menu({ items = [], anchor, open, direction = 'down-right', onSel const selectableItems = items.filter(i => !i.divider && !i.disabled); // Position relative to anchor + // When the surface uses CSS transform: scale(), getBoundingClientRect() + // returns scaled coordinates but position:fixed uses viewport coordinates. + // Dividing by the scale factor converts back to true viewport pixels. useEffect(() => { if (!open || !anchor) return; - const rect = typeof anchor.getBoundingClientRect === 'function' + const scale = window.sw?.shell?.getScale?.() || 1; + const raw = typeof anchor.getBoundingClientRect === 'function' ? anchor.getBoundingClientRect() : anchor; - const vw = window.innerWidth; - const vh = window.innerHeight; + const rect = scale !== 1 + ? { top: raw.top / scale, bottom: raw.bottom / scale, left: raw.left / scale, right: raw.right / scale } + : raw; + const vw = window.innerWidth / scale; + const vh = window.innerHeight / scale; let top, left; const [vDir, hDir] = direction.split('-');