victory-box-plot 36.9.1 → 36.9.2-next.0

package/es/helper-methods.js

@@ -1,51 +1,34 @@
-import _isNil from "lodash/isNil";
-import _isNaN from "lodash/isNaN";
 import _keys from "lodash/keys";
 import _groupBy from "lodash/groupBy";
 import _uniq from "lodash/uniq";
 import _defaults from "lodash/defaults";
 import _orderBy from "lodash/orderBy";
-
-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; }
-
 import { Helpers, Scale, Domain, Data, Collection } from "victory-core";
 import { min as d3Min, max as d3Max, quantile as d3Quantile } from "victory-vendor/d3-array";
-var TYPES = ["max", "min", "median", "q1", "q3"];
-
-var checkProcessedData = function (data) {
+const TYPES = ["max", "min", "median", "q1", "q3"];
+const checkProcessedData = data => {
   /* check if the data is pre-processed. start by checking that it has
   all required quartile attributes. */
-  var hasQuartileAttributes = data.every(function (datum) {
-    return TYPES.every(function (val) {
-      return typeof datum["_".concat(val)] !== "undefined";
-    });
+  const hasQuartileAttributes = data.every(datum => {
+    return TYPES.every(val => typeof datum[`_${val}`] !== "undefined");
   });
-
   if (hasQuartileAttributes) {
     // check that the independent variable is distinct
-    var values = data.map(function (d) {
-      return d._x;
-    });
-
+    const values = data.map(d => d._x);
     if (!_uniq(values).length === values.length) {
-      throw new Error("\n        data prop may only take an array of objects with a unique\n        independent variable. Make sure your x values are distinct.\n      ");
+      throw new Error(`
+        data prop may only take an array of objects with a unique
+        independent variable. Make sure your x values are distinct.
+      `);
     }
-
     return true;
   }
-
   return false;
 };
-
-var nanToNull = function (val) {
-  return _isNaN(val) ? null : val;
-};
-
-var getSummaryStatistics = function (data) {
-  var dependentVars = data.map(function (datum) {
-    return datum._y;
-  });
-  var quartiles = {
+const nanToNull = val => Number.isNaN(val) ? null : val;
+const getSummaryStatistics = data => {
+  const dependentVars = data.map(datum => datum._y);
+  const quartiles = {
     _q1: nanToNull(d3Quantile(dependentVars, 0.25)),
     // eslint-disable-line no-magic-numbers
     _q3: nanToNull(d3Quantile(dependentVars, 0.75)),
@@ -58,46 +41,36 @@ var getSummaryStatistics = function (data) {
     _y: data[0]._y
   });
 };
-
-var processData = function (data) {
+const processData = data => {
   /* check if the data is coming in a pre-processed form,
   i.e. { x || y, min, max, q1, q3, median }. if not, process it. */
-  var isProcessed = checkProcessedData(data);
-
+  const isProcessed = checkProcessedData(data);
   if (!isProcessed) {
     // check if the data is coming with x or y values as an array
-    var arrayX = data.every(function (datum) {
-      return Array.isArray(datum._x);
-    });
-    var arrayY = data.every(function (datum) {
-      return Array.isArray(datum._y);
-    });
-    var sortKey = "_y";
-    var groupKey = "_x";
-
+    const arrayX = data.every(datum => Array.isArray(datum._x));
+    const arrayY = data.every(datum => Array.isArray(datum._y));
+    const sortKey = "_y";
+    const groupKey = "_x";
     if (arrayX) {
-      throw new Error("\n        data should not be given as in array for x\n      ");
+      throw new Error(`
+        data should not be given as in array for x
+      `);
     } else if (arrayY) {
       /* generate summary statistics for each datum. to do this, flatten
       the depedentVarArray and process each datum separately */
-      return data.map(function (datum) {
-        var dataArray = datum[sortKey].map(function (d) {
-          return Object.assign({}, datum, _defineProperty({}, sortKey, d));
-        });
-
-        var sortedData = _orderBy(dataArray, sortKey);
-
+      return data.map(datum => {
+        const dataArray = datum[sortKey].map(d => Object.assign({}, datum, {
+          [sortKey]: d
+        }));
+        const sortedData = _orderBy(dataArray, sortKey);
         return getSummaryStatistics(sortedData);
       });
     } else {
       /* Group data by independent variable and generate summary statistics for each group */
-      var groupedData = _groupBy(data, groupKey);
-
-      return _keys(groupedData).map(function (key) {
-        var datum = groupedData[key];
-
-        var sortedData = _orderBy(datum, sortKey);
-
+      const groupedData = _groupBy(data, groupKey);
+      return _keys(groupedData).map(key => {
+        const datum = groupedData[key];
+        const sortedData = _orderBy(datum, sortKey);
         return getSummaryStatistics(sortedData);
       });
     }
@@ -105,84 +78,69 @@ var processData = function (data) {
     return data;
   }
 };
-
-export var getData = function (props) {
-  var accessorTypes = TYPES.concat("x", "y");
-  var formattedData = Data.formatData(props.data, props, accessorTypes);
+export const getData = props => {
+  const accessorTypes = TYPES.concat("x", "y");
+  const formattedData = Data.formatData(props.data, props, accessorTypes);
   return formattedData.length ? processData(formattedData) : [];
 };
-
-var reduceDataset = function (dataset, props, axis) {
-  var minDomain = Domain.getMinFromProps(props, axis);
-  var maxDomain = Domain.getMaxFromProps(props, axis);
-  var minData = minDomain !== undefined ? minDomain : dataset.reduce(function (memo, datum) {
-    return memo < datum["_".concat(axis)] ? memo : datum["_".concat(axis)];
+const reduceDataset = (dataset, props, axis) => {
+  const minDomain = Domain.getMinFromProps(props, axis);
+  const maxDomain = Domain.getMaxFromProps(props, axis);
+  const minData = minDomain !== undefined ? minDomain : dataset.reduce((memo, datum) => {
+    return memo < datum[`_${axis}`] ? memo : datum[`_${axis}`];
   }, Infinity);
-  var maxData = maxDomain !== undefined ? maxDomain : dataset.reduce(function (memo, datum) {
-    return memo > datum["_".concat(axis)] ? memo : datum["_".concat(axis)];
+  const maxData = maxDomain !== undefined ? maxDomain : dataset.reduce((memo, datum) => {
+    return memo > datum[`_${axis}`] ? memo : datum[`_${axis}`];
   }, -Infinity);
   return Domain.getDomainFromMinMax(minData, maxData);
 };
-
-var getDomainFromMinMaxValues = function (dataset, props, axis) {
-  var minDomain = Domain.getMinFromProps(props, axis);
-  var maxDomain = Domain.getMaxFromProps(props, axis);
-  var minData = minDomain !== undefined ? minDomain : dataset.reduce(function (memo, datum) {
+const getDomainFromMinMaxValues = (dataset, props, axis) => {
+  const minDomain = Domain.getMinFromProps(props, axis);
+  const maxDomain = Domain.getMaxFromProps(props, axis);
+  const minData = minDomain !== undefined ? minDomain : dataset.reduce((memo, datum) => {
     return memo < datum._min ? memo : datum._min;
   }, Infinity);
-  var maxData = maxDomain !== undefined ? maxDomain : dataset.reduce(function (memo, datum) {
+  const maxData = maxDomain !== undefined ? maxDomain : dataset.reduce((memo, datum) => {
     return memo > datum._max ? memo : datum._max;
   }, -Infinity);
   return Domain.getDomainFromMinMax(minData, maxData);
 };
-
-var getDomainFromData = function (props, axis) {
-  var minDomain = Domain.getMinFromProps(props, axis);
-  var maxDomain = Domain.getMaxFromProps(props, axis);
-  var dataset = getData(props);
-
+const getDomainFromData = (props, axis) => {
+  const minDomain = Domain.getMinFromProps(props, axis);
+  const maxDomain = Domain.getMaxFromProps(props, axis);
+  const dataset = getData(props);
   if (dataset.length < 1) {
     return minDomain !== undefined && maxDomain !== undefined ? Domain.getDomainFromMinMax(minDomain, maxDomain) : undefined;
   }
-
   return axis === "y" ? getDomainFromMinMaxValues(dataset, props, axis) : reduceDataset(dataset, props, axis);
 };
-
-export var getDomain = function (props, axis) {
+export const getDomain = (props, axis) => {
   return Domain.createDomainFunction(getDomainFromData)(props, axis);
 };
-
-var getLabelStyle = function (props, styleObject, namespace) {
-  var component = props["".concat(namespace, "LabelComponent")] || props.labelComponent;
-  var baseStyle = styleObject["".concat(namespace, "Labels")] || styleObject.labels;
-
+const getLabelStyle = (props, styleObject, namespace) => {
+  const component = props[`${namespace}LabelComponent`] || props.labelComponent;
+  const baseStyle = styleObject[`${namespace}Labels`] || styleObject.labels;
   if (!Helpers.isTooltip(component)) {
     return baseStyle;
   }
-
-  var tooltipTheme = props.theme && props.theme.tooltip || {};
+  const tooltipTheme = props.theme && props.theme.tooltip || {};
   return _defaults({}, tooltipTheme.style, baseStyle);
 };
-
-var getStyles = function (props) {
-  var styleObject = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
+const getStyles = function (props, styleObject) {
+  if (styleObject === void 0) {
+    styleObject = {};
+  }
   if (props.disableInlineStyles) {
     return {};
   }
-
-  var style = props.style || {};
-  var parentStyles = {
+  const style = props.style || {};
+  const parentStyles = {
     height: "100%",
     width: "100%"
   };
-
-  var labelStyles = _defaults({}, style.labels, getLabelStyle(props, styleObject));
-
-  var boxStyles = _defaults({}, style.boxes, styleObject.boxes);
-
-  var whiskerStyles = _defaults({}, style.whiskers, styleObject.whiskers);
-
+  const labelStyles = _defaults({}, style.labels, getLabelStyle(props, styleObject));
+  const boxStyles = _defaults({}, style.boxes, styleObject.boxes);
+  const whiskerStyles = _defaults({}, style.whiskers, styleObject.whiskers);
   return {
     boxes: boxStyles,
     labels: labelStyles,
@@ -200,63 +158,67 @@ var getStyles = function (props) {
     whiskers: whiskerStyles
   };
 };
-
-var getCalculatedValues = function (props) {
-  var theme = props.theme,
-      horizontal = props.horizontal;
-  var data = getData(props);
-  var range = {
+const getCalculatedValues = props => {
+  const {
+    theme,
+    horizontal
+  } = props;
+  const data = getData(props);
+  const range = {
     x: Helpers.getRange(props, "x"),
     y: Helpers.getRange(props, "y")
   };
-  var domain = {
+  const domain = {
     x: getDomain(props, "x"),
     y: getDomain(props, "y")
   };
-  var scale = {
+  const scale = {
     x: Scale.getBaseScale(props, "x").domain(domain.x).range(props.horizontal ? range.y : range.x),
     y: Scale.getBaseScale(props, "y").domain(domain.y).range(props.horizontal ? range.x : range.y)
   };
-  var defaultStyles = theme && theme.boxplot && theme.boxplot.style ? theme.boxplot.style : {};
-  var style = getStyles(props, defaultStyles);
-  var defaultOrientation = props.horizontal ? "top" : "right";
-  var labelOrientation = props.labelOrientation || defaultOrientation;
-  var boxWidth = props.boxWidth || 1;
+  const defaultStyles = theme && theme.boxplot && theme.boxplot.style ? theme.boxplot.style : {};
+  const style = getStyles(props, defaultStyles);
+  const defaultOrientation = props.horizontal ? "top" : "right";
+  const labelOrientation = props.labelOrientation || defaultOrientation;
+  const boxWidth = props.boxWidth || 1;
   return {
-    data: data,
-    horizontal: horizontal,
-    domain: domain,
-    scale: scale,
-    style: style,
-    labelOrientation: labelOrientation,
-    boxWidth: boxWidth
+    data,
+    horizontal,
+    domain,
+    scale,
+    style,
+    labelOrientation,
+    boxWidth
   };
-}; // eslint-disable-next-line complexity
-
+};
 
-var getWhiskerProps = function (props, type) {
-  var horizontal = props.horizontal,
-      style = props.style,
-      boxWidth = props.boxWidth,
-      whiskerWidth = props.whiskerWidth,
-      datum = props.datum,
-      scale = props.scale,
-      index = props.index,
-      disableInlineStyles = props.disableInlineStyles;
-  var _props$positions = props.positions,
-      min = _props$positions.min,
-      max = _props$positions.max,
-      q1 = _props$positions.q1,
-      q3 = _props$positions.q3,
-      x = _props$positions.x,
-      y = _props$positions.y;
-  var boxValue = type === "min" ? q1 : q3;
-  var whiskerValue = type === "min" ? min : max;
-  var width = typeof whiskerWidth === "number" ? whiskerWidth : boxWidth;
+// eslint-disable-next-line complexity
+const getWhiskerProps = (props, type) => {
+  const {
+    horizontal,
+    style,
+    boxWidth,
+    whiskerWidth,
+    datum,
+    scale,
+    index,
+    disableInlineStyles
+  } = props;
+  const {
+    min,
+    max,
+    q1,
+    q3,
+    x,
+    y
+  } = props.positions;
+  const boxValue = type === "min" ? q1 : q3;
+  const whiskerValue = type === "min" ? min : max;
+  const width = typeof whiskerWidth === "number" ? whiskerWidth : boxWidth;
   return {
-    datum: datum,
-    index: index,
-    scale: scale,
+    datum,
+    index,
+    scale,
     majorWhisker: {
       x1: horizontal ? boxValue : x,
       y1: horizontal ? y : boxValue,
@@ -270,128 +232,127 @@ var getWhiskerProps = function (props, type) {
       y2: horizontal ? y + width / 2 : whiskerValue
     },
     style: disableInlineStyles ? {} : style[type] || style.whisker,
-    disableInlineStyles: disableInlineStyles
+    disableInlineStyles
   };
 };
-
-var getBoxProps = function (props, type) {
-  var horizontal = props.horizontal,
-      boxWidth = props.boxWidth,
-      style = props.style,
-      scale = props.scale,
-      datum = props.datum,
-      index = props.index,
-      disableInlineStyles = props.disableInlineStyles;
-  var _props$positions2 = props.positions,
-      median = _props$positions2.median,
-      q1 = _props$positions2.q1,
-      q3 = _props$positions2.q3,
-      x = _props$positions2.x,
-      y = _props$positions2.y;
-  var defaultX = type === "q1" ? q1 : median;
-  var defaultY = type === "q1" ? median : q3;
-  var defaultWidth = type === "q1" ? median - q1 : q3 - median;
-  var defaultHeight = type === "q1" ? q1 - median : median - q3;
+const getBoxProps = (props, type) => {
+  const {
+    horizontal,
+    boxWidth,
+    style,
+    scale,
+    datum,
+    index,
+    disableInlineStyles
+  } = props;
+  const {
+    median,
+    q1,
+    q3,
+    x,
+    y
+  } = props.positions;
+  const defaultX = type === "q1" ? q1 : median;
+  const defaultY = type === "q1" ? median : q3;
+  const defaultWidth = type === "q1" ? median - q1 : q3 - median;
+  const defaultHeight = type === "q1" ? q1 - median : median - q3;
   return {
-    datum: datum,
-    scale: scale,
-    index: index,
+    datum,
+    scale,
+    index,
     x: horizontal ? defaultX : x - boxWidth / 2,
     y: horizontal ? y - boxWidth / 2 : defaultY,
     width: horizontal ? defaultWidth : boxWidth,
     height: horizontal ? boxWidth : defaultHeight,
     style: disableInlineStyles ? {} : style[type] || style.boxes,
-    disableInlineStyles: disableInlineStyles
+    disableInlineStyles
   };
 };
-
-var getMedianProps = function (props) {
-  var boxWidth = props.boxWidth,
-      horizontal = props.horizontal,
-      style = props.style,
-      datum = props.datum,
-      scale = props.scale,
-      index = props.index,
-      disableInlineStyles = props.disableInlineStyles;
-  var _props$positions3 = props.positions,
-      median = _props$positions3.median,
-      x = _props$positions3.x,
-      y = _props$positions3.y;
+const getMedianProps = props => {
+  const {
+    boxWidth,
+    horizontal,
+    style,
+    datum,
+    scale,
+    index,
+    disableInlineStyles
+  } = props;
+  const {
+    median,
+    x,
+    y
+  } = props.positions;
   return {
-    datum: datum,
-    scale: scale,
-    index: index,
+    datum,
+    scale,
+    index,
     x1: horizontal ? median : x - boxWidth / 2,
     y1: horizontal ? y - boxWidth / 2 : median,
     x2: horizontal ? median : x + boxWidth / 2,
     y2: horizontal ? y + boxWidth / 2 : median,
     style: disableInlineStyles ? {} : style.median,
-    disableInlineStyles: disableInlineStyles
+    disableInlineStyles
   };
 };
-
-var getText = function (props, type) {
-  var datum = props.datum,
-      index = props.index,
-      labels = props.labels;
-  var propName = "".concat(type, "Labels");
-  var labelProp = props[propName];
-
+const getText = (props, type) => {
+  const {
+    datum,
+    index,
+    labels
+  } = props;
+  const propName = `${type}Labels`;
+  const labelProp = props[propName];
   if (!labelProp && !labels) {
     return null;
   } else if (labelProp === true || labels === true) {
-    var dataName = "_".concat(type);
-    return "".concat(datum[dataName]);
+    const dataName = `_${type}`;
+    return `${datum[dataName]}`;
   }
-
   return Array.isArray(labelProp) ? labelProp[index] : labelProp;
 };
-
-var getOrientation = function (labelOrientation, type) {
-  return typeof labelOrientation === "object" && labelOrientation[type] || labelOrientation;
-};
-
-var getLabelProps = function (props, text, type) {
-  var datum = props.datum,
-      positions = props.positions,
-      index = props.index,
-      boxWidth = props.boxWidth,
-      horizontal = props.horizontal,
-      labelOrientation = props.labelOrientation,
-      style = props.style,
-      theme = props.theme,
-      disableInlineStyles = props.disableInlineStyles;
-  var orientation = getOrientation(labelOrientation, type);
-  var namespace = "".concat(type, "Labels");
-  var labelStyle = style[namespace] || style.labels;
-  var defaultVerticalAnchors = {
+const getOrientation = (labelOrientation, type) => typeof labelOrientation === "object" && labelOrientation[type] || labelOrientation;
+const getLabelProps = (props, text, type) => {
+  const {
+    datum,
+    positions,
+    index,
+    boxWidth,
+    horizontal,
+    labelOrientation,
+    style,
+    theme,
+    disableInlineStyles
+  } = props;
+  const orientation = getOrientation(labelOrientation, type);
+  const namespace = `${type}Labels`;
+  const labelStyle = style[namespace] || style.labels;
+  const defaultVerticalAnchors = {
     top: "end",
     bottom: "start",
     left: "middle",
     right: "middle"
   };
-  var defaultTextAnchors = {
+  const defaultTextAnchors = {
     left: "end",
     right: "start",
     top: "middle",
     bottom: "middle"
   };
-  var whiskerWidth = typeof props.whiskerWidth === "number" ? props.whiskerWidth : boxWidth;
-  var width = type === "min" || type === "max" ? whiskerWidth : boxWidth;
-
-  var getOffset = function (coord) {
-    var sign = {
+  const whiskerWidth = typeof props.whiskerWidth === "number" ? props.whiskerWidth : boxWidth;
+  const width = type === "min" || type === "max" ? whiskerWidth : boxWidth;
+  const getOffset = coord => {
+    const sign = {
       x: orientation === "left" ? -1 : 1,
       y: orientation === "top" ? -1 : 1
     };
     return sign[coord] * width / 2 + sign[coord] * (labelStyle.padding || 0);
   };
-
-  var labelProps = {
-    text: text,
-    datum: datum,
-    index: index,
-    orientation: orientation,
+  const labelProps = {
+    text,
+    datum,
+    index,
+    orientation,
     style: disableInlineStyles ? {} : labelStyle,
     y: horizontal ? positions.y : positions[type],
     x: horizontal ? positions[type] : positions.x,
@@ -400,106 +361,92 @@ var getLabelProps = function (props, text, type) {
     textAnchor: labelStyle.textAnchor || defaultTextAnchors[orientation],
     verticalAnchor: labelStyle.verticalAnchor || defaultVerticalAnchors[orientation],
     angle: labelStyle.angle,
-    horizontal: horizontal,
-    disableInlineStyles: disableInlineStyles
+    horizontal,
+    disableInlineStyles
   };
-  var component = props["".concat(type, "LabelComponent")];
-
+  const component = props[`${type}LabelComponent`];
   if (!Helpers.isTooltip(component)) {
     return labelProps;
   }
-
-  var tooltipTheme = theme && theme.tooltip || {};
+  const tooltipTheme = theme && theme.tooltip || {};
   return _defaults({}, labelProps, Helpers.omit(tooltipTheme, ["style"]));
 };
-
-var getDataProps = function (props, type) {
+const getDataProps = (props, type) => {
   if (type === "median") {
     return getMedianProps(props);
   } else if (type === "min" || type === "max") {
     return getWhiskerProps(props, type);
   }
-
   return getBoxProps(props, type);
-}; // if all data points on an axis are out of bound of the domain, filter out this datum
-
-
-var isDatumOutOfBounds = function (datum, domain) {
-  var exists = function (val) {
-    return val !== undefined;
-  };
-
-  var _x = datum._x,
-      _min = datum._min,
-      _max = datum._max;
-  var minDomainX = Collection.getMinValue(domain.x);
-  var maxDomainX = Collection.getMaxValue(domain.x);
-  var minDomainY = Collection.getMinValue(domain.y);
-  var maxDomainY = Collection.getMaxValue(domain.y);
-
-  var underMin = function (min) {
-    return function (val) {
-      return exists(val) && val < min;
-    };
-  };
-
-  var overMax = function (max) {
-    return function (val) {
-      return exists(val) && val > max;
-    };
-  };
-
-  var isUnderMinX = underMin(minDomainX);
-  var isUnderMinY = underMin(minDomainY);
-  var isOverMaxX = overMax(maxDomainX);
-  var isOverMaxY = overMax(maxDomainY);
-  var yOutOfBounds;
-  var xOutOfBounds; // if x is out of the bounds of the domain
-
-  if (isUnderMinX(_x) || isOverMaxX(_x)) xOutOfBounds = true; // if min/max are out of the bounds of the domain
+};
 
+// if all data points on an axis are out of bound of the domain, filter out this datum
+const isDatumOutOfBounds = (datum, domain) => {
+  const exists = val => val !== undefined;
+  const {
+    _x,
+    _min,
+    _max
+  } = datum;
+  const minDomainX = Collection.getMinValue(domain.x);
+  const maxDomainX = Collection.getMaxValue(domain.x);
+  const minDomainY = Collection.getMinValue(domain.y);
+  const maxDomainY = Collection.getMaxValue(domain.y);
+  const underMin = min => val => exists(val) && val < min;
+  const overMax = max => val => exists(val) && val > max;
+  const isUnderMinX = underMin(minDomainX);
+  const isUnderMinY = underMin(minDomainY);
+  const isOverMaxX = overMax(maxDomainX);
+  const isOverMaxY = overMax(maxDomainY);
+  let yOutOfBounds;
+  let xOutOfBounds;
+
+  // if x is out of the bounds of the domain
+  if (isUnderMinX(_x) || isOverMaxX(_x)) xOutOfBounds = true;
+  // if min/max are out of the bounds of the domain
   if (isUnderMinY(_min) && isUnderMinY(_max) || isOverMaxY(_min) && isOverMaxY(_max)) yOutOfBounds = true;
   return yOutOfBounds || xOutOfBounds;
 };
-
-export var getBaseProps = function (initialProps, fallbackProps) {
-  var modifiedProps = Helpers.modifyProps(initialProps, fallbackProps, "boxplot");
-  var props = Object.assign({}, modifiedProps, getCalculatedValues(modifiedProps));
-  var groupComponent = props.groupComponent,
-      width = props.width,
-      height = props.height,
-      padding = props.padding,
-      standalone = props.standalone,
-      theme = props.theme,
-      events = props.events,
-      sharedEvents = props.sharedEvents,
-      scale = props.scale,
-      horizontal = props.horizontal,
-      data = props.data,
-      style = props.style,
-      domain = props.domain,
-      name = props.name;
-  var initialChildProps = {
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(initialProps, fallbackProps, "boxplot");
+  const props = Object.assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+  const {
+    groupComponent,
+    width,
+    height,
+    padding,
+    standalone,
+    theme,
+    events,
+    sharedEvents,
+    scale,
+    horizontal,
+    data,
+    style,
+    domain,
+    name
+  } = props;
+  const initialChildProps = {
     parent: {
-      domain: domain,
-      scale: scale,
-      width: width,
-      height: height,
-      data: data,
-      standalone: standalone,
-      name: name,
-      theme: theme,
+      domain,
+      scale,
+      width,
+      height,
+      data,
+      standalone,
+      name,
+      theme,
       style: style.parent || {},
-      padding: padding,
-      groupComponent: groupComponent,
-      horizontal: horizontal
+      padding,
+      groupComponent,
+      horizontal
     }
   };
-  var boxScale = scale.y;
-  return data.reduce(function (acc, datum, index) {
-    var eventKey = !_isNil(datum.eventKey) ? datum.eventKey : index;
+  const boxScale = scale.y;
+  return data.reduce((acc, datum, index) => {
+    const eventKey = !Helpers.isNil(datum.eventKey) ? datum.eventKey : index;
     if (isDatumOutOfBounds(datum, domain)) return acc;
-    var positions = {
+    const positions = {
       x: horizontal ? scale.y(datum._y) : scale.x(datum._x),
       y: horizontal ? scale.x(datum._x) : scale.y(datum._y),
       min: boxScale(datum._min),
@@ -508,22 +455,21 @@ export var getBaseProps = function (initialProps, fallbackProps) {
       q1: boxScale(datum._q1),
       q3: boxScale(datum._q3)
     };
-    var dataProps = Object.assign({
-      index: index,
-      datum: datum,
-      positions: positions
+    const dataProps = Object.assign({
+      index,
+      datum,
+      positions
     }, props);
-    var dataObj = TYPES.reduce(function (memo, type) {
+    const dataObj = TYPES.reduce((memo, type) => {
       memo[type] = getDataProps(dataProps, type);
       return memo;
     }, {});
     acc[eventKey] = dataObj;
-    TYPES.forEach(function (type) {
-      var labelText = getText(dataProps, type);
-      var labelProp = props.labels || props["".concat(type, "Labels")];
-
+    TYPES.forEach(type => {
+      const labelText = getText(dataProps, type);
+      const labelProp = props.labels || props[`${type}Labels`];
       if (labelText !== null && labelText !== undefined || labelProp && (events || sharedEvents)) {
-        var target = "".concat(type, "Labels");
+        const target = `${type}Labels`;
         acc[eventKey][target] = getLabelProps(Object.assign({}, props, dataProps), labelText, type);
       }
     });