Hooks
useConnection
The useConnection hook returns the current connection when there is an active connection interaction. If no connection interaction is active, it returns null for every property. A typical use case for this hook is to colorize handles based on a certain condition (e.g. if the connection is valid or not).
Read moreuseEdges
The useEdges hook returns an array of the current edges store.
Read moreuseHandleConnections
This hook can be used to get notified when the connections of a handle change.
Read moreuseInternalNode
The useInternalNode hook returns an internal node.
Read moreuseNodes
This hook returns a store of the current nodes array. When you subscribe to this store, it will trigger whenever the nodes array changes. This happens when nodes are added, removed, or updated (dragged for example).
Read moreuseNodesData
With this hook you can receive the data of the passed node ids.
Read moreuseNodesInitialized
The useNodesInitialized hook can be used to check if all nodes are initialized.
Read moreuseSvelteFlow
The useSvelteFlow hook returns functions to update the viewport, transform coordinates or get node intersections for example.
Read moreuseStore
The useStore hook can be used to access the internal store of the Svelte Flow.
Read moreuseUpdateNodeInternals
When you programmatically add or remove handles to a node or update a node's handle position, you need to inform Svelte Flow about it by using this hook. This will update the internal dimensions of the node and properly reposition handles on the canvas if necessary.
Read more