From e8aa8737ae4dc038706c0984c40aa0812ad3506c Mon Sep 17 00:00:00 2001 From: Andreas Schultz Date: Fri, 11 Mar 2022 09:03:24 +0100 Subject: [PATCH] Pass isSourceHandle flag to onEdgeUpdateStart - This allows to know during an edge update which side of the edge is getting dragged by the user. - Use cases include showing custom validation hints to the user during an edge update, e.g. which handles can be connected to and which not. This would otherwise not be possible without knowing which side is updated. --- src/components/Edges/wrapEdge.tsx | 2 +- src/container/EdgeRenderer/index.tsx | 2 +- src/container/ReactFlow/index.tsx | 2 +- src/types/index.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/Edges/wrapEdge.tsx b/src/components/Edges/wrapEdge.tsx index 60384e74..292463f0 100644 --- a/src/components/Edges/wrapEdge.tsx +++ b/src/components/Edges/wrapEdge.tsx @@ -140,7 +140,7 @@ export default (EdgeComponent: ComponentType) => { const isValidConnection = () => true; const isTarget = isSourceHandle; - onEdgeUpdateStart?.(event, edgeElement); + onEdgeUpdateStart?.(event, edgeElement, isSourceHandle); const _onEdgeUpdate = onEdgeUpdateEnd ? (evt: MouseEvent): void => onEdgeUpdateEnd(evt, edgeElement) diff --git a/src/container/EdgeRenderer/index.tsx b/src/container/EdgeRenderer/index.tsx index 21d7034f..def55e27 100644 --- a/src/container/EdgeRenderer/index.tsx +++ b/src/container/EdgeRenderer/index.tsx @@ -34,7 +34,7 @@ interface EdgeRendererProps { onEdgeMouseEnter?: (event: React.MouseEvent, edge: Edge) => void; onEdgeMouseMove?: (event: React.MouseEvent, edge: Edge) => void; onEdgeMouseLeave?: (event: React.MouseEvent, edge: Edge) => void; - onEdgeUpdateStart?: (event: React.MouseEvent, edge: Edge) => void; + onEdgeUpdateStart?: (event: React.MouseEvent, edge: Edge, isSourceHandle: boolean) => void; onEdgeUpdateEnd?: (event: MouseEvent, edge: Edge) => void; edgeUpdaterRadius?: number; } diff --git a/src/container/ReactFlow/index.tsx b/src/container/ReactFlow/index.tsx index 66dbe234..cc0ae8ea 100644 --- a/src/container/ReactFlow/index.tsx +++ b/src/container/ReactFlow/index.tsx @@ -123,7 +123,7 @@ export interface ReactFlowProps extends Omit, 'on onEdgeMouseMove?: (event: ReactMouseEvent, edge: Edge) => void; onEdgeMouseLeave?: (event: ReactMouseEvent, edge: Edge) => void; onEdgeDoubleClick?: (event: ReactMouseEvent, edge: Edge) => void; - onEdgeUpdateStart?: (event: ReactMouseEvent, edge: Edge) => void; + onEdgeUpdateStart?: (event: ReactMouseEvent, edge: Edge, isSourceHandle: boolean) => void; onEdgeUpdateEnd?: (event: MouseEvent, edge: Edge) => void; edgeUpdaterRadius?: number; nodeTypesId?: string; diff --git a/src/types/index.ts b/src/types/index.ts index d24a0c12..ce257abd 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -132,7 +132,7 @@ export interface WrapEdgeProps { onMouseMove?: (event: React.MouseEvent, edge: Edge) => void; onMouseLeave?: (event: React.MouseEvent, edge: Edge) => void; edgeUpdaterRadius?: number; - onEdgeUpdateStart?: (event: React.MouseEvent, edge: Edge) => void; + onEdgeUpdateStart?: (event: React.MouseEvent, edge: Edge, isSourceHandle: boolean) => void; onEdgeUpdateEnd?: (event: MouseEvent, edge: Edge) => void; }