You know when you need tooltips and it smells easy so you do it yourself?
Component to display stuff, some state or context for "Yes tooltip is on", maybe a little React Portaling, and voila a tooltip.
And then the edge cases start ... #200wordsTIL
I have gone through this spiel and dance more times than I can count. Tooltips are a giant footgun and I fall for it every time.
BUT NOT THIS TIME OH NO! This weekend I built tooltips. Amazing tooltips. Great tooltips. The best tooltips.
I used react-tooltip
react-tooltip is a wonderful little library
You render a tooltip component then use it with a data-tip prop. Just like ye olden days
Notice that children of <ReactTooltip> are just JSX. That means you can make it completely custom like I did. Superb 👌
I even used a CSS Grid on the inside to help with layout
You can re-use a tooltip from as many triggers as you'd like. They all use the same component reducing the amount of DOM nodes. Perfect
Where it gets tricky is if you want custom dynamic tooltip content for each trigger. There's a getContent render prop but it doesn't accept arguments.
Next best thing was to create a bunch of tooltips, give them unique IDs, and trigger that way.
now my dom is slow :/