feat(react,svelte): add getHandleConnections helper to useReactFlow & useSvelteFlow

This commit is contained in:
braks
2024-08-20 13:04:41 +02:00
parent 9b768b2dae
commit 181dc66b8c
3 changed files with 52 additions and 2 deletions
+7
View File
@@ -230,6 +230,13 @@ export function useReactFlow<NodeType extends Node = Node, EdgeType extends Edge
options
);
},
getHandleConnections: ({ type, id, nodeId }) =>
Array.from(
store
.getState()
.connectionLookup.get(`${nodeId}-${type}-${id ?? null}`)
?.values() ?? []
),
};
}, []);
+18 -1
View File
@@ -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<NodeType extends Node = Node, EdgeType extends Edge = Edge> = {
@@ -173,6 +173,23 @@ export type GeneralHelpers<NodeType extends Node = Node, EdgeType extends Edge =
dataUpdate: Partial<EdgeType['data']> | ((edge: EdgeType) => Partial<EdgeType['data']>),
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<NodeType extends Node = Node, EdgeType extends Edge = Edge> = GeneralHelpers<
+27 -1
View File
@@ -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
};
}