@evergis/charts 2.0.21 → 2.0.22

package/dist/charts.cjs.development.js

@@ -54,16 +54,8 @@ function _taggedTemplateLiteralLoose(strings, raw) {
   return strings;
 }
 
-function _templateObject() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const Wrapper = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject());
+var _templateObject;
+const Wrapper = /*#__PURE__*/styled__default.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n"])));
 
 function useNode() {
   const [node, onSetNode] = React.useState(null);
@@ -101,16 +93,8 @@ const appendSvg = (node, width, height) => {
   return svg;
 };
 
-function _templateObject$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow: hidden;\n  user-select: none;\n"]);
-
-  _templateObject$1 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const SwipeScrollContainer = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject$1());
+var _templateObject$1;
+const SwipeScrollContainer = /*#__PURE__*/styled__default.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow: hidden;\n  user-select: none;\n"])));
 
 function animate(_ref) {
   let {
@@ -257,13 +241,14 @@ const useSwipe = (node, _ref) => {
   }, [container, onStart, node, width]);
 };
 
+const _excluded = ["children", "width", "onSwipe"];
 const SwipeScroll = (_ref) => {
   let {
     children,
     width,
     onSwipe
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, ["children", "width", "onSwipe"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const [ref, draggingNode] = useNode();
   useSwipe(draggingNode, _extends({
@@ -299,15 +284,7 @@ const getTextAnchor = (index, length) => {
   return 'end';
 };
 
-function _templateObject$2() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: absolute;\n"]);
-
-  _templateObject$2 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$2;
 
 const getTranslate = (_ref) => {
   let {
@@ -334,7 +311,7 @@ const LabelContainer = /*#__PURE__*/styled__default.div.attrs(props => ({
   style: {
     transform: getTranslate(props)
   }
-}))( /*#__PURE__*/_templateObject$2());
+}))(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n"])));
 
 const labelClassName = 'd3-chart-label';
 const drawRadialLabels = (_ref) => {
@@ -388,65 +365,7 @@ const drawRadialLabels = (_ref) => {
   });
 };
 
-function _templateObject6() {
-  const data = _taggedTemplateLiteralLoose(["\n  margin-left: 4px;\n  font-size: 10px;\n  color: rgba(255, 255, 255, 0.54);\n"]);
-
-  _templateObject6 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5() {
-  const data = _taggedTemplateLiteralLoose(["\n  ", "\n"]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  const data = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  padding: 2px 4px;\n  border-radius: 4px;\n  color: rgb(255, 255, 255);\n  background-color: rgb(144, 197, 61);\n  margin-left: 8px;\n"]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 50%;\n  right: 0;\n  transform: translate(calc(100% + 6px), -50%);\n"]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  const data = _taggedTemplateLiteralLoose(["\n  text-align: center;\n  max-width: 120px;\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$3() {
-  const data = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  font-size: 12px;\n"]);
-
-  _templateObject$3 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$3, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 const getTranslate$1 = (_ref) => {
   let {
     anchor,
@@ -467,22 +386,14 @@ const getTranslate$1 = (_ref) => {
 
   return "translate(" + translateX + "px, " + translateY + "px)";
 };
-const Label = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject$3());
-const Name = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject2());
-const middleBadgeStyles = /*#__PURE__*/styled.css( /*#__PURE__*/_templateObject3());
-const DefaultBadge = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject4());
-const MiddleBadge = /*#__PURE__*/styled__default(DefaultBadge)( /*#__PURE__*/_templateObject5(), middleBadgeStyles);
-const BadgePrefix = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject6());
-
-function _templateObject$4() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", " {\n    path,\n    line,\n    circle {\n      fill: none;\n      stroke-width: 1px;\n      stroke: rgba(149, 149, 149, 0.18);\n    }\n  }\n  .", " {\n    font-size: 12px;\n    fill-opacity: 0.56;\n  }\n  .", " {\n    fill-opacity: 0.06;\n    stroke-width: 2px;\n    fill: rgb(144, 197, 61);\n    stroke: rgb(144, 197, 61);\n  }\n  .", " {\n    fill: rgb(144, 197, 61);\n  }\n"]);
+const Label = /*#__PURE__*/styled__default.div(_templateObject$3 || (_templateObject$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  font-size: 12px;\n"])));
+const Name = /*#__PURE__*/styled__default.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: center;\n  max-width: 120px;\n"])));
+const middleBadgeStyles = /*#__PURE__*/styled.css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 50%;\n  right: 0;\n  transform: translate(calc(100% + 6px), -50%);\n"])));
+const DefaultBadge = /*#__PURE__*/styled__default.div(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  padding: 2px 4px;\n  border-radius: 4px;\n  color: rgb(255, 255, 255);\n  background-color: rgb(144, 197, 61);\n  margin-left: 8px;\n"])));
+const MiddleBadge = /*#__PURE__*/styled__default(DefaultBadge)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n"])), middleBadgeStyles);
+const BadgePrefix = /*#__PURE__*/styled__default.div(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-left: 4px;\n  font-size: 10px;\n  color: rgba(255, 255, 255, 0.54);\n"])));
 
-  _templateObject$4 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$4;
 const radarChartclassNames = {
   radar: 'radar',
   radarAxis: 'radarAxis',
@@ -495,7 +406,7 @@ const radarChartclassNames = {
   radarLabelBadgePrefix: 'radarLabelBadgePrefix',
   radarCircle: 'radarCircle'
 };
-const SvgWrapper = /*#__PURE__*/styled__default(Wrapper)( /*#__PURE__*/_templateObject$4(), radarChartclassNames.radarAxis, radarChartclassNames.radarAxisText, radarChartclassNames.radarPolygon, radarChartclassNames.radarCircle);
+const SvgWrapper = /*#__PURE__*/styled__default(Wrapper)(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", " {\n    path,\n    line,\n    circle {\n      fill: none;\n      stroke-width: 1px;\n      stroke: rgba(149, 149, 149, 0.18);\n    }\n  }\n  .", " {\n    font-size: 12px;\n    fill-opacity: 0.56;\n  }\n  .", " {\n    fill-opacity: 0.06;\n    stroke-width: 2px;\n    fill: rgb(144, 197, 61);\n    stroke: rgb(144, 197, 61);\n  }\n  .", " {\n    fill: rgb(144, 197, 61);\n  }\n"])), radarChartclassNames.radarAxis, radarChartclassNames.radarAxisText, radarChartclassNames.radarPolygon, radarChartclassNames.radarCircle);
 
 const draw = (node, props) => {
   const {
@@ -725,15 +636,7 @@ function degreesToRadians(degrees) {
   return degrees * (Math.PI / flatAngle);
 }
 
-function _templateObject$5() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", " {\n    fill: #4a4a4a;\n  }\n  .", " {\n    position: absolute;\n    max-width: 128px;\n  }\n  .", " {\n    stroke: #000;\n  }\n  .", " {\n    fill: transparent;\n    cursor: pointer;\n  }\n"]);
-
-  _templateObject$5 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$5;
 const pieChartclassNames = {
   pieGlobal: 'pieGlobal',
   pieSlice: 'pieSlice',
@@ -751,7 +654,7 @@ const pieChartclassNames = {
   pieTooltipColorBox: 'pieTooltipColorBox',
   pieFullChartTooltipCircle: 'pieFullChartTooltipCircle'
 };
-const SvgWrapper$1 = /*#__PURE__*/styled__default(Wrapper)( /*#__PURE__*/_templateObject$5(), pieChartclassNames.pieSliceLabel, pieChartclassNames.pieRadialLabel, pieChartclassNames.pieRadialLink, pieChartclassNames.pieFullChartTooltipCircle);
+const SvgWrapper$1 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$5 || (_templateObject$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", " {\n    fill: #4a4a4a;\n  }\n  .", " {\n    position: absolute;\n    max-width: 128px;\n  }\n  .", " {\n    stroke: #000;\n  }\n  .", " {\n    fill: transparent;\n    cursor: pointer;\n  }\n"])), pieChartclassNames.pieSliceLabel, pieChartclassNames.pieRadialLabel, pieChartclassNames.pieRadialLink, pieChartclassNames.pieFullChartTooltipCircle);
 
 const getMidFactor = d => d.startAngle + (d.endAngle - d.startAngle) / 2 < Math.PI ? 1 : -1;
 const getAlign = d => {
@@ -815,159 +718,21 @@ const drawRadialLabels$1 = (_ref) => {
   }
 };
 
-function _templateObject14() {
-  const data = _taggedTemplateLiteralLoose(["\n  bottom: 6px;\n"]);
-
-  _templateObject14 = function _templateObject14() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject13() {
-  const data = _taggedTemplateLiteralLoose(["\n  top: 6px;\n"]);
-
-  _templateObject13 = function _templateObject13() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject12() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n  font-size: 11px;\n  color: #fff;\n  font-weight: bold;\n  letter-spacing: 0.52px;\n"]);
-
-  _templateObject12 = function _templateObject12() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject11() {
-  const data = _taggedTemplateLiteralLoose(["\n  text-align: right;\n  flex-shrink: 0;\n  flex-grow: 1;\n"]);
-
-  _templateObject11 = function _templateObject11() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject10() {
-  const data = _taggedTemplateLiteralLoose(["\n  margin-right: 4px;\n"]);
-
-  _templateObject10 = function _templateObject10() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject9() {
-  const data = _taggedTemplateLiteralLoose(["\n  height: 2px;\n  border-radius: 0;\n"]);
-
-  _templateObject9 = function _templateObject9() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject8() {
-  const data = _taggedTemplateLiteralLoose(["\n  margin-right: 4px;\n  width: 10px;\n  height: 10px;\n  border-radius: 2px;\n"]);
-
-  _templateObject8 = function _templateObject8() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject7() {
-  const data = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-right: 4px;\n"]);
-
-  _templateObject7 = function _templateObject7() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject6$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-bottom: 0.25rem;\n  &:last-of-type {\n    margin-bottom: 0;\n  }\n"]);
-
-  _templateObject6$1 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  font-size: 14px;\n  margin-bottom: 6px;\n"]);
-
-  _templateObject5$1 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n  font-size: 11px;\n  color: #fff;\n  margin-bottom: 8px;\n  padding: 4px 6px;\n  background-color: rgba(48, 69, 79, 1);\n  border-radius: 4px;\n  box-shadow: 0 0.1875rem 0.5rem rgba(48, 69, 79, 0.06);\n  :before {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 50%;\n    transform: translate(-50%, 100%);\n    width: 0;\n    height: 0;\n    border-style: solid;\n    border-width: 4px 3px 0 3px;\n    border-color: rgba(48, 69, 79, 1) transparent transparent transparent;\n  }\n"]);
-
-  _templateObject4$1 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  align-items: center;\n"]);
-
-  _templateObject3$1 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2$1() {
-  const data = _taggedTemplateLiteralLoose([""]);
-
-  _templateObject2$1 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$6() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  pointer-events: none;\n  white-space: nowrap;\n"]);
-
-  _templateObject$6 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const TooltipFlex = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject$6());
-const LabelFlex = /*#__PURE__*/styled__default(TooltipFlex)( /*#__PURE__*/_templateObject2$1());
-const LabelFlexCenter = /*#__PURE__*/styled__default(LabelFlex)( /*#__PURE__*/_templateObject3$1());
-const TooltipContainer = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject4$1());
-const TooltipGroupName = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject5$1());
-const TooltipItem = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject6$1());
-const ColFlex = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject7());
-const ColorBox = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject8());
-const ColorLine = /*#__PURE__*/styled__default(ColorBox)( /*#__PURE__*/_templateObject9());
-const Name$1 = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject10());
-const Value = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject11());
-const Label$1 = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject12());
-const LabelTop = /*#__PURE__*/styled__default(Label$1)( /*#__PURE__*/_templateObject13());
-const LabelBottom = /*#__PURE__*/styled__default(Label$1)( /*#__PURE__*/_templateObject14());
+var _templateObject$6, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
+const TooltipFlex = /*#__PURE__*/styled__default.div(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  pointer-events: none;\n  white-space: nowrap;\n"])));
+const LabelFlex = /*#__PURE__*/styled__default(TooltipFlex)(_templateObject2$1 || (_templateObject2$1 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+const LabelFlexCenter = /*#__PURE__*/styled__default(LabelFlex)(_templateObject3$1 || (_templateObject3$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  align-items: center;\n"])));
+const TooltipContainer = /*#__PURE__*/styled__default.div(_templateObject4$1 || (_templateObject4$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  font-size: 11px;\n  color: #fff;\n  margin-bottom: 8px;\n  padding: 4px 6px;\n  background-color: rgba(48, 69, 79, 1);\n  border-radius: 4px;\n  box-shadow: 0 0.1875rem 0.5rem rgba(48, 69, 79, 0.06);\n  :before {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 50%;\n    transform: translate(-50%, 100%);\n    width: 0;\n    height: 0;\n    border-style: solid;\n    border-width: 4px 3px 0 3px;\n    border-color: rgba(48, 69, 79, 1) transparent transparent transparent;\n  }\n"])));
+const TooltipGroupName = /*#__PURE__*/styled__default.div(_templateObject5$1 || (_templateObject5$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: 14px;\n  margin-bottom: 6px;\n"])));
+const TooltipItem = /*#__PURE__*/styled__default.div(_templateObject6$1 || (_templateObject6$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-bottom: 0.25rem;\n  &:last-of-type {\n    margin-bottom: 0;\n  }\n"])));
+const ColFlex = /*#__PURE__*/styled__default.div(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-right: 4px;\n"])));
+const ColorBox = /*#__PURE__*/styled__default.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 4px;\n  width: 10px;\n  height: 10px;\n  border-radius: 2px;\n"])));
+const ColorLine = /*#__PURE__*/styled__default(ColorBox)(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 2px;\n  border-radius: 0;\n"])));
+const Name$1 = /*#__PURE__*/styled__default.div(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 4px;\n"])));
+const Value = /*#__PURE__*/styled__default.div(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: right;\n  flex-shrink: 0;\n  flex-grow: 1;\n"])));
+const Label$1 = /*#__PURE__*/styled__default.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  font-size: 11px;\n  color: #fff;\n  font-weight: bold;\n  letter-spacing: 0.52px;\n"])));
+const LabelTop = /*#__PURE__*/styled__default(Label$1)(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  top: 6px;\n"])));
+const LabelBottom = /*#__PURE__*/styled__default(Label$1)(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  bottom: 6px;\n"])));
 
 const drawTooltip = (_ref) => {
   let {
@@ -1364,15 +1129,7 @@ const getLegend = (_ref) => {
   return svg;
 };
 
-function _templateObject$7() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", " {\n    display: flex;\n    margin-bottom: 16px;\n  }\n  .", " {\n    display: inline-flex;\n    align-items: flex-end;\n    height: ", ";\n    margin-bottom: 4px;\n    font-weight: bold;\n  }\n  .", " {\n    height: ", ";\n    margin-bottom: 4px;\n    position: relative;\n    display: flex;\n  }\n  .", " {\n    font-size: 14px;\n    bottom: 0;\n    position: absolute;\n  }\n  .", " {\n    display: flex;\n    flex-direction: column;\n    margin-right: 10px;\n  }\n  .", " {\n    font-size: 12px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: flex-end;\n  }\n  .", " {\n    position: relative;\n  }\n  .", " {\n    position: absolute;\n  }\n"]);
-
-  _templateObject$7 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$7;
 const calendarChartClassNames = /*#__PURE__*/_extends({
   calendarChart: 'calendarChart',
   calendarYear: 'calendarYear',
@@ -1386,7 +1143,7 @@ const calendarChartClassNames = /*#__PURE__*/_extends({
   calendarDay: 'calendarDay'
 }, legendClassNames);
 const headerHeight = '20px';
-const SvgWrapper$2 = /*#__PURE__*/styled__default(Wrapper)( /*#__PURE__*/_templateObject$7(), calendarChartClassNames.calendarYear, calendarChartClassNames.calendarYearTitle, headerHeight, calendarChartClassNames.calendarHeader, headerHeight, calendarChartClassNames.calendarMonth, calendarChartClassNames.calendarAxis, calendarChartClassNames.calendarWeekDay, calendarChartClassNames.calendarDays, calendarChartClassNames.calendarDay);
+const SvgWrapper$2 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$7 || (_templateObject$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", " {\n    display: flex;\n    margin-bottom: 16px;\n  }\n  .", " {\n    display: inline-flex;\n    align-items: flex-end;\n    height: ", ";\n    margin-bottom: 4px;\n    font-weight: bold;\n  }\n  .", " {\n    height: ", ";\n    margin-bottom: 4px;\n    position: relative;\n    display: flex;\n  }\n  .", " {\n    font-size: 14px;\n    bottom: 0;\n    position: absolute;\n  }\n  .", " {\n    display: flex;\n    flex-direction: column;\n    margin-right: 10px;\n  }\n  .", " {\n    font-size: 12px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: flex-end;\n  }\n  .", " {\n    position: relative;\n  }\n  .", " {\n    position: absolute;\n  }\n"])), calendarChartClassNames.calendarYear, calendarChartClassNames.calendarYearTitle, headerHeight, calendarChartClassNames.calendarHeader, headerHeight, calendarChartClassNames.calendarMonth, calendarChartClassNames.calendarAxis, calendarChartClassNames.calendarWeekDay, calendarChartClassNames.calendarDays, calendarChartClassNames.calendarDay);
 
 const draw$2 = (node, props) => {
   const {
@@ -1569,25 +1326,7 @@ const stackedData = data => {
   });
 };
 
-function _templateObject2$2() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", " {\n    transition: opacity linear 200ms;\n    z-index: 1;\n    .", " {\n      justify-content: flex-start;\n      align-items: center;\n      pointer-events: none;\n    }\n    .", " {\n      margin: 0 0 0 10px;\n    }\n  }\n"]);
-
-  _templateObject2$2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$8() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", ",\n    .", ",\n    .", " {\n    shape-rendering: crispEdges;\n  }\n  .", " {\n    fill: none;\n    stroke: steelblue;\n    stroke-width: 1.5px;\n    stroke-linejoin: round;\n    stroke-linecap: round;\n  }\n  .", " {\n    fill-opacity: 0.24;\n  }\n  .", ",\n    .", ",\n    .", " {\n    stroke: rgba(149, 149, 149, 0.24);\n  }\n  .", ",\n    .", " {\n    transition: opacity linear 200ms;\n    pointer-events: none;\n    stroke-width: 1px;\n  }\n  .", " {\n    stroke: #fff;\n    stroke-width: 2px;\n  }\n  .", " {\n    shape-rendering: crispEdges;\n  }\n  .", " {\n    fill: none;\n    pointer-events: all;\n  }\n"]);
-
-  _templateObject$8 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$8, _templateObject2$2;
 const lineChartClassNames = {
   lineChartYScaleGlobal: 'lineChartYScaleGlobal',
   lineChartXScaleGlobal: 'lineChartXScaleGlobal',
@@ -1611,8 +1350,8 @@ const lineChartClassNames = {
   lineChartMouseLabelContainer: 'lineChartMouseLabelContainer',
   lineChartMouseLabel: 'lineChartMouseLabel'
 };
-const SvgWrapper$3 = /*#__PURE__*/styled__default(Wrapper)( /*#__PURE__*/_templateObject$8(), lineChartClassNames.lineChartYScaleGlobal, lineChartClassNames.lineChartXScaleGlobal, lineChartClassNames.lineChartGridGlobal, lineChartClassNames.lineChartLinesGlobal, lineChartClassNames.lineChartArea, lineChartClassNames.lineChartGridLineX, lineChartClassNames.lineChartGridLineY, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseCircle, lineChartClassNames.lineChartDot, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseRect);
-const TooltipStyles = /*#__PURE__*/styled.createGlobalStyle( /*#__PURE__*/_templateObject2$2(), lineChartClassNames.lineChartMouseLabel, lineChartClassNames.lineChartLabelFlex, lineChartClassNames.lineChartLabel);
+const SvgWrapper$3 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", ",\n    .", ",\n    .", " {\n    shape-rendering: crispEdges;\n  }\n  .", " {\n    fill: none;\n    stroke: steelblue;\n    stroke-width: 1.5px;\n    stroke-linejoin: round;\n    stroke-linecap: round;\n  }\n  .", " {\n    fill-opacity: 0.24;\n  }\n  .", ",\n    .", ",\n    .", " {\n    stroke: rgba(149, 149, 149, 0.24);\n  }\n  .", ",\n    .", " {\n    transition: opacity linear 200ms;\n    pointer-events: none;\n    stroke-width: 1px;\n  }\n  .", " {\n    stroke: #fff;\n    stroke-width: 2px;\n  }\n  .", " {\n    shape-rendering: crispEdges;\n  }\n  .", " {\n    fill: none;\n    pointer-events: all;\n  }\n"])), lineChartClassNames.lineChartYScaleGlobal, lineChartClassNames.lineChartXScaleGlobal, lineChartClassNames.lineChartGridGlobal, lineChartClassNames.lineChartLinesGlobal, lineChartClassNames.lineChartArea, lineChartClassNames.lineChartGridLineX, lineChartClassNames.lineChartGridLineY, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseCircle, lineChartClassNames.lineChartDot, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseRect);
+const TooltipStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", " {\n    transition: opacity linear 200ms;\n    z-index: 1;\n    .", " {\n      justify-content: flex-start;\n      align-items: center;\n      pointer-events: none;\n    }\n    .", " {\n      margin: 0 0 0 10px;\n    }\n  }\n"])), lineChartClassNames.lineChartMouseLabel, lineChartClassNames.lineChartLabelFlex, lineChartClassNames.lineChartLabel);
 
 const drawGrid = (_ref) => {
   let {
@@ -1639,27 +1378,9 @@ const drawGrid = (_ref) => {
   }
 };
 
-function _templateObject2$3() {
-  const data = _taggedTemplateLiteralLoose(["\n  margin-bottom: 4px;\n"]);
-
-  _templateObject2$3 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$9() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  font-size: 12px;\n  white-space: nowrap;\n"]);
-
-  _templateObject$9 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const LabelContainer$1 = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject$9());
-const Label$2 = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject2$3());
+var _templateObject$9, _templateObject2$3;
+const LabelContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  font-size: 12px;\n  white-space: nowrap;\n"])));
+const Label$2 = /*#__PURE__*/styled__default.div(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 4px;\n"])));
 
 const labelClassName$1 = 'd3-chart-label';
 const drawLabel = (_ref) => {
@@ -1690,6 +1411,7 @@ const drawLabel = (_ref) => {
   });
 };
 
+const _excluded$1 = ["values"];
 const drawTooltip$1 = (_ref) => {
   let {
     svg,
@@ -1806,7 +1528,7 @@ const drawTooltip$1 = (_ref) => {
       let {
         values
       } = _ref7,
-          rest = _objectWithoutPropertiesLoose(_ref7, ["values"]);
+          rest = _objectWithoutPropertiesLoose(_ref7, _excluded$1);
 
       return _extends({}, rest, {
         value: getValue(values),
@@ -2177,7 +1899,7 @@ const drawLines = (_ref) => {
   let linesSelection = null;
   let areasSelection = null;
   let area = null;
-  const line = d3.line().defined(d => d !== null).x((_, index) => xScale(index.toString()) + bandwidth / 2) // @ts-ignore
+  const line = d3.line().defined(d => d !== null).x((_, index) => xScale(index) + bandwidth / 2) // @ts-ignore
   .y(d => yScale(d)).curve(curve || d3.curveLinear);
   const bandwidth = xScale.bandwidth();
   const linesData = lineData.filter((_ref2) => {
@@ -2209,7 +1931,7 @@ const drawLines = (_ref) => {
 
   if (areasData.length > 0) {
     let dataIndex = -2;
-    area = d3.area().x((_, index) => xScale(index.toString()) + bandwidth / 2).y0((_, index) => {
+    area = d3.area().x((_, index) => xScale(index) + bandwidth / 2).y0((_, index) => {
       if (index === 0) {
         dataIndex = dataIndex + 1;
       }
@@ -2232,25 +1954,7 @@ const drawLines = (_ref) => {
   };
 };
 
-function _templateObject2$4() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", " {\n    z-index: 1;\n    transition: all linear 144ms;\n\n    .", " {\n      margin-bottom: 4px;\n      :last-of-type {\n        margin-bottom: 0;\n      }\n    }\n  }\n"]);
-
-  _templateObject2$4 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$a() {
-  const data = _taggedTemplateLiteralLoose(["\n  line {\n    stroke-width: 1px;\n    shape-rendering: crispEdges;\n  }\n  .", ",\n    .", " {\n    stroke: rgba(48, 69, 79, 0.06);\n  }\n  .", " {\n  }\n  .", " {\n    fill: none;\n    pointer-events: all;\n  }\n  .", " {\n    stroke-width: 1.5px;\n    stroke-linejoin: round;\n    stroke-linecap: round;\n  }\n  .", " {\n    shape-rendering: auto;\n  }\n  .", " {\n    fill-opacity: 0.24;\n  }\n"]);
-
-  _templateObject$a = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$a, _templateObject2$4;
 const tooltipClassnames = {
   barChartMouseRect: 'barChartMouseRect',
   barChartMouseContainer: 'barChartMouseContainer',
@@ -2282,8 +1986,8 @@ const barChartClassNames = /*#__PURE__*/_extends({
   barChartGridLineYZero: 'barChartGridLineYZero',
   barChartGridLineY: 'barChartGridLineY'
 }, tooltipClassnames, labelClassnames, barChartLinesClassNames);
-const SvgWrapper$4 = /*#__PURE__*/styled__default(Wrapper)( /*#__PURE__*/_templateObject$a(), barChartClassNames.barChartGridLineX, barChartClassNames.barChartGridLineY, barChartClassNames.barChartMouseRect, barChartClassNames.barChartMouseRect, barChartClassNames.barChartLinesGlobal, barChartClassNames.barChartLine, barChartClassNames.barChartArea);
-const TooltipStyles$1 = /*#__PURE__*/styled.createGlobalStyle( /*#__PURE__*/_templateObject2$4(), barChartClassNames.barChartMouseTooltip, barChartClassNames.barChartTooltipItem);
+const SvgWrapper$4 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$a || (_templateObject$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  line {\n    stroke-width: 1px;\n    shape-rendering: crispEdges;\n  }\n  .", ",\n    .", " {\n    stroke: rgba(48, 69, 79, 0.06);\n  }\n  .", " {\n  }\n  .", " {\n    fill: none;\n    pointer-events: all;\n  }\n  .", " {\n    stroke-width: 1.5px;\n    stroke-linejoin: round;\n    stroke-linecap: round;\n  }\n  .", " {\n    shape-rendering: auto;\n  }\n  .", " {\n    fill-opacity: 0.24;\n  }\n"])), barChartClassNames.barChartGridLineX, barChartClassNames.barChartGridLineY, barChartClassNames.barChartMouseRect, barChartClassNames.barChartMouseRect, barChartClassNames.barChartLinesGlobal, barChartClassNames.barChartLine, barChartClassNames.barChartArea);
+const TooltipStyles$1 = /*#__PURE__*/styled.createGlobalStyle(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", " {\n    z-index: 1;\n    transition: all linear 144ms;\n\n    .", " {\n      margin-bottom: 4px;\n      :last-of-type {\n        margin-bottom: 0;\n      }\n    }\n  }\n"])), barChartClassNames.barChartMouseTooltip, barChartClassNames.barChartTooltipItem);
 
 const drawGrid$1 = (_ref) => {
   let {
@@ -2313,6 +2017,7 @@ const drawGrid$1 = (_ref) => {
   }
 };
 
+const _excluded$2 = ["groupName"];
 const getDomain = (_ref) => {
   let {
     data,
@@ -2322,7 +2027,7 @@ const getDomain = (_ref) => {
   let MIN = Number.POSITIVE_INFINITY;
   let MAX = Number.NEGATIVE_INFINITY;
   data.forEach((_ref2) => {
-    let groups = _objectWithoutPropertiesLoose(_ref2, ["groupName"]);
+    let groups = _objectWithoutPropertiesLoose(_ref2, _excluded$2);
 
     let groupMax = 0;
     let groupMin = 0;
@@ -2359,6 +2064,7 @@ const getDomain = (_ref) => {
   };
 };
 
+const _excluded$3 = ["groupName"];
 const marshaling = (_ref) => {
   let {
     data,
@@ -2373,7 +2079,7 @@ const marshaling = (_ref) => {
     let {
       groupName
     } = _ref2,
-        groups = _objectWithoutPropertiesLoose(_ref2, ["groupName"]);
+        groups = _objectWithoutPropertiesLoose(_ref2, _excluded$3);
 
     const marshalledGroup = [];
     const hundred = 100;
@@ -2444,6 +2150,7 @@ const getLabel = labelPosition => {
   }
 };
 
+const _excluded$4 = ["values"];
 const drawTooltip$2 = (_ref) => {
   let {
     svg,
@@ -2566,7 +2273,7 @@ const drawTooltip$2 = (_ref) => {
       }
 
       const top = (typeof tooltipY === 'number' ? tooltipY : topYDomain[currIndex] - y2) + offsetY;
-      const left = (tooltipBind ? (xScale(currIndex.toString()) || 0) + bandwidth / 2 : x) + offsetX;
+      const left = (tooltipBind ? (xScale(currIndex) || 0) + bandwidth / 2 : x) + offsetX;
 
       if (tooltipBind && flagCurrIndex === currIndex) {
         return;
@@ -2583,7 +2290,7 @@ const drawTooltip$2 = (_ref) => {
           let {
             values
           } = _ref4,
-              rest = _objectWithoutPropertiesLoose(_ref4, ["values"]);
+              rest = _objectWithoutPropertiesLoose(_ref4, _excluded$4);
 
           return _extends({}, rest, {
             value: values[currIndex],
@@ -2717,7 +2424,7 @@ const drawTooltip$2 = (_ref) => {
         groupIndex: index
       };
     }))) : marshalledData;
-    const groups = labelContainer.selectAll('div').data(concatedData).enter().append('div').style('position', 'absolute').style('transform', (_, index) => "translate(" + Math.round(xScale(index.toString())) + "px," + -(marginTop || 0) + "px)");
+    const groups = labelContainer.selectAll('div').data(concatedData).enter().append('div').style('position', 'absolute').style('transform', (_, index) => "translate(" + Math.round(xScale(index)) + "px," + -(marginTop || 0) + "px)");
     const LabelFlexStyled = labelPosition === 'center' ? LabelFlexCenter : LabelFlex;
     const LabelStyle = getLabel(labelPosition);
     groups.selectAll('span').data(item => onLabelItem ? onLabelItem(item) : item).join('div').style('left', item => Math.round(item.x + barWidth / 2) + "px").style('top', item => getLabelY(labelPosition, y2, item) + "px").style('position', 'absolute').html(item => ReactDOMServer.renderToString(React__default.createElement(LabelFlexStyled, {
@@ -2730,6 +2437,7 @@ const drawTooltip$2 = (_ref) => {
   }
 };
 
+const _excluded$5 = ["groupName"];
 const resizeBarWidth = (_ref) => {
   let {
     data,
@@ -2741,7 +2449,7 @@ const resizeBarWidth = (_ref) => {
   const groupPadding = typeof sectionPadding === 'number' ? sectionPadding : 0;
   const chartWidth = range[1] - range[0];
   const barsWidth = data.reduce((acc, _ref2) => {
-    let curr = _objectWithoutPropertiesLoose(_ref2, ["groupName"]);
+    let curr = _objectWithoutPropertiesLoose(_ref2, _excluded$5);
 
     return acc + Object.keys(curr).reduce((acc, _key, index) => index > 0 ? acc + (barWidth || 0) + (barPadding || 0) : acc + barWidth, 0) + groupPadding;
   }, groupPadding);
@@ -2904,7 +2612,7 @@ const draw$4 = (node, props) => {
     });
     xAxis.attr('transform', "translate(0, " + (yScale(yTicks[0]) + (xAxisPadding || 0)) + ")");
     const gSvg = svg.append('g').attr('class', barChartClassNames.barChartBarGlobal);
-    const groups = gSvg.selectAll('g').data(marshalledData).enter().append('g').attr('transform', (_, i) => "translate(" + Math.round(xScale(i.toString())) + "," + -(marginTop || 0) + ")");
+    const groups = gSvg.selectAll('g').data(marshalledData).enter().append('g').attr('transform', (_, i) => "translate(" + Math.round(xScale(i)) + "," + -(marginTop || 0) + ")");
     const bars = drawBars ? drawBars({
       groups,
       yScale,
@@ -3015,6 +2723,7 @@ BarChart.defaultProps = {
   sectionPadding: 1
 };
 
+const _excluded$6 = ["value"];
 const hundred = 100;
 const useMarshaling = (_ref) => {
   let {
@@ -3047,7 +2756,7 @@ const useMarshaling = (_ref) => {
           let {
             value
           } = _ref4,
-              rest = _objectWithoutPropertiesLoose(_ref4, ["value"]);
+              rest = _objectWithoutPropertiesLoose(_ref4, _excluded$6);
 
           return _extends({}, rest, {
             value,
@@ -3060,85 +2769,7 @@ const useMarshaling = (_ref) => {
   }, [data, fullExtent, maxValue, labels]);
 };
 
-function _templateObject8$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  display: flex;\n  justify-content: flex-start;\n  height: 100%;\n"]);
-
-  _templateObject8$1 = function _templateObject8() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject7$1() {
-  const data = _taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(0, -50%);\n"]);
-
-  _templateObject7$1 = function _templateObject7() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject6$2() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n"]);
-
-  _templateObject6$2 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5$2() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  will-change: left, top;\n"]);
-
-  _templateObject5$2 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4$2() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  position: relative;\n  vertical-align: middle;\n"]);
-
-  _templateObject4$2 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3$2() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  height: 1rem;\n"]);
-
-  _templateObject3$2 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2$5() {
-  const data = _taggedTemplateLiteralLoose(["\n  text-align: right;\n"]);
-
-  _templateObject2$5 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$b() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 100%;\n"]);
-
-  _templateObject$b = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$b, _templateObject2$5, _templateObject3$2, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$1, _templateObject8$1;
 const horizontalBarChartClassNames = {
   horizontalBarChartButtonTd: 'horizontalBarChartButtonTd',
   horizontalBarChartLabelTd: 'horizontalBarChartLabelTd',
@@ -3161,14 +2792,14 @@ const horizontalBarChartClassNames = {
   horizontalBarChartTooltipName: 'horizontalBarChartTooltipName',
   horizontalBarChartTooltipValue: 'horizontalBarChartTooltipValue'
 };
-const Table = /*#__PURE__*/styled__default.table( /*#__PURE__*/_templateObject$b());
-const LabelCell = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject2$5());
-const BarFlex = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject3$2());
-const BarsTd = /*#__PURE__*/styled__default.td( /*#__PURE__*/_templateObject4$2());
-const TooltipFlex$1 = /*#__PURE__*/styled__default(TooltipFlex)( /*#__PURE__*/_templateObject5$2());
-const StackSumContainer = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject6$2());
-const StackSum = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject7$1());
-const StackWrapper = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject8$1());
+const Table = /*#__PURE__*/styled__default.table(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
+const LabelCell = /*#__PURE__*/styled__default.div(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: right;\n"])));
+const BarFlex = /*#__PURE__*/styled__default.div(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  height: 1rem;\n"])));
+const BarsTd = /*#__PURE__*/styled__default.td(_templateObject4$2 || (_templateObject4$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  position: relative;\n  vertical-align: middle;\n"])));
+const TooltipFlex$1 = /*#__PURE__*/styled__default(TooltipFlex)(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  will-change: left, top;\n"])));
+const StackSumContainer = /*#__PURE__*/styled__default.div(_templateObject6$2 || (_templateObject6$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
+const StackSum = /*#__PURE__*/styled__default.div(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(0, -50%);\n"])));
+const StackWrapper = /*#__PURE__*/styled__default.div(_templateObject8$1 || (_templateObject8$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  display: flex;\n  justify-content: flex-start;\n  height: 100%;\n"])));
 
 const Tooltip = (_ref) => {
   let {
@@ -3258,6 +2889,7 @@ const useTooltip = (_ref) => {
   return [onMouseMove, onMouseLeave];
 };
 
+const _excluded$7 = ["item", "mouseMove", "mouseLeave", "tooltipBind"];
 const useStackWrapper = stackedTooltip => {
   return React.useMemo(() => stackedTooltip ? (_ref) => {
     let {
@@ -3266,7 +2898,7 @@ const useStackWrapper = stackedTooltip => {
       mouseLeave,
       tooltipBind
     } = _ref,
-        props = _objectWithoutPropertiesLoose(_ref, ["item", "mouseMove", "mouseLeave", "tooltipBind"]);
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
 
     return React__default.createElement(StackWrapper, Object.assign({
       className: horizontalBarChartClassNames.horizontalBarChartStackWrapper,
@@ -3282,16 +2914,8 @@ const useStackWrapper = stackedTooltip => {
   }, [stackedTooltip]);
 };
 
-function _templateObject$c() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n  display: inline-flex;\n  height: 100%;\n"]);
-
-  _templateObject$c = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const BarStyled = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject$c());
+var _templateObject$c;
+const BarStyled = /*#__PURE__*/styled__default.div(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  display: inline-flex;\n  height: 100%;\n"])));
 
 const Bar = (_ref) => {
   let {
@@ -3344,38 +2968,10 @@ const useScale = (_ref) => {
   }, [maxValue, scaleTicks, scaleDomain]);
 };
 
-function _templateObject3$3() {
-  const data = _taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  width: 0;\n  height: 0;\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"]);
-
-  _templateObject3$3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2$6() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n  height: 1rem;\n"]);
-
-  _templateObject2$6 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$d() {
-  const data = _taggedTemplateLiteralLoose(["\n  position: relative;\n"]);
-
-  _templateObject$d = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const TickTd = /*#__PURE__*/styled__default.td( /*#__PURE__*/_templateObject$d());
-const Ticks = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject2$6());
-const Tick = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject3$3());
+var _templateObject$d, _templateObject2$6, _templateObject3$3;
+const TickTd = /*#__PURE__*/styled__default.td(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
+const Ticks = /*#__PURE__*/styled__default.div(_templateObject2$6 || (_templateObject2$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  height: 1rem;\n"])));
+const Tick = /*#__PURE__*/styled__default.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  width: 0;\n  height: 0;\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])));
 
 const XScale = (_ref) => {
   let {
@@ -3532,25 +3128,7 @@ HorizontalBarChart.defaultProps = {
   withoutXScale: false
 };
 
-function _templateObject2$7() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", " {\n    position: absolute;\n    transition: opacity 150ms cubic-bezier(0.2, 1, 0.6, 1);\n    pointer-events: none;\n    z-index: 1;\n  }\n"]);
-
-  _templateObject2$7 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject$e() {
-  const data = _taggedTemplateLiteralLoose(["\n  .", ",\n    .", ",\n    .", " {\n    shape-rendering: crispEdges;\n  }\n\n  .", ",\n    .", " {\n    stroke: rgba(149, 149, 149, 0.24);\n  }\n\n  .", " {\n    font-size: 10px;\n  }\n"]);
-
-  _templateObject$e = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject$e, _templateObject2$7;
 const bubbleChartClassNames = {
   bubbleChartYAxis: 'bubbleChartYAxis',
   bubbleChartYAxisZeroTick: 'bubbleChartYAxisZeroTick',
@@ -3565,8 +3143,8 @@ const bubbleChartClassNames = {
   bubbleChartTooltipFlex: 'bubbleChartTooltipFlex',
   bubbleChartTip: 'bubbleChartTip'
 };
-const SvgWrapper$5 = /*#__PURE__*/styled__default(Wrapper)( /*#__PURE__*/_templateObject$e(), bubbleChartClassNames.bubbleChartYAxis, bubbleChartClassNames.bubbleChartXAxis, bubbleChartClassNames.bubbleChartGridGlobal, bubbleChartClassNames.bubbleChartGridLineX, bubbleChartClassNames.bubbleChartGridLineY, bubbleChartClassNames.bubbleChartYScaleLabel);
-const TooltipStyles$2 = /*#__PURE__*/styled.createGlobalStyle( /*#__PURE__*/_templateObject2$7(), bubbleChartClassNames.bubbleChartTooltipContainer);
+const SvgWrapper$5 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", ",\n    .", ",\n    .", " {\n    shape-rendering: crispEdges;\n  }\n\n  .", ",\n    .", " {\n    stroke: rgba(149, 149, 149, 0.24);\n  }\n\n  .", " {\n    font-size: 10px;\n  }\n"])), bubbleChartClassNames.bubbleChartYAxis, bubbleChartClassNames.bubbleChartXAxis, bubbleChartClassNames.bubbleChartGridGlobal, bubbleChartClassNames.bubbleChartGridLineX, bubbleChartClassNames.bubbleChartGridLineY, bubbleChartClassNames.bubbleChartYScaleLabel);
+const TooltipStyles$2 = /*#__PURE__*/styled.createGlobalStyle(_templateObject2$7 || (_templateObject2$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .", " {\n    position: absolute;\n    transition: opacity 150ms cubic-bezier(0.2, 1, 0.6, 1);\n    pointer-events: none;\n    z-index: 1;\n  }\n"])), bubbleChartClassNames.bubbleChartTooltipContainer);
 
 const drawGrid$2 = (_ref) => {
   let {
@@ -3591,16 +3169,8 @@ const drawGrid$2 = (_ref) => {
   }
 };
 
-function _templateObject$f() {
-  const data = _taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  font-size: 12px;\n  white-space: nowrap;\n"]);
-
-  _templateObject$f = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-const Tooltip$1 = /*#__PURE__*/styled__default.div( /*#__PURE__*/_templateObject$f());
+var _templateObject$f;
+const Tooltip$1 = /*#__PURE__*/styled__default.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 0;\n  height: 0;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  font-size: 12px;\n  white-space: nowrap;\n"])));
 
 const drawTooltip$3 = (_ref) => {
   let {