React Flow | Svelte Flow - Powerful open source libraries for building node-based UIs with React (https://reactflow.dev) or Svelte (https://svelteflow.dev). Ready out-of-the-box and infinitely customizable.
add string array to UpdateNodeInternals thanks @DenizUgur
pinch zoom on windows
drag for touch devices
return user node in node event handlers
cleanup useReactFlow
export KeyCode and Align type
Svelte Flow 0.1.0
This is a bigger update for Svelte Flow to keep up with the latest changes we made for React Flow and the Svelte5 rewrite. The biggest change is the separation of user nodes (type Node) and internal nodes (type InternalNode), which includes a renaming of the node.computed attribute to node.measured. In the previous versions, we stored internals in node[internalsSymbol]. This doesn't exist anymore, but we only add it to our internal nodes in node.internals.. We will stick to our plan and use 0.x.x for Svelte 4 and start with Svelte 5 with >= 1.0.0.
⚠️ Breaking
rename node.computed to node.measured - this attribute only includes width and height and no positionAbsolute anymore. For this we added the helpers getInternalNode and useInternalNode
rename node.parentNode to node.parentId
More updates:
add isValidConnection for <Handle /> component
add fitViewOptions for <Controls /> component
add getInternalNode to useSvelteFlow
add useInternalNode hook
don't reset nodes and edges when svelte flow unmounts - thanks @darabos
fix node event types - thanks @RedPhoenixQ
make handleId and isTarget reactive - thanks @darabos
fix MiniMap interaction for touch devices
fix pane: pinch zoom on windows
fix nodes: return user node in node event handlers
React Flow 12.0.0-next.17
defaultNodescloses #4202UpdateNodeInternalsthanks @DenizUguruseReactFlowKeyCodeandAligntypeSvelte Flow 0.1.0
This is a bigger update for Svelte Flow to keep up with the latest changes we made for React Flow and the Svelte5 rewrite. The biggest change is the separation of user nodes (type
Node) and internal nodes (typeInternalNode), which includes a renaming of thenode.computedattribute tonode.measured. In the previous versions, we stored internals innode[internalsSymbol]. This doesn't exist anymore, but we only add it to our internal nodes innode.internals.. We will stick to our plan and use 0.x.x for Svelte 4 and start with Svelte 5 with >= 1.0.0.⚠️ Breaking
node.computedtonode.measured- this attribute only includeswidthandheightand nopositionAbsoluteanymore. For this we added the helpersgetInternalNodeanduseInternalNodenode.parentNodetonode.parentIdMore updates:
isValidConnectionfor<Handle />componentfitViewOptionsfor<Controls />componentgetInternalNodetouseSvelteFlowuseInternalNodehookAligntype