feat(Workflow): add modules

src/components/workflow/DropzoneBackground.vue

@@ -0,0 +1,13 @@
+<script lang="ts" setup>
+import { Background } from '@vue-flow/background'
+</script>
+
+<template>
+  <div class="dropzone-background">
+    <Background :size="2" :gap="20" pattern-color="#BDBDBD" />
+
+    <div class="overlay">
+      <slot />
+    </div>
+  </div>
+</template>

src/components/workflow/Sidebar.vue

@@ -0,0 +1,21 @@
+<script lang="ts" setup>
+import useDragAndDrop from '@core/utils/workflow'
+
+const { onDragStart } = useDragAndDrop()
+</script>
+
+<template>
+  <aside>
+    <div class="description">You can drag these nodes to the pane.</div>
+
+    <div class="nodes">
+      <div class="vue-flow__node-input" :draggable="true" @dragstart="onDragStart($event, 'input')">Input Node</div>
+
+      <div class="vue-flow__node-default" :draggable="true" @dragstart="onDragStart($event, 'default')">
+        Default Node
+      </div>
+
+      <div class="vue-flow__node-output" :draggable="true" @dragstart="onDragStart($event, 'output')">Output Node</div>
+    </div>
+  </aside>
+</template>