dnd-kit-sortable-tree
dnd-kit-sortable-tree copied to clipboard
How to DnD items from other are into sortable tree
Hi bro, I have the following request. There are two areas: Screen list and Menu list (using dnd-kit-sortable-tree). The menu list only contains 3 levels, the 3rd level includes items from the Screen list.
- I want to DnD item from Screen list to Menu list (just go to 3rd menu). After DnD, the screen item will not disappear from the Screen list.
- I want the items on the Menu list to be sorted on the same level, in the same parent folder, the level of the item cannot be changed. Ex: If there is a parent tree, it can only be sorted in the parent tree. If it does not have a parent tree (level 1), the position can only be sorted in the root tree. Please give me a solution. My repo: https://codesandbox.io/p/sandbox/tree-r6qy39?file=%2Fsrc%2FApp.tsx Thanks
My workaround for this was to fork this repo and modify the SortableTree component so that the DndContext and SortableContext are disabled when the disabled
prop was passed. That also means setting that in state so you can only either have the tree editable OR have support to drop items from outside the tree into the tree. May not satisfy your project requirements, but figured I'd share my workaround. Would love to find a better way to do that though.
In my project, I have two containers, one a tree of folders and the other a grid of images. The idea is to drag an image over a folder to assign it to that folder, and clicking a folder updates the grid to show the images currently assigned to the folder, for example.
(Sorry for the necro post)