isaacHagoel / svelte-dnd-action

An action based drag and drop container for Svelte
MIT License
1.79k stars 104 forks source link

Linked items to drag at once within different drop zones #353

Open DavidM42 opened 2 years ago

DavidM42 commented 2 years ago

So I currently have multiple rows of dnd zones. In those zones are items oriented as columns.

What I'd now like to achieve is that some of these column items are linked to the column item above or below them in another dnd row. When one of them is moved, the other one should start dragging to and be placed appropriately one below or above the other.

How could I go about doing that?

isaacHagoel commented 2 years ago

Have you looked at the multi drag example (link in the readme)?

On Sun, Feb 13, 2022, 06:19 DavidM. @.***> wrote:

So I currently have multiple rows of dnd zones. In those zones are items oriented as columns.

What I'd now like to achieve is that some of these column items are linked to the column item above or below them in another dnd row. When one of them is moved, the other one should start dragging to and be placed appropriately one below or above the other.

How could I go about doing that?

— Reply to this email directly, view it on GitHub https://github.com/isaacHagoel/svelte-dnd-action/issues/353, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE4OZCZ5G5345P4NIFAGDBLU22XDBANCNFSM5OHLUGEQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

You are receiving this because you are subscribed to this thread.Message ID: @.***>

DavidM42 commented 2 years ago

Yes I did and I understand that it probably is done within the consider and finalize handlers as well as needing custom styling.

The linked example is a bit hard for me to understand if I'm honest, but I'll look into it more and hopefully understand how to transfer it to my use case. I don't know if these kinds of multi drags could be a common use case and useful to natively support in the library

isaacHagoel commented 2 years ago

There are no plans to support this kind of thing out of the box but it should be not super hard to achieve with the existing features. On drag start you will need to remove/ replace the matching items in the lists that should be affected (besides the one that the dragged element comes from). If you want the dragged element to look like all the elements (instead of one), you can manipulate its dom element directly (and carefully)

On Sun, Feb 13, 2022, 10:49 DavidM. @.***> wrote:

Yes I did and I understand that it probably is done within the consider and finalize handlers as well as needing custom styling.

The linked example is a bit hard for me to understand if I'm honest, but I'll look into it more and hopefully understand how to transfer it to my use case. I don't know if these kinds of multi drags could be a common use case and useful to natively support in the library

— Reply to this email directly, view it on GitHub https://github.com/isaacHagoel/svelte-dnd-action/issues/353#issuecomment-1037585300, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE4OZC2DV264FCIYPNWCTT3U23WYRANCNFSM5OHLUGEQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

You are receiving this because you commented.Message ID: @.***>