This reference attempts to document every function, hook, component, and type exported by Svelte Flow. If you are looking for guides, please refer to our learn section.
This package is currently in an alpha state and under heavy development. The API is likely to change. You can read about the latest changes in the "What's New" section.
We think that documentation should answer two broad questions: "what is this thing?" and "how do I use it?"
To that end, our API reference aims to concisely answer that first question, while guides go into more detail on the second. If you find yourself clicking around the reference wondering what the heck any of this means, maybe we have a guide that can help you out!
A powerful feature of Svelte Flow is the ability to add custom nodes. Within your custom nodes you can render everything you want. You can define multiple source and target handles and render form inputs or charts for example. In this guide we will implement a node with an input field that updates some text in another part of the application.Read more
Is this a flow within a flow? Yes! Sometimes you want to treat parts of a flow as a group or even as a single node. This is where subflows come into play. In this guide you will learn how to create a child-parent relationship between nodes and implement different types of subflows.Read more
For our API reference, however, we use TypeScript's syntax to document the types of props and functions. Here's a quick crash course on how to read it:
? means that the field or argument is optional.
<T> in a type definition represents a generic type parameter. Like a function
argument but for types! The definition
type Array<T> = ... means a type called
Array that takes a generic type parameter
<T> when referring to a type is like "filling in" a generic type parameter.
It's like calling a function but for types! The type
Array<number> is the
Array with the generic type parameter
T filled in with the type
T | U means that the type is either
U: this is often called a
T & U means that the type is both
U: this is often called an
The TypeScript folks have their own handy guide for reading types (opens in a new tab) that you might find useful. If you're still stuck on something, feel free to drop by our Discord (opens in a new tab) and ask for help!