impaktapps-design 0.0.1 → 0.1.0

package/dist/impaktapps-design.es.js

@@ -8500,796 +8500,138 @@ var esm$3 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty(
   toString,
   scaleCanBeZeroed
 }, Symbol.toStringTag, { value: "Module" }));
-var _excluded$w = ["tooltipOpen"];
-function _objectWithoutPropertiesLoose$w(source, excluded) {
-  if (source == null)
-    return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i2;
-  for (i2 = 0; i2 < sourceKeys.length; i2++) {
-    key = sourceKeys[i2];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-function _extends$M() {
-  _extends$M = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
+var balancedMatch$1 = balanced$3;
+function balanced$3(a2, b10, str) {
+  if (a2 instanceof RegExp)
+    a2 = maybeMatch$1(a2, str);
+  if (b10 instanceof RegExp)
+    b10 = maybeMatch$1(b10, str);
+  var r2 = range$4(a2, b10, str);
+  return r2 && {
+    start: r2[0],
+    end: r2[1],
+    pre: str.slice(0, r2[0]),
+    body: str.slice(r2[0] + a2.length, r2[1]),
+    post: str.slice(r2[1] + b10.length)
   };
-  return _extends$M.apply(this, arguments);
 }
-function useTooltip(initialTooltipState) {
-  var _useState = useState(_extends$M({
-    tooltipOpen: false
-  }, initialTooltipState)), tooltipState = _useState[0], setTooltipState = _useState[1];
-  var showTooltip = useCallback(function(showArgs) {
-    return setTooltipState(typeof showArgs === "function" ? function(_ref) {
-      _ref.tooltipOpen;
-      var show = _objectWithoutPropertiesLoose$w(_ref, _excluded$w);
-      return _extends$M({}, showArgs(show), {
-        tooltipOpen: true
-      });
-    } : {
-      tooltipOpen: true,
-      tooltipLeft: showArgs.tooltipLeft,
-      tooltipTop: showArgs.tooltipTop,
-      tooltipData: showArgs.tooltipData
-    });
-  }, [setTooltipState]);
-  var hideTooltip = useCallback(function() {
-    return setTooltipState({
-      tooltipOpen: false,
-      tooltipLeft: void 0,
-      tooltipTop: void 0,
-      tooltipData: void 0
-    });
-  }, [setTooltipState]);
-  return {
-    tooltipOpen: tooltipState.tooltipOpen,
-    tooltipLeft: tooltipState.tooltipLeft,
-    tooltipTop: tooltipState.tooltipTop,
-    tooltipData: tooltipState.tooltipData,
-    updateTooltip: setTooltipState,
-    showTooltip,
-    hideTooltip
-  };
+function maybeMatch$1(reg, str) {
+  var m2 = str.match(reg);
+  return m2 ? m2[0] : null;
 }
-function _extends$L() {
-  _extends$L = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
+balanced$3.range = range$4;
+function range$4(a2, b10, str) {
+  var begs, beg, left2, right2, result;
+  var ai = str.indexOf(a2);
+  var bi = str.indexOf(b10, ai + 1);
+  var i2 = ai;
+  if (ai >= 0 && bi > 0) {
+    begs = [];
+    left2 = str.length;
+    while (i2 >= 0 && !result) {
+      if (i2 == ai) {
+        begs.push(i2);
+        ai = str.indexOf(a2, i2 + 1);
+      } else if (begs.length == 1) {
+        result = [begs.pop(), bi];
+      } else {
+        beg = begs.pop();
+        if (beg < left2) {
+          left2 = beg;
+          right2 = bi;
         }
+        bi = str.indexOf(b10, i2 + 1);
       }
+      i2 = ai < bi && ai >= 0 ? ai : bi;
+    }
+    if (begs.length) {
+      result = [left2, right2];
     }
-    return target;
-  };
-  return _extends$L.apply(this, arguments);
-}
-function withTooltip(BaseComponent, containerProps, renderContainer) {
-  if (containerProps === void 0) {
-    containerProps = {
-      style: {
-        position: "relative",
-        width: "inherit",
-        height: "inherit"
-      }
-    };
-  }
-  if (renderContainer === void 0) {
-    renderContainer = function renderContainer2(children2, props) {
-      return /* @__PURE__ */ React__default.createElement("div", props, children2);
-    };
   }
-  var WrappedComponent = function WrappedComponent2(props) {
-    var tooltipProps = useTooltip();
-    return renderContainer(/* @__PURE__ */ React__default.createElement(BaseComponent, _extends$L({}, tooltipProps, props)), containerProps);
+  return result;
+}
+var balancedMatch = balanced$2;
+function balanced$2(a2, b10, str) {
+  if (a2 instanceof RegExp)
+    a2 = maybeMatch(a2, str);
+  if (b10 instanceof RegExp)
+    b10 = maybeMatch(b10, str);
+  var r2 = range$3(a2, b10, str);
+  return r2 && {
+    start: r2[0],
+    end: r2[1],
+    pre: str.slice(0, r2[0]),
+    body: str.slice(r2[0] + a2.length, r2[1]),
+    post: str.slice(r2[1] + b10.length)
   };
-  return WrappedComponent;
 }
-function debounce$2(func, wait, immediate) {
-  var timeout2, args, context, timestamp, result;
-  if (null == wait)
-    wait = 100;
-  function later() {
-    var last2 = Date.now() - timestamp;
-    if (last2 < wait && last2 >= 0) {
-      timeout2 = setTimeout(later, wait - last2);
-    } else {
-      timeout2 = null;
-      if (!immediate) {
-        result = func.apply(context, args);
-        context = args = null;
+function maybeMatch(reg, str) {
+  var m2 = str.match(reg);
+  return m2 ? m2[0] : null;
+}
+balanced$2.range = range$3;
+function range$3(a2, b10, str) {
+  var begs, beg, left2, right2, result;
+  var ai = str.indexOf(a2);
+  var bi = str.indexOf(b10, ai + 1);
+  var i2 = ai;
+  if (ai >= 0 && bi > 0) {
+    if (a2 === b10) {
+      return [ai, bi];
+    }
+    begs = [];
+    left2 = str.length;
+    while (i2 >= 0 && !result) {
+      if (i2 == ai) {
+        begs.push(i2);
+        ai = str.indexOf(a2, i2 + 1);
+      } else if (begs.length == 1) {
+        result = [begs.pop(), bi];
+      } else {
+        beg = begs.pop();
+        if (beg < left2) {
+          left2 = beg;
+          right2 = bi;
+        }
+        bi = str.indexOf(b10, i2 + 1);
       }
+      i2 = ai < bi && ai >= 0 ? ai : bi;
+    }
+    if (begs.length) {
+      result = [left2, right2];
     }
   }
-  var debounced = function() {
-    context = this;
-    args = arguments;
-    timestamp = Date.now();
-    var callNow = immediate && !timeout2;
-    if (!timeout2)
-      timeout2 = setTimeout(later, wait);
-    if (callNow) {
-      result = func.apply(context, args);
-      context = args = null;
+  return result;
+}
+var balanced$1 = balancedMatch;
+var reduceFunctionCall_1 = reduceFunctionCall$1;
+function reduceFunctionCall$1(string2, functionRE, callback) {
+  var call = string2;
+  return getFunctionCalls(string2, functionRE).reduce(function(string3, obj) {
+    return string3.replace(obj.functionIdentifier + "(" + obj.matches.body + ")", evalFunctionCall(obj.matches.body, obj.functionIdentifier, callback, call, functionRE));
+  }, string2);
+}
+function getFunctionCalls(call, functionRE) {
+  var expressions = [];
+  var fnRE = typeof functionRE === "string" ? new RegExp("\\b(" + functionRE + ")\\(") : functionRE;
+  do {
+    var searchMatch = fnRE.exec(call);
+    if (!searchMatch) {
+      return expressions;
     }
-    return result;
-  };
-  debounced.clear = function() {
-    if (timeout2) {
-      clearTimeout(timeout2);
-      timeout2 = null;
+    if (searchMatch[1] === void 0) {
+      throw new Error("Missing the first couple of parenthesis to get the function identifier in " + functionRE);
     }
-  };
-  debounced.flush = function() {
-    if (timeout2) {
-      result = func.apply(context, args);
-      context = args = null;
-      clearTimeout(timeout2);
-      timeout2 = null;
+    var fn = searchMatch[1];
+    var startIndex = searchMatch.index;
+    var matches = balanced$1("(", ")", call.substring(startIndex));
+    if (!matches || matches.start !== searchMatch[0].length - 1) {
+      throw new SyntaxError(fn + "(): missing closing ')' in the value '" + call + "'");
     }
-  };
-  return debounced;
-}
-debounce$2.debounce = debounce$2;
-var debounce_1$1 = debounce$2;
-function useMeasure(_temp) {
-  let {
-    debounce: debounce2,
-    scroll,
-    polyfill,
-    offsetSize
-  } = _temp === void 0 ? {
-    debounce: 0,
-    scroll: false,
-    offsetSize: false
-  } : _temp;
-  const ResizeObserver2 = polyfill || (typeof window === "undefined" ? class ResizeObserver {
-  } : window.ResizeObserver);
-  if (!ResizeObserver2) {
-    throw new Error("This browser does not support ResizeObserver out of the box. See: https://github.com/react-spring/react-use-measure/#resize-observer-polyfills");
-  }
-  const [bounds2, set2] = useState({
-    left: 0,
-    top: 0,
-    width: 0,
-    height: 0,
-    bottom: 0,
-    right: 0,
-    x: 0,
-    y: 0
-  });
-  const state = useRef({
-    element: null,
-    scrollContainers: null,
-    resizeObserver: null,
-    lastBounds: bounds2
-  });
-  const scrollDebounce = debounce2 ? typeof debounce2 === "number" ? debounce2 : debounce2.scroll : null;
-  const resizeDebounce = debounce2 ? typeof debounce2 === "number" ? debounce2 : debounce2.resize : null;
-  const mounted = useRef(false);
-  useEffect(() => {
-    mounted.current = true;
-    return () => void (mounted.current = false);
-  });
-  const [forceRefresh, resizeChange, scrollChange] = useMemo(() => {
-    const callback = () => {
-      if (!state.current.element)
-        return;
-      const {
-        left: left2,
-        top: top2,
-        width,
-        height,
-        bottom: bottom2,
-        right: right2,
-        x: x2,
-        y: y2
-      } = state.current.element.getBoundingClientRect();
-      const size = {
-        left: left2,
-        top: top2,
-        width,
-        height,
-        bottom: bottom2,
-        right: right2,
-        x: x2,
-        y: y2
-      };
-      if (state.current.element instanceof HTMLElement && offsetSize) {
-        size.height = state.current.element.offsetHeight;
-        size.width = state.current.element.offsetWidth;
-      }
-      Object.freeze(size);
-      if (mounted.current && !areBoundsEqual(state.current.lastBounds, size))
-        set2(state.current.lastBounds = size);
-    };
-    return [callback, resizeDebounce ? debounce_1$1(callback, resizeDebounce) : callback, scrollDebounce ? debounce_1$1(callback, scrollDebounce) : callback];
-  }, [set2, offsetSize, scrollDebounce, resizeDebounce]);
-  function removeListeners() {
-    if (state.current.scrollContainers) {
-      state.current.scrollContainers.forEach((element) => element.removeEventListener("scroll", scrollChange, true));
-      state.current.scrollContainers = null;
-    }
-    if (state.current.resizeObserver) {
-      state.current.resizeObserver.disconnect();
-      state.current.resizeObserver = null;
-    }
-  }
-  function addListeners() {
-    if (!state.current.element)
-      return;
-    state.current.resizeObserver = new ResizeObserver2(scrollChange);
-    state.current.resizeObserver.observe(state.current.element);
-    if (scroll && state.current.scrollContainers) {
-      state.current.scrollContainers.forEach((scrollContainer) => scrollContainer.addEventListener("scroll", scrollChange, {
-        capture: true,
-        passive: true
-      }));
-    }
-  }
-  const ref = (node) => {
-    if (!node || node === state.current.element)
-      return;
-    removeListeners();
-    state.current.element = node;
-    state.current.scrollContainers = findScrollContainers(node);
-    addListeners();
-  };
-  useOnWindowScroll(scrollChange, Boolean(scroll));
-  useOnWindowResize(resizeChange);
-  useEffect(() => {
-    removeListeners();
-    addListeners();
-  }, [scroll, scrollChange, resizeChange]);
-  useEffect(() => removeListeners, []);
-  return [ref, bounds2, forceRefresh];
-}
-function useOnWindowResize(onWindowResize) {
-  useEffect(() => {
-    const cb = onWindowResize;
-    window.addEventListener("resize", cb);
-    return () => void window.removeEventListener("resize", cb);
-  }, [onWindowResize]);
-}
-function useOnWindowScroll(onScroll, enabled) {
-  useEffect(() => {
-    if (enabled) {
-      const cb = onScroll;
-      window.addEventListener("scroll", cb, {
-        capture: true,
-        passive: true
-      });
-      return () => void window.removeEventListener("scroll", cb, true);
-    }
-  }, [onScroll, enabled]);
-}
-function findScrollContainers(element) {
-  const result = [];
-  if (!element || element === document.body)
-    return result;
-  const {
-    overflow,
-    overflowX,
-    overflowY
-  } = window.getComputedStyle(element);
-  if ([overflow, overflowX, overflowY].some((prop) => prop === "auto" || prop === "scroll"))
-    result.push(element);
-  return [...result, ...findScrollContainers(element.parentElement)];
-}
-const keys = ["x", "y", "top", "bottom", "left", "right", "width", "height"];
-const areBoundsEqual = (a2, b10) => keys.every((key) => a2[key] === b10[key]);
-function _inheritsLoose$1(subClass, superClass) {
-  subClass.prototype = Object.create(superClass.prototype);
-  subClass.prototype.constructor = subClass;
-  _setPrototypeOf$1(subClass, superClass);
-}
-function _setPrototypeOf$1(o, p2) {
-  _setPrototypeOf$1 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p3) {
-    o2.__proto__ = p3;
-    return o2;
-  };
-  return _setPrototypeOf$1(o, p2);
-}
-var Portal = /* @__PURE__ */ function(_React$PureComponent) {
-  _inheritsLoose$1(Portal2, _React$PureComponent);
-  function Portal2() {
-    return _React$PureComponent.apply(this, arguments) || this;
-  }
-  var _proto = Portal2.prototype;
-  _proto.componentWillUnmount = function componentWillUnmount() {
-    if (this.node && document.body) {
-      document.body.removeChild(this.node);
-      delete this.node;
-    }
-  };
-  _proto.render = function render2() {
-    if (!this.node && typeof document !== "undefined") {
-      this.node = document.createElement("div");
-      if (this.props.zIndex != null)
-        this.node.style.zIndex = "" + this.props.zIndex;
-      document.body.append(this.node);
-    }
-    if (!this.node) {
-      return null;
-    }
-    return /* @__PURE__ */ ReactDOM.createPortal(this.props.children, this.node);
-  };
-  return Portal2;
-}(React__default.PureComponent);
-Portal.propTypes = {
-  zIndex: _pt.oneOfType([_pt.number, _pt.string])
-};
-var _excluded$v = ["className", "top", "left", "offsetLeft", "offsetTop", "style", "children", "unstyled", "applyPositionStyle"];
-function _extends$K() {
-  _extends$K = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$K.apply(this, arguments);
-}
-function _objectWithoutPropertiesLoose$v(source, excluded) {
-  if (source == null)
-    return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i2;
-  for (i2 = 0; i2 < sourceKeys.length; i2++) {
-    key = sourceKeys[i2];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-var defaultStyles = {
-  position: "absolute",
-  backgroundColor: "white",
-  color: "#666666",
-  padding: ".3rem .5rem",
-  borderRadius: "3px",
-  fontSize: "14px",
-  boxShadow: "0 1px 2px rgba(33,33,33,0.2)",
-  lineHeight: "1em",
-  pointerEvents: "none"
-};
-var Tooltip$1 = /* @__PURE__ */ React__default.forwardRef(function(_ref, ref) {
-  var className = _ref.className, top2 = _ref.top, left2 = _ref.left, _ref$offsetLeft = _ref.offsetLeft, offsetLeft = _ref$offsetLeft === void 0 ? 10 : _ref$offsetLeft, _ref$offsetTop = _ref.offsetTop, offsetTop = _ref$offsetTop === void 0 ? 10 : _ref$offsetTop, _ref$style = _ref.style, style2 = _ref$style === void 0 ? defaultStyles : _ref$style, children2 = _ref.children, _ref$unstyled = _ref.unstyled, unstyled = _ref$unstyled === void 0 ? false : _ref$unstyled, _ref$applyPositionSty = _ref.applyPositionStyle, applyPositionStyle = _ref$applyPositionSty === void 0 ? false : _ref$applyPositionSty, restProps = _objectWithoutPropertiesLoose$v(_ref, _excluded$v);
-  return /* @__PURE__ */ React__default.createElement("div", _extends$K({
-    ref,
-    className: cx("visx-tooltip", className),
-    style: _extends$K({
-      top: top2 == null || offsetTop == null ? top2 : top2 + offsetTop,
-      left: left2 == null || offsetLeft == null ? left2 : left2 + offsetLeft
-    }, applyPositionStyle && {
-      position: "absolute"
-    }, !unstyled && style2)
-  }, restProps), children2);
-});
-Tooltip$1.propTypes = {
-  children: _pt.node,
-  className: _pt.string,
-  left: _pt.number,
-  offsetLeft: _pt.number,
-  offsetTop: _pt.number,
-  top: _pt.number,
-  applyPositionStyle: _pt.bool,
-  unstyled: _pt.bool
-};
-Tooltip$1.displayName = "Tooltip";
-var Tooltip$2 = Tooltip$1;
-function _extends$J() {
-  _extends$J = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$J.apply(this, arguments);
-}
-function _assertThisInitialized(self2) {
-  if (self2 === void 0) {
-    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-  }
-  return self2;
-}
-function _inheritsLoose(subClass, superClass) {
-  subClass.prototype = Object.create(superClass.prototype);
-  subClass.prototype.constructor = subClass;
-  _setPrototypeOf(subClass, superClass);
-}
-function _setPrototypeOf(o, p2) {
-  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p3) {
-    o2.__proto__ = p3;
-    return o2;
-  };
-  return _setPrototypeOf(o, p2);
-}
-var emptyRect = {
-  top: 0,
-  right: 0,
-  bottom: 0,
-  left: 0,
-  width: 0,
-  height: 0
-};
-function withBoundingRects(BaseComponent) {
-  var _class;
-  return _class = /* @__PURE__ */ function(_React$PureComponent) {
-    _inheritsLoose(WrappedComponent, _React$PureComponent);
-    function WrappedComponent(props) {
-      var _this;
-      _this = _React$PureComponent.call(this, props) || this;
-      _this.state = {
-        rect: void 0,
-        parentRect: void 0
-      };
-      _this.nodeRef = /* @__PURE__ */ React__default.createRef();
-      _this.getRects = _this.getRects.bind(_assertThisInitialized(_this));
-      return _this;
-    }
-    var _proto = WrappedComponent.prototype;
-    _proto.componentDidMount = function componentDidMount() {
-      var _this$nodeRef, _this2 = this;
-      this.node = (_this$nodeRef = this.nodeRef) != null && _this$nodeRef.current ? this.nodeRef.current : ReactDOM.findDOMNode(this);
-      this.setState(function() {
-        return _this2.getRects();
-      });
-    };
-    _proto.getRects = function getRects() {
-      if (!this.node)
-        return this.state;
-      var node = this.node;
-      var parentNode = node.parentNode;
-      var rect = node.getBoundingClientRect ? node.getBoundingClientRect() : emptyRect;
-      var parentRect = parentNode != null && parentNode.getBoundingClientRect ? parentNode.getBoundingClientRect() : emptyRect;
-      return {
-        rect,
-        parentRect
-      };
-    };
-    _proto.render = function render2() {
-      return /* @__PURE__ */ React__default.createElement(BaseComponent, _extends$J({
-        nodeRef: this.nodeRef,
-        getRects: this.getRects
-      }, this.state, this.props));
-    };
-    return WrappedComponent;
-  }(React__default.PureComponent), _class.displayName = "withBoundingRects(" + (BaseComponent.displayName || "") + ")", _class;
-}
-var TooltipPositionContext = /* @__PURE__ */ createContext({
-  isFlippedVertically: false,
-  isFlippedHorizontally: false
-});
-var TooltipPositionProvider = TooltipPositionContext.Provider;
-TooltipPositionContext.Consumer;
-var _excluded$u = ["children", "getRects", "left", "offsetLeft", "offsetTop", "parentRect", "rect", "style", "top", "unstyled", "nodeRef"];
-function _extends$I() {
-  _extends$I = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$I.apply(this, arguments);
-}
-function _objectWithoutPropertiesLoose$u(source, excluded) {
-  if (source == null)
-    return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i2;
-  for (i2 = 0; i2 < sourceKeys.length; i2++) {
-    key = sourceKeys[i2];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-function TooltipWithBounds(_ref) {
-  var children2 = _ref.children;
-  _ref.getRects;
-  var _ref$left = _ref.left, initialLeft = _ref$left === void 0 ? 0 : _ref$left, _ref$offsetLeft = _ref.offsetLeft, offsetLeft = _ref$offsetLeft === void 0 ? 10 : _ref$offsetLeft, _ref$offsetTop = _ref.offsetTop, offsetTop = _ref$offsetTop === void 0 ? 10 : _ref$offsetTop, parentBounds = _ref.parentRect, ownBounds = _ref.rect, _ref$style = _ref.style, style2 = _ref$style === void 0 ? defaultStyles : _ref$style, _ref$top = _ref.top, initialTop = _ref$top === void 0 ? 0 : _ref$top, _ref$unstyled = _ref.unstyled, unstyled = _ref$unstyled === void 0 ? false : _ref$unstyled, nodeRef = _ref.nodeRef, otherProps = _objectWithoutPropertiesLoose$u(_ref, _excluded$u);
-  var transform2;
-  var placeTooltipLeft = false;
-  var placeTooltipUp = false;
-  if (ownBounds && parentBounds) {
-    var left2 = initialLeft;
-    var top2 = initialTop;
-    if (parentBounds.width) {
-      var rightPlacementClippedPx = left2 + offsetLeft + ownBounds.width - parentBounds.width;
-      var leftPlacementClippedPx = ownBounds.width - left2 - offsetLeft;
-      placeTooltipLeft = rightPlacementClippedPx > 0 && rightPlacementClippedPx > leftPlacementClippedPx;
-    } else {
-      var _rightPlacementClippedPx = left2 + offsetLeft + ownBounds.width - window.innerWidth;
-      var _leftPlacementClippedPx = ownBounds.width - left2 - offsetLeft;
-      placeTooltipLeft = _rightPlacementClippedPx > 0 && _rightPlacementClippedPx > _leftPlacementClippedPx;
-    }
-    if (parentBounds.height) {
-      var bottomPlacementClippedPx = top2 + offsetTop + ownBounds.height - parentBounds.height;
-      var topPlacementClippedPx = ownBounds.height - top2 - offsetTop;
-      placeTooltipUp = bottomPlacementClippedPx > 0 && bottomPlacementClippedPx > topPlacementClippedPx;
-    } else {
-      placeTooltipUp = top2 + offsetTop + ownBounds.height > window.innerHeight;
-    }
-    left2 = placeTooltipLeft ? left2 - ownBounds.width - offsetLeft : left2 + offsetLeft;
-    top2 = placeTooltipUp ? top2 - ownBounds.height - offsetTop : top2 + offsetTop;
-    left2 = Math.round(left2);
-    top2 = Math.round(top2);
-    transform2 = "translate(" + left2 + "px, " + top2 + "px)";
-  }
-  return /* @__PURE__ */ React__default.createElement(Tooltip$2, _extends$I({
-    ref: nodeRef,
-    style: _extends$I({
-      left: 0,
-      top: 0,
-      transform: transform2
-    }, !unstyled && style2)
-  }, otherProps), /* @__PURE__ */ React__default.createElement(TooltipPositionProvider, {
-    value: {
-      isFlippedVertically: !placeTooltipUp,
-      isFlippedHorizontally: !placeTooltipLeft
-    }
-  }, children2));
-}
-TooltipWithBounds.propTypes = {
-  nodeRef: _pt.oneOfType([_pt.string, _pt.func, _pt.object])
-};
-var TooltipWithBounds$1 = withBoundingRects(TooltipWithBounds);
-var _excluded$t = ["detectBounds", "zIndex"], _excluded2$1 = ["left", "top", "detectBounds", "zIndex"];
-function _objectWithoutPropertiesLoose$t(source, excluded) {
-  if (source == null)
-    return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i2;
-  for (i2 = 0; i2 < sourceKeys.length; i2++) {
-    key = sourceKeys[i2];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-function useTooltipInPortal(_temp) {
-  var _ref = _temp === void 0 ? {} : _temp, _ref$detectBounds = _ref.detectBounds, detectBoundsOption = _ref$detectBounds === void 0 ? true : _ref$detectBounds, zIndexOption = _ref.zIndex, useMeasureOptions = _objectWithoutPropertiesLoose$t(_ref, _excluded$t);
-  var _useMeasure = useMeasure(useMeasureOptions), containerRef = _useMeasure[0], containerBounds = _useMeasure[1], forceRefreshBounds = _useMeasure[2];
-  var _useState = useState(false), isSsr = _useState[0], setIsSsr = _useState[1];
-  useEffect(function() {
-    setIsSsr(false);
-  }, []);
-  var TooltipInPortal = useMemo(function() {
-    return function(_ref2) {
-      var _ref2$left = _ref2.left, containerLeft = _ref2$left === void 0 ? 0 : _ref2$left, _ref2$top = _ref2.top, containerTop = _ref2$top === void 0 ? 0 : _ref2$top, detectBoundsProp = _ref2.detectBounds, zIndexProp = _ref2.zIndex, tooltipProps = _objectWithoutPropertiesLoose$t(_ref2, _excluded2$1);
-      var detectBounds = detectBoundsProp == null ? detectBoundsOption : detectBoundsProp;
-      var zIndex = zIndexProp == null ? zIndexOption : zIndexProp;
-      var TooltipComponent = detectBounds ? TooltipWithBounds$1 : Tooltip$2;
-      var scrollX = isSsr ? 0 : window.scrollX;
-      var scrollY = isSsr ? 0 : window.scrollY;
-      var portalLeft = containerLeft + (containerBounds.left || 0) + scrollX;
-      var portalTop = containerTop + (containerBounds.top || 0) + scrollY;
-      return /* @__PURE__ */ jsx(Portal, {
-        zIndex,
-        children: /* @__PURE__ */ jsx(TooltipComponent, {
-          left: portalLeft,
-          top: portalTop,
-          ...tooltipProps
-        })
-      });
-    };
-  }, [detectBoundsOption, zIndexOption, containerBounds.left, containerBounds.top, isSsr]);
-  return {
-    containerRef,
-    containerBounds,
-    forceRefreshBounds,
-    TooltipInPortal
-  };
-}
-const ToolTip = ({
-  style: style2,
-  top: top2,
-  left: left2,
-  tooltipData
-}) => {
-  const {
-    TooltipInPortal
-  } = useTooltipInPortal({
-    detectBounds: true,
-    scroll: true
-  });
-  return /* @__PURE__ */ jsx(TooltipInPortal, {
-    top: top2,
-    left: left2,
-    children: /* @__PURE__ */ jsxs("div", {
-      style: {
-        width: "100%",
-        height: "auto",
-        textAlign: "center",
-        background: "black",
-        boxShadow: "2px 2px 5px black",
-        color: "#6c5efb",
-        padding: "15px",
-        ...style2 == null ? void 0 : style2.tooltipStyle
-      },
-      children: [/* @__PURE__ */ jsx("div", {
-        style: {
-          paddingBottom: "2px",
-          color: "white"
-        },
-        children: tooltipData[0]
-      }), /* @__PURE__ */ jsx("div", {
-        style: {
-          marginTop: "10px"
-        },
-        children: tooltipData[1]
-      })]
-    })
-  }, Math.random());
-};
-var balancedMatch$1 = balanced$3;
-function balanced$3(a2, b10, str) {
-  if (a2 instanceof RegExp)
-    a2 = maybeMatch$1(a2, str);
-  if (b10 instanceof RegExp)
-    b10 = maybeMatch$1(b10, str);
-  var r2 = range$4(a2, b10, str);
-  return r2 && {
-    start: r2[0],
-    end: r2[1],
-    pre: str.slice(0, r2[0]),
-    body: str.slice(r2[0] + a2.length, r2[1]),
-    post: str.slice(r2[1] + b10.length)
-  };
-}
-function maybeMatch$1(reg, str) {
-  var m2 = str.match(reg);
-  return m2 ? m2[0] : null;
-}
-balanced$3.range = range$4;
-function range$4(a2, b10, str) {
-  var begs, beg, left2, right2, result;
-  var ai = str.indexOf(a2);
-  var bi = str.indexOf(b10, ai + 1);
-  var i2 = ai;
-  if (ai >= 0 && bi > 0) {
-    begs = [];
-    left2 = str.length;
-    while (i2 >= 0 && !result) {
-      if (i2 == ai) {
-        begs.push(i2);
-        ai = str.indexOf(a2, i2 + 1);
-      } else if (begs.length == 1) {
-        result = [begs.pop(), bi];
-      } else {
-        beg = begs.pop();
-        if (beg < left2) {
-          left2 = beg;
-          right2 = bi;
-        }
-        bi = str.indexOf(b10, i2 + 1);
-      }
-      i2 = ai < bi && ai >= 0 ? ai : bi;
-    }
-    if (begs.length) {
-      result = [left2, right2];
-    }
-  }
-  return result;
-}
-var balancedMatch = balanced$2;
-function balanced$2(a2, b10, str) {
-  if (a2 instanceof RegExp)
-    a2 = maybeMatch(a2, str);
-  if (b10 instanceof RegExp)
-    b10 = maybeMatch(b10, str);
-  var r2 = range$3(a2, b10, str);
-  return r2 && {
-    start: r2[0],
-    end: r2[1],
-    pre: str.slice(0, r2[0]),
-    body: str.slice(r2[0] + a2.length, r2[1]),
-    post: str.slice(r2[1] + b10.length)
-  };
-}
-function maybeMatch(reg, str) {
-  var m2 = str.match(reg);
-  return m2 ? m2[0] : null;
-}
-balanced$2.range = range$3;
-function range$3(a2, b10, str) {
-  var begs, beg, left2, right2, result;
-  var ai = str.indexOf(a2);
-  var bi = str.indexOf(b10, ai + 1);
-  var i2 = ai;
-  if (ai >= 0 && bi > 0) {
-    if (a2 === b10) {
-      return [ai, bi];
-    }
-    begs = [];
-    left2 = str.length;
-    while (i2 >= 0 && !result) {
-      if (i2 == ai) {
-        begs.push(i2);
-        ai = str.indexOf(a2, i2 + 1);
-      } else if (begs.length == 1) {
-        result = [begs.pop(), bi];
-      } else {
-        beg = begs.pop();
-        if (beg < left2) {
-          left2 = beg;
-          right2 = bi;
-        }
-        bi = str.indexOf(b10, i2 + 1);
-      }
-      i2 = ai < bi && ai >= 0 ? ai : bi;
-    }
-    if (begs.length) {
-      result = [left2, right2];
-    }
-  }
-  return result;
-}
-var balanced$1 = balancedMatch;
-var reduceFunctionCall_1 = reduceFunctionCall$1;
-function reduceFunctionCall$1(string2, functionRE, callback) {
-  var call = string2;
-  return getFunctionCalls(string2, functionRE).reduce(function(string3, obj) {
-    return string3.replace(obj.functionIdentifier + "(" + obj.matches.body + ")", evalFunctionCall(obj.matches.body, obj.functionIdentifier, callback, call, functionRE));
-  }, string2);
-}
-function getFunctionCalls(call, functionRE) {
-  var expressions = [];
-  var fnRE = typeof functionRE === "string" ? new RegExp("\\b(" + functionRE + ")\\(") : functionRE;
-  do {
-    var searchMatch = fnRE.exec(call);
-    if (!searchMatch) {
-      return expressions;
-    }
-    if (searchMatch[1] === void 0) {
-      throw new Error("Missing the first couple of parenthesis to get the function identifier in " + functionRE);
-    }
-    var fn = searchMatch[1];
-    var startIndex = searchMatch.index;
-    var matches = balanced$1("(", ")", call.substring(startIndex));
-    if (!matches || matches.start !== searchMatch[0].length - 1) {
-      throw new SyntaxError(fn + "(): missing closing ')' in the value '" + call + "'");
-    }
-    expressions.push({ matches, functionIdentifier: fn });
-    call = matches.post;
-  } while (fnRE.test(call));
-  return expressions;
+    expressions.push({ matches, functionIdentifier: fn });
+    call = matches.post;
+  } while (fnRE.test(call));
+  return expressions;
 }
 function evalFunctionCall(string2, functionIdentifier, callback, call, functionRE) {
   return callback(reduceFunctionCall$1(string2, functionRE, callback), functionIdentifier, call);
@@ -10314,212 +9656,616 @@ function hashSet$1(key, value) {
   data[key] = nativeCreate && value === void 0 ? HASH_UNDEFINED : value;
   return this;
 }
-var _hashSet = hashSet$1;
-var hashClear = _hashClear, hashDelete = _hashDelete, hashGet = _hashGet, hashHas = _hashHas, hashSet = _hashSet;
-function Hash$1(entries) {
-  var index2 = -1, length2 = entries == null ? 0 : entries.length;
-  this.clear();
-  while (++index2 < length2) {
-    var entry = entries[index2];
-    this.set(entry[0], entry[1]);
+var _hashSet = hashSet$1;
+var hashClear = _hashClear, hashDelete = _hashDelete, hashGet = _hashGet, hashHas = _hashHas, hashSet = _hashSet;
+function Hash$1(entries) {
+  var index2 = -1, length2 = entries == null ? 0 : entries.length;
+  this.clear();
+  while (++index2 < length2) {
+    var entry = entries[index2];
+    this.set(entry[0], entry[1]);
+  }
+}
+Hash$1.prototype.clear = hashClear;
+Hash$1.prototype["delete"] = hashDelete;
+Hash$1.prototype.get = hashGet;
+Hash$1.prototype.has = hashHas;
+Hash$1.prototype.set = hashSet;
+var _Hash = Hash$1;
+function listCacheClear$1() {
+  this.__data__ = [];
+  this.size = 0;
+}
+var _listCacheClear = listCacheClear$1;
+function eq$1(value, other) {
+  return value === other || value !== value && other !== other;
+}
+var eq_1 = eq$1;
+var eq = eq_1;
+function assocIndexOf$4(array2, key) {
+  var length2 = array2.length;
+  while (length2--) {
+    if (eq(array2[length2][0], key)) {
+      return length2;
+    }
+  }
+  return -1;
+}
+var _assocIndexOf = assocIndexOf$4;
+var assocIndexOf$3 = _assocIndexOf;
+var arrayProto = Array.prototype;
+var splice = arrayProto.splice;
+function listCacheDelete$1(key) {
+  var data = this.__data__, index2 = assocIndexOf$3(data, key);
+  if (index2 < 0) {
+    return false;
+  }
+  var lastIndex = data.length - 1;
+  if (index2 == lastIndex) {
+    data.pop();
+  } else {
+    splice.call(data, index2, 1);
+  }
+  --this.size;
+  return true;
+}
+var _listCacheDelete = listCacheDelete$1;
+var assocIndexOf$2 = _assocIndexOf;
+function listCacheGet$1(key) {
+  var data = this.__data__, index2 = assocIndexOf$2(data, key);
+  return index2 < 0 ? void 0 : data[index2][1];
+}
+var _listCacheGet = listCacheGet$1;
+var assocIndexOf$1 = _assocIndexOf;
+function listCacheHas$1(key) {
+  return assocIndexOf$1(this.__data__, key) > -1;
+}
+var _listCacheHas = listCacheHas$1;
+var assocIndexOf = _assocIndexOf;
+function listCacheSet$1(key, value) {
+  var data = this.__data__, index2 = assocIndexOf(data, key);
+  if (index2 < 0) {
+    ++this.size;
+    data.push([key, value]);
+  } else {
+    data[index2][1] = value;
+  }
+  return this;
+}
+var _listCacheSet = listCacheSet$1;
+var listCacheClear = _listCacheClear, listCacheDelete = _listCacheDelete, listCacheGet = _listCacheGet, listCacheHas = _listCacheHas, listCacheSet = _listCacheSet;
+function ListCache$1(entries) {
+  var index2 = -1, length2 = entries == null ? 0 : entries.length;
+  this.clear();
+  while (++index2 < length2) {
+    var entry = entries[index2];
+    this.set(entry[0], entry[1]);
+  }
+}
+ListCache$1.prototype.clear = listCacheClear;
+ListCache$1.prototype["delete"] = listCacheDelete;
+ListCache$1.prototype.get = listCacheGet;
+ListCache$1.prototype.has = listCacheHas;
+ListCache$1.prototype.set = listCacheSet;
+var _ListCache = ListCache$1;
+var getNative$1 = _getNative, root$5 = _root;
+var Map$4 = getNative$1(root$5, "Map");
+var _Map = Map$4;
+var Hash = _Hash, ListCache = _ListCache, Map$3 = _Map;
+function mapCacheClear$1() {
+  this.size = 0;
+  this.__data__ = {
+    "hash": new Hash(),
+    "map": new (Map$3 || ListCache)(),
+    "string": new Hash()
+  };
+}
+var _mapCacheClear = mapCacheClear$1;
+function isKeyable$1(value) {
+  var type2 = typeof value;
+  return type2 == "string" || type2 == "number" || type2 == "symbol" || type2 == "boolean" ? value !== "__proto__" : value === null;
+}
+var _isKeyable = isKeyable$1;
+var isKeyable = _isKeyable;
+function getMapData$4(map2, key) {
+  var data = map2.__data__;
+  return isKeyable(key) ? data[typeof key == "string" ? "string" : "hash"] : data.map;
+}
+var _getMapData = getMapData$4;
+var getMapData$3 = _getMapData;
+function mapCacheDelete$1(key) {
+  var result = getMapData$3(this, key)["delete"](key);
+  this.size -= result ? 1 : 0;
+  return result;
+}
+var _mapCacheDelete = mapCacheDelete$1;
+var getMapData$2 = _getMapData;
+function mapCacheGet$1(key) {
+  return getMapData$2(this, key).get(key);
+}
+var _mapCacheGet = mapCacheGet$1;
+var getMapData$1 = _getMapData;
+function mapCacheHas$1(key) {
+  return getMapData$1(this, key).has(key);
+}
+var _mapCacheHas = mapCacheHas$1;
+var getMapData = _getMapData;
+function mapCacheSet$1(key, value) {
+  var data = getMapData(this, key), size = data.size;
+  data.set(key, value);
+  this.size += data.size == size ? 0 : 1;
+  return this;
+}
+var _mapCacheSet = mapCacheSet$1;
+var mapCacheClear = _mapCacheClear, mapCacheDelete = _mapCacheDelete, mapCacheGet = _mapCacheGet, mapCacheHas = _mapCacheHas, mapCacheSet = _mapCacheSet;
+function MapCache$1(entries) {
+  var index2 = -1, length2 = entries == null ? 0 : entries.length;
+  this.clear();
+  while (++index2 < length2) {
+    var entry = entries[index2];
+    this.set(entry[0], entry[1]);
+  }
+}
+MapCache$1.prototype.clear = mapCacheClear;
+MapCache$1.prototype["delete"] = mapCacheDelete;
+MapCache$1.prototype.get = mapCacheGet;
+MapCache$1.prototype.has = mapCacheHas;
+MapCache$1.prototype.set = mapCacheSet;
+var _MapCache = MapCache$1;
+var MapCache = _MapCache;
+var FUNC_ERROR_TEXT$1 = "Expected a function";
+function memoize(func, resolver) {
+  if (typeof func != "function" || resolver != null && typeof resolver != "function") {
+    throw new TypeError(FUNC_ERROR_TEXT$1);
+  }
+  var memoized = function() {
+    var args = arguments, key = resolver ? resolver.apply(this, args) : args[0], cache = memoized.cache;
+    if (cache.has(key)) {
+      return cache.get(key);
+    }
+    var result = func.apply(this, args);
+    memoized.cache = cache.set(key, result) || cache;
+    return result;
+  };
+  memoized.cache = new (memoize.Cache || MapCache)();
+  return memoized;
+}
+memoize.Cache = MapCache;
+var memoize_1 = memoize;
+var memoize$1 = memoize_1;
+var MEASUREMENT_ELEMENT_ID = "__react_svg_text_measurement_id";
+function getStringWidth(str, style2) {
+  try {
+    var textEl = document.getElementById(MEASUREMENT_ELEMENT_ID);
+    if (!textEl) {
+      var svg2 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+      svg2.setAttribute("aria-hidden", "true");
+      svg2.style.width = "0";
+      svg2.style.height = "0";
+      svg2.style.position = "absolute";
+      svg2.style.top = "-100%";
+      svg2.style.left = "-100%";
+      textEl = document.createElementNS("http://www.w3.org/2000/svg", "text");
+      textEl.setAttribute("id", MEASUREMENT_ELEMENT_ID);
+      svg2.appendChild(textEl);
+      document.body.appendChild(svg2);
+    }
+    Object.assign(textEl.style, style2);
+    textEl.textContent = str;
+    return textEl.getComputedTextLength();
+  } catch (e3) {
+    return null;
+  }
+}
+var getStringWidth$1 = memoize$1(getStringWidth, function(str, style2) {
+  return str + "_" + JSON.stringify(style2);
+});
+var _excluded$w = ["verticalAnchor", "scaleToFit", "angle", "width", "lineHeight", "capHeight", "children", "style"];
+function _objectWithoutPropertiesLoose$w(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i2;
+  for (i2 = 0; i2 < sourceKeys.length; i2++) {
+    key = sourceKeys[i2];
+    if (excluded.indexOf(key) >= 0)
+      continue;
+    target[key] = source[key];
   }
+  return target;
 }
-Hash$1.prototype.clear = hashClear;
-Hash$1.prototype["delete"] = hashDelete;
-Hash$1.prototype.get = hashGet;
-Hash$1.prototype.has = hashHas;
-Hash$1.prototype.set = hashSet;
-var _Hash = Hash$1;
-function listCacheClear$1() {
-  this.__data__ = [];
-  this.size = 0;
+function isNumber$2(val) {
+  return typeof val === "number";
 }
-var _listCacheClear = listCacheClear$1;
-function eq$1(value, other) {
-  return value === other || value !== value && other !== other;
+function isXOrYInValid(xOrY) {
+  return typeof xOrY === "number" && Number.isFinite(xOrY) || typeof xOrY === "string";
 }
-var eq_1 = eq$1;
-var eq = eq_1;
-function assocIndexOf$4(array2, key) {
-  var length2 = array2.length;
-  while (length2--) {
-    if (eq(array2[length2][0], key)) {
-      return length2;
+function useText(props) {
+  var _props$verticalAnchor = props.verticalAnchor, verticalAnchor = _props$verticalAnchor === void 0 ? "end" : _props$verticalAnchor, _props$scaleToFit = props.scaleToFit, scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit, angle2 = props.angle, width = props.width, _props$lineHeight = props.lineHeight, lineHeight = _props$lineHeight === void 0 ? "1em" : _props$lineHeight, _props$capHeight = props.capHeight, capHeight = _props$capHeight === void 0 ? "0.71em" : _props$capHeight, children2 = props.children, style2 = props.style, textProps = _objectWithoutPropertiesLoose$w(props, _excluded$w);
+  var _textProps$x = textProps.x, x2 = _textProps$x === void 0 ? 0 : _textProps$x, _textProps$y = textProps.y, y2 = _textProps$y === void 0 ? 0 : _textProps$y;
+  var isXOrYNotValid = !isXOrYInValid(x2) || !isXOrYInValid(y2);
+  var _useMemo = useMemo(function() {
+    var words = children2 == null ? [] : children2.toString().split(/(?:(?!\u00A0+)\s+)/);
+    return {
+      wordsWithWidth: words.map(function(word) {
+        return {
+          word,
+          wordWidth: getStringWidth$1(word, style2) || 0
+        };
+      }),
+      spaceWidth: getStringWidth$1("\xA0", style2) || 0
+    };
+  }, [children2, style2]), wordsWithWidth = _useMemo.wordsWithWidth, spaceWidth = _useMemo.spaceWidth;
+  var wordsByLines = useMemo(function() {
+    if (isXOrYNotValid) {
+      return [];
     }
-  }
-  return -1;
+    if (width || scaleToFit) {
+      return wordsWithWidth.reduce(function(result, _ref) {
+        var word = _ref.word, wordWidth = _ref.wordWidth;
+        var currentLine = result[result.length - 1];
+        if (currentLine && (width == null || scaleToFit || (currentLine.width || 0) + wordWidth + spaceWidth < width)) {
+          currentLine.words.push(word);
+          currentLine.width = currentLine.width || 0;
+          currentLine.width += wordWidth + spaceWidth;
+        } else {
+          var newLine = {
+            words: [word],
+            width: wordWidth
+          };
+          result.push(newLine);
+        }
+        return result;
+      }, []);
+    }
+    return [{
+      words: children2 == null ? [] : children2.toString().split(/(?:(?!\u00A0+)\s+)/)
+    }];
+  }, [isXOrYNotValid, width, scaleToFit, children2, wordsWithWidth, spaceWidth]);
+  var startDy = useMemo(function() {
+    var startDyStr = isXOrYNotValid ? "" : verticalAnchor === "start" ? reduceCSSCalc$1("calc(" + capHeight + ")") : verticalAnchor === "middle" ? reduceCSSCalc$1("calc(" + (wordsByLines.length - 1) / 2 + " * -" + lineHeight + " + (" + capHeight + " / 2))") : reduceCSSCalc$1("calc(" + (wordsByLines.length - 1) + " * -" + lineHeight + ")");
+    return startDyStr;
+  }, [isXOrYNotValid, verticalAnchor, capHeight, wordsByLines.length, lineHeight]);
+  var transform2 = useMemo(function() {
+    var transforms = [];
+    if (isXOrYNotValid) {
+      return "";
+    }
+    if (isNumber$2(x2) && isNumber$2(y2) && isNumber$2(width) && scaleToFit && wordsByLines.length > 0) {
+      var lineWidth = wordsByLines[0].width || 1;
+      var sx = scaleToFit === "shrink-only" ? Math.min(width / lineWidth, 1) : width / lineWidth;
+      var sy = sx;
+      var originX = x2 - sx * x2;
+      var originY = y2 - sy * y2;
+      transforms.push("matrix(" + sx + ", 0, 0, " + sy + ", " + originX + ", " + originY + ")");
+    }
+    if (angle2) {
+      transforms.push("rotate(" + angle2 + ", " + x2 + ", " + y2 + ")");
+    }
+    return transforms.length > 0 ? transforms.join(" ") : "";
+  }, [isXOrYNotValid, x2, y2, width, scaleToFit, wordsByLines, angle2]);
+  return {
+    wordsByLines,
+    startDy,
+    transform: transform2
+  };
 }
-var _assocIndexOf = assocIndexOf$4;
-var assocIndexOf$3 = _assocIndexOf;
-var arrayProto = Array.prototype;
-var splice = arrayProto.splice;
-function listCacheDelete$1(key) {
-  var data = this.__data__, index2 = assocIndexOf$3(data, key);
-  if (index2 < 0) {
-    return false;
-  }
-  var lastIndex = data.length - 1;
-  if (index2 == lastIndex) {
-    data.pop();
-  } else {
-    splice.call(data, index2, 1);
-  }
-  --this.size;
-  return true;
+var _excluded$v = ["dx", "dy", "textAnchor", "innerRef", "innerTextRef", "verticalAnchor", "angle", "lineHeight", "scaleToFit", "capHeight", "width"];
+function _extends$M() {
+  _extends$M = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$M.apply(this, arguments);
 }
-var _listCacheDelete = listCacheDelete$1;
-var assocIndexOf$2 = _assocIndexOf;
-function listCacheGet$1(key) {
-  var data = this.__data__, index2 = assocIndexOf$2(data, key);
-  return index2 < 0 ? void 0 : data[index2][1];
+function _objectWithoutPropertiesLoose$v(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i2;
+  for (i2 = 0; i2 < sourceKeys.length; i2++) {
+    key = sourceKeys[i2];
+    if (excluded.indexOf(key) >= 0)
+      continue;
+    target[key] = source[key];
+  }
+  return target;
 }
-var _listCacheGet = listCacheGet$1;
-var assocIndexOf$1 = _assocIndexOf;
-function listCacheHas$1(key) {
-  return assocIndexOf$1(this.__data__, key) > -1;
+var SVG_STYLE = {
+  overflow: "visible"
+};
+function Text(props) {
+  var _props$dx = props.dx, dx = _props$dx === void 0 ? 0 : _props$dx, _props$dy = props.dy, dy = _props$dy === void 0 ? 0 : _props$dy, _props$textAnchor = props.textAnchor, textAnchor = _props$textAnchor === void 0 ? "start" : _props$textAnchor, innerRef = props.innerRef, innerTextRef = props.innerTextRef;
+  props.verticalAnchor;
+  props.angle;
+  var _props$lineHeight = props.lineHeight, lineHeight = _props$lineHeight === void 0 ? "1em" : _props$lineHeight;
+  props.scaleToFit;
+  props.capHeight;
+  props.width;
+  var textProps = _objectWithoutPropertiesLoose$v(props, _excluded$v);
+  var _textProps$x = textProps.x, x2 = _textProps$x === void 0 ? 0 : _textProps$x, fontSize = textProps.fontSize;
+  var _useText = useText(props), wordsByLines = _useText.wordsByLines, startDy = _useText.startDy, transform2 = _useText.transform;
+  return /* @__PURE__ */ React__default.createElement("svg", {
+    ref: innerRef,
+    x: dx,
+    y: dy,
+    fontSize,
+    style: SVG_STYLE
+  }, wordsByLines.length > 0 ? /* @__PURE__ */ React__default.createElement("text", _extends$M({
+    ref: innerTextRef,
+    transform: transform2
+  }, textProps, {
+    textAnchor
+  }), wordsByLines.map(function(line2, index2) {
+    return /* @__PURE__ */ React__default.createElement("tspan", {
+      key: index2,
+      x: x2,
+      dy: index2 === 0 ? startDy : lineHeight
+    }, line2.words.join(" "));
+  })) : null);
 }
-var _listCacheHas = listCacheHas$1;
-var assocIndexOf = _assocIndexOf;
-function listCacheSet$1(key, value) {
-  var data = this.__data__, index2 = assocIndexOf(data, key);
-  if (index2 < 0) {
-    ++this.size;
-    data.push([key, value]);
+var esm$2 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Text,
+  getStringWidth: getStringWidth$1,
+  useText
+}, Symbol.toStringTag, { value: "Module" }));
+var Orientation$1 = {
+  top: "top",
+  left: "left",
+  right: "right",
+  bottom: "bottom"
+};
+var Orientation$2 = Orientation$1;
+function getLabelTransform$2(_ref) {
+  var labelOffset = _ref.labelOffset, labelProps = _ref.labelProps, orientation2 = _ref.orientation, range2 = _ref.range, tickLabelFontSize = _ref.tickLabelFontSize, tickLength = _ref.tickLength;
+  var sign2 = orientation2 === Orientation$2.left || orientation2 === Orientation$2.top ? -1 : 1;
+  var x2;
+  var y2;
+  var transform2;
+  if (orientation2 === Orientation$2.top || orientation2 === Orientation$2.bottom) {
+    var yBottomOffset = orientation2 === Orientation$2.bottom && typeof labelProps.fontSize === "number" ? labelProps.fontSize : 0;
+    x2 = (Number(range2[0]) + Number(range2[range2.length - 1])) / 2;
+    y2 = sign2 * (tickLength + labelOffset + tickLabelFontSize + yBottomOffset);
   } else {
-    data[index2][1] = value;
-  }
-  return this;
-}
-var _listCacheSet = listCacheSet$1;
-var listCacheClear = _listCacheClear, listCacheDelete = _listCacheDelete, listCacheGet = _listCacheGet, listCacheHas = _listCacheHas, listCacheSet = _listCacheSet;
-function ListCache$1(entries) {
-  var index2 = -1, length2 = entries == null ? 0 : entries.length;
-  this.clear();
-  while (++index2 < length2) {
-    var entry = entries[index2];
-    this.set(entry[0], entry[1]);
+    x2 = sign2 * ((Number(range2[0]) + Number(range2[range2.length - 1])) / 2);
+    y2 = -(tickLength + labelOffset);
+    transform2 = "rotate(" + sign2 * 90 + ")";
   }
-}
-ListCache$1.prototype.clear = listCacheClear;
-ListCache$1.prototype["delete"] = listCacheDelete;
-ListCache$1.prototype.get = listCacheGet;
-ListCache$1.prototype.has = listCacheHas;
-ListCache$1.prototype.set = listCacheSet;
-var _ListCache = ListCache$1;
-var getNative$1 = _getNative, root$5 = _root;
-var Map$4 = getNative$1(root$5, "Map");
-var _Map = Map$4;
-var Hash = _Hash, ListCache = _ListCache, Map$3 = _Map;
-function mapCacheClear$1() {
-  this.size = 0;
-  this.__data__ = {
-    "hash": new Hash(),
-    "map": new (Map$3 || ListCache)(),
-    "string": new Hash()
+  return {
+    x: x2,
+    y: y2,
+    transform: transform2
   };
 }
-var _mapCacheClear = mapCacheClear$1;
-function isKeyable$1(value) {
-  var type2 = typeof value;
-  return type2 == "string" || type2 == "number" || type2 == "symbol" || type2 == "boolean" ? value !== "__proto__" : value === null;
-}
-var _isKeyable = isKeyable$1;
-var isKeyable = _isKeyable;
-function getMapData$4(map2, key) {
-  var data = map2.__data__;
-  return isKeyable(key) ? data[typeof key == "string" ? "string" : "hash"] : data.map;
+function _extends$L() {
+  _extends$L = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$L.apply(this, arguments);
 }
-var _getMapData = getMapData$4;
-var getMapData$3 = _getMapData;
-function mapCacheDelete$1(key) {
-  var result = getMapData$3(this, key)["delete"](key);
-  this.size -= result ? 1 : 0;
-  return result;
+function Ticks$2(_ref) {
+  var hideTicks = _ref.hideTicks, horizontal = _ref.horizontal, orientation2 = _ref.orientation, tickClassName = _ref.tickClassName, tickComponent = _ref.tickComponent, allTickLabelProps = _ref.tickLabelProps, _ref$tickStroke = _ref.tickStroke, tickStroke = _ref$tickStroke === void 0 ? "#222" : _ref$tickStroke, tickTransform = _ref.tickTransform, ticks2 = _ref.ticks, strokeWidth = _ref.strokeWidth, tickLineProps = _ref.tickLineProps;
+  return ticks2.map(function(_ref2) {
+    var _allTickLabelProps$in;
+    var value = _ref2.value, index2 = _ref2.index, from = _ref2.from, to = _ref2.to, formattedValue = _ref2.formattedValue;
+    var tickLabelProps = (_allTickLabelProps$in = allTickLabelProps[index2]) != null ? _allTickLabelProps$in : {};
+    var tickLabelFontSize = Math.max(10, typeof tickLabelProps.fontSize === "number" && tickLabelProps.fontSize || 0);
+    var tickYCoord = to.y + (horizontal && orientation2 !== Orientation$2.top ? tickLabelFontSize : 0);
+    return /* @__PURE__ */ React__default.createElement(Group, {
+      key: "visx-tick-" + value + "-" + index2,
+      className: cx("visx-axis-tick", tickClassName),
+      transform: tickTransform
+    }, !hideTicks && /* @__PURE__ */ React__default.createElement(Line$2, _extends$L({
+      from,
+      to,
+      stroke: tickStroke,
+      strokeWidth,
+      strokeLinecap: "square"
+    }, tickLineProps)), tickComponent ? tickComponent(_extends$L({}, tickLabelProps, {
+      x: to.x,
+      y: tickYCoord,
+      formattedValue
+    })) : /* @__PURE__ */ React__default.createElement(Text, _extends$L({
+      x: to.x,
+      y: tickYCoord
+    }, tickLabelProps), formattedValue));
+  });
 }
-var _mapCacheDelete = mapCacheDelete$1;
-var getMapData$2 = _getMapData;
-function mapCacheGet$1(key) {
-  return getMapData$2(this, key).get(key);
+function _extends$K() {
+  _extends$K = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$K.apply(this, arguments);
 }
-var _mapCacheGet = mapCacheGet$1;
-var getMapData$1 = _getMapData;
-function mapCacheHas$1(key) {
-  return getMapData$1(this, key).has(key);
+var defaultTextProps$1 = {
+  textAnchor: "middle",
+  fontFamily: "Arial",
+  fontSize: 10,
+  fill: "#222"
+};
+function AxisRenderer$2(_ref) {
+  var axisFromPoint = _ref.axisFromPoint, axisLineClassName = _ref.axisLineClassName, axisToPoint = _ref.axisToPoint, hideAxisLine = _ref.hideAxisLine, hideTicks = _ref.hideTicks, horizontal = _ref.horizontal, _ref$label = _ref.label, label = _ref$label === void 0 ? "" : _ref$label, labelClassName = _ref.labelClassName, _ref$labelOffset = _ref.labelOffset, labelOffset = _ref$labelOffset === void 0 ? 14 : _ref$labelOffset, _ref$labelProps = _ref.labelProps, labelProps = _ref$labelProps === void 0 ? defaultTextProps$1 : _ref$labelProps, _ref$orientation = _ref.orientation, orientation2 = _ref$orientation === void 0 ? Orientation$2.bottom : _ref$orientation, scale = _ref.scale, _ref$stroke = _ref.stroke, stroke = _ref$stroke === void 0 ? "#222" : _ref$stroke, strokeDasharray = _ref.strokeDasharray, _ref$strokeWidth = _ref.strokeWidth, strokeWidth = _ref$strokeWidth === void 0 ? 1 : _ref$strokeWidth, tickClassName = _ref.tickClassName, tickComponent = _ref.tickComponent, tickLineProps = _ref.tickLineProps, tickLabelProps = _ref.tickLabelProps, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, _ref$tickStroke = _ref.tickStroke, tickStroke = _ref$tickStroke === void 0 ? "#222" : _ref$tickStroke, tickTransform = _ref.tickTransform, ticks2 = _ref.ticks, _ref$ticksComponent = _ref.ticksComponent, ticksComponent = _ref$ticksComponent === void 0 ? Ticks$2 : _ref$ticksComponent;
+  var tickLabelPropsDefault = _extends$K({}, defaultTextProps$1, typeof tickLabelProps === "object" ? tickLabelProps : null);
+  var allTickLabelProps = ticks2.map(function(_ref2) {
+    var value = _ref2.value, index2 = _ref2.index;
+    return typeof tickLabelProps === "function" ? tickLabelProps(value, index2, ticks2) : tickLabelPropsDefault;
+  });
+  var maxTickLabelFontSize = Math.max.apply(Math, [10].concat(allTickLabelProps.map(function(props) {
+    return typeof props.fontSize === "number" ? props.fontSize : 0;
+  })));
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, ticksComponent({
+    hideTicks,
+    horizontal,
+    orientation: orientation2,
+    scale,
+    tickClassName,
+    tickComponent,
+    tickLabelProps: allTickLabelProps,
+    tickStroke,
+    tickTransform,
+    ticks: ticks2,
+    strokeWidth,
+    tickLineProps
+  }), !hideAxisLine && /* @__PURE__ */ React__default.createElement(Line$2, {
+    className: cx("visx-axis-line", axisLineClassName),
+    from: axisFromPoint,
+    to: axisToPoint,
+    stroke,
+    strokeWidth,
+    strokeDasharray
+  }), label && /* @__PURE__ */ React__default.createElement(Text, _extends$K({
+    className: cx("visx-axis-label", labelClassName)
+  }, getLabelTransform$2({
+    labelOffset,
+    labelProps,
+    orientation: orientation2,
+    range: scale.range(),
+    tickLabelFontSize: maxTickLabelFontSize,
+    tickLength
+  }), labelProps), label));
 }
-var _mapCacheHas = mapCacheHas$1;
-var getMapData = _getMapData;
-function mapCacheSet$1(key, value) {
-  var data = getMapData(this, key), size = data.size;
-  data.set(key, value);
-  this.size += data.size == size ? 0 : 1;
-  return this;
+function getTickPosition$2(scale, align2) {
+  if (align2 === void 0) {
+    align2 = "center";
+  }
+  var s2 = scale;
+  if (align2 !== "start" && "bandwidth" in s2) {
+    var offset = s2.bandwidth();
+    if (align2 === "center")
+      offset /= 2;
+    if (s2.round())
+      offset = Math.round(offset);
+    return function(d2) {
+      var scaledValue = s2(d2);
+      return typeof scaledValue === "number" ? scaledValue + offset : scaledValue;
+    };
+  }
+  return scale;
 }
-var _mapCacheSet = mapCacheSet$1;
-var mapCacheClear = _mapCacheClear, mapCacheDelete = _mapCacheDelete, mapCacheGet = _mapCacheGet, mapCacheHas = _mapCacheHas, mapCacheSet = _mapCacheSet;
-function MapCache$1(entries) {
-  var index2 = -1, length2 = entries == null ? 0 : entries.length;
-  this.clear();
-  while (++index2 < length2) {
-    var entry = entries[index2];
-    this.set(entry[0], entry[1]);
+function getTickFormatter$2(scale) {
+  var s2 = scale;
+  if ("tickFormat" in s2) {
+    return s2.tickFormat();
   }
+  return toString;
 }
-MapCache$1.prototype.clear = mapCacheClear;
-MapCache$1.prototype["delete"] = mapCacheDelete;
-MapCache$1.prototype.get = mapCacheGet;
-MapCache$1.prototype.has = mapCacheHas;
-MapCache$1.prototype.set = mapCacheSet;
-var _MapCache = MapCache$1;
-var MapCache = _MapCache;
-var FUNC_ERROR_TEXT$1 = "Expected a function";
-function memoize(func, resolver) {
-  if (typeof func != "function" || resolver != null && typeof resolver != "function") {
-    throw new TypeError(FUNC_ERROR_TEXT$1);
+var Point = /* @__PURE__ */ function() {
+  function Point2(_ref) {
+    var _ref$x = _ref.x, x2 = _ref$x === void 0 ? 0 : _ref$x, _ref$y = _ref.y, y2 = _ref$y === void 0 ? 0 : _ref$y;
+    this.x = 0;
+    this.y = 0;
+    this.x = x2;
+    this.y = y2;
   }
-  var memoized = function() {
-    var args = arguments, key = resolver ? resolver.apply(this, args) : args[0], cache = memoized.cache;
-    if (cache.has(key)) {
-      return cache.get(key);
-    }
-    var result = func.apply(this, args);
-    memoized.cache = cache.set(key, result) || cache;
-    return result;
+  var _proto = Point2.prototype;
+  _proto.value = function value() {
+    return {
+      x: this.x,
+      y: this.y
+    };
   };
-  memoized.cache = new (memoize.Cache || MapCache)();
-  return memoized;
+  _proto.toArray = function toArray() {
+    return [this.x, this.y];
+  };
+  return Point2;
+}();
+function sumPoints(point1, point2) {
+  return new Point({
+    x: point1.x + point2.x,
+    y: point1.y + point2.y
+  });
 }
-memoize.Cache = MapCache;
-var memoize_1 = memoize;
-var memoize$1 = memoize_1;
-var MEASUREMENT_ELEMENT_ID = "__react_svg_text_measurement_id";
-function getStringWidth(str, style2) {
-  try {
-    var textEl = document.getElementById(MEASUREMENT_ELEMENT_ID);
-    if (!textEl) {
-      var svg2 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-      svg2.setAttribute("aria-hidden", "true");
-      svg2.style.width = "0";
-      svg2.style.height = "0";
-      svg2.style.position = "absolute";
-      svg2.style.top = "-100%";
-      svg2.style.left = "-100%";
-      textEl = document.createElementNS("http://www.w3.org/2000/svg", "text");
-      textEl.setAttribute("id", MEASUREMENT_ELEMENT_ID);
-      svg2.appendChild(textEl);
-      document.body.appendChild(svg2);
+function subtractPoints(point1, point2) {
+  return new Point({
+    x: point1.x - point2.x,
+    y: point1.y - point2.y
+  });
+}
+var esm$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Point,
+  sumPoints,
+  subtractPoints
+}, Symbol.toStringTag, { value: "Module" }));
+function createPoint$2(_ref, horizontal) {
+  var x2 = _ref.x, y2 = _ref.y;
+  return new Point(horizontal ? {
+    x: x2,
+    y: y2
+  } : {
+    x: y2,
+    y: x2
+  });
+}
+function _extends$J() {
+  _extends$J = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
     }
-    Object.assign(textEl.style, style2);
-    textEl.textContent = str;
-    return textEl.getComputedTextLength();
-  } catch (e3) {
-    return null;
+    return target;
+  };
+  return _extends$J.apply(this, arguments);
+}
+var defaultAxisRangePadding$1 = 0;
+function getAxisRangePaddingConfig$2(originalRangePadding) {
+  if (originalRangePadding === void 0) {
+    originalRangePadding = defaultAxisRangePadding$1;
   }
+  return typeof originalRangePadding === "number" ? {
+    start: originalRangePadding,
+    end: originalRangePadding
+  } : _extends$J({
+    start: defaultAxisRangePadding$1,
+    end: defaultAxisRangePadding$1
+  }, originalRangePadding);
 }
-var getStringWidth$1 = memoize$1(getStringWidth, function(str, style2) {
-  return str + "_" + JSON.stringify(style2);
-});
-var _excluded$s = ["verticalAnchor", "scaleToFit", "angle", "width", "lineHeight", "capHeight", "children", "style"];
-function _objectWithoutPropertiesLoose$s(source, excluded) {
+var _excluded$u = ["children", "axisClassName", "hideAxisLine", "hideTicks", "hideZero", "left", "numTicks", "orientation", "rangePadding", "scale", "tickFormat", "tickLength", "tickValues", "top"];
+function _extends$I() {
+  _extends$I = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$I.apply(this, arguments);
+}
+function _objectWithoutPropertiesLoose$u(source, excluded) {
   if (source == null)
     return {};
   var target = {};
@@ -10533,83 +10279,72 @@ function _objectWithoutPropertiesLoose$s(source, excluded) {
   }
   return target;
 }
-function isNumber$2(val) {
-  return typeof val === "number";
-}
-function isXOrYInValid(xOrY) {
-  return typeof xOrY === "number" && Number.isFinite(xOrY) || typeof xOrY === "string";
-}
-function useText(props) {
-  var _props$verticalAnchor = props.verticalAnchor, verticalAnchor = _props$verticalAnchor === void 0 ? "end" : _props$verticalAnchor, _props$scaleToFit = props.scaleToFit, scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit, angle2 = props.angle, width = props.width, _props$lineHeight = props.lineHeight, lineHeight = _props$lineHeight === void 0 ? "1em" : _props$lineHeight, _props$capHeight = props.capHeight, capHeight = _props$capHeight === void 0 ? "0.71em" : _props$capHeight, children2 = props.children, style2 = props.style, textProps = _objectWithoutPropertiesLoose$s(props, _excluded$s);
-  var _textProps$x = textProps.x, x2 = _textProps$x === void 0 ? 0 : _textProps$x, _textProps$y = textProps.y, y2 = _textProps$y === void 0 ? 0 : _textProps$y;
-  var isXOrYNotValid = !isXOrYInValid(x2) || !isXOrYInValid(y2);
-  var _useMemo = useMemo(function() {
-    var words = children2 == null ? [] : children2.toString().split(/(?:(?!\u00A0+)\s+)/);
+function Axis$2(_ref) {
+  var _ref$children = _ref.children, children2 = _ref$children === void 0 ? AxisRenderer$2 : _ref$children, axisClassName = _ref.axisClassName, _ref$hideAxisLine = _ref.hideAxisLine, hideAxisLine = _ref$hideAxisLine === void 0 ? false : _ref$hideAxisLine, _ref$hideTicks = _ref.hideTicks, hideTicks = _ref$hideTicks === void 0 ? false : _ref$hideTicks, _ref$hideZero = _ref.hideZero, hideZero = _ref$hideZero === void 0 ? false : _ref$hideZero, _ref$left = _ref.left, left2 = _ref$left === void 0 ? 0 : _ref$left, _ref$numTicks = _ref.numTicks, numTicks = _ref$numTicks === void 0 ? 10 : _ref$numTicks, _ref$orientation = _ref.orientation, orientation2 = _ref$orientation === void 0 ? Orientation$2.bottom : _ref$orientation, _ref$rangePadding = _ref.rangePadding, rangePadding = _ref$rangePadding === void 0 ? 0 : _ref$rangePadding, scale = _ref.scale, tickFormat2 = _ref.tickFormat, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, tickValues = _ref.tickValues, _ref$top = _ref.top, top2 = _ref$top === void 0 ? 0 : _ref$top, restProps = _objectWithoutPropertiesLoose$u(_ref, _excluded$u);
+  var format2 = tickFormat2 != null ? tickFormat2 : getTickFormatter$2(scale);
+  var isLeft = orientation2 === Orientation$2.left;
+  var isTop = orientation2 === Orientation$2.top;
+  var horizontal = isTop || orientation2 === Orientation$2.bottom;
+  var tickPosition = getTickPosition$2(scale);
+  var tickSign = isLeft || isTop ? -1 : 1;
+  var range2 = scale.range();
+  var rangePaddingConfig = getAxisRangePaddingConfig$2(rangePadding);
+  var axisFromPoint = createPoint$2({
+    x: Number(range2[0]) + 0.5 - rangePaddingConfig.start,
+    y: 0
+  }, horizontal);
+  var axisToPoint = createPoint$2({
+    x: Number(range2[range2.length - 1]) + 0.5 + rangePaddingConfig.end,
+    y: 0
+  }, horizontal);
+  var filteredTickValues = (tickValues != null ? tickValues : getTicks(scale, numTicks)).filter(function(value) {
+    return !hideZero || value !== 0 && value !== "0";
+  }).map(function(value, index2) {
     return {
-      wordsWithWidth: words.map(function(word) {
-        return {
-          word,
-          wordWidth: getStringWidth$1(word, style2) || 0
-        };
-      }),
-      spaceWidth: getStringWidth$1("\xA0", style2) || 0
+      value,
+      index: index2
     };
-  }, [children2, style2]), wordsWithWidth = _useMemo.wordsWithWidth, spaceWidth = _useMemo.spaceWidth;
-  var wordsByLines = useMemo(function() {
-    if (isXOrYNotValid) {
-      return [];
-    }
-    if (width || scaleToFit) {
-      return wordsWithWidth.reduce(function(result, _ref) {
-        var word = _ref.word, wordWidth = _ref.wordWidth;
-        var currentLine = result[result.length - 1];
-        if (currentLine && (width == null || scaleToFit || (currentLine.width || 0) + wordWidth + spaceWidth < width)) {
-          currentLine.words.push(word);
-          currentLine.width = currentLine.width || 0;
-          currentLine.width += wordWidth + spaceWidth;
-        } else {
-          var newLine = {
-            words: [word],
-            width: wordWidth
-          };
-          result.push(newLine);
-        }
-        return result;
-      }, []);
-    }
-    return [{
-      words: children2 == null ? [] : children2.toString().split(/(?:(?!\u00A0+)\s+)/)
-    }];
-  }, [isXOrYNotValid, width, scaleToFit, children2, wordsWithWidth, spaceWidth]);
-  var startDy = useMemo(function() {
-    var startDyStr = isXOrYNotValid ? "" : verticalAnchor === "start" ? reduceCSSCalc$1("calc(" + capHeight + ")") : verticalAnchor === "middle" ? reduceCSSCalc$1("calc(" + (wordsByLines.length - 1) / 2 + " * -" + lineHeight + " + (" + capHeight + " / 2))") : reduceCSSCalc$1("calc(" + (wordsByLines.length - 1) + " * -" + lineHeight + ")");
-    return startDyStr;
-  }, [isXOrYNotValid, verticalAnchor, capHeight, wordsByLines.length, lineHeight]);
-  var transform2 = useMemo(function() {
-    var transforms = [];
-    if (isXOrYNotValid) {
-      return "";
-    }
-    if (isNumber$2(x2) && isNumber$2(y2) && isNumber$2(width) && scaleToFit && wordsByLines.length > 0) {
-      var lineWidth = wordsByLines[0].width || 1;
-      var sx = scaleToFit === "shrink-only" ? Math.min(width / lineWidth, 1) : width / lineWidth;
-      var sy = sx;
-      var originX = x2 - sx * x2;
-      var originY = y2 - sy * y2;
-      transforms.push("matrix(" + sx + ", 0, 0, " + sy + ", " + originX + ", " + originY + ")");
-    }
-    if (angle2) {
-      transforms.push("rotate(" + angle2 + ", " + x2 + ", " + y2 + ")");
-    }
-    return transforms.length > 0 ? transforms.join(" ") : "";
-  }, [isXOrYNotValid, x2, y2, width, scaleToFit, wordsByLines, angle2]);
-  return {
-    wordsByLines,
-    startDy,
-    transform: transform2
-  };
+  });
+  var ticks2 = filteredTickValues.map(function(_ref2) {
+    var value = _ref2.value, index2 = _ref2.index;
+    var scaledValue = coerceNumber(tickPosition(value));
+    return {
+      value,
+      index: index2,
+      from: createPoint$2({
+        x: scaledValue,
+        y: 0
+      }, horizontal),
+      to: createPoint$2({
+        x: scaledValue,
+        y: tickLength * tickSign
+      }, horizontal),
+      formattedValue: format2(value, index2, filteredTickValues)
+    };
+  });
+  return /* @__PURE__ */ React__default.createElement(Group, {
+    className: cx("visx-axis", axisClassName),
+    top: top2,
+    left: left2
+  }, children2(_extends$I({}, restProps, {
+    axisFromPoint,
+    axisToPoint,
+    hideAxisLine,
+    hideTicks,
+    hideZero,
+    horizontal,
+    numTicks,
+    orientation: orientation2,
+    rangePadding,
+    scale,
+    tickFormat: format2,
+    tickLength,
+    tickPosition,
+    tickSign,
+    ticks: ticks2
+  })));
 }
-var _excluded$r = ["dx", "dy", "textAnchor", "innerRef", "innerTextRef", "verticalAnchor", "angle", "lineHeight", "scaleToFit", "capHeight", "width"];
+var _excluded$t = ["axisClassName", "labelOffset", "tickLength", "tickLabelProps"];
 function _extends$H() {
   _extends$H = Object.assign ? Object.assign.bind() : function(target) {
     for (var i2 = 1; i2 < arguments.length; i2++) {
@@ -10624,7 +10359,7 @@ function _extends$H() {
   };
   return _extends$H.apply(this, arguments);
 }
-function _objectWithoutPropertiesLoose$r(source, excluded) {
+function _objectWithoutPropertiesLoose$t(source, excluded) {
   if (source == null)
     return {};
   var target = {};
@@ -10632,79 +10367,32 @@ function _objectWithoutPropertiesLoose$r(source, excluded) {
   var key, i2;
   for (i2 = 0; i2 < sourceKeys.length; i2++) {
     key = sourceKeys[i2];
-    if (excluded.indexOf(key) >= 0)
-      continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-var SVG_STYLE = {
-  overflow: "visible"
-};
-function Text(props) {
-  var _props$dx = props.dx, dx = _props$dx === void 0 ? 0 : _props$dx, _props$dy = props.dy, dy = _props$dy === void 0 ? 0 : _props$dy, _props$textAnchor = props.textAnchor, textAnchor = _props$textAnchor === void 0 ? "start" : _props$textAnchor, innerRef = props.innerRef, innerTextRef = props.innerTextRef;
-  props.verticalAnchor;
-  props.angle;
-  var _props$lineHeight = props.lineHeight, lineHeight = _props$lineHeight === void 0 ? "1em" : _props$lineHeight;
-  props.scaleToFit;
-  props.capHeight;
-  props.width;
-  var textProps = _objectWithoutPropertiesLoose$r(props, _excluded$r);
-  var _textProps$x = textProps.x, x2 = _textProps$x === void 0 ? 0 : _textProps$x, fontSize = textProps.fontSize;
-  var _useText = useText(props), wordsByLines = _useText.wordsByLines, startDy = _useText.startDy, transform2 = _useText.transform;
-  return /* @__PURE__ */ React__default.createElement("svg", {
-    ref: innerRef,
-    x: dx,
-    y: dy,
-    fontSize,
-    style: SVG_STYLE
-  }, wordsByLines.length > 0 ? /* @__PURE__ */ React__default.createElement("text", _extends$H({
-    ref: innerTextRef,
-    transform: transform2
-  }, textProps, {
-    textAnchor
-  }), wordsByLines.map(function(line2, index2) {
-    return /* @__PURE__ */ React__default.createElement("tspan", {
-      key: index2,
-      x: x2,
-      dy: index2 === 0 ? startDy : lineHeight
-    }, line2.words.join(" "));
-  })) : null);
-}
-var esm$2 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  Text,
-  getStringWidth: getStringWidth$1,
-  useText
-}, Symbol.toStringTag, { value: "Module" }));
-var Orientation$1 = {
-  top: "top",
-  left: "left",
-  right: "right",
-  bottom: "bottom"
-};
-var Orientation$2 = Orientation$1;
-function getLabelTransform$2(_ref) {
-  var labelOffset = _ref.labelOffset, labelProps = _ref.labelProps, orientation2 = _ref.orientation, range2 = _ref.range, tickLabelFontSize = _ref.tickLabelFontSize, tickLength = _ref.tickLength;
-  var sign2 = orientation2 === Orientation$2.left || orientation2 === Orientation$2.top ? -1 : 1;
-  var x2;
-  var y2;
-  var transform2;
-  if (orientation2 === Orientation$2.top || orientation2 === Orientation$2.bottom) {
-    var yBottomOffset = orientation2 === Orientation$2.bottom && typeof labelProps.fontSize === "number" ? labelProps.fontSize : 0;
-    x2 = (Number(range2[0]) + Number(range2[range2.length - 1])) / 2;
-    y2 = sign2 * (tickLength + labelOffset + tickLabelFontSize + yBottomOffset);
-  } else {
-    x2 = sign2 * ((Number(range2[0]) + Number(range2[range2.length - 1])) / 2);
-    y2 = -(tickLength + labelOffset);
-    transform2 = "rotate(" + sign2 * 90 + ")";
-  }
-  return {
-    x: x2,
-    y: y2,
-    transform: transform2
-  };
+    if (excluded.indexOf(key) >= 0)
+      continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+var leftTickLabelProps$1 = {
+  dx: "-0.25em",
+  dy: "0.25em",
+  fill: "#222",
+  fontFamily: "Arial",
+  fontSize: 10,
+  textAnchor: "end"
+};
+function AxisLeft$2(_ref) {
+  var axisClassName = _ref.axisClassName, _ref$labelOffset = _ref.labelOffset, labelOffset = _ref$labelOffset === void 0 ? 36 : _ref$labelOffset, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, tickLabelProps = _ref.tickLabelProps, restProps = _objectWithoutPropertiesLoose$t(_ref, _excluded$t);
+  var tickLabelPropsFinal = typeof tickLabelProps === "function" ? tickLabelProps : _extends$H({}, leftTickLabelProps$1, tickLabelProps);
+  return /* @__PURE__ */ React__default.createElement(Axis$2, _extends$H({
+    axisClassName: cx("visx-axis-left", axisClassName),
+    labelOffset,
+    orientation: Orientation$2.left,
+    tickLabelProps: tickLabelPropsFinal,
+    tickLength
+  }, restProps));
 }
+var _excluded$s = ["axisClassName", "labelOffset", "tickLength", "tickLabelProps"];
 function _extends$G() {
   _extends$G = Object.assign ? Object.assign.bind() : function(target) {
     for (var i2 = 1; i2 < arguments.length; i2++) {
@@ -10719,33 +10407,120 @@ function _extends$G() {
   };
   return _extends$G.apply(this, arguments);
 }
-function Ticks$2(_ref) {
-  var hideTicks = _ref.hideTicks, horizontal = _ref.horizontal, orientation2 = _ref.orientation, tickClassName = _ref.tickClassName, tickComponent = _ref.tickComponent, allTickLabelProps = _ref.tickLabelProps, _ref$tickStroke = _ref.tickStroke, tickStroke = _ref$tickStroke === void 0 ? "#222" : _ref$tickStroke, tickTransform = _ref.tickTransform, ticks2 = _ref.ticks, strokeWidth = _ref.strokeWidth, tickLineProps = _ref.tickLineProps;
-  return ticks2.map(function(_ref2) {
-    var _allTickLabelProps$in;
-    var value = _ref2.value, index2 = _ref2.index, from = _ref2.from, to = _ref2.to, formattedValue = _ref2.formattedValue;
-    var tickLabelProps = (_allTickLabelProps$in = allTickLabelProps[index2]) != null ? _allTickLabelProps$in : {};
-    var tickLabelFontSize = Math.max(10, typeof tickLabelProps.fontSize === "number" && tickLabelProps.fontSize || 0);
-    var tickYCoord = to.y + (horizontal && orientation2 !== Orientation$2.top ? tickLabelFontSize : 0);
-    return /* @__PURE__ */ React__default.createElement(Group, {
-      key: "visx-tick-" + value + "-" + index2,
-      className: cx("visx-axis-tick", tickClassName),
-      transform: tickTransform
-    }, !hideTicks && /* @__PURE__ */ React__default.createElement(Line$2, _extends$G({
-      from,
-      to,
-      stroke: tickStroke,
-      strokeWidth,
-      strokeLinecap: "square"
-    }, tickLineProps)), tickComponent ? tickComponent(_extends$G({}, tickLabelProps, {
-      x: to.x,
-      y: tickYCoord,
-      formattedValue
-    })) : /* @__PURE__ */ React__default.createElement(Text, _extends$G({
-      x: to.x,
-      y: tickYCoord
-    }, tickLabelProps), formattedValue));
+function _objectWithoutPropertiesLoose$s(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i2;
+  for (i2 = 0; i2 < sourceKeys.length; i2++) {
+    key = sourceKeys[i2];
+    if (excluded.indexOf(key) >= 0)
+      continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+var bottomTickLabelProps$1 = {
+  dy: "0.25em",
+  fill: "#222",
+  fontFamily: "Arial",
+  fontSize: 10,
+  textAnchor: "middle"
+};
+function AxisBottom$2(_ref) {
+  var axisClassName = _ref.axisClassName, _ref$labelOffset = _ref.labelOffset, labelOffset = _ref$labelOffset === void 0 ? 8 : _ref$labelOffset, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, tickLabelProps = _ref.tickLabelProps, restProps = _objectWithoutPropertiesLoose$s(_ref, _excluded$s);
+  var tickLabelPropsFinal = typeof tickLabelProps === "function" ? tickLabelProps : _extends$G({}, bottomTickLabelProps$1, tickLabelProps);
+  return /* @__PURE__ */ React__default.createElement(Axis$2, _extends$G({
+    axisClassName: cx("visx-axis-bottom", axisClassName),
+    labelOffset,
+    orientation: Orientation$2.bottom,
+    tickLabelProps: tickLabelPropsFinal,
+    tickLength
+  }, restProps));
+}
+const LeftAxis = ({
+  value,
+  yScale,
+  parentWidth
+}) => {
+  var _a2, _b2, _c2, _d, _e2, _f, _g, _h, _i, _j, _k, _l, _m, _n2, _o, _p, _q, _r;
+  return /* @__PURE__ */ jsx(AxisLeft$2, {
+    numTicks: (_a2 = value.main) == null ? void 0 : _a2.numTicks,
+    scale: yScale,
+    top: 0,
+    label: (_b2 = value.main) == null ? void 0 : _b2.leftLabel,
+    tickStroke: (_d = (_c2 = value.style) == null ? void 0 : _c2.labelStyle) == null ? void 0 : _d.tickColor,
+    strokeWidth: (_f = (_e2 = value.style) == null ? void 0 : _e2.labelStyle) == null ? void 0 : _f.rightAxisWidth,
+    hideTicks: (_g = value.main) == null ? void 0 : _g.hideLeftTicks,
+    labelOffset: (_i = (_h = value.style) == null ? void 0 : _h.labelStyle) == null ? void 0 : _i.leftLabelOffset,
+    labelProps: {
+      fill: (_k = (_j = value.style) == null ? void 0 : _j.labelStyle) == null ? void 0 : _k.labelColor,
+      fontSize: (_m = (_l = value.style) == null ? void 0 : _l.labelStyle) == null ? void 0 : _m.fontSize,
+      fontWeight: (_o = (_n2 = value.style) == null ? void 0 : _n2.labelStyle) == null ? void 0 : _o.fontWeight,
+      fontFamily: (_q = (_p = value.style) == null ? void 0 : _p.labelStyle) == null ? void 0 : _q.fontWeight
+    },
+    hideAxisLine: (_r = value.main) == null ? void 0 : _r.hideLeftAxisLine,
+    tickLabelProps: (e3) => {
+      var _a3, _b3;
+      return {
+        fill: (_b3 = (_a3 = value.style) == null ? void 0 : _a3.labelStyle) == null ? void 0 : _b3.tickLabelColor,
+        fontSize: 11,
+        textAnchor: "end",
+        dy: "0.33em"
+      };
+    }
+  });
+};
+const BottomAxis = ({
+  data,
+  yMax,
+  value,
+  xScale,
+  parentWidth
+}) => {
+  var _a2, _b2, _c2, _d, _e2, _f, _g, _h, _i, _j, _k, _l, _m, _n2, _o, _p, _q, _r, _s;
+  return /* @__PURE__ */ jsx(AxisBottom$2, {
+    numTicks: data.length,
+    top: yMax,
+    hideTicks: (_a2 = value.main) == null ? void 0 : _a2.hideTicks,
+    hideAxisLine: (_b2 = value.main) == null ? void 0 : _b2.hideBottomAxisLine,
+    strokeWidth: (_d = (_c2 = value.style) == null ? void 0 : _c2.labelStyle) == null ? void 0 : _d.bottomAxisWidth,
+    scale: xScale,
+    stroke: (_f = (_e2 = value.style) == null ? void 0 : _e2.labelStyle) == null ? void 0 : _f.tickColor,
+    labelOffset: (_h = (_g = value.style) == null ? void 0 : _g.labelStyle) == null ? void 0 : _h.bottomLabelOffset,
+    label: (_i = value.main) == null ? void 0 : _i.bottomLabel,
+    labelProps: {
+      fill: (_k = (_j = value.style) == null ? void 0 : _j.labelStyle) == null ? void 0 : _k.labelColor,
+      fontSize: (_m = (_l = value.style) == null ? void 0 : _l.labelStyle) == null ? void 0 : _m.fontSize,
+      fontWeight: (_o = (_n2 = value.style) == null ? void 0 : _n2.labelStyle) == null ? void 0 : _o.fontWeight,
+      fontFamily: (_q = (_p = value.style) == null ? void 0 : _p.labelStyle) == null ? void 0 : _q.fontWeight
+    },
+    tickStroke: (_s = (_r = value.style) == null ? void 0 : _r.labelStyle) == null ? void 0 : _s.tickColor,
+    tickLabelProps: () => {
+      var _a3, _b3, _c3, _d2;
+      return {
+        fill: (_b3 = (_a3 = value.style) == null ? void 0 : _a3.labelStyle) == null ? void 0 : _b3.tickLabelColor,
+        fontSize: ((_d2 = (_c3 = value.style) == null ? void 0 : _c3.labelStyle) == null ? void 0 : _d2.tickFontSize) || 11,
+        textAnchor: "middle"
+      };
+    }
   });
+};
+var _excluded$r = ["tooltipOpen"];
+function _objectWithoutPropertiesLoose$r(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i2;
+  for (i2 = 0; i2 < sourceKeys.length; i2++) {
+    key = sourceKeys[i2];
+    if (excluded.indexOf(key) >= 0)
+      continue;
+    target[key] = source[key];
+  }
+  return target;
 }
 function _extends$F() {
   _extends$F = Object.assign ? Object.assign.bind() : function(target) {
@@ -10761,125 +10536,41 @@ function _extends$F() {
   };
   return _extends$F.apply(this, arguments);
 }
-var defaultTextProps$1 = {
-  textAnchor: "middle",
-  fontFamily: "Arial",
-  fontSize: 10,
-  fill: "#222"
-};
-function AxisRenderer$2(_ref) {
-  var axisFromPoint = _ref.axisFromPoint, axisLineClassName = _ref.axisLineClassName, axisToPoint = _ref.axisToPoint, hideAxisLine = _ref.hideAxisLine, hideTicks = _ref.hideTicks, horizontal = _ref.horizontal, _ref$label = _ref.label, label = _ref$label === void 0 ? "" : _ref$label, labelClassName = _ref.labelClassName, _ref$labelOffset = _ref.labelOffset, labelOffset = _ref$labelOffset === void 0 ? 14 : _ref$labelOffset, _ref$labelProps = _ref.labelProps, labelProps = _ref$labelProps === void 0 ? defaultTextProps$1 : _ref$labelProps, _ref$orientation = _ref.orientation, orientation2 = _ref$orientation === void 0 ? Orientation$2.bottom : _ref$orientation, scale = _ref.scale, _ref$stroke = _ref.stroke, stroke = _ref$stroke === void 0 ? "#222" : _ref$stroke, strokeDasharray = _ref.strokeDasharray, _ref$strokeWidth = _ref.strokeWidth, strokeWidth = _ref$strokeWidth === void 0 ? 1 : _ref$strokeWidth, tickClassName = _ref.tickClassName, tickComponent = _ref.tickComponent, tickLineProps = _ref.tickLineProps, tickLabelProps = _ref.tickLabelProps, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, _ref$tickStroke = _ref.tickStroke, tickStroke = _ref$tickStroke === void 0 ? "#222" : _ref$tickStroke, tickTransform = _ref.tickTransform, ticks2 = _ref.ticks, _ref$ticksComponent = _ref.ticksComponent, ticksComponent = _ref$ticksComponent === void 0 ? Ticks$2 : _ref$ticksComponent;
-  var tickLabelPropsDefault = _extends$F({}, defaultTextProps$1, typeof tickLabelProps === "object" ? tickLabelProps : null);
-  var allTickLabelProps = ticks2.map(function(_ref2) {
-    var value = _ref2.value, index2 = _ref2.index;
-    return typeof tickLabelProps === "function" ? tickLabelProps(value, index2, ticks2) : tickLabelPropsDefault;
-  });
-  var maxTickLabelFontSize = Math.max.apply(Math, [10].concat(allTickLabelProps.map(function(props) {
-    return typeof props.fontSize === "number" ? props.fontSize : 0;
-  })));
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, ticksComponent({
-    hideTicks,
-    horizontal,
-    orientation: orientation2,
-    scale,
-    tickClassName,
-    tickComponent,
-    tickLabelProps: allTickLabelProps,
-    tickStroke,
-    tickTransform,
-    ticks: ticks2,
-    strokeWidth,
-    tickLineProps
-  }), !hideAxisLine && /* @__PURE__ */ React__default.createElement(Line$2, {
-    className: cx("visx-axis-line", axisLineClassName),
-    from: axisFromPoint,
-    to: axisToPoint,
-    stroke,
-    strokeWidth,
-    strokeDasharray
-  }), label && /* @__PURE__ */ React__default.createElement(Text, _extends$F({
-    className: cx("visx-axis-label", labelClassName)
-  }, getLabelTransform$2({
-    labelOffset,
-    labelProps,
-    orientation: orientation2,
-    range: scale.range(),
-    tickLabelFontSize: maxTickLabelFontSize,
-    tickLength
-  }), labelProps), label));
-}
-function getTickPosition$2(scale, align2) {
-  if (align2 === void 0) {
-    align2 = "center";
-  }
-  var s2 = scale;
-  if (align2 !== "start" && "bandwidth" in s2) {
-    var offset = s2.bandwidth();
-    if (align2 === "center")
-      offset /= 2;
-    if (s2.round())
-      offset = Math.round(offset);
-    return function(d2) {
-      var scaledValue = s2(d2);
-      return typeof scaledValue === "number" ? scaledValue + offset : scaledValue;
-    };
-  }
-  return scale;
-}
-function getTickFormatter$2(scale) {
-  var s2 = scale;
-  if ("tickFormat" in s2) {
-    return s2.tickFormat();
-  }
-  return toString;
-}
-var Point = /* @__PURE__ */ function() {
-  function Point2(_ref) {
-    var _ref$x = _ref.x, x2 = _ref$x === void 0 ? 0 : _ref$x, _ref$y = _ref.y, y2 = _ref$y === void 0 ? 0 : _ref$y;
-    this.x = 0;
-    this.y = 0;
-    this.x = x2;
-    this.y = y2;
-  }
-  var _proto = Point2.prototype;
-  _proto.value = function value() {
-    return {
-      x: this.x,
-      y: this.y
-    };
-  };
-  _proto.toArray = function toArray() {
-    return [this.x, this.y];
+function useTooltip(initialTooltipState) {
+  var _useState = useState(_extends$F({
+    tooltipOpen: false
+  }, initialTooltipState)), tooltipState = _useState[0], setTooltipState = _useState[1];
+  var showTooltip = useCallback(function(showArgs) {
+    return setTooltipState(typeof showArgs === "function" ? function(_ref) {
+      _ref.tooltipOpen;
+      var show = _objectWithoutPropertiesLoose$r(_ref, _excluded$r);
+      return _extends$F({}, showArgs(show), {
+        tooltipOpen: true
+      });
+    } : {
+      tooltipOpen: true,
+      tooltipLeft: showArgs.tooltipLeft,
+      tooltipTop: showArgs.tooltipTop,
+      tooltipData: showArgs.tooltipData
+    });
+  }, [setTooltipState]);
+  var hideTooltip = useCallback(function() {
+    return setTooltipState({
+      tooltipOpen: false,
+      tooltipLeft: void 0,
+      tooltipTop: void 0,
+      tooltipData: void 0
+    });
+  }, [setTooltipState]);
+  return {
+    tooltipOpen: tooltipState.tooltipOpen,
+    tooltipLeft: tooltipState.tooltipLeft,
+    tooltipTop: tooltipState.tooltipTop,
+    tooltipData: tooltipState.tooltipData,
+    updateTooltip: setTooltipState,
+    showTooltip,
+    hideTooltip
   };
-  return Point2;
-}();
-function sumPoints(point1, point2) {
-  return new Point({
-    x: point1.x + point2.x,
-    y: point1.y + point2.y
-  });
-}
-function subtractPoints(point1, point2) {
-  return new Point({
-    x: point1.x - point2.x,
-    y: point1.y - point2.y
-  });
-}
-var esm$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  Point,
-  sumPoints,
-  subtractPoints
-}, Symbol.toStringTag, { value: "Module" }));
-function createPoint$2(_ref, horizontal) {
-  var x2 = _ref.x, y2 = _ref.y;
-  return new Point(horizontal ? {
-    x: x2,
-    y: y2
-  } : {
-    x: y2,
-    y: x2
-  });
 }
 function _extends$E() {
   _extends$E = Object.assign ? Object.assign.bind() : function(target) {
@@ -10893,22 +10584,264 @@ function _extends$E() {
     }
     return target;
   };
-  return _extends$E.apply(this, arguments);
+  return _extends$E.apply(this, arguments);
+}
+function withTooltip(BaseComponent, containerProps, renderContainer) {
+  if (containerProps === void 0) {
+    containerProps = {
+      style: {
+        position: "relative",
+        width: "inherit",
+        height: "inherit"
+      }
+    };
+  }
+  if (renderContainer === void 0) {
+    renderContainer = function renderContainer2(children2, props) {
+      return /* @__PURE__ */ React__default.createElement("div", props, children2);
+    };
+  }
+  var WrappedComponent = function WrappedComponent2(props) {
+    var tooltipProps = useTooltip();
+    return renderContainer(/* @__PURE__ */ React__default.createElement(BaseComponent, _extends$E({}, tooltipProps, props)), containerProps);
+  };
+  return WrappedComponent;
+}
+function debounce$2(func, wait, immediate) {
+  var timeout2, args, context, timestamp, result;
+  if (null == wait)
+    wait = 100;
+  function later() {
+    var last2 = Date.now() - timestamp;
+    if (last2 < wait && last2 >= 0) {
+      timeout2 = setTimeout(later, wait - last2);
+    } else {
+      timeout2 = null;
+      if (!immediate) {
+        result = func.apply(context, args);
+        context = args = null;
+      }
+    }
+  }
+  var debounced = function() {
+    context = this;
+    args = arguments;
+    timestamp = Date.now();
+    var callNow = immediate && !timeout2;
+    if (!timeout2)
+      timeout2 = setTimeout(later, wait);
+    if (callNow) {
+      result = func.apply(context, args);
+      context = args = null;
+    }
+    return result;
+  };
+  debounced.clear = function() {
+    if (timeout2) {
+      clearTimeout(timeout2);
+      timeout2 = null;
+    }
+  };
+  debounced.flush = function() {
+    if (timeout2) {
+      result = func.apply(context, args);
+      context = args = null;
+      clearTimeout(timeout2);
+      timeout2 = null;
+    }
+  };
+  return debounced;
+}
+debounce$2.debounce = debounce$2;
+var debounce_1$1 = debounce$2;
+function useMeasure(_temp) {
+  let {
+    debounce: debounce2,
+    scroll,
+    polyfill,
+    offsetSize
+  } = _temp === void 0 ? {
+    debounce: 0,
+    scroll: false,
+    offsetSize: false
+  } : _temp;
+  const ResizeObserver2 = polyfill || (typeof window === "undefined" ? class ResizeObserver {
+  } : window.ResizeObserver);
+  if (!ResizeObserver2) {
+    throw new Error("This browser does not support ResizeObserver out of the box. See: https://github.com/react-spring/react-use-measure/#resize-observer-polyfills");
+  }
+  const [bounds2, set2] = useState({
+    left: 0,
+    top: 0,
+    width: 0,
+    height: 0,
+    bottom: 0,
+    right: 0,
+    x: 0,
+    y: 0
+  });
+  const state = useRef({
+    element: null,
+    scrollContainers: null,
+    resizeObserver: null,
+    lastBounds: bounds2
+  });
+  const scrollDebounce = debounce2 ? typeof debounce2 === "number" ? debounce2 : debounce2.scroll : null;
+  const resizeDebounce = debounce2 ? typeof debounce2 === "number" ? debounce2 : debounce2.resize : null;
+  const mounted = useRef(false);
+  useEffect(() => {
+    mounted.current = true;
+    return () => void (mounted.current = false);
+  });
+  const [forceRefresh, resizeChange, scrollChange] = useMemo(() => {
+    const callback = () => {
+      if (!state.current.element)
+        return;
+      const {
+        left: left2,
+        top: top2,
+        width,
+        height,
+        bottom: bottom2,
+        right: right2,
+        x: x2,
+        y: y2
+      } = state.current.element.getBoundingClientRect();
+      const size = {
+        left: left2,
+        top: top2,
+        width,
+        height,
+        bottom: bottom2,
+        right: right2,
+        x: x2,
+        y: y2
+      };
+      if (state.current.element instanceof HTMLElement && offsetSize) {
+        size.height = state.current.element.offsetHeight;
+        size.width = state.current.element.offsetWidth;
+      }
+      Object.freeze(size);
+      if (mounted.current && !areBoundsEqual(state.current.lastBounds, size))
+        set2(state.current.lastBounds = size);
+    };
+    return [callback, resizeDebounce ? debounce_1$1(callback, resizeDebounce) : callback, scrollDebounce ? debounce_1$1(callback, scrollDebounce) : callback];
+  }, [set2, offsetSize, scrollDebounce, resizeDebounce]);
+  function removeListeners() {
+    if (state.current.scrollContainers) {
+      state.current.scrollContainers.forEach((element) => element.removeEventListener("scroll", scrollChange, true));
+      state.current.scrollContainers = null;
+    }
+    if (state.current.resizeObserver) {
+      state.current.resizeObserver.disconnect();
+      state.current.resizeObserver = null;
+    }
+  }
+  function addListeners() {
+    if (!state.current.element)
+      return;
+    state.current.resizeObserver = new ResizeObserver2(scrollChange);
+    state.current.resizeObserver.observe(state.current.element);
+    if (scroll && state.current.scrollContainers) {
+      state.current.scrollContainers.forEach((scrollContainer) => scrollContainer.addEventListener("scroll", scrollChange, {
+        capture: true,
+        passive: true
+      }));
+    }
+  }
+  const ref = (node) => {
+    if (!node || node === state.current.element)
+      return;
+    removeListeners();
+    state.current.element = node;
+    state.current.scrollContainers = findScrollContainers(node);
+    addListeners();
+  };
+  useOnWindowScroll(scrollChange, Boolean(scroll));
+  useOnWindowResize(resizeChange);
+  useEffect(() => {
+    removeListeners();
+    addListeners();
+  }, [scroll, scrollChange, resizeChange]);
+  useEffect(() => removeListeners, []);
+  return [ref, bounds2, forceRefresh];
+}
+function useOnWindowResize(onWindowResize) {
+  useEffect(() => {
+    const cb = onWindowResize;
+    window.addEventListener("resize", cb);
+    return () => void window.removeEventListener("resize", cb);
+  }, [onWindowResize]);
+}
+function useOnWindowScroll(onScroll, enabled) {
+  useEffect(() => {
+    if (enabled) {
+      const cb = onScroll;
+      window.addEventListener("scroll", cb, {
+        capture: true,
+        passive: true
+      });
+      return () => void window.removeEventListener("scroll", cb, true);
+    }
+  }, [onScroll, enabled]);
+}
+function findScrollContainers(element) {
+  const result = [];
+  if (!element || element === document.body)
+    return result;
+  const {
+    overflow,
+    overflowX,
+    overflowY
+  } = window.getComputedStyle(element);
+  if ([overflow, overflowX, overflowY].some((prop) => prop === "auto" || prop === "scroll"))
+    result.push(element);
+  return [...result, ...findScrollContainers(element.parentElement)];
+}
+const keys = ["x", "y", "top", "bottom", "left", "right", "width", "height"];
+const areBoundsEqual = (a2, b10) => keys.every((key) => a2[key] === b10[key]);
+function _inheritsLoose$1(subClass, superClass) {
+  subClass.prototype = Object.create(superClass.prototype);
+  subClass.prototype.constructor = subClass;
+  _setPrototypeOf$1(subClass, superClass);
+}
+function _setPrototypeOf$1(o, p2) {
+  _setPrototypeOf$1 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p3) {
+    o2.__proto__ = p3;
+    return o2;
+  };
+  return _setPrototypeOf$1(o, p2);
 }
-var defaultAxisRangePadding$1 = 0;
-function getAxisRangePaddingConfig$2(originalRangePadding) {
-  if (originalRangePadding === void 0) {
-    originalRangePadding = defaultAxisRangePadding$1;
+var Portal = /* @__PURE__ */ function(_React$PureComponent) {
+  _inheritsLoose$1(Portal2, _React$PureComponent);
+  function Portal2() {
+    return _React$PureComponent.apply(this, arguments) || this;
   }
-  return typeof originalRangePadding === "number" ? {
-    start: originalRangePadding,
-    end: originalRangePadding
-  } : _extends$E({
-    start: defaultAxisRangePadding$1,
-    end: defaultAxisRangePadding$1
-  }, originalRangePadding);
-}
-var _excluded$q = ["children", "axisClassName", "hideAxisLine", "hideTicks", "hideZero", "left", "numTicks", "orientation", "rangePadding", "scale", "tickFormat", "tickLength", "tickValues", "top"];
+  var _proto = Portal2.prototype;
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    if (this.node && document.body) {
+      document.body.removeChild(this.node);
+      delete this.node;
+    }
+  };
+  _proto.render = function render2() {
+    if (!this.node && typeof document !== "undefined") {
+      this.node = document.createElement("div");
+      if (this.props.zIndex != null)
+        this.node.style.zIndex = "" + this.props.zIndex;
+      document.body.append(this.node);
+    }
+    if (!this.node) {
+      return null;
+    }
+    return /* @__PURE__ */ ReactDOM.createPortal(this.props.children, this.node);
+  };
+  return Portal2;
+}(React__default.PureComponent);
+Portal.propTypes = {
+  zIndex: _pt.oneOfType([_pt.number, _pt.string])
+};
+var _excluded$q = ["className", "top", "left", "offsetLeft", "offsetTop", "style", "children", "unstyled", "applyPositionStyle"];
 function _extends$D() {
   _extends$D = Object.assign ? Object.assign.bind() : function(target) {
     for (var i2 = 1; i2 < arguments.length; i2++) {
@@ -10937,72 +10870,42 @@ function _objectWithoutPropertiesLoose$q(source, excluded) {
   }
   return target;
 }
-function Axis$2(_ref) {
-  var _ref$children = _ref.children, children2 = _ref$children === void 0 ? AxisRenderer$2 : _ref$children, axisClassName = _ref.axisClassName, _ref$hideAxisLine = _ref.hideAxisLine, hideAxisLine = _ref$hideAxisLine === void 0 ? false : _ref$hideAxisLine, _ref$hideTicks = _ref.hideTicks, hideTicks = _ref$hideTicks === void 0 ? false : _ref$hideTicks, _ref$hideZero = _ref.hideZero, hideZero = _ref$hideZero === void 0 ? false : _ref$hideZero, _ref$left = _ref.left, left2 = _ref$left === void 0 ? 0 : _ref$left, _ref$numTicks = _ref.numTicks, numTicks = _ref$numTicks === void 0 ? 10 : _ref$numTicks, _ref$orientation = _ref.orientation, orientation2 = _ref$orientation === void 0 ? Orientation$2.bottom : _ref$orientation, _ref$rangePadding = _ref.rangePadding, rangePadding = _ref$rangePadding === void 0 ? 0 : _ref$rangePadding, scale = _ref.scale, tickFormat2 = _ref.tickFormat, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, tickValues = _ref.tickValues, _ref$top = _ref.top, top2 = _ref$top === void 0 ? 0 : _ref$top, restProps = _objectWithoutPropertiesLoose$q(_ref, _excluded$q);
-  var format2 = tickFormat2 != null ? tickFormat2 : getTickFormatter$2(scale);
-  var isLeft = orientation2 === Orientation$2.left;
-  var isTop = orientation2 === Orientation$2.top;
-  var horizontal = isTop || orientation2 === Orientation$2.bottom;
-  var tickPosition = getTickPosition$2(scale);
-  var tickSign = isLeft || isTop ? -1 : 1;
-  var range2 = scale.range();
-  var rangePaddingConfig = getAxisRangePaddingConfig$2(rangePadding);
-  var axisFromPoint = createPoint$2({
-    x: Number(range2[0]) + 0.5 - rangePaddingConfig.start,
-    y: 0
-  }, horizontal);
-  var axisToPoint = createPoint$2({
-    x: Number(range2[range2.length - 1]) + 0.5 + rangePaddingConfig.end,
-    y: 0
-  }, horizontal);
-  var filteredTickValues = (tickValues != null ? tickValues : getTicks(scale, numTicks)).filter(function(value) {
-    return !hideZero || value !== 0 && value !== "0";
-  }).map(function(value, index2) {
-    return {
-      value,
-      index: index2
-    };
-  });
-  var ticks2 = filteredTickValues.map(function(_ref2) {
-    var value = _ref2.value, index2 = _ref2.index;
-    var scaledValue = coerceNumber(tickPosition(value));
-    return {
-      value,
-      index: index2,
-      from: createPoint$2({
-        x: scaledValue,
-        y: 0
-      }, horizontal),
-      to: createPoint$2({
-        x: scaledValue,
-        y: tickLength * tickSign
-      }, horizontal),
-      formattedValue: format2(value, index2, filteredTickValues)
-    };
-  });
-  return /* @__PURE__ */ React__default.createElement(Group, {
-    className: cx("visx-axis", axisClassName),
-    top: top2,
-    left: left2
-  }, children2(_extends$D({}, restProps, {
-    axisFromPoint,
-    axisToPoint,
-    hideAxisLine,
-    hideTicks,
-    hideZero,
-    horizontal,
-    numTicks,
-    orientation: orientation2,
-    rangePadding,
-    scale,
-    tickFormat: format2,
-    tickLength,
-    tickPosition,
-    tickSign,
-    ticks: ticks2
-  })));
-}
-var _excluded$p = ["axisClassName", "labelOffset", "tickLength", "tickLabelProps"];
+var defaultStyles = {
+  position: "absolute",
+  backgroundColor: "white",
+  color: "#666666",
+  padding: ".3rem .5rem",
+  borderRadius: "3px",
+  fontSize: "14px",
+  boxShadow: "0 1px 2px rgba(33,33,33,0.2)",
+  lineHeight: "1em",
+  pointerEvents: "none"
+};
+var Tooltip$1 = /* @__PURE__ */ React__default.forwardRef(function(_ref, ref) {
+  var className = _ref.className, top2 = _ref.top, left2 = _ref.left, _ref$offsetLeft = _ref.offsetLeft, offsetLeft = _ref$offsetLeft === void 0 ? 10 : _ref$offsetLeft, _ref$offsetTop = _ref.offsetTop, offsetTop = _ref$offsetTop === void 0 ? 10 : _ref$offsetTop, _ref$style = _ref.style, style2 = _ref$style === void 0 ? defaultStyles : _ref$style, children2 = _ref.children, _ref$unstyled = _ref.unstyled, unstyled = _ref$unstyled === void 0 ? false : _ref$unstyled, _ref$applyPositionSty = _ref.applyPositionStyle, applyPositionStyle = _ref$applyPositionSty === void 0 ? false : _ref$applyPositionSty, restProps = _objectWithoutPropertiesLoose$q(_ref, _excluded$q);
+  return /* @__PURE__ */ React__default.createElement("div", _extends$D({
+    ref,
+    className: cx("visx-tooltip", className),
+    style: _extends$D({
+      top: top2 == null || offsetTop == null ? top2 : top2 + offsetTop,
+      left: left2 == null || offsetLeft == null ? left2 : left2 + offsetLeft
+    }, applyPositionStyle && {
+      position: "absolute"
+    }, !unstyled && style2)
+  }, restProps), children2);
+});
+Tooltip$1.propTypes = {
+  children: _pt.node,
+  className: _pt.string,
+  left: _pt.number,
+  offsetLeft: _pt.number,
+  offsetTop: _pt.number,
+  top: _pt.number,
+  applyPositionStyle: _pt.bool,
+  unstyled: _pt.bool
+};
+Tooltip$1.displayName = "Tooltip";
+var Tooltip$2 = Tooltip$1;
 function _extends$C() {
   _extends$C = Object.assign ? Object.assign.bind() : function(target) {
     for (var i2 = 1; i2 < arguments.length; i2++) {
@@ -11017,6 +10920,97 @@ function _extends$C() {
   };
   return _extends$C.apply(this, arguments);
 }
+function _assertThisInitialized(self2) {
+  if (self2 === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+  return self2;
+}
+function _inheritsLoose(subClass, superClass) {
+  subClass.prototype = Object.create(superClass.prototype);
+  subClass.prototype.constructor = subClass;
+  _setPrototypeOf(subClass, superClass);
+}
+function _setPrototypeOf(o, p2) {
+  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p3) {
+    o2.__proto__ = p3;
+    return o2;
+  };
+  return _setPrototypeOf(o, p2);
+}
+var emptyRect = {
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  width: 0,
+  height: 0
+};
+function withBoundingRects(BaseComponent) {
+  var _class;
+  return _class = /* @__PURE__ */ function(_React$PureComponent) {
+    _inheritsLoose(WrappedComponent, _React$PureComponent);
+    function WrappedComponent(props) {
+      var _this;
+      _this = _React$PureComponent.call(this, props) || this;
+      _this.state = {
+        rect: void 0,
+        parentRect: void 0
+      };
+      _this.nodeRef = /* @__PURE__ */ React__default.createRef();
+      _this.getRects = _this.getRects.bind(_assertThisInitialized(_this));
+      return _this;
+    }
+    var _proto = WrappedComponent.prototype;
+    _proto.componentDidMount = function componentDidMount() {
+      var _this$nodeRef, _this2 = this;
+      this.node = (_this$nodeRef = this.nodeRef) != null && _this$nodeRef.current ? this.nodeRef.current : ReactDOM.findDOMNode(this);
+      this.setState(function() {
+        return _this2.getRects();
+      });
+    };
+    _proto.getRects = function getRects() {
+      if (!this.node)
+        return this.state;
+      var node = this.node;
+      var parentNode = node.parentNode;
+      var rect = node.getBoundingClientRect ? node.getBoundingClientRect() : emptyRect;
+      var parentRect = parentNode != null && parentNode.getBoundingClientRect ? parentNode.getBoundingClientRect() : emptyRect;
+      return {
+        rect,
+        parentRect
+      };
+    };
+    _proto.render = function render2() {
+      return /* @__PURE__ */ React__default.createElement(BaseComponent, _extends$C({
+        nodeRef: this.nodeRef,
+        getRects: this.getRects
+      }, this.state, this.props));
+    };
+    return WrappedComponent;
+  }(React__default.PureComponent), _class.displayName = "withBoundingRects(" + (BaseComponent.displayName || "") + ")", _class;
+}
+var TooltipPositionContext = /* @__PURE__ */ createContext({
+  isFlippedVertically: false,
+  isFlippedHorizontally: false
+});
+var TooltipPositionProvider = TooltipPositionContext.Provider;
+TooltipPositionContext.Consumer;
+var _excluded$p = ["children", "getRects", "left", "offsetLeft", "offsetTop", "parentRect", "rect", "style", "top", "unstyled", "nodeRef"];
+function _extends$B() {
+  _extends$B = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$B.apply(this, arguments);
+}
 function _objectWithoutPropertiesLoose$p(source, excluded) {
   if (source == null)
     return {};
@@ -11029,42 +11023,59 @@ function _objectWithoutPropertiesLoose$p(source, excluded) {
       continue;
     target[key] = source[key];
   }
-  return target;
-}
-var leftTickLabelProps$1 = {
-  dx: "-0.25em",
-  dy: "0.25em",
-  fill: "#222",
-  fontFamily: "Arial",
-  fontSize: 10,
-  textAnchor: "end"
-};
-function AxisLeft$2(_ref) {
-  var axisClassName = _ref.axisClassName, _ref$labelOffset = _ref.labelOffset, labelOffset = _ref$labelOffset === void 0 ? 36 : _ref$labelOffset, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, tickLabelProps = _ref.tickLabelProps, restProps = _objectWithoutPropertiesLoose$p(_ref, _excluded$p);
-  var tickLabelPropsFinal = typeof tickLabelProps === "function" ? tickLabelProps : _extends$C({}, leftTickLabelProps$1, tickLabelProps);
-  return /* @__PURE__ */ React__default.createElement(Axis$2, _extends$C({
-    axisClassName: cx("visx-axis-left", axisClassName),
-    labelOffset,
-    orientation: Orientation$2.left,
-    tickLabelProps: tickLabelPropsFinal,
-    tickLength
-  }, restProps));
+  return target;
 }
-var _excluded$o = ["axisClassName", "labelOffset", "tickLength", "tickLabelProps"];
-function _extends$B() {
-  _extends$B = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
+function TooltipWithBounds(_ref) {
+  var children2 = _ref.children;
+  _ref.getRects;
+  var _ref$left = _ref.left, initialLeft = _ref$left === void 0 ? 0 : _ref$left, _ref$offsetLeft = _ref.offsetLeft, offsetLeft = _ref$offsetLeft === void 0 ? 10 : _ref$offsetLeft, _ref$offsetTop = _ref.offsetTop, offsetTop = _ref$offsetTop === void 0 ? 10 : _ref$offsetTop, parentBounds = _ref.parentRect, ownBounds = _ref.rect, _ref$style = _ref.style, style2 = _ref$style === void 0 ? defaultStyles : _ref$style, _ref$top = _ref.top, initialTop = _ref$top === void 0 ? 0 : _ref$top, _ref$unstyled = _ref.unstyled, unstyled = _ref$unstyled === void 0 ? false : _ref$unstyled, nodeRef = _ref.nodeRef, otherProps = _objectWithoutPropertiesLoose$p(_ref, _excluded$p);
+  var transform2;
+  var placeTooltipLeft = false;
+  var placeTooltipUp = false;
+  if (ownBounds && parentBounds) {
+    var left2 = initialLeft;
+    var top2 = initialTop;
+    if (parentBounds.width) {
+      var rightPlacementClippedPx = left2 + offsetLeft + ownBounds.width - parentBounds.width;
+      var leftPlacementClippedPx = ownBounds.width - left2 - offsetLeft;
+      placeTooltipLeft = rightPlacementClippedPx > 0 && rightPlacementClippedPx > leftPlacementClippedPx;
+    } else {
+      var _rightPlacementClippedPx = left2 + offsetLeft + ownBounds.width - window.innerWidth;
+      var _leftPlacementClippedPx = ownBounds.width - left2 - offsetLeft;
+      placeTooltipLeft = _rightPlacementClippedPx > 0 && _rightPlacementClippedPx > _leftPlacementClippedPx;
     }
-    return target;
-  };
-  return _extends$B.apply(this, arguments);
+    if (parentBounds.height) {
+      var bottomPlacementClippedPx = top2 + offsetTop + ownBounds.height - parentBounds.height;
+      var topPlacementClippedPx = ownBounds.height - top2 - offsetTop;
+      placeTooltipUp = bottomPlacementClippedPx > 0 && bottomPlacementClippedPx > topPlacementClippedPx;
+    } else {
+      placeTooltipUp = top2 + offsetTop + ownBounds.height > window.innerHeight;
+    }
+    left2 = placeTooltipLeft ? left2 - ownBounds.width - offsetLeft : left2 + offsetLeft;
+    top2 = placeTooltipUp ? top2 - ownBounds.height - offsetTop : top2 + offsetTop;
+    left2 = Math.round(left2);
+    top2 = Math.round(top2);
+    transform2 = "translate(" + left2 + "px, " + top2 + "px)";
+  }
+  return /* @__PURE__ */ React__default.createElement(Tooltip$2, _extends$B({
+    ref: nodeRef,
+    style: _extends$B({
+      left: 0,
+      top: 0,
+      transform: transform2
+    }, !unstyled && style2)
+  }, otherProps), /* @__PURE__ */ React__default.createElement(TooltipPositionProvider, {
+    value: {
+      isFlippedVertically: !placeTooltipUp,
+      isFlippedHorizontally: !placeTooltipLeft
+    }
+  }, children2));
 }
+TooltipWithBounds.propTypes = {
+  nodeRef: _pt.oneOfType([_pt.string, _pt.func, _pt.object])
+};
+var TooltipWithBounds$1 = withBoundingRects(TooltipWithBounds);
+var _excluded$o = ["detectBounds", "zIndex"], _excluded2$1 = ["left", "top", "detectBounds", "zIndex"];
 function _objectWithoutPropertiesLoose$o(source, excluded) {
   if (source == null)
     return {};
@@ -11079,101 +11090,122 @@ function _objectWithoutPropertiesLoose$o(source, excluded) {
   }
   return target;
 }
-var bottomTickLabelProps$1 = {
-  dy: "0.25em",
-  fill: "#222",
-  fontFamily: "Arial",
-  fontSize: 10,
-  textAnchor: "middle"
-};
-function AxisBottom$2(_ref) {
-  var axisClassName = _ref.axisClassName, _ref$labelOffset = _ref.labelOffset, labelOffset = _ref$labelOffset === void 0 ? 8 : _ref$labelOffset, _ref$tickLength = _ref.tickLength, tickLength = _ref$tickLength === void 0 ? 8 : _ref$tickLength, tickLabelProps = _ref.tickLabelProps, restProps = _objectWithoutPropertiesLoose$o(_ref, _excluded$o);
-  var tickLabelPropsFinal = typeof tickLabelProps === "function" ? tickLabelProps : _extends$B({}, bottomTickLabelProps$1, tickLabelProps);
-  return /* @__PURE__ */ React__default.createElement(Axis$2, _extends$B({
-    axisClassName: cx("visx-axis-bottom", axisClassName),
-    labelOffset,
-    orientation: Orientation$2.bottom,
-    tickLabelProps: tickLabelPropsFinal,
-    tickLength
-  }, restProps));
+function useTooltipInPortal(_temp) {
+  var _ref = _temp === void 0 ? {} : _temp, _ref$detectBounds = _ref.detectBounds, detectBoundsOption = _ref$detectBounds === void 0 ? true : _ref$detectBounds, zIndexOption = _ref.zIndex, useMeasureOptions = _objectWithoutPropertiesLoose$o(_ref, _excluded$o);
+  var _useMeasure = useMeasure(useMeasureOptions), containerRef = _useMeasure[0], containerBounds = _useMeasure[1], forceRefreshBounds = _useMeasure[2];
+  var _useState = useState(false), isSsr = _useState[0], setIsSsr = _useState[1];
+  useEffect(function() {
+    setIsSsr(false);
+  }, []);
+  var TooltipInPortal = useMemo(function() {
+    return function(_ref2) {
+      var _ref2$left = _ref2.left, containerLeft = _ref2$left === void 0 ? 0 : _ref2$left, _ref2$top = _ref2.top, containerTop = _ref2$top === void 0 ? 0 : _ref2$top, detectBoundsProp = _ref2.detectBounds, zIndexProp = _ref2.zIndex, tooltipProps = _objectWithoutPropertiesLoose$o(_ref2, _excluded2$1);
+      var detectBounds = detectBoundsProp == null ? detectBoundsOption : detectBoundsProp;
+      var zIndex = zIndexProp == null ? zIndexOption : zIndexProp;
+      var TooltipComponent = detectBounds ? TooltipWithBounds$1 : Tooltip$2;
+      var scrollX = isSsr ? 0 : window.scrollX;
+      var scrollY = isSsr ? 0 : window.scrollY;
+      var portalLeft = containerLeft + (containerBounds.left || 0) + scrollX;
+      var portalTop = containerTop + (containerBounds.top || 0) + scrollY;
+      return /* @__PURE__ */ jsx(Portal, {
+        zIndex,
+        children: /* @__PURE__ */ jsx(TooltipComponent, {
+          left: portalLeft,
+          top: portalTop,
+          ...tooltipProps
+        })
+      });
+    };
+  }, [detectBoundsOption, zIndexOption, containerBounds.left, containerBounds.top, isSsr]);
+  return {
+    containerRef,
+    containerBounds,
+    forceRefreshBounds,
+    TooltipInPortal
+  };
 }
-const BottomAxis = ({
-  data,
-  yMax,
-  value,
-  xScale,
-  parentWidth
+const ToolTip = ({
+  style: style2,
+  top: top2,
+  left: left2,
+  tooltipData
 }) => {
-  var _a2, _b2, _c2, _d, _e2, _f, _g, _h, _i, _j, _k, _l, _m, _n2, _o, _p, _q, _r, _s;
-  return /* @__PURE__ */ jsx(AxisBottom$2, {
-    numTicks: data.length,
-    top: yMax,
-    hideTicks: (_a2 = value.main) == null ? void 0 : _a2.hideTicks,
-    hideAxisLine: (_b2 = value.main) == null ? void 0 : _b2.hideBottomAxisLine,
-    strokeWidth: (_d = (_c2 = value.style) == null ? void 0 : _c2.labelStyle) == null ? void 0 : _d.bottomAxisWidth,
-    scale: xScale,
-    stroke: (_f = (_e2 = value.style) == null ? void 0 : _e2.labelStyle) == null ? void 0 : _f.tickColor,
-    labelOffset: (_h = (_g = value.style) == null ? void 0 : _g.labelStyle) == null ? void 0 : _h.bottomLabelOffset,
-    label: (_i = value.main) == null ? void 0 : _i.bottomLabel,
-    labelProps: {
-      fill: (_k = (_j = value.style) == null ? void 0 : _j.labelStyle) == null ? void 0 : _k.labelColor,
-      fontSize: (_m = (_l = value.style) == null ? void 0 : _l.labelStyle) == null ? void 0 : _m.fontSize,
-      fontWeight: (_o = (_n2 = value.style) == null ? void 0 : _n2.labelStyle) == null ? void 0 : _o.fontWeight,
-      fontFamily: (_q = (_p = value.style) == null ? void 0 : _p.labelStyle) == null ? void 0 : _q.fontWeight
-    },
-    tickStroke: (_s = (_r = value.style) == null ? void 0 : _r.labelStyle) == null ? void 0 : _s.tickColor,
-    tickLabelProps: () => {
-      var _a3, _b3, _c3, _d2;
-      return {
-        fill: (_b3 = (_a3 = value.style) == null ? void 0 : _a3.labelStyle) == null ? void 0 : _b3.tickLabelColor,
-        fontSize: ((_d2 = (_c3 = value.style) == null ? void 0 : _c3.labelStyle) == null ? void 0 : _d2.tickFontSize) || 11,
-        textAnchor: "middle"
-      };
-    }
+  const {
+    TooltipInPortal
+  } = useTooltipInPortal({
+    detectBounds: true,
+    scroll: true
   });
+  return /* @__PURE__ */ jsx(TooltipInPortal, {
+    top: top2,
+    left: left2,
+    children: /* @__PURE__ */ jsxs("div", {
+      style: {
+        height: "50px",
+        textAlign: "center",
+        background: "black",
+        padding: "10px",
+        boxShadow: "2px 2px 5px black",
+        color: "#6c5efb",
+        backgroundColor: (style2 == null ? void 0 : style2.tooltipbackground) || "black",
+        ...style2 == null ? void 0 : style2.tooltipStyle,
+        margin: "-20px"
+      },
+      children: [/* @__PURE__ */ jsx("div", {
+        style: {
+          padding: "4px 10px",
+          backgroundColor: "black",
+          color: "white",
+          borderRadius: "5px"
+        },
+        children: tooltipData[0]
+      }), /* @__PURE__ */ jsx("div", {
+        style: {
+          marginTop: "10px",
+          fontWeight: 700
+        },
+        children: tooltipData[1]
+      })]
+    })
+  }, Math.random());
 };
-const LeftAxis = ({
-  value,
-  yScale,
-  parentWidth
-}) => {
-  var _a2, _b2, _c2, _d, _e2, _f, _g, _h, _i, _j, _k, _l, _m, _n2, _o, _p, _q, _r;
-  return /* @__PURE__ */ jsx(AxisLeft$2, {
-    numTicks: (_a2 = value.main) == null ? void 0 : _a2.numTicks,
-    scale: yScale,
-    top: 0,
-    label: (_b2 = value.main) == null ? void 0 : _b2.leftLabel,
-    tickStroke: (_d = (_c2 = value.style) == null ? void 0 : _c2.labelStyle) == null ? void 0 : _d.tickColor,
-    strokeWidth: (_f = (_e2 = value.style) == null ? void 0 : _e2.labelStyle) == null ? void 0 : _f.rightAxisWidth,
-    hideTicks: (_g = value.main) == null ? void 0 : _g.hideLeftTicks,
-    labelOffset: (_i = (_h = value.style) == null ? void 0 : _h.labelStyle) == null ? void 0 : _i.leftLabelOffset,
-    labelProps: {
-      fill: (_k = (_j = value.style) == null ? void 0 : _j.labelStyle) == null ? void 0 : _k.labelColor,
-      fontSize: (_m = (_l = value.style) == null ? void 0 : _l.labelStyle) == null ? void 0 : _m.fontSize,
-      fontWeight: (_o = (_n2 = value.style) == null ? void 0 : _n2.labelStyle) == null ? void 0 : _o.fontWeight,
-      fontFamily: (_q = (_p = value.style) == null ? void 0 : _p.labelStyle) == null ? void 0 : _q.fontWeight
-    },
-    hideAxisLine: (_r = value.main) == null ? void 0 : _r.hideLeftAxisLine,
-    tickLabelProps: (e3) => {
-      var _a3, _b3;
-      return {
-        fill: (_b3 = (_a3 = value.style) == null ? void 0 : _a3.labelStyle) == null ? void 0 : _b3.tickLabelColor,
-        fontSize: 11,
-        textAnchor: "end",
-        dy: "0.33em"
-      };
-    }
-  });
+const defaultMargin = {
+  top: 20,
+  right: 0,
+  bottom: 40,
+  left: 40
 };
-const DrawBarGraph = ({
-  value,
-  parentWidth,
-  parentHeight,
-  margin
-}) => {
+function DrawBarGraph({
+  width,
+  height,
+  events = false,
+  margin = defaultMargin,
+  value
+}) {
   var _a2, _b2, _c2, _d, _e2, _f, _g, _h, _i, _j;
-  const data = (_a2 = value == null ? void 0 : value.main) == null ? void 0 : _a2.data;
-  const arr = ((_b2 = value.main) == null ? void 0 : _b2.xAxisValue) && ((_c2 = value.main) == null ? void 0 : _c2.yAxisValue) ? [value.cosntent.xAxisValue, (_d = value.main) == null ? void 0 : _d.yAxisValue] : Object.keys(data[0]);
+  const data = (_a2 = value.main) == null ? void 0 : _a2.data;
+  const keys2 = Object.keys(data[0]).filter((d2) => d2 !== "label");
+  const getDate = (d2) => d2.label;
+  const dateScale = createBandScale({
+    domain: data.map(getDate),
+    padding: 0.2
+  });
+  const cityScale = createBandScale({
+    domain: keys2,
+    padding: 0.1
+  });
+  const tempScale = createLinearScale({
+    domain: [0, Math.max(...data.map((d2) => Math.max(...keys2.map((key) => Number(d2[key])))))]
+  });
+  const colorScale = createOrdinalScale$1({
+    domain: keys2,
+    range: [((_d = (_c2 = (_b2 = value.style) == null ? void 0 : _b2.barStyle) == null ? void 0 : _c2.color) == null ? void 0 : _d.firstBarColor) || "#aeeef8", ((_g = (_f = (_e2 = value.style) == null ? void 0 : _e2.barStyle) == null ? void 0 : _f.color) == null ? void 0 : _g.secondBarColor) || "e5fd3d", ((_j = (_i = (_h = value.style) == null ? void 0 : _h.barStyle) == null ? void 0 : _i.color) == null ? void 0 : _j.thirdBarColor) || "#9caff6"]
+  });
+  const xMax = width - margin.left - margin.right;
+  const yMax = height - margin.top - margin.bottom;
+  dateScale.rangeRound([0, xMax]);
+  cityScale.rangeRound([0, dateScale.bandwidth()]);
+  tempScale.range([yMax, 0]);
   const {
     tooltipData,
     tooltipLeft,
@@ -11182,89 +11214,85 @@ const DrawBarGraph = ({
     showTooltip,
     hideTooltip
   } = useTooltip();
-  const {
-    containerRef
-  } = useTooltipInPortal({
-    detectBounds: true,
-    scroll: true
-  });
   const handleMouse = (event, datum2) => {
+    console.log(datum2);
     showTooltip({
       tooltipLeft: event.clientX,
       tooltipTop: event.clientY,
-      tooltipData: [datum2[arr[0]], datum2[arr[1]]]
+      tooltipData: [datum2.key, datum2.value, datum2.color]
     });
   };
-  const xMax = parentWidth - margin.left - margin.right;
-  const yMax = parentHeight - margin.top - margin.bottom;
-  const x2 = (d2) => d2[arr[0]];
-  const y2 = (d2) => +d2[arr[1]];
-  const xScale = createBandScale({
-    range: [0, xMax],
-    round: true,
-    domain: data.map(x2),
-    padding: 0.4
-  });
-  const tempValue = data.reduce((total, curValue) => {
-    return total + curValue[arr[1]];
-  }, 0);
-  let averageValue = tempValue / data.length;
-  const yScale = createLinearScale({
-    range: [yMax, 0],
-    round: true,
-    domain: [0, Math.max(...data.map(y2))]
-  });
-  function compose2(scale, accessor) {
-    return (data2) => scale(accessor(data2));
-  }
-  const xPoint = compose2(xScale, x2);
-  const yPoint = compose2(yScale, y2);
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [/* @__PURE__ */ jsx("svg", {
-      ref: containerRef,
-      width: parentWidth,
-      height: parentHeight,
-      children: /* @__PURE__ */ jsxs(Group, {
-        left: (_f = (_e2 = value.style) == null ? void 0 : _e2.labelStyle) == null ? void 0 : _f.leftLabelMargin,
-        top: (_h = (_g = value.style) == null ? void 0 : _g.labelStyle) == null ? void 0 : _h.topLabelMargin,
-        children: [((_i = value.main) == null ? void 0 : _i.axisLeft) && /* @__PURE__ */ jsx(LeftAxis, {
+  return width < 10 ? null : /* @__PURE__ */ jsxs("div", {
+    children: [/* @__PURE__ */ jsxs("svg", {
+      width,
+      height,
+      children: [/* @__PURE__ */ jsx("rect", {
+        x: 0,
+        y: 0,
+        width,
+        height,
+        fill: value.style.containerStyle.background || "#612efb",
+        rx: 14
+      }), /* @__PURE__ */ jsxs(Group, {
+        top: margin.top,
+        left: margin.left,
+        children: [/* @__PURE__ */ jsx(LeftAxis, {
           value,
-          yScale,
-          parentWidth
-        }), data.map((d2) => {
-          var _a3, _b3, _c3, _d2, _e3, _f2, _g2, _h2;
-          const barHeight = yMax - yPoint(d2);
-          const fillBarColor = averageValue / 2 > d2[arr[1]] ? (_b3 = (_a3 = value.style) == null ? void 0 : _a3.barStyle) == null ? void 0 : _b3.lowValueColor : averageValue < d2[arr[1]] ? (_d2 = (_c3 = value.style) == null ? void 0 : _c3.barStyle) == null ? void 0 : _d2.highValueColor : (_f2 = (_e3 = value.style) == null ? void 0 : _e3.barStyle) == null ? void 0 : _f2.mediumValueColor;
-          return /* @__PURE__ */ jsx(Fragment, {
-            children: /* @__PURE__ */ jsx(Bar, {
-              x: xPoint(d2),
-              y: yMax - barHeight,
-              radius: ((_h2 = (_g2 = value.style) == null ? void 0 : _g2.barStyle) == null ? void 0 : _h2.barRadius) || 0,
-              height: barHeight,
-              width: xScale.bandwidth(),
-              fill: fillBarColor,
-              onMouseOver: (e3) => handleMouse(e3, d2),
-              onMouseOut: hideTooltip
-            }, `bar-${barHeight}`)
-          });
-        }), ((_j = value.main) == null ? void 0 : _j.axisBottom) && /* @__PURE__ */ jsx(BottomAxis, {
+          yScale: tempScale,
+          parentWidth: width
+        }), /* @__PURE__ */ jsx(BarGroup, {
           data,
-          value,
-          yMax,
-          xScale,
-          parentWidth
+          keys: keys2,
+          height: yMax,
+          x0: getDate,
+          x0Scale: dateScale,
+          x1Scale: cityScale,
+          yScale: tempScale,
+          color: colorScale,
+          children: (barGroups) => barGroups.map((barGroup) => /* @__PURE__ */ jsx(Group, {
+            left: barGroup.x0,
+            children: barGroup.bars.map((bar) => /* @__PURE__ */ jsx("rect", {
+              x: bar.x,
+              y: bar.y,
+              width: bar.width,
+              height: bar.height,
+              fill: bar.color,
+              rx: 4,
+              onMouseOver: (e3) => handleMouse(e3, bar),
+              onMouseOut: hideTooltip,
+              onClick: () => {
+                if (!events)
+                  return;
+                const {
+                  key,
+                  value: value2
+                } = bar;
+                alert(JSON.stringify({
+                  key,
+                  value: value2
+                }));
+              }
+            }, `bar-group-bar-${barGroup.index}-${bar.index}-${bar.value}-${bar.key}`))
+          }, `bar-group-${barGroup.index}-${barGroup.x0}`))
         })]
-      })
+      }), /* @__PURE__ */ jsx(BottomAxis, {
+        yMax: yMax + margin.top,
+        value,
+        left: margin.left,
+        xScale: dateScale,
+        parentWidth: width
+      })]
     }), tooltipOpen && /* @__PURE__ */ jsx(ToolTip, {
       style: {
-        ...value == null ? void 0 : value.style
+        ...value == null ? void 0 : value.style,
+        tooltipbackground: tooltipData[2]
       },
       top: tooltipTop,
       left: tooltipLeft,
       tooltipData
     })]
   });
-};
+}
 var root$4 = _root;
 var now$2 = function() {
   return root$4.Date.now();
@@ -11787,17 +11815,15 @@ const BarGraph = ({
     children: (parent) => {
       var _a3, _b3, _c3, _d2, _e2, _f, _g, _h, _i, _j, _k, _l, _m, _n2;
       return /* @__PURE__ */ jsx(DrawBarGraph, {
-        parentWidth: parent.width,
-        parentHeight: (_b3 = (_a3 = barData == null ? void 0 : barData.style) == null ? void 0 : _a3.containerStyle) == null ? void 0 : _b3.height,
+        width: parent.width || 400,
+        height: ((_b3 = (_a3 = barData == null ? void 0 : barData.style) == null ? void 0 : _a3.containerStyle) == null ? void 0 : _b3.height) | 400,
         margin: {
           top: ((_e2 = (_d2 = (_c3 = barData == null ? void 0 : barData.style) == null ? void 0 : _c3.labelStyle) == null ? void 0 : _d2.margin) == null ? void 0 : _e2.top) || 10,
           right: ((_h = (_g = (_f = barData == null ? void 0 : barData.style) == null ? void 0 : _f.labelStyle) == null ? void 0 : _g.margin) == null ? void 0 : _h.right) || 10,
           bottom: ((_k = (_j = (_i = barData == null ? void 0 : barData.style) == null ? void 0 : _i.labelStyle) == null ? void 0 : _j.margin) == null ? void 0 : _k.bottom) || 20,
           left: ((_n2 = (_m = (_l = barData == null ? void 0 : barData.style) == null ? void 0 : _l.labelStyle) == null ? void 0 : _m.margin) == null ? void 0 : _n2.left) || 60
         },
-        value: barData,
-        parentRef: parent.ref,
-        resizeParent: parent.resize
+        value: barData
       });
     }
   });