In my react project, I was able to implement a crude implementation of drag and drop as I didn't want to rely on any drag and drop libraries in order to have a fundamental understanding of how to accomplish such functionality. I'm also targeting touch/mobile devices. So for my initial implementation, I was able to drag a component and drop it on a target area/component but the dragged component didn't render in such a way to reflect that it was being dragged. So after I fixed that issue, it no longer drag and drops as it was before because the dragged element now renders over the dropzone/target component preventing any firing of onPointerOver/onPointerEnter. I have a link to both "before" and "after" behavior for reference: before: https://youtu.be/ViEgXr45aM0 after: https://youtu.be/rpfMp-ClMdI
So I'm trying to figure out how to trigger onPointerOver/onPointerEnter of below target when we drag over/into it while the dragged element/component overlaps it. Even if it's a hacky solution, I'm all ears. I don't want to have to resort to using a third party react library as I've invested so much time and code already. Any guidance would greatly be appreciated.
