Problem Description

1. We need to be able to drag an element from outside the Svelvet canvas and drop it on it to the canvas to create a new svelvet node with custom metadata based on which element was dropped. example from another library https://reactflow.dev/docs/examples/interaction/drag-and-drop/

2. Currently svelvet uses a svelte store to track the node and edges objects. We need a concept of a save button. So svelvet can use it's current store as normal, but we will need a second tracking changes since the last "save" and on cancel/close revert to the state of last saved changes.

Acceptance Criteria

• Drag a non svelvet dom element onto the canvas and create a new svelvet node with custom properties based on which element was dropped
• Ability to save a state of the svelvet diagram
• Ability to revert to last save of the svelvet diagram
• Must stick as reasonably close to Svelvet current conventions to increase chance of merge with main project
• Must still assume svelvet being imported as a package (if internal functions/apis used they must be exported and used via the export)

Link to Project

Svelvet project https://github.com/open-source-labs/Svelvet
Fork to work off with a couple existing fixes (hopefully to be merged back into main project) https://github.com/AtlasCloudDev/Svelvet