Drag and sort multiple items as a group

[niklasramo]

This feature request has popped up in the issues quite a few times and I think it's a worthy feature to add to the core (or at least make it possible to implement easily). The only question I'm asking is that how? Technically it should be pretty trivial, but I'm not sure at all what kind of use-cases we should be considering when designing the API and functionality changes.

So I am calling out for help here. If you'd like to see this feature land in Muuri please give a 👍 and if at all possible share any insight you might have for the implementation from library user's perspective. What kind of usage flows do you have in mind? How much should Muuri handle from that flow? What would you prefer the API/code to look like (share imaginary example if you wish).

To kick off this conversation here are a few examples in the wild from other libraries:

• https://github.com/SortableJS/Sortable/tree/master/plugins/MultiDrag
• https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/patterns/multi-drag.md

Also food for though, for selecting the target items this selecto.js looks nice: https://github.com/daybrush/selecto. Would make sense that Muuri only has API to e.g. group items together for the duration of drag and other libraries would provide the functionality/UI for doing the actual selection.

[niklasramo]

Dang, totally forgot we already had an open ticket for this: #313. Well, let's continue that conversation here. Maybe a reboot will provide more discussion 🤞

[geoffbullen]

This would be amazing

[niklasramo]

A little update related to this issue, a while back I started working on isolating most of Muuri's drag logic into its own separate library which actually is in pretty good shape already and has this specific feature integrated. I'll post some example test code when I actually get the library released and integrated into the dev branch (there's still plenty of not-so-fun work to do before that happens).

This is also the first step towards making Muuri more modular (as the drag related code is quite a big chunk of the total amount of Muuri's code) and also makes it easier to build all these drag related extra features. The plan is to make Muuri use the new drag library for the next version (1.0.0), but I'll post more updates on that when the time comes.

[ttkaine]

I quite like the way Sortable does this - the ability to click to select a bunch of items and then drag the lot of them to a new location and have them all arrange themselves in the new place is really neat. Possibly using the index of the items in thier original locations and the index of the containers also so that the collection of moved items arrange in a consistent order at the destination? This would be a very welcome addition to this fantastic library!