[FEAT REQ] Close the tooltip after delay even while still hovering the anchor element

[ggnu11]

When mouse hover, the tooltip is displayed, and I want to close it 5 seconds after the tooltip is displayed.

I customized the tooltip using afterShow and afterHide, but there is a problem.

If you hover your mouse over id=test1 and move your mouse to id=test2 to open the tooltip and mouse over the existing test1 again, there is a bug that closes immediately, not after 5 seconds.

When the id changes, I want to initialize the timeOut of that id when I do mouseLeave.

I'm going to solve this method and set the tooltip duration to 5 seconds, so if there's a good way other than this, please share it.

• condeSandBox
  https://codesandbox.io/p/sandbox/tooltip-w2q7ll?file=%2Fsrc%2FApp.tsx%3A15%2C14-15%2C19

[nareshpingale]

https://react-tooltip.com/docs/options

Check data-tooltip-delay-show and data-tooltip-delay-hide in Available attributes and delayShow and delayHide in Available props. Quite simple, straight forward and self explanatory.

[ggnu11]

Sorry, my question is unanswered.
I get a tooltip when I hover my mouse, and I want to set this tooltip to 5 seconds. I'm looking for a feature that immediately disappears when the mouse leaves, and when I move the mouse, the tooltip displays for 5 seconds and then disappears.

[gabrieljablonski]

@ggnu11 we indeed do not have a solution for this use-case, but I do like the idea. Maybe we could include an autoClose prop (kinda like react-toastify but obviously would need to behave a little differently).

I've updated your code sandbox to fix the issue you're having, so maybe that works for you for now, until we possibly work on the new feature.

https://codesandbox.io/p/sandbox/tooltip-forked-5385t9

Anyway, let's leave this issue open for now.

[ggnu11]

Thank you for your good feedback, I'll keep the code sandbox open for others to refer to.
I'll look forward to many features in the next update