diff --git a/packages/network/src/chart/Network.jsx b/packages/network/src/chart/Network.jsx index 28bbc7eb..1d57cb94 100644 --- a/packages/network/src/chart/Network.jsx +++ b/packages/network/src/chart/Network.jsx @@ -324,6 +324,8 @@ class Network extends React.PureComponent { children, className, height, + onMouseLeave, + onMouseMove, renderLink, renderNode, renderTooltip, @@ -335,7 +337,11 @@ class Network extends React.PureComponent { if (renderTooltip) { return ( - + ); diff --git a/packages/shared/src/enhancer/WithTooltip.jsx b/packages/shared/src/enhancer/WithTooltip.jsx index f867571d..994e60cf 100644 --- a/packages/shared/src/enhancer/WithTooltip.jsx +++ b/packages/shared/src/enhancer/WithTooltip.jsx @@ -20,6 +20,8 @@ export const propTypes = { children: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired, className: PropTypes.string, HoverStyles: PropTypes.oneOfType([PropTypes.object, PropTypes.func]), + onMouseMove: PropTypes.func, + onMouseLeave: PropTypes.func, renderTooltip: PropTypes.func, styles: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), TooltipComponent: PropTypes.oneOfType([PropTypes.object, PropTypes.func]), @@ -40,6 +42,8 @@ const defaultProps = { `} ), + onMouseMove: null, + onMouseLeave: null, renderTooltip: null, styles: { display: 'inline-block', position: 'relative' }, TooltipComponent: TooltipWithBounds, @@ -62,7 +66,7 @@ class WithTooltip extends React.PureComponent { } handleMouseMove({ event, datum, coords, ...rest }) { - const { showTooltip } = this.props; + const { showTooltip, onMouseMove } = this.props; if (this.tooltipTimeout) { clearTimeout(this.tooltipTimeout); } @@ -83,13 +87,16 @@ class WithTooltip extends React.PureComponent { ...rest, }, }); + + if (onMouseMove) onMouseMove({ event, datum, coords, ...rest }); } handleMouseLeave() { - const { tooltipTimeout, hideTooltip } = this.props; + const { tooltipTimeout, hideTooltip, onMouseLeave } = this.props; this.tooltipTimeout = setTimeout(() => { hideTooltip(); }, tooltipTimeout); + if (onMouseLeave) onMouseLeave(); } render() { diff --git a/packages/shared/test/enhancer/WithTooltip.test.js b/packages/shared/test/enhancer/WithTooltip.test.js index 17f1f65b..a3c635a3 100644 --- a/packages/shared/test/enhancer/WithTooltip.test.js +++ b/packages/shared/test/enhancer/WithTooltip.test.js @@ -73,6 +73,44 @@ describe('', () => { expect(wrapper.find('#test')).toHaveLength(1); }); + it('it should invoke the passed onMouseMove when the provided onMouseMove is invoked', () => { + const passedOnMouseMove = jest.fn(); + + let providedMouseMove; + const wrapper = mount( + null} onMouseMove={passedOnMouseMove}> + {({ onMouseMove }) => { + providedMouseMove = onMouseMove; + + return ; + }} + , + ); + + providedMouseMove({}); + wrapper.update(); + expect(passedOnMouseMove).toHaveBeenCalledTimes(1); + }); + + it('it should invoke the passed onMouseLeave when the provided onMouseLeave is invoked', () => { + const passedOnMouseLeave = jest.fn(); + + let providedMouseLeave; + const wrapper = mount( + null} onMouseLeave={passedOnMouseLeave}> + {({ onMouseLeave }) => { + providedMouseLeave = onMouseLeave; + + return ; + }} + , + ); + + providedMouseLeave({}); + wrapper.update(); + expect(passedOnMouseLeave).toHaveBeenCalledTimes(1); + }); + it('it should use the provided `coords` if passed to onMouseMove', () => { let mouseMove; const wrapper = mount( diff --git a/packages/xy-chart/package.json b/packages/xy-chart/package.json index ad267386..7d5d3a35 100644 --- a/packages/xy-chart/package.json +++ b/packages/xy-chart/package.json @@ -65,6 +65,9 @@ "react": "^15.0.0-0 || ^16.0.0-0", "react-dom": "^15.0.0-0 || ^16.0.0-0" }, + "resolutions": { + "@beemo/core": "1.0.8" + }, "beemo": { "module": "@data-ui/build-config", "drivers": [ diff --git a/packages/xy-chart/src/chart/XYChart.jsx b/packages/xy-chart/src/chart/XYChart.jsx index 60453fac..26b5c89c 100644 --- a/packages/xy-chart/src/chart/XYChart.jsx +++ b/packages/xy-chart/src/chart/XYChart.jsx @@ -263,10 +263,14 @@ class XYChart extends React.PureComponent { } render() { - const { renderTooltip } = this.props; + const { renderTooltip, onMouseLeave, onMouseMove } = this.props; if (renderTooltip) { return ( - + );