Merge branch 'feature/18-expose-circle-radius' into develop

Author: bkrem

README.md

@@ -90,6 +90,7 @@ class MyComponent extends React.Component {
 | `scaleExtent`         | `object`        | `{min: 0..n, max: 0..n}`              |           | `{min: 0.1, max: 1}`            | Sets the minimum/maximum extent to which the tree can be scaled if `props.zoomable` is true.                                                                                    |
 | `nodeSize`            | `object`        | `{x: 0..n, y: 0..n}`                  |           | `{x: 140, y: 140}`              | Sets a fixed size for each node. <br /><br /> This does not affect node circle sizes, circle sizes are handled by the `circleRadius` prop.                                      |
 | `separation`          | `object`        | `{siblings: 0..n, nonSiblings: 0..n}` |           | `{siblings: 1, nonSiblings: 2}` | Sets separation between neighbouring nodes, differentiating between siblings (same parent) and non-siblings.                                                                    |
+| `circleRadius`        | `number`        | `0..n`                                |           | `10`                            | Sets the radius of each node's `<circle>` element.                                                                                                                              |
 | `transitionDuration`  | `number`        | `0..n`                                |           | `500`                           | Sets the animation duration (in ms) of each expansion/collapse of a tree node. <br /><br /> Set this to `0` to deactivate animations completely.                                |
 | `styles`              | `object`        | see [Styling](#styling)               |           | `Node`/`Link` CSS files         | Overrides and/or enhances the tree's default styling.                                                                                                                           |
 

src/Node/index.js

@@ -114,7 +114,6 @@ export default class Node extends React.Component {
 }
 
 Node.defaultProps = {
-  circleRadius: 10,
   textAnchor: 'start',
   attributes: undefined,
 };
@@ -130,6 +129,6 @@ Node.propTypes = {
   name: PropTypes.string.isRequired,
   attributes: PropTypes.object,
   textAnchor: PropTypes.string,
-  circleRadius: PropTypes.number,
+  circleRadius: PropTypes.number.isRequired,
   styles: PropTypes.object.isRequired,
 };

src/Node/tests/index.test.js

@@ -22,6 +22,7 @@ describe('<Node />', () => {
     orientation: 'horizontal',
     transitionDuration: 500,
     onClick: () => {},
+    circleRadius: 10,
     styles: {},
   };
 

src/Tree/index.js

@@ -246,6 +246,7 @@ export default class Tree extends React.Component {
       pathFunc,
       transitionDuration,
       zoomable,
+      circleRadius,
       styles,
     } = this.props;
 
@@ -267,6 +268,7 @@ export default class Tree extends React.Component {
                 name={nodeData.name}
                 attributes={nodeData.attributes}
                 onClick={this.handleNodeToggle}
+                circleRadius={circleRadius}
                 styles={styles.nodes}
               />
             )}
@@ -300,6 +302,7 @@ Tree.defaultProps = {
   scaleExtent: { min: 0.1, max: 1 },
   nodeSize: { x: 140, y: 140 },
   separation: { siblings: 1, nonSiblings: 2 },
+  circleRadius: 10,
   styles: {
     nodes: {
       node: {
@@ -348,6 +351,7 @@ Tree.propTypes = {
     siblings: PropTypes.number,
     nonSiblings: PropTypes.number,
   }),
+  circleRadius: PropTypes.number,
   styles: PropTypes.shape({
     nodes: PropTypes.object,
     links: PropTypes.object,