diff --git a/src/components/node.js b/src/components/node.js index eb1c5ca..720d217 100644 --- a/src/components/node.js +++ b/src/components/node.js @@ -4,6 +4,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import {VelocityTransitionGroup} from 'velocity-react'; +import Tree from './tree'; import NodeHeader from './header'; class TreeNode extends React.Component { @@ -90,7 +91,7 @@ class TreeNode extends React.Component { } renderChildren(decorators) { - const {animations, decorators: propDecorators, node, style} = this.props; + const {node, ...props} = this.props; if (node.loading) { return this.renderLoading(decorators); @@ -102,16 +103,10 @@ class TreeNode extends React.Component { } return ( - + this.subtreeRef = ref} + data={children}/> ); } diff --git a/src/components/tree.js b/src/components/tree.js new file mode 100644 index 0000000..ae2ea1a --- /dev/null +++ b/src/components/tree.js @@ -0,0 +1,46 @@ +'use strict'; + +import React from 'react'; +import PropTypes from 'prop-types'; + +import TreeNode from './node'; + +class Tree extends React.Component { + render() { + const {animations, decorators, data, onToggle, style, event, treeRef} = this.props; + const {tree} = style; + + return ( + + ); + } +} + +Tree.propTypes = { + style: PropTypes.object.isRequired, + data: PropTypes.oneOfType([ + PropTypes.object, + PropTypes.array + ]).isRequired, + decorators: PropTypes.object.isRequired, + animations: PropTypes.oneOfType([ + PropTypes.object, + PropTypes.bool + ]).isRequired, + onToggle: PropTypes.func.isRequired, + event: PropTypes.object, + treeRef: PropTypes.func.isRequired +}; + +export default Tree; diff --git a/src/components/treebeard.js b/src/components/treebeard.js index 2e15254..434cde0 100644 --- a/src/components/treebeard.js +++ b/src/components/treebeard.js @@ -3,14 +3,14 @@ import React from 'react'; import PropTypes from 'prop-types'; -import TreeNode from './node'; +import Tree from './tree'; import defaultDecorators from './decorators'; import defaultTheme from '../themes/default'; import defaultAnimations from '../themes/animations'; class TreeBeard extends React.Component { render() { - const {animations, decorators, data: propsData, onToggle, style} = this.props; + const {data: propsData, ...props} = this.props; let data = propsData; // Support Multiple Root Nodes. Its not formally a tree, but its a use-case. @@ -18,17 +18,9 @@ class TreeBeard extends React.Component { data = [data]; } return ( - + this.treeBaseRef = ref} + data={data}/> ); } }