flowGen keeps an undo/redo history of the whole graph and continuously propagates each node's output onto the input fields of the nodes it feeds, so consumers always reflect their current upstream sources.
Where: canvas — Edit the graph, then undo/redo; watch connected inputs update live
Key ideas
- Graph history: Meaningful actions (add/delete/move node, connect edge, batch binding edits) push a snapshot; undo/redo restores nodes + edges and re-attaches each node's interactive callbacks. A fingerprint dedups identical states, including AI text/prompt mutations and batch bindings.
- Live data propagation: An effect keyed on edges resolves each connection and mirrors the upstream value onto the target's input data — prompts to gen nodes, images to reference/asset/layer handles, HTML and design systems to section/behavior nodes, context items into Text Generation.
- Connection-aware behavior: Some nodes act only when wired: a node's isConnected flag tracks whether it has the input it needs, and producers like layer compose / text style only rasterize when something downstream consumes them.
Steps
- Build or edit your graph normally — connect, move, and configure nodes.
- Use undo/redo to step back and forward through graph states; restored nodes stay fully interactive (their Run/change callbacks are reattached).
- Connect a Text or source node into a generation node and watch its prompt/reference fields fill in automatically from the upstream output.
- Disconnect a source and confirm the consumer drops the propagated value and updates its connected state.
FAQ
Why does undo capture an AI text change but not just moving a node a pixel?
The history fingerprint includes node positions (rounded), key data fields (text/prompt/model/aspect ratio/etc.), result counts, and batch bindings. Identical fingerprints are deduped so an AI prompt edit registers as a distinct state while no-op churn doesn't.
How does a node know its input changed?
Data propagation runs on edge changes, resolves proxy edges for collapsed groups, and writes the upstream value into the consumer's data (and flips its isConnected flag) so the card reflects the live source.