diff --git a/packages/app/src/components/ui/menu/menu-anchor.test.ts b/packages/app/src/components/ui/menu/menu-anchor.test.ts index d779714f0..ecdf438fe 100644 --- a/packages/app/src/components/ui/menu/menu-anchor.test.ts +++ b/packages/app/src/components/ui/menu/menu-anchor.test.ts @@ -68,8 +68,8 @@ describe("computePosition", () => { describe("getTransformOrigin", () => { it.each([ - ["bottom", "start", "top left"], - ["top", "end", "bottom right"], + ["bottom", "start", "left top"], + ["top", "end", "right bottom"], ["right", "center", "center center"], ] as const)("maps %s/%s to %s", (placement, alignment, expected) => { expect(getTransformOrigin(placement, alignment)).toBe(expected); diff --git a/packages/app/src/components/ui/menu/menu-anchor.ts b/packages/app/src/components/ui/menu/menu-anchor.ts index e255fc74a..c7548dde6 100644 --- a/packages/app/src/components/ui/menu/menu-anchor.ts +++ b/packages/app/src/components/ui/menu/menu-anchor.ts @@ -155,5 +155,7 @@ export function getTransformOrigin(placement: Placement, alignment: Alignment): else if (alignment === "end") horizontal = "right"; else horizontal = "center"; - return `${vertical} ${horizontal}`; + // React Native parses transform-origin positionally (x then y), unlike CSS + // which accepts keyword pairs in either order. + return `${horizontal} ${vertical}`; }