Update popover position on scroll and field resize to autocomplete/search TokenField examples

[agusterodin]

🙋 Documentation Request

The popover doesn't remain positioned above/below the TokenField input in the autocomplete and search TokenField examples. The popover also can't easily be closed other than clicking an item in the popover menu (eg: clicking outside popover or clicking into another input does not close it).

Not sure if this is just a flawed/incomplete docs example or an actual bug.

https://react-aria.adobe.com/TokenField#search
https://react-aria.adobe.com/TokenField#autocomplete

Current Behavior
https://github.com/user-attachments/assets/b60de6cb-efb5-4484-8b29-16b9fb522b0e

Expected Behavior
https://github.com/user-attachments/assets/26f4bbf6-d59d-4be6-9930-72dc8c1ab9e2

Possible Fix

Setting shouldUpdatePosition: true in useOverlayPosition doesn't work.

This works as a temporary solution:

/**
 * Calls `updatePosition` whenever any scroll container on the page scrolls while `isEnabled` is true, so an overlay stays
 * attached to its trigger. Scrolling inside the overlay itself is ignored, since that doesn’t move the trigger.
 */
export function useUpdatePositionOnScroll(overlayRef: React.RefObject<Element | null>, updatePosition: () => void, isEnabled: boolean) {
  useEffect(() => {
    if (!isEnabled) return
    function handleScroll(event: Event) {
      // Scrolling the overlay’s own contents doesn’t move the trigger.
      if (event.target instanceof Node && overlayRef.current?.contains(event.target)) return
      updatePosition()
    }
    // Scroll events don’t bubble, so capture them from every scroll container.
    window.addEventListener('scroll', handleScroll, { capture: true, passive: true })
    return () => window.removeEventListener('scroll', handleScroll, { capture: true })
  }, [isEnabled, updatePosition, overlayRef])
}

Environment
MacOS 15.7.4 (24G517), Google Chrome 154.0.8037.58 (arm64), react-aria: 3.52.1, react-aria-components 1.21.1

🧢 Your Company/Team

No response

[LFDanLu]

The popover position not updating on scroll is a long standing issue relating to some similar issues around combobox: #3804 #4020. Similarly, the popover not closing on a click outside the popover is due to the isNonModal behavior which the team has in the past discussed splitting up the functionality that prop controls. I'm going to leave this open since all the related issues I could find were pretty specific to combobox/closed as dupes