Tree Node - Copy this React, Tailwind Component to your project
I want a component to create infinite nodes (parent child relationship) tree. I want the zero or root node to be there at initial. On it’s click it should show me option like edit or add child. If user select edit then at root node position a popup should appear asking for full name (20 words, gender (Options like Male, Female Other, Unknown), reference (Textbox with 200 words) and date of birth (on text field), with a update button (on its click value should update at the node). If user click add child then a position a popup should appear asking for full name (20 words, gender (Options like Male, Female Other, Unknown), reference (Textbox with 200 words) and date of birth (on text field), with a save button (on its click value should update at the node). This node is moveable and always displays a line connecting its parent. At every node I want facility to add as many children as I want. So, at root if I want I can select add and after saving, I can again click on add. Every time it will create a new node which is connected to root and we can move these children anywhere by click and drag method. On these child node I want the similar facility so On it’s click it should show me option like edit, transfer, delete or add child. If user click on transfer, then a dropdown should appear with all the names on the screen. User can select the dropdown and use the button assign next to it. Once done this node along with all the child going to transfer to the selected node and will disconnect previous and connect with the new node with a line. If user click on delete, this node along with this node all its child should be delete. On add child click, same action as above. a popup should appear asking for full name (20 words, gender (Options like Male, Female Other, Unknown), reference (Textbox with 200 words) and date of birth (on text field), with a save button (on its click value should update at the node). This node is moveable and always displays a line connecting its parent. I also want every node to be editable. Except root all nodes are editable. I also want a export button to download every node in csv file . I also want import button upload this csv back if required. Avoid tangling of nodes connection with auto arrangement. Feel free to enhance the codes
