diff --git a/packages/vue-flow/src/container/VueFlow/VueFlow.vue b/packages/vue-flow/src/container/VueFlow/VueFlow.vue
index fcb6bac8..04bf4c9b 100644
--- a/packages/vue-flow/src/container/VueFlow/VueFlow.vue
+++ b/packages/vue-flow/src/container/VueFlow/VueFlow.vue
@@ -1,23 +1,10 @@
 <script lang="ts" setup>
-import type { D3ZoomEvent } from 'd3-zoom'
 import Viewport from '../Viewport/Viewport.vue'
 import { useHooks } from '../../store'
 import { useVueFlow } from '../../composables'
-import type { FlowElements, FlowProps } from '../../types/flow'
+import type { FlowProps } from '../../types/flow'
+import type { Emits } from '../../types/hooks'
 import { Slots } from '../../context'
-import type {
-  Connection,
-  EdgeChange,
-  EdgeMouseEvent,
-  GraphEdge,
-  GraphNode,
-  NodeChange,
-  NodeDragEvent,
-  NodeMouseEvent,
-  OnConnectStartParams,
-  ViewpaneTransform,
-  VueFlowStore,
-} from '../../types'
 import useWatch from './watch'
 
 const props = withDefaults(defineProps<FlowProps>(), {
@@ -40,57 +27,7 @@ const props = withDefaults(defineProps<FlowProps>(), {
   connectionLineStyle: undefined,
 })
 
-const emit = defineEmits<{
-  (event: 'nodesChange', changes: NodeChange[]): void
-  (event: 'edgesChange', changes: EdgeChange[]): void
-  (event: 'nodeDoubleClick', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'nodeClick', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'nodeMouseEnter', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'nodeMouseMove', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'nodeMouseLeave', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'nodeContextMenu', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'nodeDragStart', nodeDragEvent: NodeDragEvent): void
-  (event: 'nodeDrag', nodeDragEvent: NodeDragEvent): void
-  (event: 'nodeDragStop', nodeDragEvent: NodeDragEvent): void
-  (event: 'miniMapNodeClick', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'miniMapNodeDoubleClick', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'miniMapNodeMouseEnter', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'miniMapNodeMouseMove', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'miniMapNodeMouseLeave', nodeMouseEvent: NodeMouseEvent): void
-  (event: 'connect', connectionEvent: Connection): void
-  (
-    event: 'connectStart',
-    connectionEvent: {
-      event: MouseEvent
-    } & OnConnectStartParams,
-  ): void
-  (event: 'connectStop', connectionEvent: MouseEvent): void
-  (event: 'connectEnd', connectionEvent: MouseEvent): void
-  (event: 'moveStart', moveEvent: { event: D3ZoomEvent<HTMLDivElement, any>; flowTransform: ViewpaneTransform }): void
-  (event: 'move', moveEvent: { event: D3ZoomEvent<HTMLDivElement, any>; flowTransform: ViewpaneTransform }): void
-  (event: 'moveEnd', moveEvent: { event: D3ZoomEvent<HTMLDivElement, any>; flowTransform: ViewpaneTransform }): void
-  (event: 'selectionDragStart', selectionEvent: NodeDragEvent): void
-  (event: 'selectionDrag', selectionEvent: NodeDragEvent): void
-  (event: 'selectionDragStop', selectionEvent: NodeDragEvent): void
-  (event: 'selectionContextMenu', selectionEvent: { event: MouseEvent; nodes: GraphNode[] }): void
-  (event: 'paneReady', paneEvent: VueFlowStore): void
-  (event: 'paneScroll', paneEvent: WheelEvent | undefined): void
-  (event: 'paneClick', paneEvent: MouseEvent): void
-  (event: 'paneContextMenu', paneEvent: MouseEvent): void
-  (event: 'edgeContextMenu', edgeMouseEvent: EdgeMouseEvent): void
-  (event: 'edgeMouseEnter', edgeMouseEvent: EdgeMouseEvent): void
-  (event: 'edgeMouseMove', edgeMouseEvent: MouseEvent): void
-  (event: 'edgeMouseLeave', edgeMouseEvent: MouseEvent): void
-  (event: 'edgeDoubleClick', edgeMouseEvent: MouseEvent): void
-  (event: 'edgeClick', edgeMouseEvent: MouseEvent): void
-  (event: 'edgeUpdateStart', edgeMouseEvent: MouseEvent): void
-  (event: 'edgeUpdate', edgeMouseEvent: MouseEvent): void
-  (event: 'edgeUpdateEnd', edgeMouseEvent: MouseEvent): void
-
-  (event: 'update:modelValue', value: FlowElements): void
-  (event: 'update:nodes', value: GraphNode[]): void
-  (event: 'update:edges', value: GraphEdge[]): void
-}>()
+const emit = defineEmits<Emits>()
 
 const modelValue = useVModel(props, 'modelValue', emit)
 const modelNodes = useVModel(props, 'nodes', emit)
diff --git a/packages/vue-flow/src/types/hooks.ts b/packages/vue-flow/src/types/hooks.ts
index dfd49605..ac374d9e 100644
--- a/packages/vue-flow/src/types/hooks.ts
+++ b/packages/vue-flow/src/types/hooks.ts
@@ -89,6 +89,9 @@ export type FlowHooksEmit = Readonly<{
   [key in keyof FlowEvents]: EventHookTrigger<FlowEvents[key]>
 }>
 
+/**
+ * Vue Flow component event emitter definitions
+ */
 export interface Emits {
   (event: 'nodesChange', changes: NodeChange[]): void
   (event: 'edgesChange', changes: EdgeChange[]): void
@@ -136,6 +139,7 @@ export interface Emits {
   (event: 'edgeUpdate', edgeMouseEvent: MouseEvent): void
   (event: 'edgeUpdateEnd', edgeMouseEvent: MouseEvent): void
 
+  /** v-model event definitions */
   (event: 'update:modelValue', value: FlowElements): void
   (event: 'update:nodes', value: GraphNode[]): void
   (event: 'update:edges', value: GraphEdge[]): void