Merge pull request #3914 from xyflow/handle-connections-svelte

aligned useHandleConnections in svelte with react version
This commit is contained in:
Moritz Klack
2024-02-15 18:05:40 +01:00
committed by GitHub
2 changed files with 10 additions and 4 deletions
@@ -37,8 +37,9 @@ export function useHandleConnections({
onDisconnect,
}: useHandleConnectionsParams): HandleConnection[] {
const _nodeId = useNodeId();
const currentNodeId = nodeId ?? _nodeId;
const prevConnections = useRef<Map<string, HandleConnection> | null>(null);
const currentNodeId = nodeId || _nodeId;
const connections = useStore(
(state) => state.connectionLookup.get(`${currentNodeId}-${type}-${id}`),
@@ -2,10 +2,11 @@ import { derived } from 'svelte/store';
import { areConnectionMapsEqual, type HandleConnection, type HandleType } from '@xyflow/system';
import { useStore } from '$lib/store';
import { getContext } from 'svelte';
export type useHandleConnectionsParams = {
nodeId: string;
type: HandleType;
nodeId?: string;
id?: string | null;
};
@@ -20,14 +21,18 @@ const initialConnections: HandleConnection[] = [];
* @param param.id - the handle id (this is only needed if the node has multiple handles of the same type)
* @returns an array with connections
*/
export function useHandleConnections({ nodeId, type, id = null }: useHandleConnectionsParams) {
export function useHandleConnections({ type, nodeId, id = null }: useHandleConnectionsParams) {
const { edges, connectionLookup } = useStore();
const _nodeId = getContext<string>('svelteflow__node_id');
const currentNodeId = nodeId ?? _nodeId;
let prevConnections: Map<string, HandleConnection> | undefined = undefined;
return derived(
[edges, connectionLookup],
([, connectionLookup], set) => {
const nextConnections = connectionLookup.get(`${nodeId}-${type}-${id || null}`);
const nextConnections = connectionLookup.get(`${currentNodeId}-${type}-${id || null}`);
if (!areConnectionMapsEqual(nextConnections, prevConnections)) {
prevConnections = nextConnections;