React-beautiful-dnd: Dragging items from parent list into a child list

Created on 29 Jan 2018  Â·  7Comments  Â·  Source: atlassian/react-beautiful-dnd

Bug or feature request?

feature request
#
from wiki

Independent nested lists - a list can be a child of another list, but you cannot drag items from the parent list into a child list

Are you guys planning on adding the functionality of dragging items from parent list into a child list in the future? Thank you!

Most helpful comment

This would be awesome.

react-beatiful-dnd would be a perfect fit if we could move items between parent and child lists (both directions and with multiple levels).

Would this be hard to add as a feature?

All 7 comments

At this time it is not on our roadmap. However, once a few more features land we will consider it!

This would be awesome.

react-beatiful-dnd would be a perfect fit if we could move items between parent and child lists (both directions and with multiple levels).

Would this be hard to add as a feature?

@alexreardon I'd be keen to have a go making this possible.

Are there any large architectural barriers you can think of to being able to do that? Do you have any high-level pointers for what would be required?

I have not looked into the problem so i am not 100% across all the things you would need to look into.

Off the top of my head:

  • when getting the droppable over you would need to check for the smallest droppable you are over rather than the first
  • There is an assumption that a droppable cannot move during a drag. This assumption would be broken if the inner list was in a foreign list
  • The keyboard story would need to be thought about. How would a use know that the next item is a nested container and how would they move into it? Would we move into it by default or skip it?

There are probably others but that is my initial thoughts!

@skellystudios any progress on this? i'd be happy to team up on this one

Hey Matt –

So I made a bit of a start, and got it working in its most basic form – check out here: https://github.com/skellystudios/react-beautiful-dnd

Unfortunately, I got a bit unstuck working on the keyboard controls, and trying to get it tested in any reasonable way, and I've been putting that off.

If you're able to get it into a mergeable state, that would be amazing

thanks!
yeah, building it to expose the droppableId to parents & children isn't an easy fix. i took a different approach & just stacked multiple vertical lists on top of each other. It still has the keyboard problem, but I saw #219 has a priority so it may get support sooner than "true" nesting.

Was this page helpful?
0 / 5 - 0 ratings