feat(nodetypes): custome types

src/index.js

@@ -3,13 +3,24 @@ import React, { PureComponent } from 'react';
 import { separateElements } from './graph-utils';
 import GraphView from './GraphView';
 import { Provider } from './GraphContext';
+import { createNodeTypes } from './NodeRenderer/utils';
+
+import DefaultNode from './NodeRenderer/NodeTypes/DefaultNode';
+import InputNode from './NodeRenderer/NodeTypes/InputNode';
+import OutputNode from './NodeRenderer/NodeTypes/OutputNode';
 
 import './style.css';
 
 class ReactGraph extends PureComponent {
+  constructor(props) {
+    super(props);
+
+    this.nodeTypes = createNodeTypes(props.nodeTypes);
+  }
+
   render() {
     const {
-      style, onNodeClick, children, onLoad, onMove, onChange, elements, nodeTypes
+      style, onNodeClick, children, onLoad, onMove, onChange, elements
     } = this.props;
 
     const { nodes, edges } = separateElements(elements);
@@ -21,7 +32,7 @@ class ReactGraph extends PureComponent {
             onLoad={onLoad}
             onMove={onMove}
             onChange={onChange}
-            nodeTypes={nodeTypes}
+            nodeTypes={this.nodeTypes}
           />
           {children}
         </Provider>
@@ -34,7 +45,12 @@ ReactGraph.defaultProps = {
 	onNodeClick: () => {},
 	onLoad: () => {},
   onMove: () => {},
-  onChange: () => {}
+  onChange: () => {},
+  nodeTypes: {
+    input: InputNode,
+    default: DefaultNode,
+    output: OutputNode
+  }
 };
 
 export default ReactGraph;