refactor(store): connection data

packages/system/src/types/general.ts

@@ -3,8 +3,9 @@ import type { D3DragEvent, Selection as D3Selection, SubjectPosition, ZoomBehavi
 
 import type { XYPosition, Rect } from './utils';
 import type { BaseNode, NodeDragItem, NodeOrigin } from './nodes';
-import type { HandleType } from './handles';
+import type { ConnectingHandle, HandleType } from './handles';
 import { PanZoomInstance } from './panzoom';
+import { BaseEdge } from '..';
 
 export type Project = (position: XYPosition) => XYPosition;
 
@@ -34,7 +35,17 @@ export enum ConnectionMode {
   Loose = 'loose',
 }
 
+export type OnConnectStartParams = {
+  nodeId: string | null;
+  handleId: string | null;
+  handleType: HandleType | null;
+};
+
+export type OnConnectStart = (event: MouseEvent | TouchEvent, params: OnConnectStartParams) => void;
 export type OnConnect = (connection: Connection) => void;
+export type OnConnectEnd = (event: MouseEvent | TouchEvent) => void;
+
+export type IsValidConnection = (edge: BaseEdge | Connection) => boolean;
 
 export type FitViewParamsBase<NodeType extends BaseNode> = {
   nodes: NodeType[];
@@ -55,12 +66,6 @@ export type FitViewOptionsBase<NodeType extends BaseNode> = {
   nodes?: (Partial<NodeType> & { id: NodeType['id'] })[];
 };
 
-export type OnConnectStartParams = {
-  nodeId: string | null;
-  handleId: string | null;
-  handleType: HandleType | null;
-};
-
 export type Viewport = {
   x: number;
   y: number;
@@ -124,3 +129,10 @@ export type UpdateNodePositions = (
   dragging?: boolean
 ) => void;
 export type PanBy = (delta: XYPosition) => boolean;
+
+export type UpdateConnection = (params: {
+  connectionPosition?: XYPosition | null;
+  connectionStatus?: ConnectionStatus | null;
+  connectionStartHandle?: ConnectingHandle | null;
+  connectionEndHandle?: ConnectingHandle | null;
+}) => void;

packages/system/src/types/handles.ts

@@ -1,4 +1,4 @@
-import type { XYPosition, Position, Dimensions, OnConnect, Connection } from '.';
+import type { XYPosition, Position, Dimensions, OnConnect, IsValidConnection } from '.';
 
 export type HandleType = 'source' | 'target';
 
@@ -14,6 +14,14 @@ export type ConnectingHandle = {
   handleId?: string | null;
 };
 
+export type ConnectionHandle = {
+  id: string | null;
+  type: HandleType;
+  nodeId: string;
+  x: number;
+  y: number;
+};
+
 export type HandleProps = {
   type: HandleType;
   position: Position;
@@ -21,6 +29,6 @@ export type HandleProps = {
   isConnectableStart?: boolean;
   isConnectableEnd?: boolean;
   onConnect?: OnConnect;
-  isValidConnection?: (connection: Connection) => boolean;
+  isValidConnection?: IsValidConnection;
   id?: string;
 };