Maybe it would make sense to add an option to trigger the tooltip on click instead of hover.
Hardcoding the direction might be problematic on some occasions. For example, on the desktop the tooltip might be better on the right, but on a smaller screen and depending on the layout, it might need a different alignment. So, a direction "auto" could be added, which would calculate the proper position depending on the element's position on the screen.
Since the tooltip can accept HTML, links, etc, it would be nice if it would stay open when moving the cursor above it. This could be handled with just CSS I think.
Maybe it would make sense to add an option to trigger the tooltip on click instead of hover.
Agreed. IMO, tooltips are usually anonHover component but I can see value on toggling it on and off onClick.
Hardcoding the direction might be problematic on some occasions. For example, on the desktop the tooltip might be better on the right, but on a smaller screen and depending on the layout, it might need a different alignment. So, a direction "auto" could be added, which would calculate the proper position depending on the element's position on the screen.
Love the idea of direction "auto". Maybe it doesn't even need to be a specific direction but a prop like autoAdjust or something like that. I think Intersection Observer API would be the right tool for it, or maybe something simpler with media-queries.
Since the tooltip can accept HTML, links, etc, it would be nice if it would stay open when moving the cursor above it. This could be handled with just CSS I think.
I haven't thought of that, nice call. I'm not sure if it is a CSS only thing though, as the event that triggers the tooltip hide is the wrapper onMouseLeave 🤔. If I had to implement only one of the suggestions I'd pick this one for sure.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Nice job!
A few thoughts:
Hey, Giorgio. Thanks! You have excellent points.
Agreed. IMO, tooltips are usually an
onHover
component but I can see value on toggling it on and offonClick
.Love the idea of direction "auto". Maybe it doesn't even need to be a specific direction but a prop like
autoAdjust
or something like that. I think Intersection Observer API would be the right tool for it, or maybe something simpler with media-queries.I haven't thought of that, nice call. I'm not sure if it is a CSS only thing though, as the event that triggers the tooltip hide is the wrapper
onMouseLeave
🤔. If I had to implement only one of the suggestions I'd pick this one for sure.