react-grid-layout
Drag from outside positioning improvement
Description
This PR aims to improve the item positioning within the onDragOver event handler called when dragging an item from outside the layout.
The current experience treats your cursor as the top-left position of the grid item when dragging, meaning the placeholder is always below and to the right of your cursor, this often makes it feel like the library is not tracking your movement correctly, this is especially noticeable when dragging in larger items into the layout:
https://github.com/user-attachments/assets/b5c41304-7644-41dd-a67f-3d7602783dd6
This PR changes this behaviour, making the cursor more inline with the center of the placeholder:
https://github.com/user-attachments/assets/baa1bc2a-1a08-4881-9b1c-7391e0849c95
This PR [adds/removes/fixes/replaces] the [feature/bug/etc].
What type of PR is this? (check all applicable)
- [ ] 🍕 Feature
- [x] 🐛 Bug Fix
- [ ] 📝 Documentation Update
- [ ] 🎨 Style
- [ ] 🧑💻 Code Refactor
- [ ] 🔥 Performance Improvements
- [ ] ✅ Test
- [ ] 🤖 Build
- [ ] 🔁 CI
- [ ] 📦 Chore (Release)
- [ ] ⏩ Revert
Related Tickets & Documents
Mobile & Desktop Screenshots/Recordings
Added tests?
- [ ] 👍 yes
- [ ] 🙅 no, because they aren't needed
- [ ] 🙋 no, because I need help
Added to documentation?
- [ ] 📜 README.md
- [ ] 📓 examples
- [x] 🙅 no documentation needed
@michaelnesen Thanks for this PR! I'm experiencing the same and this does look like a great improvement!
Any update on this?
Hey @STRML @michaelnesen any chance on proceeding with this PR, as this would be a fantastic addition.
