feat: add path alias for src

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>

src/container/EdgeRenderer/EdgeRenderer.vue

@@ -1,10 +1,10 @@
 <script lang="ts" setup>
-import { computed, CSSProperties } from 'vue'
-import Edge from '../../components/Edges/Edge.vue'
-import ConnectionLine from '../../components/ConnectionLine/ConnectionLine.vue'
-import { ConnectionLineType, EdgeType } from '../../types'
-import { useStore } from '../../composables'
+import { CSSProperties } from 'vue'
 import MarkerDefinitions from './MarkerDefinitions.vue'
+import Edge from '~/components/Edges/Edge.vue'
+import ConnectionLine from '~/components/ConnectionLine/ConnectionLine.vue'
+import { ConnectionLineType, EdgeType } from '~/types'
+import { useStore } from '~/composables'
 
 interface EdgeRendererProps {
   edgeTypes: Record<string, EdgeType>

src/container/EdgeRenderer/utils.ts

@@ -1,6 +1,6 @@
-import { BezierEdge, SmoothStepEdge, StepEdge, StraightEdge } from '../../components/Edges'
-import { rectToBox } from '../../utils'
-import { Edge, EdgePositions, EdgeType, ElementId, HandleElement, Node, Position, Transform, XYPosition } from '../../types'
+import { BezierEdge, SmoothStepEdge, StepEdge, StraightEdge } from '~/components/Edges'
+import { rectToBox } from '~/utils'
+import { Edge, EdgePositions, EdgeType, ElementId, HandleElement, Node, Position, Transform, XYPosition } from '~/types'
 
 export function createEdgeTypes(edgeTypes: Record<string, EdgeType>): Record<string, EdgeType> {
   const standardTypes: Record<string, EdgeType> = {

src/container/Flow/Flow.vue

@@ -1,9 +1,11 @@
 <script lang="ts" setup>
 import { CSSProperties, onBeforeUnmount } from 'vue'
-import ZoomPane from '../../container/ZoomPane/ZoomPane.vue'
-import SelectionPane from '../../container/SelectionPane/SelectionPane.vue'
-import NodeRenderer from '../../container/NodeRenderer/NodeRenderer.vue'
-import EdgeRenderer from '../../container/EdgeRenderer/EdgeRenderer.vue'
+import { createEdgeTypes } from '../EdgeRenderer/utils'
+import { createNodeTypes } from '../NodeRenderer/utils'
+import ZoomPane from '~/container/ZoomPane/ZoomPane.vue'
+import SelectionPane from '~/container/SelectionPane/SelectionPane.vue'
+import NodeRenderer from '~/container/NodeRenderer/NodeRenderer.vue'
+import EdgeRenderer from '~/container/EdgeRenderer/EdgeRenderer.vue'
 import {
   ConnectionLineType,
   ConnectionMode,
@@ -15,12 +17,10 @@ import {
   TranslateExtent,
   NodeExtent,
   FlowOptions,
-} from '../../types'
-import { DefaultNode, InputNode, OutputNode } from '../../components/Nodes'
-import { BezierEdge, SmoothStepEdge, StepEdge, StraightEdge } from '../../components/Edges'
-import { createEdgeTypes } from '../EdgeRenderer/utils'
-import { createNodeTypes } from '../NodeRenderer/utils'
-import { useHooks, useStore, createHooks } from '../../composables'
+} from '~/types'
+import { DefaultNode, InputNode, OutputNode } from '~/components/Nodes'
+import { BezierEdge, SmoothStepEdge, StepEdge, StraightEdge } from '~/components/Edges'
+import { useHooks, useStore, createHooks } from '~/composables'
 
 export interface FlowProps extends FlowOptions {
   elements: Elements

src/container/NodeRenderer/NodeRenderer.vue

@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import Node from '../../components/Nodes/Node.vue'
-import { NodeType, Node as TNode } from '../../types'
-import { getNodesInside } from '../../utils'
-import { useStore } from '../../composables'
+import Node from '~/components/Nodes/Node.vue'
+import { NodeType, Node as TNode } from '~/types'
+import { getNodesInside } from '~/utils'
+import { useStore } from '~/composables'
 
 interface NodeRendererProps {
   nodeTypes: Record<string, NodeType>

src/container/NodeRenderer/utils.ts

@@ -1,5 +1,5 @@
-import { DefaultNode, InputNode, OutputNode } from '../../components/Nodes'
-import { NodeType } from '../../types'
+import { DefaultNode, InputNode, OutputNode } from '~/components/Nodes'
+import { NodeType } from '~/types'
 
 export function createNodeTypes(nodeTypes: Record<string, NodeType>): Record<string, NodeType> {
   const standardTypes: Record<string, NodeType> = {

src/container/SelectionPane/SelectionPane.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { ElementId, FlowElement, KeyCode } from '../../types'
-import NodesSelection from '../../components/NodesSelection/NodesSelection.vue'
-import UserSelection from '../../components/UserSelection/UserSelection.vue'
-import { getConnectedEdges, isNode } from '../../utils'
-import { useHooks, useStore, useKeyPress } from '../../composables'
+import { ElementId, FlowElement, KeyCode } from '~/types'
+import NodesSelection from '~/components/NodesSelection/NodesSelection.vue'
+import UserSelection from '~/components/UserSelection/UserSelection.vue'
+import { getConnectedEdges, isNode } from '~/utils'
+import { useHooks, useStore, useKeyPress } from '~/composables'
 
 interface SelectionPaneProps {
   selectionKeyCode?: KeyCode

src/container/ZoomPane/ZoomPane.vue

@@ -2,9 +2,9 @@
 import { D3ZoomEvent, zoom, zoomIdentity, ZoomTransform } from 'd3-zoom'
 import { get } from '@vueuse/core'
 import { pointer, select } from 'd3-selection'
-import { FlowTransform, KeyCode, PanOnScrollMode } from '../../types'
-import { useHooks, useKeyPress, useStore, useUpdateNodeInternals, useZoomPanHelper } from '../../composables'
-import { clamp, onLoadGetElements, onLoadProject, onLoadToObject } from '../../utils'
+import { FlowTransform, KeyCode, PanOnScrollMode } from '~/types'
+import { useHooks, useKeyPress, useStore, useUpdateNodeInternals, useZoomPanHelper } from '~/composables'
+import { clamp, onLoadGetElements, onLoadProject, onLoadToObject } from '~/utils'
 
 interface ZoomPaneProps {
   selectionKeyCode?: KeyCode
@@ -190,24 +190,22 @@ watch(height, (val) => (store.dimensions.height = val))
 watch(transform, (val) => (store.transform = [val.x, val.y, val.zoom]))
 
 const { zoomIn, zoomOut, zoomTo, transform: setTransform, fitView } = useZoomPanHelper()
-onMounted(() => {
-  watchOnce(
-    () => width.value && height.value,
-    () => {
-      hooks.load.trigger({
-        fitView: (params = { padding: 0.1 }) => fitView(params),
-        zoomIn,
-        zoomOut,
-        zoomTo,
-        setTransform,
-        updateNodeInternals: useUpdateNodeInternals(store),
-        project: onLoadProject(store),
-        getElements: onLoadGetElements(store),
-        toObject: onLoadToObject(store),
-      })
-    },
-  )
-})
+watchOnce(
+  () => width.value && height.value,
+  () => {
+    hooks.load.trigger({
+      fitView: (params = { padding: 0.1 }) => fitView(params),
+      zoomIn,
+      zoomOut,
+      zoomTo,
+      setTransform,
+      updateNodeInternals: useUpdateNodeInternals(store),
+      project: onLoadProject(store),
+      getElements: onLoadGetElements(store),
+      toObject: onLoadToObject(store),
+    })
+  },
+)
 </script>
 <template>
   <div ref="zoomPane" class="vue-flow__renderer vue-flow__zoompane">