diff --git a/packages/react/src/hooks/useReactFlow.ts b/packages/react/src/hooks/useReactFlow.ts index faf9d31f..8f303787 100644 --- a/packages/react/src/hooks/useReactFlow.ts +++ b/packages/react/src/hooks/useReactFlow.ts @@ -230,6 +230,13 @@ export function useReactFlow + Array.from( + store + .getState() + .connectionLookup.get(`${nodeId}-${type}-${id ?? null}`) + ?.values() ?? [] + ), }; }, []); diff --git a/packages/react/src/types/instance.ts b/packages/react/src/types/instance.ts index 5f4aa3b3..01bb0c13 100644 --- a/packages/react/src/types/instance.ts +++ b/packages/react/src/types/instance.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/no-namespace */ -import type { Rect, Viewport } from '@xyflow/system'; +import type { HandleConnection, HandleType, Rect, Viewport } from '@xyflow/system'; import type { Node, Edge, ViewportHelperFunctions, InternalNode } from '.'; export type ReactFlowJsonObject = { @@ -173,6 +173,23 @@ export type GeneralHelpers | ((edge: EdgeType) => Partial), options?: { replace: boolean } ) => void; + /** + * Gets all connections for a given handle belonging to a specific node. + * + * @param type - handle type 'source' or 'target' + * @param id - the handle id + * @param nodeId - the node id the handle belongs to + * @returns an array with handle connections + */ + getHandleConnections: ({ + type, + id, + nodeId, + }: { + type: HandleType; + nodeId: string; + id?: string | null; + }) => HandleConnection[]; }; export type ReactFlowInstance = GeneralHelpers< diff --git a/packages/svelte/src/lib/hooks/useSvelteFlow.ts b/packages/svelte/src/lib/hooks/useSvelteFlow.ts index 4ed08350..7fb7f5cf 100644 --- a/packages/svelte/src/lib/hooks/useSvelteFlow.ts +++ b/packages/svelte/src/lib/hooks/useSvelteFlow.ts @@ -14,7 +14,9 @@ import { getViewportForBounds, getElementsToRemove, rendererPointToPoint, - evaluateAbsolutePosition + evaluateAbsolutePosition, + type HandleType, + type HandleConnection } from '@xyflow/system'; import { useStore } from '$lib/store'; @@ -230,6 +232,23 @@ export function useSvelteFlow(): { * @returns the nodes, edges and the viewport as a JSON object */ toObject: () => { nodes: Node[]; edges: Edge[]; viewport: Viewport }; + /** + * Gets all connections for a given handle belonging to a specific node. + * + * @param type - handle type 'source' or 'target' + * @param id - the handle id + * @param nodeId - the node id the handle belongs to + * @returns an array with handle connections + */ + getHandleConnections: ({ + type, + id, + nodeId + }: { + type: HandleType; + nodeId: string; + id?: string | null; + }) => HandleConnection[]; } { const { zoomIn, @@ -248,6 +267,7 @@ export function useSvelteFlow(): { domNode, nodeLookup, edgeLookup, + connectionLookup, nodeOrigin } = useStore(); @@ -523,6 +543,12 @@ export function useSvelteFlow(): { nodes.update((nds) => nds); }, + getHandleConnections: ({ type, id, nodeId }) => + Array.from( + get(connectionLookup) + .get(`${nodeId}-${type}-${id ?? null}`) + ?.values() ?? [] + ), viewport }; }