update!: graphnode and node typing

* graphnode is a node containing internal Vue Flow data
* move util files to util directory
* move flow actions type into store file
* rename panel type file to zoom
* rename types file to flow
* Rename Node to NodeWrapper
* Rename Edge to EdgeWrapper

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

src/types/zoom.ts

@@ -0,0 +1,31 @@
+import { Selection, ZoomBehavior } from 'd3'
+import { FitViewFunc, FlowTransform, Rect, XYPosition } from './flow'
+
+export type D3Zoom = ZoomBehavior<HTMLDivElement, unknown>
+export type D3Selection = Selection<HTMLDivElement, unknown, any, any>
+export type D3ZoomHandler = (this: HTMLDivElement, event: any, d: unknown) => void
+
+export type KeyCode = number | string
+
+export enum PanOnScrollMode {
+  Free = 'free',
+  Vertical = 'vertical',
+  Horizontal = 'horizontal',
+}
+
+export interface UseZoomPanHelper {
+  zoomIn: () => void
+  zoomOut: () => void
+  zoomTo: (zoomLevel: number) => void
+  transform: (transform: FlowTransform) => void
+  fitView: FitViewFunc
+  setCenter: (x: number, y: number, zoom?: number) => void
+  fitBounds: (bounds: Rect, padding?: number) => void
+  project: (position: XYPosition) => XYPosition
+}
+
+export type InitD3ZoomPayload = {
+  d3Zoom: D3Zoom
+  d3Selection: D3Selection
+  d3ZoomHandler: D3ZoomHandler
+}