Nested drag and drop components

Question

Hi,I'm looking to create a low-code style view where users can:Add a step or conditionAlter the sequence of steps or conditions by drag and dropping the component in the desired sequence (Move - drag and drop)For conditions I would like to be able to:Add steps and conditionAlter the sequence of steps or conditions by drag and dropping the component in the desired sequence (Move - drag and drop)Refer to existings steps by drag and dropping the step in the condition (Link - Drag and drop)(see attachement)To achieve this I would ideally have a listView which contained custom components (steps and conditions) as

list items. The condition (list item) would allow the user to drop steps (list items) in predefined areas (THEN or ELSE)I have been looking at the following syncfusion components but I'm lost which solution will fit my purpose best:Common - drag and drop (https://ej2.syncfusion.com/angular/documentation/common/drag-and-drop)ListView (https://ej2.syncfusion.com/angular/documentation/listview/how-to/drag-and-drop-list-items)﻿(https://ej2.syncfusion.com/angular/documentation/listview/how-to/customize-listview-as-chat-window)Grid (https://ej2.syncfusion.com/angular/documentation/grid/row/row-drag-and-drop)Listbox (https://ej2.syncfusion.com/angular/documentation/list-box/drag-and-drop)Any help on how to achieve this would be appreciated!Thank you in advance!Attachment: NestedDD_75cac8ac.zip

LeoLavanya Dhanaraj · Answer

Hi Ruben,Greetings from Syncfusion support.From your shared details, we understand that you want to
perform a drag-and-drop action based on a particular condition. Similar like,
we have documented the TreeView sample in the Angular platform. Here, we have
restricted the files(tree node) drag-and-drop action within the folders only.
Check out the below link, to know more about the TreeView drag and drop action.
Restrict drag-and-drop : https://ej2.syncfusion.com/angular/documentation/treeview/how-to/restrict-the-drag-and-drop-for-particular-tree-nodesTreeView drag-and-drop : https://ej2.syncfusion.com/angular/documentation/treeview/drag-and-dropCheck out the shared documentation sample at your end and
let us know if the provided sample is suitable for your requirement. Please get
back to us if you need any further assistance.Regards,Leo Lavanya Dhanaraj