Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Investigate replacing react-popper-tooltip with @radix/react-tooltip or Floating UI #29161

Open
Tracked by #29038
JReinhold opened this issue Sep 19, 2024 · 0 comments
Open
Tracked by #29038

Comments

@JReinhold
Copy link
Contributor

JReinhold commented Sep 19, 2024

The WithTooltip component uses react-popper-tooltip, which depends on the rather bulky (and dated) Popperjs library. We should be able to reduce the bundle size of @storybook/core/components by moving to @radix/tooltip-react or something similar. This also follows our general goal of improving a11y by moving to Radix UI.

We should also look into the alternative of using Floating UI directly - either via @floating-ui/react or @floating-ui/react-dom. This should be even smaller but might come at the cost of a11y which wouldn't be the right trade off IMO. Radix UI uses Floating UI internally. Floating UI is the spiritual successor to Popperjs, built by the same people.

Something similar was already attempted in #24496 by @danielmarcano (for a11y reasons), but ended up being abandoned because of lack of prioritisation from the team AFAIK.

https://635781f3500dd2c49e189caf-rjflqvpgls.chromatic.com/?path=/story/bench--es-build-analyzer&args=metafile:core_SLASH_components_DOT_esm_DOT_json

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant