You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
[Bug]: Popover and DropdownMenu content is not positioned when the trigger is inside TooltipRoot #2993
Click the buttons "Popover + tooltip" and "Menu + tooltip".
Describe the bug
When a PopoverTrigger or DropdownMenuTrigger is inside a TooltipRoot (to show a tooltip on the same button), the content opens but is never positioned. Its [data-reka-popper-content-wrapper] keeps transform: translate(0px, -200%), so it is above the top of the page. The same happens with PopoverAnchor, and the order of the as-child triggers does not matter.
This is the structure from "Composing multiple primitives" in the Composition guide, only with PopoverTrigger instead of DialogTrigger:
All popper-based components use the same PopperRoot context, and PopperAnchor injects the nearest one. Inside TooltipRoot this is the tooltip's PopperRoot. I logged the onAnchorChange calls: the tooltip's PopperRoot gets the button from both triggers, and the popover's PopperRoot never gets an anchor.
It works when TooltipRoot is below the popover anchor, for example in a separate component inside PopoverAnchor as-child (case 4 in the reproduction).
In Radix (React), Popover and Tooltip each create their own popper scope (createPopperScope). I would like to send a PR. Would you accept a change where each component family keeps its own popper context, so that a popper of another family between the root and the trigger does not take it?
Expected behavior
The popover or menu is positioned next to the button, like without the tooltip.
Activity