Skip to content

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

Open
@acstll

Description

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
Image

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions