Bright uses the AvatarMenu in the app NavBar, which is a fairly typical use case. It is as sticky bar, which creates its own stacking context. Unrelated ancestor props like maxHeight or overflow then cause issues for the AvatarMenu.
Solution
There's rarely a reason not to use Menu with Portal. This changes AvatarMenu to do that, without changing the component signature.
Alternative considered
Accept a new custom prop like withPortal. Rejected because it is custom, and it feels acceptable to deny users the option to not use portal.
Problem
Bright uses the AvatarMenu in the app NavBar, which is a fairly typical use case. It is as sticky bar, which creates its own stacking context. Unrelated ancestor props like maxHeight or overflow then cause issues for the AvatarMenu.
Solution
There's rarely a reason not to use Menu with Portal. This changes
AvatarMenu
to do that, without changing the component signature.Alternative considered
Accept a new custom prop like
withPortal
. Rejected because it is custom, and it feels acceptable to deny users the option to not use portal.