[BUG] whileHover state does not reset when element transitions to dragConstraints

[NikxDa]

Hey folks,

I am seeing an issue where the changes applied during hover with whileHover don't properly reset when combined with drag and dragConstraints. The reason seems to be that the hover detection doesn't properly work when the cursor leaves the element due to it transitioning back from its dragged position to its constrained position. The same problems can also be seen when using dragSnapToOrigin.

Steps to reproduce:

1. Create a motion component with drag, dragConstraints and whileHover effects.
2. Drag the component so that the cursor is not inside the component anymore. Release the component. The component will return to the constrained position, but remain in the hovered state until the next hover end event.
3. Drag the component so that the cursor remains inside the component. Release the component, but do not move your cursor. The component will return to the constrained position (so that the cursor is now outside of the component), but remain in the hovered state until you move your cursor.

CodeSandbox reproduction: https://codesandbox.io/p/sandbox/framer-motion-hover-bug-49yl5n

Expected behavior: The hovered state should be removed as soon as the cursor is not located over the element anymore, even if this happens due to the element being animated away from the cursor.

Video:

CleanShot.2024-03-23.at.23.58.50.mp4

Please note that the lags in the video during drag & drop are caused by CleanShot X's recording. They aren't actually there.