ValentinH
Support differently-sized items in the list
Is your feature request related to a problem? Please describe. Currently, we are using react-easy-sort for a list of elements with different height. Dragging them around moves items around, but they are moved by wrong distances (see attached screen cast).
Describe the solution you'd like
Ideally, react-easy-sort should by default support items of variable height/width and allow to drag them around with no problems.
Describe alternatives you've considered NA
Additional context
https://user-images.githubusercontent.com/4501047/150535566-a9118628-0ce2-4688-ab88-9f4624517890.mov
I've looked into this for a bit, because I feel this would really polish this awesome lib, but it's quite hard to do. Currently the moving around works by having the items swap their positions in a chained manner, which makes it really fast.
My approach for supporting this would be to put a dummy of the dragged item on the new location when dragging, measure the new positions of all elements, put them back before it's visible and then move all items towards the new locations (animated). This will make sure all elements are at the same location and have the same size as after sorting.
This is quite a big refactor and I'm not sure if this will work out perfectly. I might have another look if I find some time.
Thanks for investigating this. This is indeed non-trivial with how the current logic works.
Out of curiosity, did you consider using dnd-kit as a more robust/capable alternative? I've personally used it in some places where scroll and keyboard controls were a requirement and I was satisfied with it.
Yes, definitely the best lib for advanced configurations. I just like how lightweight and plug-and-play this lib is, so I am really loving it for quick and small drag&drop functionality. It does everything right on the first try. Personally I don't have much use for this specific functionality, but when testing auto scroll it caught my attention and felt like a nice challenge, and something that would really 'perfect' this lib in my opinion.
Thanks for the feedback, it confirms my choice for the name of the library 5 years ago 😁
As this seems to be a more advanced, hard-to-implement feature that is out of scope for this lib, I will close this issue :)