Microlink Hover improvements

[Kikobeats]

The Microlink Hover package is a decorator on top of Microlink SDK for showing links when the user hover to an HTML element (normally a link).

Demos

• https://germanro.vercel.app
• https://hover-react.microlink.io
• https://hover-vanilla.microlink.io

Improvements

The popup effect is done via CSS. Although it's a lightweight solution, there is a flick if you keep the mouse in the gap between the link and the popup box.

https://user-images.githubusercontent.com/2096101/143472768-43138089-d7b4-48db-ba1d-b28a28df43c1.mp4

Also, part of the problem with the current implementation is the popup is covering the content, making the interaction a bit tedious.

Something worth it to explore could be to show the preview next to the cursor, so you don't lose the content context.

https://user-images.githubusercontent.com/2096101/143473307-470e4674-90b8-4339-9135-3159e13ee6f8.mp4

(related source code)