diff --git a/example/SimpleGraph.js b/example/SimpleGraph.js
index 3b68aee4..c4d99360 100644
--- a/example/SimpleGraph.js
+++ b/example/SimpleGraph.js
@@ -1,13 +1,11 @@
import React, { PureComponent } from 'react';
import Graph from '../src';
-import wrapNode from '../src/NodeRenderer/NodeTypes/wrapNode';
-
// import Graph from '../dist/ReactGraph';
-const SpecialNode = wrapNode(({ data }) =>
+const SpecialNode = ({ data }) =>
I am Special!
{data.label}
-);
+;
class App extends PureComponent {
constructor() {
@@ -27,7 +25,7 @@ class App extends PureComponent {
{ data: { source: '3', target: '5' } },
{ data: { source: '5', target: '6' } }
]
- }
+ };
}
onLoad(graphInstance) {
diff --git a/src/NodeRenderer/NodeTypes/DefaultNode.js b/src/NodeRenderer/NodeTypes/DefaultNode.js
index b97e713e..81cb5992 100644
--- a/src/NodeRenderer/NodeTypes/DefaultNode.js
+++ b/src/NodeRenderer/NodeTypes/DefaultNode.js
@@ -1,12 +1,11 @@
import React from 'react';
-import wrapNode from './wrapNode';
import Handle from '../Handle';
-export default wrapNode(({ data, style }) => (
+export default ({ data, style }) => (
{data.label}
-));
+);
diff --git a/src/NodeRenderer/NodeTypes/InputNode.js b/src/NodeRenderer/NodeTypes/InputNode.js
index da266483..aff12db2 100644
--- a/src/NodeRenderer/NodeTypes/InputNode.js
+++ b/src/NodeRenderer/NodeTypes/InputNode.js
@@ -1,11 +1,10 @@
import React from 'react';
-import wrapNode from './wrapNode';
import Handle from '../Handle';
-export default wrapNode(({ data, style }) => (
+export default ({ data, style }) => (
{data.label}
-));
+);
diff --git a/src/NodeRenderer/NodeTypes/OutputNode.js b/src/NodeRenderer/NodeTypes/OutputNode.js
index c8e4b629..455b675c 100644
--- a/src/NodeRenderer/NodeTypes/OutputNode.js
+++ b/src/NodeRenderer/NodeTypes/OutputNode.js
@@ -1,11 +1,10 @@
import React from 'react';
-import wrapNode from './wrapNode';
import Handle from '../Handle';
-export default wrapNode(({ data, style }) => (
+export default ({ data, style }) => (
{data.label}
-));
+);
diff --git a/src/NodeRenderer/index.js b/src/NodeRenderer/index.js
index 27478713..6c91cd9a 100644
--- a/src/NodeRenderer/index.js
+++ b/src/NodeRenderer/index.js
@@ -1,30 +1,11 @@
import React, { PureComponent } from 'react';
import { Consumer } from '../GraphContext';
-import DefaultNode from './NodeTypes/DefaultNode';
-import InputNode from './NodeTypes/InputNode';
-import OutputNode from './NodeTypes/OutputNode';
-
class NodeRenderer extends PureComponent {
renderNode(d, onNodeClick) {
const nodeType = d.data.type || 'default';
- let NodeComponent = null;
-
- switch (nodeType) {
- case 'input': {
- NodeComponent = this.props.nodeTypes.input || InputNode; break;
- }
- case 'default': {
- NodeComponent = this.props.nodeTypes.default || DefaultNode; break;
- }
- case 'output': {
- NodeComponent = this.props.nodeTypes.output || OutputNode; break;
- }
- default: {
- NodeComponent = this.props.nodeTypes[nodeType] || DefaultNode;
- }
- }
+ const NodeComponent = this.props.nodeTypes[nodeType];
return (
!['input', 'default', 'output'].includes(k))
+ .reduce((res, key) => {
+ res[key] = wrapNode(nodeTypes[key]);
+
+ return res;
+ }, {});
+
+ return {
+ ...standardTypes,
+ ...specialTypes
+ };
+}
diff --git a/src/index.js b/src/index.js
index 6137b067..d0c51691 100644
--- a/src/index.js
+++ b/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}
@@ -34,7 +45,12 @@ ReactGraph.defaultProps = {
onNodeClick: () => {},
onLoad: () => {},
onMove: () => {},
- onChange: () => {}
+ onChange: () => {},
+ nodeTypes: {
+ input: InputNode,
+ default: DefaultNode,
+ output: OutputNode
+ }
};
export default ReactGraph;