Skip to content
This repository has been archived by the owner on Feb 1, 2024. It is now read-only.

Tooltip: implement with Radix UI #2796

Merged
merged 8 commits into from
Oct 31, 2023
Merged

Tooltip: implement with Radix UI #2796

merged 8 commits into from
Oct 31, 2023

Conversation

lowiebenoot
Copy link
Collaborator

@lowiebenoot lowiebenoot commented Oct 30, 2023

Description

While trying to solve a bug in our tooltip positioning, I created another bug and realised that we would actually need to change and rewrite it completely in order to get it correct. Instead of implementing it ourself, we opted for using the tooltip from Radix UI. In the future we might use other Radix primitives as well for other components.

I still had to keep the hovering and active state inside our component (instead of letting radix handle it), because radix doesn't have the tooltipHideOnClick.

I removed the horizontal and vertical position, but it will still render to the opposite side in case there is not enough space on the side that you chose.

There is also no animation anymore when hiding the tooltip, because radix just removes it from the dom immediately.

Breaking changes

Tooltip: removed the horizontal and vertical position

…l the positioning ourselves

The positioning is very complicated, and it was bugged.
Horizontal and vertical don't exist anymore
Radix renders the tooltip content 2 times, one is just for accessibility.
@lowiebenoot lowiebenoot self-assigned this Oct 30, 2023
@lowiebenoot lowiebenoot marked this pull request as ready for review October 30, 2023 08:16
@lowiebenoot lowiebenoot changed the title Radix tooltip Tooltip: implement with Radix UI Oct 30, 2023
lorgan3
lorgan3 previously approved these changes Oct 30, 2023
src/components/tooltip/Tooltip.tsx Outdated Show resolved Hide resolved
farazatarodi
farazatarodi previously approved these changes Oct 30, 2023
JorenSaeyTL
JorenSaeyTL previously approved these changes Oct 30, 2023
@lowiebenoot lowiebenoot merged commit e577e91 into next-release Oct 31, 2023
10 checks passed
@lowiebenoot lowiebenoot deleted the radix-tooltip branch October 31, 2023 09:50
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants