Currently it is not possible AFAIK to add a CSS animation which triggers once the element that toggle react-hint is hovered out.
We can use delay={{ hide: someDelay }} props but then the react-hint is removed from DOM after specified delay when state.target is emptied, thus no animation can be shown.
An option to allow fadeOut on leave would be to add a class once triggering element is hovered out (ex. .react-hint--hide) and use this class to set a fadeout animation similar to the CSS animation fadeIn. This fadeOut could complete as long as the animation-delay (0.5s by default on the fadeIn anim) is smaller than the hide delay set in delay props.
Currently it is not possible AFAIK to add a CSS animation which triggers once the element that toggle
react-hint
is hovered out.We can use
delay={{ hide: someDelay }}
props but then the react-hint is removed from DOM after specified delay when state.target is emptied, thus no animation can be shown.An option to allow fadeOut on leave would be to add a class once triggering element is hovered out (ex.
.react-hint--hide
) and use this class to set a fadeout animation similar to the CSS animation fadeIn. This fadeOut could complete as long as theanimation-delay
(0.5s by default on the fadeIn anim) is smaller than the hide delay set indelay
props.