victory-tooltip 36.9.2 → 37.0.0

package/es/victory-tooltip.js

@@ -2,601 +2,496 @@ import _orderBy from "lodash/orderBy";
 import _isPlainObject from "lodash/isPlainObject";
 import _uniqueId from "lodash/uniqueId";
 import _defaults from "lodash/defaults";
-
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(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"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
 import React from "react";
 import { TextSize, Helpers, LabelHelpers, VictoryLabel, VictoryTheme, VictoryPortal } from "victory-core";
 import { Flyout } from "./flyout";
-var fallbackProps = {
+const fallbackProps = {
   cornerRadius: 5,
   pointerLength: 10,
   pointerWidth: 10
 };
-export var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
-  _inherits(VictoryTooltip, _React$Component);
-
-  var _super = _createSuper(VictoryTooltip);
-
-  function VictoryTooltip(props) {
-    var _this;
-
-    _classCallCheck(this, VictoryTooltip);
-
-    _this = _super.call(this, props);
-    _this.id = void 0;
-    _this.id = props.id === undefined ? _uniqueId("tooltip-") : props.id;
-    return _this;
-  }
-
-  _createClass(VictoryTooltip, [{
-    key: "getDefaultOrientation",
-    value: function getDefaultOrientation(props) {
-      var datum = props.datum,
-          horizontal = props.horizontal,
-          polar = props.polar;
-
-      if (!polar) {
-        var positive = horizontal ? "right" : "top";
-        var negative = horizontal ? "left" : "bottom";
-        return datum && datum.y < 0 ? negative : positive;
+export class VictoryTooltip extends React.Component {
+  static displayName = "VictoryTooltip";
+  static role = "tooltip";
+  static defaultProps = {
+    active: false,
+    renderInPortal: true,
+    labelComponent: /*#__PURE__*/React.createElement(VictoryLabel, null),
+    flyoutComponent: /*#__PURE__*/React.createElement(Flyout, null),
+    groupComponent: /*#__PURE__*/React.createElement("g", null)
+  };
+  static defaultEvents = props => {
+    const activate = props.activateData ? [{
+      target: "labels",
+      mutation: () => ({
+        active: true
+      })
+    }, {
+      target: "data",
+      mutation: () => ({
+        active: true
+      })
+    }] : [{
+      target: "labels",
+      mutation: () => ({
+        active: true
+      })
+    }];
+    const deactivate = props.activateData ? [{
+      target: "labels",
+      mutation: () => ({
+        active: undefined
+      })
+    }, {
+      target: "data",
+      mutation: () => ({
+        active: undefined
+      })
+    }] : [{
+      target: "labels",
+      mutation: () => ({
+        active: undefined
+      })
+    }];
+    return [{
+      target: "data",
+      eventHandlers: {
+        onMouseOver: () => activate,
+        onFocus: () => activate,
+        onTouchStart: () => activate,
+        onMouseOut: () => deactivate,
+        onBlur: () => deactivate,
+        onTouchEnd: () => deactivate
       }
-
-      return this.getPolarOrientation(props);
+    }];
+  };
+  constructor(props) {
+    super(props);
+    this.id = props.id === undefined ? _uniqueId("tooltip-") : props.id;
+  }
+  getDefaultOrientation(props) {
+    const {
+      datum,
+      horizontal,
+      polar
+    } = props;
+    if (!polar) {
+      const positive = horizontal ? "right" : "top";
+      const negative = horizontal ? "left" : "bottom";
+      return datum && datum.y < 0 ? negative : positive;
     }
-  }, {
-    key: "getPolarOrientation",
-    value: function getPolarOrientation(props) {
-      var degrees = LabelHelpers.getDegrees(props, props.datum);
-      var placement = props.labelPlacement || "vertical";
-
-      if (placement === "vertical") {
-        return this.getVerticalOrientations(degrees);
-      } else if (placement === "parallel") {
-        return degrees < 90 || degrees > 270 ? "right" : "left";
-      }
-
-      return degrees > 180 ? "bottom" : "top";
+    return this.getPolarOrientation(props);
+  }
+  getPolarOrientation(props) {
+    const degrees = LabelHelpers.getDegrees(props, props.datum);
+    const placement = props.labelPlacement || "vertical";
+    if (placement === "vertical") {
+      return this.getVerticalOrientations(degrees);
+    } else if (placement === "parallel") {
+      return degrees < 90 || degrees > 270 ? "right" : "left";
     }
-  }, {
-    key: "getVerticalOrientations",
-    value: function getVerticalOrientations(degrees) {
+    return degrees > 180 ? "bottom" : "top";
+  }
+  getVerticalOrientations(degrees) {
+    // eslint-disable-next-line no-magic-numbers
+    if (degrees < 45 || degrees > 315) {
+      return "right";
       // eslint-disable-next-line no-magic-numbers
-      if (degrees < 45 || degrees > 315) {
-        return "right"; // eslint-disable-next-line no-magic-numbers
-      } else if (degrees >= 45 && degrees <= 135) {
-        return "top"; // eslint-disable-next-line no-magic-numbers
-      } else if (degrees > 135 && degrees < 225) {
-        return "left";
-      }
-
-      return "bottom";
-    }
-  }, {
-    key: "getStyles",
-    value: function getStyles(props) {
-      var theme = props.theme || VictoryTheme.grayscale;
-      var defaultLabelStyles = theme && theme.tooltip && theme.tooltip.style ? theme.tooltip.style : {};
-      var baseLabelStyle = Array.isArray(props.style) ? props.style.map(function (s) {
-        return _defaults({}, s, defaultLabelStyles);
-      }) : _defaults({}, props.style, defaultLabelStyles);
-      var defaultFlyoutStyles = theme && theme.tooltip && theme.tooltip.flyoutStyle ? theme.tooltip.flyoutStyle : {};
-      var baseFlyoutStyle = props.flyoutStyle ? _defaults({}, props.flyoutStyle, defaultFlyoutStyles) : defaultFlyoutStyles;
-      var style = Array.isArray(baseLabelStyle) ? baseLabelStyle.map(function (s) {
-        return Helpers.evaluateStyle(s, props);
-      }) : Helpers.evaluateStyle(baseLabelStyle, props);
-      var flyoutStyle = Helpers.evaluateStyle(baseFlyoutStyle, Object.assign({}, props, {
-        style: style
-      }));
-      return {
-        style: style,
-        flyoutStyle: flyoutStyle
-      };
+    } else if (degrees >= 45 && degrees <= 135) {
+      return "top";
+      // eslint-disable-next-line no-magic-numbers
+    } else if (degrees > 135 && degrees < 225) {
+      return "left";
     }
-  }, {
-    key: "getEvaluatedProps",
-    value: function getEvaluatedProps(props) {
-      var cornerRadius = props.cornerRadius,
-          centerOffset = props.centerOffset,
-          dx = props.dx,
-          dy = props.dy;
-      var active = Helpers.evaluateProp(props.active, props);
-      var text = Helpers.evaluateProp(props.text, Object.assign({}, props, {
-        active: active
-      }));
-
-      if (text === undefined || text === null) {
-        text = "";
-      }
-
-      if (typeof text === "number") {
-        text = text.toString();
-      }
-
-      var _this$getStyles = this.getStyles(Object.assign({}, props, {
-        active: active,
-        text: text
-      })),
-          style = _this$getStyles.style,
-          flyoutStyle = _this$getStyles.flyoutStyle;
-
-      var orientation = Helpers.evaluateProp(props.orientation, Object.assign({}, props, {
-        active: active,
-        text: text,
-        style: style,
-        flyoutStyle: flyoutStyle
-      })) || this.getDefaultOrientation(props);
-      var padding = Helpers.evaluateProp(props.flyoutPadding, Object.assign({}, props, {
-        active: active,
-        text: text,
-        style: style,
-        flyoutStyle: flyoutStyle,
-        orientation: orientation
-      })) || this.getLabelPadding(style);
-      var flyoutPadding = Helpers.getPadding({
-        padding: padding
-      });
-      var pointerWidth = Helpers.evaluateProp(props.pointerWidth, Object.assign({}, props, {
-        active: active,
-        text: text,
-        style: style,
-        flyoutStyle: flyoutStyle,
-        orientation: orientation
-      }));
-      var pointerLength = Helpers.evaluateProp(props.pointerLength, Object.assign({}, props, {
-        active: active,
-        text: text,
-        style: style,
-        flyoutStyle: flyoutStyle,
-        orientation: orientation
-      }));
-      var labelSize = TextSize.approximateTextSize(text, style);
-
-      var _this$getDimensions = this.getDimensions(Object.assign({}, props, {
-        style: style,
-        flyoutStyle: flyoutStyle,
-        active: active,
-        text: text,
-        orientation: orientation,
-        flyoutPadding: flyoutPadding,
-        pointerWidth: pointerWidth,
-        pointerLength: pointerLength
-      }), labelSize),
-          flyoutHeight = _this$getDimensions.flyoutHeight,
-          flyoutWidth = _this$getDimensions.flyoutWidth;
-
-      var evaluatedProps = Object.assign({}, props, {
-        active: active,
-        text: text,
-        style: style,
-        flyoutStyle: flyoutStyle,
-        orientation: orientation,
-        flyoutHeight: flyoutHeight,
-        flyoutWidth: flyoutWidth,
-        flyoutPadding: flyoutPadding,
-        pointerWidth: pointerWidth,
-        pointerLength: pointerLength
-      });
-      var offsetX = _isPlainObject(centerOffset) && (centerOffset === null || centerOffset === void 0 ? void 0 : centerOffset.x) !== undefined ? Helpers.evaluateProp(centerOffset.x, evaluatedProps) : 0;
-      var offsetY = _isPlainObject(centerOffset) && (centerOffset === null || centerOffset === void 0 ? void 0 : centerOffset.y) !== undefined ? Helpers.evaluateProp(centerOffset.y, evaluatedProps) : 0;
-      return _objectSpread(_objectSpread({}, evaluatedProps), {}, {
-        centerOffset: {
-          x: offsetX,
-          y: offsetY
-        },
-        dx: dx !== undefined ? Helpers.evaluateProp(dx, evaluatedProps) : 0,
-        dy: dy !== undefined ? Helpers.evaluateProp(dy, evaluatedProps) : 0,
-        cornerRadius: Helpers.evaluateProp(cornerRadius, evaluatedProps)
-      });
+    return "bottom";
+  }
+  getStyles(props) {
+    const theme = props.theme || VictoryTheme.grayscale;
+    const defaultLabelStyles = theme && theme.tooltip && theme.tooltip.style ? theme.tooltip.style : {};
+    const baseLabelStyle = Array.isArray(props.style) ? props.style.map(s => _defaults({}, s, defaultLabelStyles)) : _defaults({}, props.style, defaultLabelStyles);
+    const defaultFlyoutStyles = theme && theme.tooltip && theme.tooltip.flyoutStyle ? theme.tooltip.flyoutStyle : {};
+    const baseFlyoutStyle = props.flyoutStyle ? _defaults({}, props.flyoutStyle, defaultFlyoutStyles) : defaultFlyoutStyles;
+    const style = Array.isArray(baseLabelStyle) ? baseLabelStyle.map(s => Helpers.evaluateStyle(s, props)) : Helpers.evaluateStyle(baseLabelStyle, props);
+    const flyoutStyle = Helpers.evaluateStyle(baseFlyoutStyle, Object.assign({}, props, {
+      style
+    }));
+    return {
+      style,
+      flyoutStyle
+    };
+  }
+  getEvaluatedProps(props) {
+    const {
+      cornerRadius,
+      centerOffset,
+      dx,
+      dy
+    } = props;
+    const active = Helpers.evaluateProp(props.active, props);
+    let text = Helpers.evaluateProp(props.text, Object.assign({}, props, {
+      active
+    }));
+    if (text === undefined || text === null) {
+      text = "";
     }
-  }, {
-    key: "getCalculatedValues",
-    value: function getCalculatedValues(props) {
-      var style = props.style,
-          text = props.text,
-          flyoutStyle = props.flyoutStyle,
-          flyoutHeight = props.flyoutHeight,
-          flyoutWidth = props.flyoutWidth;
-      var labelSize = TextSize.approximateTextSize(text, style);
-      var flyoutDimensions = {
-        height: flyoutHeight,
-        width: flyoutWidth
-      };
-      var flyoutCenter = this.getFlyoutCenter(props, flyoutDimensions);
-      var transform = this.getTransform(props);
-      return {
-        style: style,
-        flyoutStyle: flyoutStyle,
-        labelSize: labelSize,
-        flyoutDimensions: flyoutDimensions,
-        flyoutCenter: flyoutCenter,
-        transform: transform
-      };
+    if (typeof text === "number") {
+      text = text.toString();
     }
-  }, {
-    key: "getTransform",
-    value: function getTransform(props) {
-      var x = props.x,
-          y = props.y,
-          style = props.style;
-      var labelStyle = style || {};
-      var angle = labelStyle.angle || props.angle || this.getDefaultAngle(props);
-      return angle ? "rotate(".concat(angle, " ").concat(x, " ").concat(y, ")") : undefined;
+    const {
+      style,
+      flyoutStyle
+    } = this.getStyles(Object.assign({}, props, {
+      active,
+      text
+    }));
+    const orientation = Helpers.evaluateProp(props.orientation, Object.assign({}, props, {
+      active,
+      text,
+      style,
+      flyoutStyle
+    })) || this.getDefaultOrientation(props);
+    const padding = Helpers.evaluateProp(props.flyoutPadding, Object.assign({}, props, {
+      active,
+      text,
+      style,
+      flyoutStyle,
+      orientation
+    })) || this.getLabelPadding(style);
+    const flyoutPadding = Helpers.getPadding({
+      padding
+    });
+    const pointerWidth = Helpers.evaluateProp(props.pointerWidth, Object.assign({}, props, {
+      active,
+      text,
+      style,
+      flyoutStyle,
+      orientation
+    }));
+    const pointerLength = Helpers.evaluateProp(props.pointerLength, Object.assign({}, props, {
+      active,
+      text,
+      style,
+      flyoutStyle,
+      orientation
+    }));
+    const labelSize = TextSize.approximateTextSize(text, style);
+    const {
+      flyoutHeight,
+      flyoutWidth
+    } = this.getDimensions(Object.assign({}, props, {
+      style,
+      flyoutStyle,
+      active,
+      text,
+      orientation,
+      flyoutPadding,
+      pointerWidth,
+      pointerLength
+    }), labelSize);
+    const evaluatedProps = Object.assign({}, props, {
+      active,
+      text,
+      style,
+      flyoutStyle,
+      orientation,
+      flyoutHeight,
+      flyoutWidth,
+      flyoutPadding,
+      pointerWidth,
+      pointerLength
+    });
+    const offsetX = _isPlainObject(centerOffset) && centerOffset?.x !== undefined ? Helpers.evaluateProp(centerOffset.x, evaluatedProps) : 0;
+    const offsetY = _isPlainObject(centerOffset) && centerOffset?.y !== undefined ? Helpers.evaluateProp(centerOffset.y, evaluatedProps) : 0;
+    return {
+      ...evaluatedProps,
+      centerOffset: {
+        x: offsetX,
+        y: offsetY
+      },
+      dx: dx !== undefined ? Helpers.evaluateProp(dx, evaluatedProps) : 0,
+      dy: dy !== undefined ? Helpers.evaluateProp(dy, evaluatedProps) : 0,
+      cornerRadius: Helpers.evaluateProp(cornerRadius, evaluatedProps)
+    };
+  }
+  getCalculatedValues(props) {
+    const {
+      style,
+      text,
+      flyoutStyle,
+      flyoutHeight,
+      flyoutWidth
+    } = props;
+    const labelSize = TextSize.approximateTextSize(text, style);
+    const flyoutDimensions = {
+      height: flyoutHeight,
+      width: flyoutWidth
+    };
+    const flyoutCenter = this.getFlyoutCenter(props, flyoutDimensions);
+    const transform = this.getTransform(props);
+    return {
+      style,
+      flyoutStyle,
+      labelSize,
+      flyoutDimensions,
+      flyoutCenter,
+      transform
+    };
+  }
+  getTransform(props) {
+    const {
+      x,
+      y,
+      style
+    } = props;
+    const labelStyle = style || {};
+    const angle = labelStyle.angle || props.angle || this.getDefaultAngle(props);
+    return angle ? `rotate(${angle} ${x} ${y})` : undefined;
+  }
+  getDefaultAngle(props) {
+    const {
+      polar,
+      labelPlacement,
+      orientation,
+      datum
+    } = props;
+    if (!polar || !labelPlacement || labelPlacement === "vertical") {
+      return 0;
     }
-  }, {
-    key: "getDefaultAngle",
-    value: function getDefaultAngle(props) {
-      var polar = props.polar,
-          labelPlacement = props.labelPlacement,
-          orientation = props.orientation,
-          datum = props.datum;
-
-      if (!polar || !labelPlacement || labelPlacement === "vertical") {
-        return 0;
-      }
-
-      var degrees = LabelHelpers.getDegrees(props, datum);
-      var sign = degrees > 90 && degrees < 180 || degrees > 270 ? 1 : -1;
-      var labelRotation = labelPlacement === "perpendicular" ? 0 : 90;
-      var angle = 0;
-
-      if (degrees === 0 || degrees === 180) {
-        angle = orientation === "top" && degrees === 180 ? 270 : 90;
-      } else if (degrees > 0 && degrees < 180) {
-        angle = 90 - degrees;
-      } else if (degrees > 180 && degrees < 360) {
-        angle = 270 - degrees;
-      }
-
-      return angle + sign * labelRotation;
+    const degrees = LabelHelpers.getDegrees(props, datum);
+    const sign = degrees > 90 && degrees < 180 || degrees > 270 ? 1 : -1;
+    const labelRotation = labelPlacement === "perpendicular" ? 0 : 90;
+    let angle = 0;
+    if (degrees === 0 || degrees === 180) {
+      angle = orientation === "top" && degrees === 180 ? 270 : 90;
+    } else if (degrees > 0 && degrees < 180) {
+      angle = 90 - degrees;
+    } else if (degrees > 180 && degrees < 360) {
+      angle = 270 - degrees;
     }
-  }, {
-    key: "constrainTooltip",
-    value: function constrainTooltip(center, props, dimensions) {
-      var x = center.x,
-          y = center.y;
-      var width = dimensions.width,
-          height = dimensions.height;
-      var extent = {
-        x: [0, props.width],
-        y: [0, props.height]
-      };
-      var flyoutExtent = {
-        x: [x - width / 2, x + width / 2],
-        y: [y - height / 2, y + height / 2]
-      };
-      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])
-      };
-    } // eslint-disable-next-line complexity
+    return angle + sign * labelRotation;
+  }
+  constrainTooltip(center, props, dimensions) {
+    const {
+      x,
+      y
+    } = center;
+    const {
+      width,
+      height
+    } = dimensions;
+    const extent = {
+      x: [0, props.width],
+      y: [0, props.height]
+    };
+    const flyoutExtent = {
+      x: [x - width / 2, x + width / 2],
+      y: [y - height / 2, y + height / 2]
+    };
+    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])
+    };
+  }
 
-  }, {
-    key: "getFlyoutCenter",
-    value: function getFlyoutCenter(props, dimensions) {
-      var x = props.x,
-          y = props.y,
-          dx = props.dx,
-          dy = props.dy,
-          pointerLength = props.pointerLength,
-          orientation = props.orientation,
-          constrainToVisibleArea = props.constrainToVisibleArea,
-          centerOffset = props.centerOffset;
-      var height = dimensions.height,
-          width = dimensions.width;
-      var xSign = orientation === "left" ? -1 : 1;
-      var ySign = orientation === "bottom" ? -1 : 1;
-      var flyoutCenter = {
-        x: orientation === "left" || orientation === "right" ? x + xSign * (pointerLength + width / 2 + xSign * dx) : x + dx,
-        y: orientation === "top" || orientation === "bottom" ? y - ySign * (pointerLength + height / 2 - ySign * dy) : y + dy
-      };
-      var center = {
-        x: _isPlainObject(props.center) && props.center.x !== undefined ? props.center.x : flyoutCenter.x,
-        y: _isPlainObject(props.center) && props.center.y !== undefined ? props.center.y : flyoutCenter.y
-      };
-      var centerWithOffset = {
-        x: center.x + centerOffset.x,
-        y: center.y + centerOffset.y
-      };
-      return constrainToVisibleArea ? this.constrainTooltip(centerWithOffset, props, dimensions) : centerWithOffset;
+  // eslint-disable-next-line complexity
+  getFlyoutCenter(props, dimensions) {
+    const {
+      x,
+      y,
+      dx,
+      dy,
+      pointerLength,
+      orientation,
+      constrainToVisibleArea,
+      centerOffset
+    } = props;
+    const {
+      height,
+      width
+    } = dimensions;
+    const xSign = orientation === "left" ? -1 : 1;
+    const ySign = orientation === "bottom" ? -1 : 1;
+    const flyoutCenter = {
+      x: orientation === "left" || orientation === "right" ? x + xSign * (pointerLength + width / 2 + xSign * dx) : x + dx,
+      y: orientation === "top" || orientation === "bottom" ? y - ySign * (pointerLength + height / 2 - ySign * dy) : y + dy
+    };
+    const center = {
+      x: _isPlainObject(props.center) && props.center.x !== undefined ? props.center.x : flyoutCenter.x,
+      y: _isPlainObject(props.center) && props.center.y !== undefined ? props.center.y : flyoutCenter.y
+    };
+    const centerWithOffset = {
+      x: center.x + centerOffset.x,
+      y: center.y + centerOffset.y
+    };
+    return constrainToVisibleArea ? this.constrainTooltip(centerWithOffset, props, dimensions) : centerWithOffset;
+  }
+  getLabelPadding(style) {
+    if (!style) {
+      return 0;
     }
-  }, {
-    key: "getLabelPadding",
-    value: function getLabelPadding(style) {
-      if (!style) {
-        return 0;
+    const paddings = Array.isArray(style) ? style.map(s => s.padding) : [style.padding];
+    return Math.max(...paddings, 0);
+  }
+  getDimensions(props, labelSize) {
+    const {
+      orientation,
+      pointerLength,
+      pointerWidth,
+      flyoutHeight,
+      flyoutWidth,
+      flyoutPadding
+    } = props;
+    const cornerRadius = Helpers.evaluateProp(props.cornerRadius, props);
+    const getHeight = () => {
+      const calculatedHeight = labelSize.height + flyoutPadding.top + flyoutPadding.bottom;
+      const minHeight = orientation === "top" || orientation === "bottom" ? 2 * cornerRadius : 2 * cornerRadius + pointerWidth;
+      return Math.max(minHeight, calculatedHeight);
+    };
+    const getWidth = () => {
+      const calculatedWidth = labelSize.width + flyoutPadding.left + flyoutPadding.right;
+      const minWidth = orientation === "left" || orientation === "right" ? 2 * cornerRadius + pointerLength : 2 * cornerRadius;
+      return Math.max(minWidth, calculatedWidth);
+    };
+    return {
+      flyoutHeight: flyoutHeight ? Helpers.evaluateProp(flyoutHeight, props) : getHeight(),
+      flyoutWidth: flyoutWidth ? Helpers.evaluateProp(flyoutWidth, props) : getWidth()
+    };
+  }
+  getLabelProps(props, calculatedValues) {
+    const {
+      flyoutCenter,
+      style,
+      labelSize,
+      dy = 0,
+      dx = 0
+    } = calculatedValues;
+    const {
+      text,
+      datum,
+      activePoints,
+      labelComponent,
+      index,
+      flyoutPadding
+    } = props;
+    const textAnchor = (Array.isArray(style) && style.length ? style[0].textAnchor : style.textAnchor) || "middle";
+    const getLabelX = () => {
+      if (!textAnchor || textAnchor === "middle") {
+        return flyoutCenter.x;
       }
-
-      var paddings = Array.isArray(style) ? style.map(function (s) {
-        return s.padding;
-      }) : [style.padding];
-      return Math.max.apply(Math, _toConsumableArray(paddings).concat([0]));
-    }
-  }, {
-    key: "getDimensions",
-    value: function getDimensions(props, labelSize) {
-      var orientation = props.orientation,
-          pointerLength = props.pointerLength,
-          pointerWidth = props.pointerWidth,
-          flyoutHeight = props.flyoutHeight,
-          flyoutWidth = props.flyoutWidth,
-          flyoutPadding = props.flyoutPadding;
-      var cornerRadius = Helpers.evaluateProp(props.cornerRadius, props);
-
-      var getHeight = function () {
-        var calculatedHeight = labelSize.height + flyoutPadding.top + flyoutPadding.bottom;
-        var minHeight = orientation === "top" || orientation === "bottom" ? 2 * cornerRadius : 2 * cornerRadius + pointerWidth;
-        return Math.max(minHeight, calculatedHeight);
-      };
-
-      var getWidth = function () {
-        var calculatedWidth = labelSize.width + flyoutPadding.left + flyoutPadding.right;
-        var minWidth = orientation === "left" || orientation === "right" ? 2 * cornerRadius + pointerLength : 2 * cornerRadius;
-        return Math.max(minWidth, calculatedWidth);
-      };
-
-      return {
-        flyoutHeight: flyoutHeight ? Helpers.evaluateProp(flyoutHeight, props) : getHeight(),
-        flyoutWidth: flyoutWidth ? Helpers.evaluateProp(flyoutWidth, props) : getWidth()
-      };
-    }
-  }, {
-    key: "getLabelProps",
-    value: function getLabelProps(props, calculatedValues) {
-      var flyoutCenter = calculatedValues.flyoutCenter,
-          style = calculatedValues.style,
-          labelSize = calculatedValues.labelSize,
-          _calculatedValues$dy = calculatedValues.dy,
-          dy = _calculatedValues$dy === void 0 ? 0 : _calculatedValues$dy,
-          _calculatedValues$dx = calculatedValues.dx,
-          dx = _calculatedValues$dx === void 0 ? 0 : _calculatedValues$dx;
-      var text = props.text,
-          datum = props.datum,
-          activePoints = props.activePoints,
-          labelComponent = props.labelComponent,
-          index = props.index,
-          flyoutPadding = props.flyoutPadding;
-      var textAnchor = (Array.isArray(style) && style.length ? style[0].textAnchor : style.textAnchor) || "middle";
-
-      var getLabelX = function () {
-        if (!textAnchor || textAnchor === "middle") {
-          return flyoutCenter.x;
-        }
-
-        var sign = textAnchor === "end" ? -1 : 1;
-        return flyoutCenter.x - sign * (labelSize.width / 2);
-      };
-
-      return _defaults({}, labelComponent.props, {
-        key: "".concat(this.id, "-label-").concat(index),
-        text: text,
-        datum: datum,
-        activePoints: activePoints,
-        textAnchor: textAnchor,
-        dy: dy,
-        dx: dx,
-        style: style,
-        x: getLabelX() + (flyoutPadding.left - flyoutPadding.right) / 2,
-        y: flyoutCenter.y + (flyoutPadding.top - flyoutPadding.bottom) / 2,
-        verticalAnchor: "middle",
-        angle: style.angle
-      });
-    }
-  }, {
-    key: "getPointerOrientation",
-    value: function getPointerOrientation(point, center, flyoutDimensions) {
-      var edges = {
-        bottom: center.y + flyoutDimensions.height / 2,
-        top: center.y - flyoutDimensions.height / 2,
-        left: center.x - flyoutDimensions.width / 2,
-        right: center.x + flyoutDimensions.width / 2
-      };
-      var gaps = [{
-        side: "top",
-        val: edges.top > point.y ? edges.top - point.y : -1
-      }, {
-        side: "bottom",
-        val: edges.bottom < point.y ? point.y - edges.bottom : -1
-      }, {
-        side: "right",
-        val: edges.right < point.x ? point.x - edges.right : -1
-      }, {
-        side: "left",
-        val: edges.left > point.x ? edges.left - point.x : -1
-      }];
-      return _orderBy(gaps, "val", "desc")[0].side;
-    }
-  }, {
-    key: "getFlyoutProps",
-    value: function getFlyoutProps(props, calculatedValues) {
-      var flyoutDimensions = calculatedValues.flyoutDimensions,
-          flyoutStyle = calculatedValues.flyoutStyle,
-          flyoutCenter = calculatedValues.flyoutCenter;
-      var x = props.x,
-          y = props.y,
-          dx = props.dx,
-          dy = props.dy,
-          datum = props.datum,
-          activePoints = props.activePoints,
-          index = props.index,
-          pointerLength = props.pointerLength,
-          pointerWidth = props.pointerWidth,
-          cornerRadius = props.cornerRadius,
-          events = props.events,
-          flyoutComponent = props.flyoutComponent;
-      var pointerOrientation = Helpers.evaluateProp(props.pointerOrientation, props);
-      return _defaults({}, flyoutComponent.props, {
+      const sign = textAnchor === "end" ? -1 : 1;
+      return flyoutCenter.x - sign * (labelSize.width / 2);
+    };
+    return _defaults({}, labelComponent.props, {
+      key: `${this.id}-label-${index}`,
+      text,
+      datum,
+      activePoints,
+      textAnchor,
+      dy,
+      dx,
+      style,
+      x: getLabelX() + (flyoutPadding.left - flyoutPadding.right) / 2,
+      y: flyoutCenter.y + (flyoutPadding.top - flyoutPadding.bottom) / 2,
+      verticalAnchor: "middle",
+      angle: style.angle
+    });
+  }
+  getPointerOrientation(point, center, flyoutDimensions) {
+    const edges = {
+      bottom: center.y + flyoutDimensions.height / 2,
+      top: center.y - flyoutDimensions.height / 2,
+      left: center.x - flyoutDimensions.width / 2,
+      right: center.x + flyoutDimensions.width / 2
+    };
+    const gaps = [{
+      side: "top",
+      val: edges.top > point.y ? edges.top - point.y : -1
+    }, {
+      side: "bottom",
+      val: edges.bottom < point.y ? point.y - edges.bottom : -1
+    }, {
+      side: "right",
+      val: edges.right < point.x ? point.x - edges.right : -1
+    }, {
+      side: "left",
+      val: edges.left > point.x ? edges.left - point.x : -1
+    }];
+    return _orderBy(gaps, "val", "desc")[0].side;
+  }
+  getFlyoutProps(props, calculatedValues) {
+    const {
+      flyoutDimensions,
+      flyoutStyle,
+      flyoutCenter
+    } = calculatedValues;
+    const {
+      x,
+      y,
+      dx,
+      dy,
+      datum,
+      activePoints,
+      index,
+      pointerLength,
+      pointerWidth,
+      cornerRadius,
+      events,
+      flyoutComponent
+    } = props;
+    const pointerOrientation = Helpers.evaluateProp(props.pointerOrientation, props);
+    return _defaults({}, flyoutComponent.props, {
+      x,
+      y,
+      dx,
+      dy,
+      datum,
+      activePoints,
+      index,
+      pointerLength,
+      pointerWidth,
+      cornerRadius,
+      events,
+      orientation: pointerOrientation || this.getPointerOrientation({
         x: x,
-        y: y,
-        dx: dx,
-        dy: dy,
-        datum: datum,
-        activePoints: activePoints,
-        index: index,
-        pointerLength: pointerLength,
-        pointerWidth: pointerWidth,
-        cornerRadius: cornerRadius,
-        events: events,
-        orientation: pointerOrientation || this.getPointerOrientation({
-          x: x,
-          y: y
-        }, flyoutCenter, flyoutDimensions),
-        key: "".concat(this.id, "-tooltip-").concat(index),
-        width: flyoutDimensions.width,
-        height: flyoutDimensions.height,
-        style: flyoutStyle,
-        center: flyoutCenter
-      });
-    } // Overridden in victory-core-native
-
-  }, {
-    key: "renderTooltip",
-    value: function renderTooltip(props) {
-      var active = Helpers.evaluateProp(props.active, props);
-      var renderInPortal = props.renderInPortal;
-
-      if (!active) {
-        return renderInPortal ? /*#__PURE__*/React.createElement(VictoryPortal, null) : null;
-      }
-
-      var evaluatedProps = this.getEvaluatedProps(props);
-      var flyoutComponent = evaluatedProps.flyoutComponent,
-          labelComponent = evaluatedProps.labelComponent,
-          groupComponent = evaluatedProps.groupComponent;
-      var calculatedValues = this.getCalculatedValues(evaluatedProps);
-      var children = [/*#__PURE__*/React.cloneElement(flyoutComponent, this.getFlyoutProps(evaluatedProps, calculatedValues)), /*#__PURE__*/React.cloneElement(labelComponent, this.getLabelProps(evaluatedProps, calculatedValues))];
-      var tooltip = /*#__PURE__*/React.cloneElement(groupComponent, {
-        role: "presentation",
-        transform: calculatedValues.transform
-      }, children);
-      return renderInPortal ? /*#__PURE__*/React.createElement(VictoryPortal, null, tooltip) : tooltip;
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var props = Helpers.modifyProps(this.props, fallbackProps, "tooltip");
-      return this.renderTooltip(props);
-    }
-  }]);
-
-  return VictoryTooltip;
-}(React.Component);
-VictoryTooltip.displayName = "VictoryTooltip";
-VictoryTooltip.role = "tooltip";
-VictoryTooltip.defaultProps = {
-  active: false,
-  renderInPortal: true,
-  labelComponent: /*#__PURE__*/React.createElement(VictoryLabel, null),
-  flyoutComponent: /*#__PURE__*/React.createElement(Flyout, null),
-  groupComponent: /*#__PURE__*/React.createElement("g", null)
-};
+        y: y
+      }, flyoutCenter, flyoutDimensions),
+      key: `${this.id}-tooltip-${index}`,
+      width: flyoutDimensions.width,
+      height: flyoutDimensions.height,
+      style: flyoutStyle,
+      center: flyoutCenter
+    });
+  }
 
-VictoryTooltip.defaultEvents = function (props) {
-  var activate = props.activateData ? [{
-    target: "labels",
-    mutation: function () {
-      return {
-        active: true
-      };
-    }
-  }, {
-    target: "data",
-    mutation: function () {
-      return {
-        active: true
-      };
-    }
-  }] : [{
-    target: "labels",
-    mutation: function () {
-      return {
-        active: true
-      };
-    }
-  }];
-  var deactivate = props.activateData ? [{
-    target: "labels",
-    mutation: function () {
-      return {
-        active: undefined
-      };
+  // Overridden in victory-core-native
+  renderTooltip(props) {
+    const active = Helpers.evaluateProp(props.active, props);
+    const {
+      renderInPortal
+    } = props;
+    if (!active) {
+      return renderInPortal ? /*#__PURE__*/React.createElement(VictoryPortal, null) : null;
     }
-  }, {
-    target: "data",
-    mutation: function () {
-      return {
-        active: undefined
-      };
-    }
-  }] : [{
-    target: "labels",
-    mutation: function () {
-      return {
-        active: undefined
-      };
-    }
-  }];
-  return [{
-    target: "data",
-    eventHandlers: {
-      onMouseOver: function () {
-        return activate;
-      },
-      onFocus: function () {
-        return activate;
-      },
-      onTouchStart: function () {
-        return activate;
-      },
-      onMouseOut: function () {
-        return deactivate;
-      },
-      onBlur: function () {
-        return deactivate;
-      },
-      onTouchEnd: function () {
-        return deactivate;
-      }
-    }
-  }];
-};
+    const evaluatedProps = this.getEvaluatedProps(props);
+    const {
+      flyoutComponent,
+      labelComponent,
+      groupComponent
+    } = evaluatedProps;
+    const calculatedValues = this.getCalculatedValues(evaluatedProps);
+    const children = [/*#__PURE__*/React.cloneElement(flyoutComponent, this.getFlyoutProps(evaluatedProps, calculatedValues)), /*#__PURE__*/React.cloneElement(labelComponent, this.getLabelProps(evaluatedProps, calculatedValues))];
+    const tooltip = /*#__PURE__*/React.cloneElement(groupComponent, {
+      role: "presentation",
+      transform: calculatedValues.transform
+    }, children);
+    return renderInPortal ? /*#__PURE__*/React.createElement(VictoryPortal, null, tooltip) : tooltip;
+  }
+  render() {
+    const props = Helpers.modifyProps(this.props, fallbackProps, "tooltip");
+    return this.renderTooltip(props);
+  }
+}