feat(props): add onConnectEnd function #451

src/container/GraphView/index.tsx

@@ -23,6 +23,7 @@ import {
   FlowTransform,
   OnConnectStartFunc,
   OnConnectStopFunc,
+  OnConnectEndFunc,
 } from '../../types';
 
 export interface GraphViewProps {
@@ -38,6 +39,7 @@ export interface GraphViewProps {
   onConnect?: (connection: Connection | Edge) => void;
   onConnectStart?: OnConnectStartFunc;
   onConnectStop?: OnConnectStopFunc;
+  onConnectEnd?: OnConnectEndFunc;
   onLoad?: OnLoadFunc;
   onMove?: (flowTransform?: FlowTransform) => void;
   onMoveStart?: (flowTransform?: FlowTransform) => void;
@@ -91,6 +93,7 @@ const GraphView = ({
   onConnect,
   onConnectStart,
   onConnectStop,
+  onConnectEnd,
   snapToGrid,
   snapGrid,
   onlyRenderVisibleNodes,
@@ -119,6 +122,7 @@ const GraphView = ({
   const setOnConnect = useStoreActions((actions) => actions.setOnConnect);
   const setOnConnectStart = useStoreActions((actions) => actions.setOnConnectStart);
   const setOnConnectStop = useStoreActions((actions) => actions.setOnConnectStop);
+  const setOnConnectEnd = useStoreActions((actions) => actions.setOnConnectEnd);
   const setSnapGrid = useStoreActions((actions) => actions.setSnapGrid);
   const setNodesDraggable = useStoreActions((actions) => actions.setNodesDraggable);
   const setNodesConnectable = useStoreActions((actions) => actions.setNodesConnectable);
@@ -209,6 +213,12 @@ const GraphView = ({
     }
   }, [onConnectStop]);
 
+  useEffect(() => {
+    if (onConnectEnd) {
+      setOnConnectEnd(onConnectEnd);
+    }
+  }, [onConnectEnd]);
+
   useEffect(() => {
     setSnapGrid({ snapToGrid, snapGrid });
   }, [snapToGrid, snapGrid]);

src/container/ReactFlow/index.tsx

@@ -29,6 +29,7 @@ import {
   FlowTransform,
   OnConnectStartFunc,
   OnConnectStopFunc,
+  OnConnectEndFunc,
 } from '../../types';
 
 import '../../style.css';
@@ -46,6 +47,7 @@ export interface ReactFlowProps extends Omit<HTMLAttributes<HTMLDivElement>, 'on
   onConnect?: (connection: Edge | Connection) => void;
   onConnectStart?: OnConnectStartFunc;
   onConnectStop?: OnConnectStopFunc;
+  onConnectEnd?: OnConnectEndFunc;
   onLoad?: OnLoadFunc;
   onMove?: (flowTransform?: FlowTransform) => void;
   onMoveStart?: (flowTransform?: FlowTransform) => void;
@@ -93,6 +95,7 @@ const ReactFlow = ({
   onConnect,
   onConnectStart,
   onConnectStop,
+  onConnectEnd,
   onNodeMouseEnter,
   onNodeMouseMove,
   onNodeMouseLeave,
@@ -153,6 +156,7 @@ const ReactFlow = ({
           onConnect={onConnect}
           onConnectStart={onConnectStart}
           onConnectStop={onConnectStop}
+          onConnectEnd={onConnectEnd}
           snapToGrid={snapToGrid}
           snapGrid={snapGrid}
           onlyRenderVisibleNodes={onlyRenderVisibleNodes}