26 lines
842 B
TypeScript
26 lines
842 B
TypeScript
const onDragStart = (event: DragEvent, nodeType: string) => {
|
|
if (event.dataTransfer) {
|
|
event.dataTransfer.setData('application/revueflow', nodeType)
|
|
event.dataTransfer.effectAllowed = 'move'
|
|
}
|
|
}
|
|
|
|
const Sidebar = () => {
|
|
return (
|
|
<aside>
|
|
<div class="description">You can drag these nodes to the pane on the left.</div>
|
|
<div class="revue-flow__node-input" onDragstart={(event: DragEvent) => onDragStart(event, 'input')} draggable>
|
|
Input Node
|
|
</div>
|
|
<div class="revue-flow__node-default" onDragstart={(event: DragEvent) => onDragStart(event, 'default')} draggable>
|
|
Default Node
|
|
</div>
|
|
<div class="revue-flow__node-output" onDragstart={(event: DragEvent) => onDragStart(event, 'output')} draggable>
|
|
Output Node
|
|
</div>
|
|
</aside>
|
|
)
|
|
}
|
|
|
|
export default Sidebar
|