A Blender-style node editor built on xyflow. Try it out in Storybook or checkout the getting started CodeSandbox.

Note: This project is still in development and the API is likely to change.

Features

• Declarative JSON-based types, inputs, and nodes.
• Custom node and input types using React components when the declarative approach is insufficient.
• Color-coded node groups, value types, and connections.
• Collapsable nodes.
• Copy and paste nodes and connections.
• Many input types supported including text input, checkboxes, button groups, and select dropdowns.
• Multiple socket shapes supported including square, circle, diamond, and diamond with a dot (similar to Blender).
• Property-as-inputs allow you to set the value directly using an input, or connect it to the output of another node.
• Built-in support for Dagre layout engine.

Getting Started

npm install @xyflow/react @clarkmcc/ngraph 

Credits

The design for this project is inspired almost entirely by the roman01la/threegn (now archived).