[EuiToolTip] Tooltip should adjust its position when the anchor element moves

[acstll]

Describe the bug
When a tooltip is anchored to an element (e.g. button) that is fixed-positioned and that changes positions when clicked, the tooltip won't follow. This creates an unwanted state where the tooltip is visible but not correctly positioned.

The repositionOnScroll prop does not help in this case, because there is no scrolling involved. The position that changes is the anchor's (button), not the scroll.

Impact and severity
I don't think it's common pattern to have a button fixed-positioned, that moves as it gets clicked, but this issue was reported so it should have some end-user impact.

Environment and versions

• EUI version: 99.0.0
• React version: 18
• Kibana version (if applicable): ~
• Browser: ~
• Operating System: ~

To Reproduce
You need a button that:

• uses EuiToolTip
• has position: fixed (or absolute)
• changes position when it gets clicked

Expected behavior
The tooltip element should adjust its position to follow its anchor.

Minimum reproducible sandbox
https://codesandbox.io/p/sandbox/gallant-shockley-629j49

Screenshots

[JasonStoltz]

We may be able to solve this by adding a dismiss callback, which would let consumers programatically dismiss tooltips. That would solve this particular use case indirectly.

[JasonStoltz]

@acstll You had some thoughts about anchoring, could you add them here as well?

[acstll]

The new CSS anchor() API

• Introducing the CSS anchor positioning API
• anchor() on MDN