A node editor for React
npm install @tjbaron/flume
  
``bash`
npm install --save flume
Import FlumeConfig and use it to define the nodes and ports that will make up your node editor.
`jsx
import { FlumeConfig, Controls, Colors } from "flume";
const flumeConfig = new FlumeConfig()
flumeConfig
.addPortType({
type: "number",
name: "number",
label: "Number",
color: Colors.red,
controls: [
Controls.number({
name: "num",
label: "Number"
})
]
})
.addNodeType({
type: "number",
label: "Number",
initialWidth: 150,
inputs: ports => [
ports.number()
],
outputs: ports => [
ports.number()
]
})
.addNodeType({
type: "addNumbers",
label: "Add Numbers",
initialWidth: 150,
inputs: ports => [
ports.number({name: "num1"}),
ports.number({name: "num2"})
],
outputs: ports => [
ports.number({name: "result"})
]
})
`
To render the node editor, import NodeEditor and pass it your nodeTypes and portTypes from the configuration you created.
`jsx
import React from 'react'
import { NodeEditor } from 'flume'
import config from './config'
const App = () => {
return (
For more complete documentation visit: flume.dev
MIT © chrisjpatty