diff --git a/packages/vx-shape/package.json b/packages/vx-shape/package.json index 584246150..cfb95e0ec 100644 --- a/packages/vx-shape/package.json +++ b/packages/vx-shape/package.json @@ -4,13 +4,21 @@ "description": "vx shape", "main": "build/index.js", "repository": "https://github.com/hshoff/vx", - "files": ["build"], + "files": [ + "build" + ], "scripts": { "build": "make build SRC=./src", "prepublish": "make build SRC=./src", "test": "jest" }, - "keywords": ["vx", "react", "d3", "visualizations", "charts"], + "keywords": [ + "vx", + "react", + "d3", + "visualizations", + "charts" + ], "author": "@hshoff", "license": "MIT", "dependencies": { @@ -24,6 +32,7 @@ "devDependencies": { "babel-jest": "^20.0.3", "d3-array": "^1.2.0", + "d3-hierarchy": "^1.1.5", "enzyme": "^2.8.2", "jest": "^20.0.3", "react": "^15.0.0-0 || ^16.0.0-0", diff --git a/packages/vx-shape/src/shapes/LinkVertical.js b/packages/vx-shape/src/shapes/LinkVertical.js index 604eacd44..8d6044263 100644 --- a/packages/vx-shape/src/shapes/LinkVertical.js +++ b/packages/vx-shape/src/shapes/LinkVertical.js @@ -1,23 +1,30 @@ import React from 'react'; import cx from 'classnames'; +import PropTypes from 'prop-types'; import { linkVertical } from 'd3-shape'; import additionalProps from '../util/additionalProps'; +LinkVertical.propTypes = { + innerRef: PropTypes.func, +}; + export default function LinkVertical({ className, + innerRef, data, x = d => d.x, y = d => d.y, ...restProps }) { - const link = linkVertical() + const link = linkVertical(); link.x(x); link.y(y); return ( ); -} \ No newline at end of file +} diff --git a/packages/vx-shape/test/LinkVertical.test.js b/packages/vx-shape/test/LinkVertical.test.js index b4359a1fb..4e4269508 100644 --- a/packages/vx-shape/test/LinkVertical.test.js +++ b/packages/vx-shape/test/LinkVertical.test.js @@ -1,7 +1,34 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import { hierarchy } from 'd3-hierarchy'; import { LinkVertical } from '../src'; +const mockHierarchy = hierarchy({ + name: 'Eve', + children: [ + { name: 'Cain' }, + { + name: 'Seth', + children: [{ name: 'Enos' }, { name: 'Noam' }], + }, + ], +}); +const link = mockHierarchy.links()[0]; + describe('', () => { test('it should be defined', () => { - expect(LinkVertical).toBeDefined() - }) -}) \ No newline at end of file + expect(LinkVertical).toBeDefined(); + }); + + test('it should expose its ref via an innerRef prop', done => { + const node = document.createElement('div'); + const refCallback = n => { + expect(n.tagName).toEqual('PATH'); + done(); + }; + ReactDOM.render( + , + node, + ); + }); +});