added final connection state to onReconnectEnd
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
// Reconnectable edges have a anchors around their handles to reconnect the edge.
|
// Reconnectable edges have a anchors around their handles to reconnect the edge.
|
||||||
import { XYHandle, type Connection, EdgePosition } from '@xyflow/system';
|
import { XYHandle, type Connection, EdgePosition, FinalConnectionState } from '@xyflow/system';
|
||||||
|
|
||||||
import { EdgeAnchor } from '../Edges/EdgeAnchor';
|
import { EdgeAnchor } from '../Edges/EdgeAnchor';
|
||||||
import type { EdgeWrapperProps, Edge } from '../../types/edges';
|
import type { EdgeWrapperProps, Edge } from '../../types/edges';
|
||||||
@@ -68,9 +68,9 @@ export function EdgeUpdateAnchors<EdgeType extends Edge = Edge>({
|
|||||||
setReconnecting(true);
|
setReconnecting(true);
|
||||||
onReconnectStart?.(event, edge, handleType);
|
onReconnectStart?.(event, edge, handleType);
|
||||||
|
|
||||||
const _onReconnectEnd = (evt: MouseEvent | TouchEvent) => {
|
const _onReconnectEnd = (evt: MouseEvent | TouchEvent, connectionState: FinalConnectionState) => {
|
||||||
setReconnecting(false);
|
setReconnecting(false);
|
||||||
onReconnectEnd?.(evt, edge, handleType);
|
onReconnectEnd?.(evt, edge, handleType, connectionState);
|
||||||
};
|
};
|
||||||
|
|
||||||
const onConnectEdge = (connection: Connection) => onReconnect?.(edge, connection);
|
const onConnectEdge = (connection: Connection) => onReconnect?.(edge, connection);
|
||||||
|
|||||||
@@ -14,6 +14,8 @@ import type {
|
|||||||
EdgePosition,
|
EdgePosition,
|
||||||
StepPathOptions,
|
StepPathOptions,
|
||||||
OnError,
|
OnError,
|
||||||
|
ConnectionState,
|
||||||
|
FinalConnectionState,
|
||||||
} from '@xyflow/system';
|
} from '@xyflow/system';
|
||||||
|
|
||||||
import { EdgeTypes, InternalNode, Node } from '.';
|
import { EdgeTypes, InternalNode, Node } from '.';
|
||||||
@@ -78,7 +80,12 @@ export type EdgeWrapperProps<EdgeType extends Edge = Edge> = {
|
|||||||
onMouseLeave?: EdgeMouseHandler<EdgeType>;
|
onMouseLeave?: EdgeMouseHandler<EdgeType>;
|
||||||
reconnectRadius?: number;
|
reconnectRadius?: number;
|
||||||
onReconnectStart?: (event: ReactMouseEvent, edge: EdgeType, handleType: HandleType) => void;
|
onReconnectStart?: (event: ReactMouseEvent, edge: EdgeType, handleType: HandleType) => void;
|
||||||
onReconnectEnd?: (event: MouseEvent | TouchEvent, edge: EdgeType, handleType: HandleType) => void;
|
onReconnectEnd?: (
|
||||||
|
event: MouseEvent | TouchEvent,
|
||||||
|
edge: EdgeType,
|
||||||
|
handleType: HandleType,
|
||||||
|
connectionState: FinalConnectionState
|
||||||
|
) => void;
|
||||||
rfId?: string;
|
rfId?: string;
|
||||||
edgeTypes?: EdgeTypes;
|
edgeTypes?: EdgeTypes;
|
||||||
onError?: OnError;
|
onError?: OnError;
|
||||||
|
|||||||
@@ -50,10 +50,9 @@ export type OnConnectStartParams = {
|
|||||||
|
|
||||||
export type OnConnectStart = (event: MouseEvent | TouchEvent, params: OnConnectStartParams) => void;
|
export type OnConnectStart = (event: MouseEvent | TouchEvent, params: OnConnectStartParams) => void;
|
||||||
export type OnConnect = (connection: Connection) => void;
|
export type OnConnect = (connection: Connection) => void;
|
||||||
export type OnConnectEnd = (
|
export type OnConnectEnd = (event: MouseEvent | TouchEvent, connectionState: FinalConnectionState) => void;
|
||||||
event: MouseEvent | TouchEvent,
|
|
||||||
connectionState: Omit<ConnectionState, 'inProgress'>
|
export type FinalConnectionState = Omit<ConnectionState, 'inProgress'>;
|
||||||
) => void;
|
|
||||||
|
|
||||||
export type IsValidConnection = (edge: EdgeBase | Connection) => boolean;
|
export type IsValidConnection = (edge: EdgeBase | Connection) => boolean;
|
||||||
|
|
||||||
|
|||||||
@@ -194,13 +194,14 @@ function onPointerDown(
|
|||||||
// in order to get the latest state of onConnectEnd
|
// in order to get the latest state of onConnectEnd
|
||||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||||
const { inProgress, ...connectionState } = previousConnection;
|
const { inProgress, ...connectionState } = previousConnection;
|
||||||
onConnectEnd?.(event, {
|
const finalConnectionState = {
|
||||||
...connectionState,
|
...connectionState,
|
||||||
toPosition: previousConnection.toHandle ? previousConnection.toPosition : null,
|
toPosition: previousConnection.toHandle ? previousConnection.toPosition : null,
|
||||||
});
|
};
|
||||||
|
onConnectEnd?.(event, finalConnectionState);
|
||||||
|
|
||||||
if (edgeUpdaterType) {
|
if (edgeUpdaterType) {
|
||||||
onReconnectEnd?.(event);
|
onReconnectEnd?.(event, finalConnectionState);
|
||||||
}
|
}
|
||||||
|
|
||||||
cancelConnection();
|
cancelConnection();
|
||||||
|
|||||||
@@ -11,6 +11,8 @@ import {
|
|||||||
type UpdateConnection,
|
type UpdateConnection,
|
||||||
type IsValidConnection,
|
type IsValidConnection,
|
||||||
NodeLookup,
|
NodeLookup,
|
||||||
|
ConnectionState,
|
||||||
|
FinalConnectionState,
|
||||||
} from '../types';
|
} from '../types';
|
||||||
|
|
||||||
export type OnPointerDownParams = {
|
export type OnPointerDownParams = {
|
||||||
@@ -32,7 +34,7 @@ export type OnPointerDownParams = {
|
|||||||
onConnect?: OnConnect;
|
onConnect?: OnConnect;
|
||||||
onConnectEnd?: OnConnectEnd;
|
onConnectEnd?: OnConnectEnd;
|
||||||
isValidConnection?: IsValidConnection;
|
isValidConnection?: IsValidConnection;
|
||||||
onReconnectEnd?: (evt: MouseEvent | TouchEvent) => void;
|
onReconnectEnd?: (evt: MouseEvent | TouchEvent, connectionState: FinalConnectionState) => void;
|
||||||
getTransform: () => Transform;
|
getTransform: () => Transform;
|
||||||
getFromHandle: () => Handle | null;
|
getFromHandle: () => Handle | null;
|
||||||
autoPanSpeed?: number;
|
autoPanSpeed?: number;
|
||||||
|
|||||||
Reference in New Issue
Block a user