victory-voronoi-container - npm Package Compare versions

Comparing version 32.3.7 to 33.0.0

es/victory-voronoi-container.js

@@ -5,8 +5,2 @@ import _pick from "lodash/pick";
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
@@ -20,2 +14,8 @@
 
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -36,3 +36,3 @@
 import { VictoryTooltip } from "victory-tooltip";
-import { VictoryContainer, Helpers, TextSize, PropTypes as CustomPropTypes } from "victory-core";
+import { VictoryContainer, Helpers, PropTypes as CustomPropTypes } from "victory-core";
 import VoronoiHelpers from "./voronoi-helpers";
@@ -66,65 +66,2 @@ export var voronoiContainerMixin = function (base) {
     }, {
-      key: "getLabelPadding",
-      value: function getLabelPadding(style) {
-        if (!style) {
-          return 0;
-        }
-
-        var paddings = Array.isArray(style) ? style.map(function (s) {
-          return s.padding;
-        }) : [style.padding];
-        return Math.max.apply(Math, _toConsumableArray(paddings).concat([0]));
-      }
-    }, {
-      key: "getFlyoutSize",
-      value: function getFlyoutSize(labelComponent, text, style) {
-        var padding = this.getLabelPadding(style);
-        var textSize = TextSize.approximateTextSize(text, style);
-        return {
-          x: labelComponent.width || textSize.width + padding,
-          y: labelComponent.height || textSize.height + padding
-        };
-      }
-    }, {
-      key: "getLabelCornerRadius",
-      value: function getLabelCornerRadius(props, labelProps) {
-        if (labelProps.cornerRadius !== undefined) {
-          return labelProps.cornerRadius;
-        }
-
-        var theme = props.theme || labelProps.theme;
-        return theme.tooltip && theme.tooltip.cornerRadius || 0;
-      }
-    }, {
-      key: "getFlyoutExtent",
-      value: function getFlyoutExtent(position, props, labelProps) {
-        var text = labelProps.text,
-            style = labelProps.style;
-        var orientation = labelProps.orientation,
-            _labelProps$dx = labelProps.dx,
-            dx = _labelProps$dx === void 0 ? 0 : _labelProps$dx,
-            _labelProps$dy = labelProps.dy,
-            dy = _labelProps$dy === void 0 ? 0 : _labelProps$dy;
-        var flyoutSize = this.getFlyoutSize(props.labelComponent, text, style);
-        var cornerRadius = this.getLabelCornerRadius(props, labelProps);
-        var x = position.x + dx + 2 * cornerRadius;
-        var y = position.y + dy + 2 * cornerRadius;
-        var width = orientation === "top" || orientation === "bottom" ? flyoutSize.x / 2 : flyoutSize.x;
-        var horizontalSign = orientation === "left" ? -1 : 1;
-        var verticalSign = orientation === "bottom" ? 1 : -1;
-        var extent = {};
-
-        if (orientation === "top" || orientation === "bottom") {
-          extent.x = [x - width, x + width];
-        } else {
-          extent.x = [x, x + horizontalSign * width];
-        }
-
-        extent.y = [y, y + verticalSign * flyoutSize.y];
-        return {
-          x: [Math.min.apply(Math, _toConsumableArray(extent.x)), Math.max.apply(Math, _toConsumableArray(extent.x))],
-          y: [Math.min.apply(Math, _toConsumableArray(extent.y)), Math.max.apply(Math, _toConsumableArray(extent.y))]
-        };
-      }
-    }, {
       key: "getPoint",
@@ -137,12 +74,14 @@ value: function getPoint(point) {
       key: "getLabelPosition",
-      value: function getLabelPosition(props, points, labelProps) {
+      value: function getLabelPosition(props, labelProps, points) {
         var mousePosition = props.mousePosition,
-            scale = props.scale,
-            voronoiPadding = props.voronoiPadding;
+            mouseFollowTooltips = props.mouseFollowTooltips;
         var voronoiDimension = this.getDimension(props);
         var point = this.getPoint(points[0]);
         var basePosition = Helpers.scalePoint(props, point);
+        var center = mouseFollowTooltips ? mousePosition : undefined;
 
         if (!voronoiDimension || points.length < 2) {
-          return basePosition;
+          return _objectSpread({}, basePosition, {
+            center: _defaults({}, labelProps.center, center)
+          });
         }
@@ -152,30 +91,10 @@
         var y = voronoiDimension === "x" ? mousePosition.y : basePosition.y;
-
-        if (props.polar) {
-          // TODO: Should multi-point tooltips be constrained within a circular chart?
-          return {
-            x: x,
-            y: y
-          };
-        }
-
-        var range = {
-          x: scale.x.range(),
-          y: scale.y.range()
-        };
-        var extent = {
-          x: [Math.min.apply(Math, _toConsumableArray(range.x)) + voronoiPadding, Math.max.apply(Math, _toConsumableArray(range.x)) - voronoiPadding],
-          y: [Math.min.apply(Math, _toConsumableArray(range.y)) + voronoiPadding, Math.max.apply(Math, _toConsumableArray(range.y)) - voronoiPadding]
-        };
-        var flyoutExtent = this.getFlyoutExtent({
+        center = mouseFollowTooltips ? mousePosition : {
           x: x,
           y: y
-        }, props, labelProps);
-        var adjustments = {
-          x: [flyoutExtent.x[0] < extent.x[0] ? extent.x[0] - flyoutExtent.x[0] : 0, flyoutExtent.x[1] > extent.x[1] ? flyoutExtent.x[1] - extent.x[1] : 0],
-          y: [flyoutExtent.y[0] < extent.y[0] ? extent.y[0] - flyoutExtent.y[0] : 0, flyoutExtent.y[1] > extent.y[1] ? flyoutExtent.y[1] - extent.y[1] : 0]
         };
         return {
-          x: Math.round(x + adjustments.x[0] - adjustments.x[1]),
-          y: Math.round(y + adjustments.y[0] - adjustments.y[1])
+          x: x,
+          y: y,
+          center: _defaults({}, labelProps.center, center)
         };
@@ -192,8 +111,13 @@ }
         var componentStyleArray = type === "flyout" ? componentProps.flyoutStyle : componentProps.style;
-        return points.reduce(function (memo, point, index) {
-          var text = _isFunction(labels) ? labels(point, index, points) : undefined;
+        return points.reduce(function (memo, datum, index) {
+          var labelProps = _defaults({}, componentProps, {
+            datum: datum,
+            active: true
+          });
+
+          var text = _isFunction(labels) ? labels(labelProps) : undefined;
           var textArray = text !== undefined ? "".concat(text).split("\n") : [];
-          var baseStyle = point.style && point.style[type] || {};
+          var baseStyle = datum.style && datum.style[type] || {};
           var componentStyle = Array.isArray(componentStyleArray) ? componentStyleArray[index] : componentStyleArray;
-          var style = Helpers.evaluateStyle(_defaults({}, componentStyle, baseStyle, themeStyles[type]), point, true);
+          var style = Helpers.evaluateStyle(_defaults({}, componentStyle, baseStyle, themeStyles[type]), labelProps);
           var styleArray = textArray.length ? textArray.map(function () {
@@ -210,3 +134,4 @@ return style;
         var voronoiDimension = props.voronoiDimension,
-            horizontal = props.horizontal;
+            horizontal = props.horizontal,
+            mouseFollowTooltips = props.mouseFollowTooltips;
         var point = this.getPoint(points[0]);
@@ -217,6 +142,8 @@ var multiPoint = voronoiDimension && points.length > 1;
         var defaultOrientation = y < 0 ? "bottom" : "top";
-        var orientation = horizontal ? defaultHorizontalOrientation : defaultOrientation;
+        var labelOrientation = horizontal ? defaultHorizontalOrientation : defaultOrientation;
+        var orientation = mouseFollowTooltips ? undefined : labelOrientation;
         return {
-          orientation: multiPoint ? "top" : orientation,
-          pointerLength: multiPoint ? 0 : undefined
+          orientation: orientation,
+          pointerLength: multiPoint ? 0 : undefined,
+          constrainToVisibleArea: multiPoint || mouseFollowTooltips ? true : undefined
         };
@@ -230,6 +157,14 @@ }
             labelComponent = props.labelComponent,
-            theme = props.theme;
-        var text = points.reduce(function (memo, point, index) {
-          var t = _isFunction(labels) ? labels(point, index, points) : null;
+            theme = props.theme,
+            width = props.width,
+            height = props.height;
+        var componentProps = labelComponent.props || {};
+        var text = points.reduce(function (memo, datum) {
+          var labelProps = _defaults({}, componentProps, {
+            datum: datum,
+            active: true
+          });
 
+          var t = _isFunction(labels) ? labels(labelProps) : null;
+
           if (t === null || t === undefined) {
@@ -241,4 +176,3 @@ return memo;
           return memo;
-        }, []);
-        var componentProps = labelComponent.props || {}; // remove properties from first point to make datum
+        }, []); // remove properties from first point to make datum
         // eslint-disable-next-line no-unused-vars
@@ -265,6 +199,8 @@
           theme: theme,
-          text: text
+          text: text,
+          width: width,
+          height: height
         }, componentProps, this.getDefaultLabelProps(props, points));
 
-        var labelPosition = this.getLabelPosition(props, points, labelProps);
+        var labelPosition = this.getLabelPosition(props, labelProps, points);
         return _defaults({}, labelPosition, labelProps);
@@ -284,3 +220,4 @@ }
         if (Array.isArray(activePoints) && activePoints.length) {
-          return React.cloneElement(labelComponent, this.getLabelProps(props, activePoints));
+          var labelProps = this.getLabelProps(props, activePoints);
+          return React.cloneElement(labelComponent, labelProps);
         } else {
@@ -314,2 +251,3 @@ return null;
       labels: PropTypes.func,
+      mouseFollowTooltips: PropTypes.bool,
       onActivated: PropTypes.func,
@@ -316,0 +254,0 @@ onDeactivated: PropTypes.func,

es/voronoi-helpers.js

@@ -57,4 +57,4 @@ import _isRegExp from "lodash/isRegExp";
         return _assign({
-          _voronoiX: props.voronoiDimension === "y" ? undefined : voronoiX,
-          _voronoiY: props.voronoiDimension === "x" ? undefined : voronoiY,
+          _voronoiX: props.voronoiDimension === "y" ? 0 : voronoiX,
+          _voronoiY: props.voronoiDimension === "x" ? 0 : voronoiY,
           eventKey: index,
@@ -99,8 +99,4 @@ childName: name,
   findPoints: function (datasets, point) {
-    var x = point._voronoiX;
-    var y = point._voronoiY;
     return datasets.filter(function (d) {
-      var matchesX = x === undefined || x === d._voronoiX;
-      var matchesY = y === undefined || y === d._voronoiY;
-      return matchesX && matchesY;
+      return point._voronoiX === d._voronoiX && point._voronoiY === d._voronoiY;
     });
@@ -107,0 +103,0 @@ },

lib/victory-voronoi-container.js

@@ -26,8 +26,2 @@ "use strict";
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
@@ -41,2 +35,8 @@
 
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -81,67 +81,2 @@
     }, {
-      key: "getLabelPadding",
-      value: function getLabelPadding(style) {
-        if (!style) {
-          return 0;
-        }
-
-        var paddings = Array.isArray(style) ? style.map(function (s) {
-          return s.padding;
-        }) : [style.padding];
-        return Math.max.apply(Math, _toConsumableArray(paddings).concat([0]));
-      }
-    }, {
-      key: "getFlyoutSize",
-      value: function getFlyoutSize(labelComponent, text, style) {
-        var padding = this.getLabelPadding(style);
-
-        var textSize = _victoryCore.TextSize.approximateTextSize(text, style);
-
-        return {
-          x: labelComponent.width || textSize.width + padding,
-          y: labelComponent.height || textSize.height + padding
-        };
-      }
-    }, {
-      key: "getLabelCornerRadius",
-      value: function getLabelCornerRadius(props, labelProps) {
-        if (labelProps.cornerRadius !== undefined) {
-          return labelProps.cornerRadius;
-        }
-
-        var theme = props.theme || labelProps.theme;
-        return theme.tooltip && theme.tooltip.cornerRadius || 0;
-      }
-    }, {
-      key: "getFlyoutExtent",
-      value: function getFlyoutExtent(position, props, labelProps) {
-        var text = labelProps.text,
-            style = labelProps.style;
-        var orientation = labelProps.orientation,
-            _labelProps$dx = labelProps.dx,
-            dx = _labelProps$dx === void 0 ? 0 : _labelProps$dx,
-            _labelProps$dy = labelProps.dy,
-            dy = _labelProps$dy === void 0 ? 0 : _labelProps$dy;
-        var flyoutSize = this.getFlyoutSize(props.labelComponent, text, style);
-        var cornerRadius = this.getLabelCornerRadius(props, labelProps);
-        var x = position.x + dx + 2 * cornerRadius;
-        var y = position.y + dy + 2 * cornerRadius;
-        var width = orientation === "top" || orientation === "bottom" ? flyoutSize.x / 2 : flyoutSize.x;
-        var horizontalSign = orientation === "left" ? -1 : 1;
-        var verticalSign = orientation === "bottom" ? 1 : -1;
-        var extent = {};
-
-        if (orientation === "top" || orientation === "bottom") {
-          extent.x = [x - width, x + width];
-        } else {
-          extent.x = [x, x + horizontalSign * width];
-        }
-
-        extent.y = [y, y + verticalSign * flyoutSize.y];
-        return {
-          x: [Math.min.apply(Math, _toConsumableArray(extent.x)), Math.max.apply(Math, _toConsumableArray(extent.x))],
-          y: [Math.min.apply(Math, _toConsumableArray(extent.y)), Math.max.apply(Math, _toConsumableArray(extent.y))]
-        };
-      }
-    }, {
       key: "getPoint",
@@ -154,6 +89,5 @@ value: function getPoint(point) {
       key: "getLabelPosition",
-      value: function getLabelPosition(props, points, labelProps) {
+      value: function getLabelPosition(props, labelProps, points) {
         var mousePosition = props.mousePosition,
-            scale = props.scale,
-            voronoiPadding = props.voronoiPadding;
+            mouseFollowTooltips = props.mouseFollowTooltips;
         var voronoiDimension = this.getDimension(props);
@@ -164,4 +98,8 @@ var point = this.getPoint(points[0]);
 
+        var center = mouseFollowTooltips ? mousePosition : undefined;
+
         if (!voronoiDimension || points.length < 2) {
-          return basePosition;
+          return _objectSpread({}, basePosition, {
+            center: (0, _defaults2.default)({}, labelProps.center, center)
+          });
         }
@@ -171,30 +109,10 @@
         var y = voronoiDimension === "x" ? mousePosition.y : basePosition.y;
-
-        if (props.polar) {
-          // TODO: Should multi-point tooltips be constrained within a circular chart?
-          return {
-            x: x,
-            y: y
-          };
-        }
-
-        var range = {
-          x: scale.x.range(),
-          y: scale.y.range()
-        };
-        var extent = {
-          x: [Math.min.apply(Math, _toConsumableArray(range.x)) + voronoiPadding, Math.max.apply(Math, _toConsumableArray(range.x)) - voronoiPadding],
-          y: [Math.min.apply(Math, _toConsumableArray(range.y)) + voronoiPadding, Math.max.apply(Math, _toConsumableArray(range.y)) - voronoiPadding]
-        };
-        var flyoutExtent = this.getFlyoutExtent({
+        center = mouseFollowTooltips ? mousePosition : {
           x: x,
           y: y
-        }, props, labelProps);
-        var adjustments = {
-          x: [flyoutExtent.x[0] < extent.x[0] ? extent.x[0] - flyoutExtent.x[0] : 0, flyoutExtent.x[1] > extent.x[1] ? flyoutExtent.x[1] - extent.x[1] : 0],
-          y: [flyoutExtent.y[0] < extent.y[0] ? extent.y[0] - flyoutExtent.y[0] : 0, flyoutExtent.y[1] > extent.y[1] ? flyoutExtent.y[1] - extent.y[1] : 0]
         };
         return {
-          x: Math.round(x + adjustments.x[0] - adjustments.x[1]),
-          y: Math.round(y + adjustments.y[0] - adjustments.y[1])
+          x: x,
+          y: y,
+          center: (0, _defaults2.default)({}, labelProps.center, center)
         };
@@ -211,9 +129,13 @@ }
         var componentStyleArray = type === "flyout" ? componentProps.flyoutStyle : componentProps.style;
-        return points.reduce(function (memo, point, index) {
-          var text = (0, _isFunction2.default)(labels) ? labels(point, index, points) : undefined;
+        return points.reduce(function (memo, datum, index) {
+          var labelProps = (0, _defaults2.default)({}, componentProps, {
+            datum: datum,
+            active: true
+          });
+          var text = (0, _isFunction2.default)(labels) ? labels(labelProps) : undefined;
           var textArray = text !== undefined ? "".concat(text).split("\n") : [];
-          var baseStyle = point.style && point.style[type] || {};
+          var baseStyle = datum.style && datum.style[type] || {};
           var componentStyle = Array.isArray(componentStyleArray) ? componentStyleArray[index] : componentStyleArray;
 
-          var style = _victoryCore.Helpers.evaluateStyle((0, _defaults2.default)({}, componentStyle, baseStyle, themeStyles[type]), point, true);
+          var style = _victoryCore.Helpers.evaluateStyle((0, _defaults2.default)({}, componentStyle, baseStyle, themeStyles[type]), labelProps);
 
@@ -231,3 +153,4 @@ var styleArray = textArray.length ? textArray.map(function () {
         var voronoiDimension = props.voronoiDimension,
-            horizontal = props.horizontal;
+            horizontal = props.horizontal,
+            mouseFollowTooltips = props.mouseFollowTooltips;
         var point = this.getPoint(points[0]);
@@ -238,6 +161,8 @@ var multiPoint = voronoiDimension && points.length > 1;
         var defaultOrientation = y < 0 ? "bottom" : "top";
-        var orientation = horizontal ? defaultHorizontalOrientation : defaultOrientation;
+        var labelOrientation = horizontal ? defaultHorizontalOrientation : defaultOrientation;
+        var orientation = mouseFollowTooltips ? undefined : labelOrientation;
         return {
-          orientation: multiPoint ? "top" : orientation,
-          pointerLength: multiPoint ? 0 : undefined
+          orientation: orientation,
+          pointerLength: multiPoint ? 0 : undefined,
+          constrainToVisibleArea: multiPoint || mouseFollowTooltips ? true : undefined
         };
@@ -251,5 +176,12 @@ }
             labelComponent = props.labelComponent,
-            theme = props.theme;
-        var text = points.reduce(function (memo, point, index) {
-          var t = (0, _isFunction2.default)(labels) ? labels(point, index, points) : null;
+            theme = props.theme,
+            width = props.width,
+            height = props.height;
+        var componentProps = labelComponent.props || {};
+        var text = points.reduce(function (memo, datum) {
+          var labelProps = (0, _defaults2.default)({}, componentProps, {
+            datum: datum,
+            active: true
+          });
+          var t = (0, _isFunction2.default)(labels) ? labels(labelProps) : null;
 
@@ -262,4 +194,3 @@ if (t === null || t === undefined) {
           return memo;
-        }, []);
-        var componentProps = labelComponent.props || {}; // remove properties from first point to make datum
+        }, []); // remove properties from first point to make datum
         // eslint-disable-next-line no-unused-vars
@@ -285,5 +216,7 @@
           theme: theme,
-          text: text
+          text: text,
+          width: width,
+          height: height
         }, componentProps, this.getDefaultLabelProps(props, points));
-        var labelPosition = this.getLabelPosition(props, points, labelProps);
+        var labelPosition = this.getLabelPosition(props, labelProps, points);
         return (0, _defaults2.default)({}, labelPosition, labelProps);
@@ -303,3 +236,4 @@ }
         if (Array.isArray(activePoints) && activePoints.length) {
-          return _react.default.cloneElement(labelComponent, this.getLabelProps(props, activePoints));
+          var labelProps = this.getLabelProps(props, activePoints);
+          return _react.default.cloneElement(labelComponent, labelProps);
         } else {
@@ -333,2 +267,3 @@ return null;
       labels: _propTypes.default.func,
+      mouseFollowTooltips: _propTypes.default.bool,
       onActivated: _propTypes.default.func,
@@ -335,0 +270,0 @@ onDeactivated: _propTypes.default.func,

lib/voronoi-helpers.js

@@ -76,4 +76,4 @@ "use strict";
         return (0, _assign2.default)({
-          _voronoiX: props.voronoiDimension === "y" ? undefined : voronoiX,
-          _voronoiY: props.voronoiDimension === "x" ? undefined : voronoiY,
+          _voronoiX: props.voronoiDimension === "y" ? 0 : voronoiX,
+          _voronoiY: props.voronoiDimension === "x" ? 0 : voronoiY,
           eventKey: index,
@@ -119,8 +119,4 @@ childName: name,
   findPoints: function (datasets, point) {
-    var x = point._voronoiX;
-    var y = point._voronoiY;
     return datasets.filter(function (d) {
-      var matchesX = x === undefined || x === d._voronoiX;
-      var matchesY = y === undefined || y === d._voronoiY;
-      return matchesX && matchesY;
+      return point._voronoiX === d._voronoiX && point._voronoiY === d._voronoiY;
     });
@@ -127,0 +123,0 @@ },

package.json

 {
   "name": "victory-voronoi-container",
-  "version": "32.3.7",
+  "version": "33.0.0",
   "description": "Interactive Voronoi Mouseover Component for Victory",
@@ -25,4 +25,4 @@ "keywords": [
     "prop-types": "^15.5.8",
-    "victory-core": "^32.3.7",
-    "victory-tooltip": "^32.3.7"
+    "victory-core": "^33.0.0",
+    "victory-tooltip": "^33.0.0"
   },
@@ -29,0 +29,0 @@ "scripts": {

src/victory-voronoi-container.js

@@ -5,3 +5,3 @@ import PropTypes from "prop-types";
 import { VictoryTooltip } from "victory-tooltip";
-import { VictoryContainer, Helpers, TextSize, PropTypes as CustomPropTypes } from "victory-core";
+import { VictoryContainer, Helpers, PropTypes as CustomPropTypes } from "victory-core";
 import VoronoiHelpers from "./voronoi-helpers";
@@ -19,2 +19,3 @@
       labels: PropTypes.func,
+      mouseFollowTooltips: PropTypes.bool,
       onActivated: PropTypes.func,
@@ -77,51 +78,2 @@ onDeactivated: PropTypes.func,
 
-    getLabelPadding(style) {
-      if (!style) {
-        return 0;
-      }
-      const paddings = Array.isArray(style) ? style.map((s) => s.padding) : [style.padding];
-      return Math.max(...paddings, 0);
-    }
-
-    getFlyoutSize(labelComponent, text, style) {
-      const padding = this.getLabelPadding(style);
-      const textSize = TextSize.approximateTextSize(text, style);
-      return {
-        x: labelComponent.width || textSize.width + padding,
-        y: labelComponent.height || textSize.height + padding
-      };
-    }
-
-    getLabelCornerRadius(props, labelProps) {
-      if (labelProps.cornerRadius !== undefined) {
-        return labelProps.cornerRadius;
-      }
-      const theme = props.theme || labelProps.theme;
-      return (theme.tooltip && theme.tooltip.cornerRadius) || 0;
-    }
-
-    getFlyoutExtent(position, props, labelProps) {
-      const { text, style } = labelProps;
-      const { orientation, dx = 0, dy = 0 } = labelProps;
-      const flyoutSize = this.getFlyoutSize(props.labelComponent, text, style);
-      const cornerRadius = this.getLabelCornerRadius(props, labelProps);
-      const x = position.x + dx + 2 * cornerRadius;
-      const y = position.y + dy + 2 * cornerRadius;
-      const width =
-        orientation === "top" || orientation === "bottom" ? flyoutSize.x / 2 : flyoutSize.x;
-      const horizontalSign = orientation === "left" ? -1 : 1;
-      const verticalSign = orientation === "bottom" ? 1 : -1;
-      const extent = {};
-      if (orientation === "top" || orientation === "bottom") {
-        extent.x = [x - width, x + width];
-      } else {
-        extent.x = [x, x + horizontalSign * width];
-      }
-      extent.y = [y, y + verticalSign * flyoutSize.y];
-      return {
-        x: [Math.min(...extent.x), Math.max(...extent.x)],
-        y: [Math.min(...extent.y), Math.max(...extent.y)]
-      };
-    }
-
     getPoint(point) {
@@ -132,9 +84,11 @@ const whitelist = ["_x", "_x1", "_x0", "_y", "_y1", "_y0"];
 
-    getLabelPosition(props, points, labelProps) {
-      const { mousePosition, scale, voronoiPadding } = props;
+    getLabelPosition(props, labelProps, points) {
+      const { mousePosition, mouseFollowTooltips } = props;
       const voronoiDimension = this.getDimension(props);
       const point = this.getPoint(points[0]);
       const basePosition = Helpers.scalePoint(props, point);
+
+      let center = mouseFollowTooltips ? mousePosition : undefined;
       if (!voronoiDimension || points.length < 2) {
-        return basePosition;
+        return { ...basePosition, center: defaults({}, labelProps.center, center) };
       }
@@ -144,26 +98,4 @@
       const y = voronoiDimension === "x" ? mousePosition.y : basePosition.y;
-      if (props.polar) {
-        // TODO: Should multi-point tooltips be constrained within a circular chart?
-        return { x, y };
-      }
-      const range = { x: scale.x.range(), y: scale.y.range() };
-      const extent = {
-        x: [Math.min(...range.x) + voronoiPadding, Math.max(...range.x) - voronoiPadding],
-        y: [Math.min(...range.y) + voronoiPadding, Math.max(...range.y) - voronoiPadding]
-      };
-      const flyoutExtent = this.getFlyoutExtent({ x, y }, props, labelProps);
-      const adjustments = {
-        x: [
-          flyoutExtent.x[0] < extent.x[0] ? extent.x[0] - flyoutExtent.x[0] : 0,
-          flyoutExtent.x[1] > extent.x[1] ? flyoutExtent.x[1] - extent.x[1] : 0
-        ],
-        y: [
-          flyoutExtent.y[0] < extent.y[0] ? extent.y[0] - flyoutExtent.y[0] : 0,
-          flyoutExtent.y[1] > extent.y[1] ? flyoutExtent.y[1] - extent.y[1] : 0
-        ]
-      };
-      return {
-        x: Math.round(x + adjustments.x[0] - adjustments.x[1]),
-        y: Math.round(y + adjustments.y[0] - adjustments.y[1])
-      };
+      center = mouseFollowTooltips ? mousePosition : { x, y };
+      return { x, y, center: defaults({}, labelProps.center, center) };
     }
@@ -177,6 +109,7 @@
         type === "flyout" ? componentProps.flyoutStyle : componentProps.style;
-      return points.reduce((memo, point, index) => {
-        const text = isFunction(labels) ? labels(point, index, points) : undefined;
+      return points.reduce((memo, datum, index) => {
+        const labelProps = defaults({}, componentProps, { datum, active: true });
+        const text = isFunction(labels) ? labels(labelProps) : undefined;
         const textArray = text !== undefined ? `${text}`.split("\n") : [];
-        const baseStyle = (point.style && point.style[type]) || {};
+        const baseStyle = (datum.style && datum.style[type]) || {};
         const componentStyle = Array.isArray(componentStyleArray)
@@ -187,4 +120,3 @@ ? componentStyleArray[index]
           defaults({}, componentStyle, baseStyle, themeStyles[type]),
-          point,
-          true
+          labelProps
         );
@@ -198,3 +130,3 @@ const styleArray = textArray.length ? textArray.map(() => style) : [style];
     getDefaultLabelProps(props, points) {
-      const { voronoiDimension, horizontal } = props;
+      const { voronoiDimension, horizontal, mouseFollowTooltips } = props;
       const point = this.getPoint(points[0]);
@@ -205,6 +137,8 @@ const multiPoint = voronoiDimension && points.length > 1;
       const defaultOrientation = y < 0 ? "bottom" : "top";
-      const orientation = horizontal ? defaultHorizontalOrientation : defaultOrientation;
+      const labelOrientation = horizontal ? defaultHorizontalOrientation : defaultOrientation;
+      const orientation = mouseFollowTooltips ? undefined : labelOrientation;
       return {
-        orientation: multiPoint ? "top" : orientation,
-        pointerLength: multiPoint ? 0 : undefined
+        orientation,
+        pointerLength: multiPoint ? 0 : undefined,
+        constrainToVisibleArea: multiPoint || mouseFollowTooltips ? true : undefined
       };
@@ -214,5 +148,7 @@ }
     getLabelProps(props, points) {
-      const { labels, scale, labelComponent, theme } = props;
-      const text = points.reduce((memo, point, index) => {
-        const t = isFunction(labels) ? labels(point, index, points) : null;
+      const { labels, scale, labelComponent, theme, width, height } = props;
+      const componentProps = labelComponent.props || {};
+      const text = points.reduce((memo, datum) => {
+        const labelProps = defaults({}, componentProps, { datum, active: true });
+        const t = isFunction(labels) ? labels(labelProps) : null;
         if (t === null || t === undefined) {
@@ -224,3 +160,2 @@ return memo;
       }, []);
-      const componentProps = labelComponent.props || {};
 
@@ -242,3 +177,5 @@ // remove properties from first point to make datum
           theme,
-          text
+          text,
+          width,
+          height
         },
@@ -248,3 +185,3 @@ componentProps,
       );
-      const labelPosition = this.getLabelPosition(props, points, labelProps);
+      const labelPosition = this.getLabelPosition(props, labelProps, points);
       return defaults({}, labelPosition, labelProps);
@@ -259,3 +196,4 @@ }
       if (Array.isArray(activePoints) && activePoints.length) {
-        return React.cloneElement(labelComponent, this.getLabelProps(props, activePoints));
+        const labelProps = this.getLabelProps(props, activePoints);
+        return React.cloneElement(labelComponent, labelProps);
       } else {
@@ -262,0 +200,0 @@ return null;

src/voronoi-helpers.js

@@ -32,4 +32,4 @@ import { Selection, Data, Helpers } from "victory-core";
           {
-            _voronoiX: props.voronoiDimension === "y" ? undefined : voronoiX,
-            _voronoiY: props.voronoiDimension === "x" ? undefined : voronoiY,
+            _voronoiX: props.voronoiDimension === "y" ? 0 : voronoiX,
+            _voronoiY: props.voronoiDimension === "x" ? 0 : voronoiY,
             eventKey: index,
@@ -74,9 +74,4 @@ childName: name,
   findPoints(datasets, point) {
-    const x = point._voronoiX;
-    const y = point._voronoiY;
-
     return datasets.filter((d) => {
-      const matchesX = x === undefined || x === d._voronoiX;
-      const matchesY = y === undefined || y === d._voronoiY;
-      return matchesX && matchesY;
+      return point._voronoiX === d._voronoiX && point._voronoiY === d._voronoiY;
     });
@@ -83,0 +78,0 @@ },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

1261674

decreased by-5.32%

Lines of code

23370

decreased by-4.01%

Dependency changes

• + Addedvictory-core@33.1.7(transitive)

• + Addedvictory-tooltip@33.1.7(transitive)

• - Removedvictory-core@32.3.7(transitive)

• - Removedvictory-tooltip@32.3.7(transitive)

• Updatedvictory-core@^33.0.0

• Updatedvictory-tooltip@^33.0.0